@font-face {
    font-family: "Clanker Mono";
    src: url("/ClankerMono-web.woff2") format("woff2");
    font-display: swap;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
    background: #040506;
    color: #b6aa99;
    font-family: "Clanker Mono", monospace;
    font-size: 1rem;
    line-height: 1.4;
    padding: 20px 24px;
}

h1 {
    font-size: 2.5rem;
    font-weight: normal;
    letter-spacing: 0.05em;
    margin-bottom: 4px;
    color: #e0e0e0;
}

.motto {
    list-style: none;
    counter-reset: motto;
    margin: 6px 0 28px;
    font-size: 1.35rem;
    line-height: 1.35;
    color: #e0e0e0;
}
.motto li { counter-increment: motto; }
.motto li::before {
    content: counter(motto) ". ";
    color: #7a6e5e;
}
.motto-unknown { color: #7a6e5e; }
.motto-profit { color: #ff9800; }
@media (max-width: 600px) {
    .motto { font-size: 1.1rem; }
}

.profile-heading {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 4px;
}

.profile-heading h1 {
    margin-bottom: 0;
}

.profile-social-links {
    display: flex;
    gap: 10px;
}

.profile-social-link,
.profile-social-link:visited {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border: 0;
    color: #a69987;
    opacity: 0.7;
    transition: color 0.15s ease, opacity 0.15s ease;
}

.profile-social-link:hover,
.profile-social-link:focus {
    border: 0;
    color: #ff9800;
    opacity: 1;
}

.profile-social-link:focus-visible {
    outline: 1px solid #ff9800;
    outline-offset: 3px;
}

.profile-social-link svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.tagline {
    font-size: 1rem;
    color: #b6aa99;
    margin-bottom: 8px;
}

.intro {
    color: #b6aa99;
    margin-bottom: 20px;
}

.showcase { margin-bottom: 24px; }
.showcase-controls p { margin-bottom: 4px; color: #a69987; }
.showcase-controls button {
    font: inherit;
    font-size: 0.875rem;
    color: #b6aa99;
    background: none;
    border: 1px solid #3d3428;
    padding: 1px 8px;
    margin: 2px 2px 2px 0;
    cursor: pointer;
}
.showcase-controls button[aria-pressed="true"] { color: #ff9800; border-color: #b56b00; }
.showcase-list { margin-top: 10px; }
.showcase-list li { padding: 8px 0; border-top: 1px solid #1c1813; }
.showcase-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 0 16px; }
.showcase-meta { color: #7a6e5e; font-size: 0.875rem; }
.showcase-meta .star { vertical-align: -1px; }
.showcase-head .repo-link { border-bottom: 0; color: #7a6e5e; margin-left: 4px; }
.showcase-head .repo-link:hover { color: #e8dcc0; }
.showcase-head .mark, .showcase-head .fork { vertical-align: -2px; }

.professional-foundation {
    margin-bottom: 20px;
}

h2, h3, h4, h5, h6 {
    font-weight: normal;
}

h2 {
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #ff9800;
    margin-top: 16px;
    margin-bottom: 4px;
    padding-top: 16px;
    border-top: 1px solid #6b5a35;
}

.section-note {
    color: #a69987;
    margin-bottom: 10px;
}

ul { list-style: none; padding: 0; }

li {
    padding: 3px 0;
}

code,
pre {
    font-family: inherit;
}

code {
    color: #e0e0e0;
    background: rgba(255, 255, 255, 0.05);
    padding: 0.1em 0.4em;
    border-radius: 4px;
}

a {
    color: #e8dcc0;
    text-decoration: none;
    border-bottom: 1px solid rgba(232, 220, 192, 0.4);
    transition: border-color 0.2s ease;
}
a:hover { border-bottom-color: #e8dcc0; }

.previously {
    color: #b6aa99;
    margin-top: 28px;
    padding-top: 8px;
}

.previously a { color: #b6aa99; }
.previously a:hover { color: #ff9800; }

/* ── Meters (toolcore-refined) ── */
.meters-link {
    float: right;
    /* Sit 12px below the header rule and 12px from the page edge, inside the body's 20px/24px padding. */
    margin: -8px -12px 0 0;
    border: none;
    text-decoration: none;
    color: inherit;
}
.meters-link:hover .meters { border-color: #7a6e5e; }
.meters {
    background: #0a0908;
    border: 1px solid #3d3428;
    padding: 0;
    margin: 0 0 8px 16px;
    font-family: inherit;
}

.meters-title {
    text-align: center;
    font-size: 0.65rem;
    font-weight: normal;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #7a6e5e;
    padding: 4px 10px;
    border-bottom: 1px solid #3d3428;
}

.meters-body {
    padding: 6px 10px;
}

.meter {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    font-size: 0.75rem;
    margin-bottom: 4px;
}

.meter:last-child { margin-bottom: 0; }

.meter-icon {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    /* Brand colours, faded so the marks sit behind the readings. */
    opacity: 0.6;
    filter: saturate(0.7);
}
.meter-icon svg { display: block; width: 100%; height: 100%; }
.meter-icon.claude { color: #D97757; }
.meter-icon.codex,
.meter-icon.zcode { color: #e0e0e0; }
.meter.muted { opacity: 0.45; }

.meter-bar {
    width: 72px;
    height: 14px;
    background: #060504;
    border: 1px solid #3d3428;
    overflow: hidden;
    flex-shrink: 0;
    position: relative;
    display: inline-block;
}

/* The pace that uses the rest of the budget by the reset; meters.js sets its position. */
.meter-burn {
    position: absolute;
    z-index: 1;
    top: 0;
    bottom: 0;
    border-left: 1px solid #b6aa99;
}
/* The combined Claude meter's target band, from min to max pace; meters.js sets its position. */
.meter-band {
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 1;
    background: rgba(255, 255, 255, 0.12);
    border-left: 1px solid #b6aa99;
    border-right: 1px solid #b6aa99;
}
.meter-fill { height: 100%; display: block; }
.meter-plan {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.5rem;
    color: rgba(182, 170, 153, 0.45);
    letter-spacing: 0.04em;
    pointer-events: none;
}
.meter-fill.ok { background: #6b8f5e; }
.meter-fill.warn { background: #c4862c; }
.meter-fill.over { background: #b84a3a; }

.meter-mult {
    width: 28px;
    text-align: right;
    font-size: 0.75rem;
    flex-shrink: 0;
}

.meter-mult.ok { color: #6b8f5e; }
.meter-mult.warn { color: #c4862c; }
.meter-mult.over { color: #b84a3a; }

.links {
    margin-top: 28px;
    padding-top: 12px;
    border-top: 1px solid #8a7d6a;
    display: flex;
    gap: 24px;
}

/* GENERATED SITE HEADER THEME:START */
/* Generated from site-theme.css. Do not edit this block. */
.site-header {
    position: relative;
    z-index: 100;
    min-height: var(--site-header-height);
    margin: -20px -24px 20px;
    border-bottom: 1px solid var(--site-header-border);
    background: var(--site-header-background);
}

.site-header-title,
.site-header-toggle {
    display: none;
}

.links-top {
    height: var(--site-header-row-height);
    margin: 0;
    padding: 0;
    border: 0;
    gap: 0;
    align-items: stretch;
}

.links-top .site-navigation-link {
    align-self: flex-start;
}

@media (max-width: 600px) {
    .site-header {
        margin: -12px -10px 12px;
    }

    /* Phones keep the links in the bar: five short links fit, and the row scrolls if it must. */
    .site-header .links-top {
        flex-wrap: nowrap;
        gap: 0;
        overflow-x: auto;
        scrollbar-width: none;
    }

    .links-top .site-navigation-link {
        padding: 0.8em 0.65em;
        white-space: nowrap;
    }
}

@media print {
    .site-header {
        display: none;
    }
}

:root {
    --site-header-accent: #ff9800;
    --site-header-background: #040506;
    --site-header-border: #6b5a35;
    --site-header-border-soft: #3d3428;
    --site-header-link: #e8dcc0;
    --site-header-bright: #e0e0e0;
    --site-header-height: 45px;
    --site-header-row-height: 44px;
}

.site-navigation-link,
.site-navigation-link:visited {
    display: block;
    height: auto;
    padding: 0.8em 1em;
    border: 0;
    background: transparent;
    color: var(--site-header-link);
    font-weight: normal;
}

.site-navigation-link:hover,
.site-navigation-link:focus {
    background-color: transparent;
    background-image: linear-gradient(var(--site-header-accent), var(--site-header-accent));
    background-position: left bottom;
    background-repeat: no-repeat;
    background-size: 100% 1px;
    color: var(--site-header-bright);
}

.site-navigation-link[aria-current="page"] {
    border-bottom: 1px solid var(--site-header-accent);
    color: var(--site-header-bright);
}
/* GENERATED SITE HEADER THEME:END */

@media (max-width: 600px) {
    body { padding: 12px 10px; font-size: 0.875rem; }
    h1 { font-size: 1.5rem; }
    .meters-link { display: none; }
    .links { gap: 16px; flex-wrap: wrap; }

}

/* ── Blog ── */
.post-list { margin: 16px 0 28px; }
.post-list li { display: flex; gap: 16px; padding: 4px 0; }
.post-list-date { color: #7a6e5e; font-variant-numeric: tabular-nums; flex-shrink: 0; }
.post-list-empty { color: #7a6e5e; }
.post-back { margin-bottom: 12px; font-size: 0.875rem; }
.post h1 { margin-bottom: 4px; }
.post-meta { color: #7a6e5e; font-size: 0.875rem; margin-bottom: 24px; }
.post p, .post pre, .post ul, .post ol, .post blockquote { margin-bottom: 12px; }
.post ul, .post ol { margin-left: 24px; }
.post ul { list-style: disc; }
.post ol { list-style: decimal; }
.post pre { background: rgba(255, 255, 255, 0.04); padding: 12px 16px; white-space: pre-wrap; overflow-wrap: anywhere; border-radius: 4px; }
.post pre code { background: none; padding: 0; }
.post h2 { border-top: none; padding-top: 0; margin-top: 24px; margin-bottom: 8px; }
.post h3 { color: #e0e0e0; font-size: 1rem; margin-top: 16px; margin-bottom: 6px; }
.post blockquote { border-left: 2px solid #6b5a35; padding-left: 12px; color: #a69987; }
.post [data-asciinema] { margin-bottom: 12px; }
.post figure a { display: block; border-bottom: none; }
.post figure img { display: block; width: 100%; height: auto; }
.post figcaption { color: #7a6e5e; font-size: 0.8125rem; margin-top: 4px; }
.post-figure-right { float: right; clear: right; width: 40%; max-width: 480px; margin: 4px 0 12px 20px; }
@media (max-width: 600px) {
  .post-figure-right { float: none; width: auto; margin: 0 0 12px; }
}
.post table { border-collapse: collapse; margin-bottom: 12px; }
.post th, .post td { border: 1px solid #3d3428; padding: 4px 10px; text-align: left; }
.post th { background: rgba(255, 255, 255, 0.06); font-weight: normal; letter-spacing: 0.04em; }

/* Autoresearch */
.research-header { margin: 12px 0 20px; }
.research-overview,
.research-meta,
.research-summary {
    font-variant-numeric: tabular-nums;
}
.research-description { margin: 4px 0 8px; color: #a69987; }
.research-overview { color: #a69987; }
.research-list { margin-bottom: 10px; }
.research-entry {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #6b5a35;
}
.research-summary { margin: 0; }
.research-meta {
    color: #a69987;
    margin-top: 2px;
}
.build-warning {
    color: #c4862c;
    border-left: 2px solid #c4862c;
    padding: 6px 10px;
    margin: 10px 0;
}

@media (max-width: 600px) {
    .research-header { margin-top: 8px; }
}
