/* ── design tokens ───────────────────────────────────────────────────── */
      :root {
        --bg: #fbfaf4;
        --ink: #101010;
        --faint: #66645c;
        --rule: #d7d1bf;
        --link: #0033aa;
        --mark: #fff0a8;
        --accent: #b5120e;
      }

      * { box-sizing: border-box; }
      html { font-size: 18px; }

      body {
        margin: 0;
        color: var(--ink);
        background:
          linear-gradient(rgba(16,16,16,.025) 1px, transparent 1px),
          linear-gradient(90deg, rgba(16,16,16,.018) 1px, transparent 1px),
          var(--bg);
        background-size: 100% 1.45rem, 1.45rem 100%;
        font-family: "Times New Roman", Times, serif;
        line-height: 1.34;
      }

      a { color: var(--link); text-decoration-thickness: 1px; text-underline-offset: .12em; }
      a:hover { background: var(--mark); }

      .top-rule { height: 4px; background: var(--accent); }

      .page {
        width: min(100% - 2rem, 1120px);
        margin: 0 auto;
        padding: 1rem 0 3rem;
      }

      .utility {
        display: flex;
        flex-wrap: wrap;
        gap: .4rem 1rem;
        justify-content: space-between;
        border-bottom: 1px solid var(--rule);
        padding-bottom: .45rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .72rem;
        text-transform: uppercase;
        letter-spacing: .035em;
      }

      .utility nav { display: flex; flex-wrap: wrap; gap: .75rem; align-items: center; }

      header {
        padding: clamp(2rem, 7vw, 5.5rem) 0 1.25rem;
        border-bottom: 4px double var(--ink);
      }

      .label {
        margin: 0 0 .7rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .78rem;
        letter-spacing: .12em;
        text-transform: uppercase;
      }

      h1 {
        max-width: 980px;
        margin: 0;
        font-size: clamp(3.2rem, 12vw, 8.5rem);
        font-weight: 400;
        letter-spacing: -.075em;
        line-height: .78;
      }

      .dek {
        max-width: 760px;
        margin: 1.4rem 0 0;
        font-size: clamp(1.05rem, 2vw, 1.55rem);
      }

      /* ── section tabs ── */
      .section-nav {
        display: flex;
        gap: 0;
        margin: 1.4rem 0 0;
        border-bottom: 2px solid var(--ink);
      }

      .tab-btn {
        padding: .55rem 1.1rem .45rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .78rem;
        font-weight: 700;
        letter-spacing: .08em;
        text-transform: uppercase;
        border: none;
        border-bottom: 3px solid transparent;
        margin-bottom: -2px;
        background: none;
        color: var(--faint);
        cursor: pointer;
      }

      .tab-btn.active { color: var(--ink); border-bottom-color: var(--accent); }
      .tab-btn:hover:not(.active) { color: var(--ink); background: rgba(0,0,0,.04); }

      .section { display: none; }
      .section.active { display: block; }

      /* ── reports ── */
      .stat-row {
        display: flex;
        flex-wrap: wrap;
        gap: 1.5rem 3rem;
        padding: 1.6rem 0 1.2rem;
        border-bottom: 1px solid var(--rule);
        margin-bottom: 1.6rem;
      }

      .stat-num {
        font-size: clamp(2rem, 6vw, 3.5rem);
        font-weight: 400;
        line-height: 1;
        letter-spacing: -.04em;
      }

      .stat-label {
        font-family: "Courier New", Courier, monospace;
        font-size: .7rem;
        letter-spacing: .06em;
        text-transform: uppercase;
        color: var(--faint);
        margin-top: .25rem;
      }

      .report-picker {
        display: flex;
        flex-wrap: wrap;
        gap: .65rem;
        margin: 1.1rem 0 1rem;
      }

      .report-card {
        flex: 1 1 190px;
        min-width: 0;
        padding: .65rem .75rem;
        border: 1px solid var(--ink);
        background: rgba(255,255,255,.3);
        color: var(--ink);
        text-align: left;
        cursor: pointer;
      }

      .report-card[disabled] {
        cursor: default;
        opacity: .72;
      }

      .report-card.active {
        background: var(--mark);
      }

      .report-card-num {
        display: block;
        font-family: "Courier New", Courier, monospace;
        font-size: .68rem;
        letter-spacing: .09em;
        text-transform: uppercase;
        color: var(--accent);
      }

      .report-card-title {
        display: block;
        margin-top: .18rem;
        font-size: .95rem;
        line-height: 1.2;
      }

      .report-card-meta {
        display: block;
        margin-top: .2rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .66rem;
        letter-spacing: .04em;
        text-transform: uppercase;
        color: var(--faint);
      }

      .report-panel { display: none; }
      .report-panel.active { display: block; }

      .report-status {
        margin: 0 0 .55rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .7rem;
        letter-spacing: .08em;
        text-transform: uppercase;
        color: var(--faint);
      }

      .report-placeholder {
        margin: 1.2rem 0;
        padding: 1rem;
        border: 1px dashed var(--rule);
        background: rgba(255,255,255,.28);
      }

      .report-layout {
        display: grid;
        grid-template-columns: minmax(0, 1.2fr) minmax(260px, .6fr);
        gap: clamp(1.5rem, 4vw, 3.5rem);
      }

      h2 {
        margin: 0 0 .75rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .86rem;
        font-weight: 700;
        letter-spacing: .08em;
        text-transform: uppercase;
      }

      h3 { margin: 1.7rem 0 .5rem; font-size: 1.4rem; font-weight: 700; }
      h4 { margin: 1.4rem 0 .4rem; font-size: 1.15rem; font-weight: 700; }

      .article {
        max-width: 760px;
      }

      .article-kicker {
        margin: 0 0 .45rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .72rem;
        letter-spacing: .1em;
        text-transform: uppercase;
        color: var(--accent);
      }

      .article-title {
        margin: 0 0 .8rem;
        font-family: Georgia, "Times New Roman", Times, serif;
        font-size: clamp(2.05rem, 5vw, 4.8rem);
        font-weight: 400;
        letter-spacing: -.055em;
        line-height: .9;
        text-transform: none;
      }

      .article-dek {
        margin: 0 0 1.4rem;
        font-size: clamp(1.05rem, 2vw, 1.35rem);
        line-height: 1.35;
      }

      .report-headline {
        max-width: 980px;
        margin: 1.5rem 0 .5rem;
        font-family: Georgia, "Times New Roman", Times, serif;
        font-size: clamp(1.85rem, 4vw, 3.1rem);
        font-weight: 400;
        letter-spacing: -.03em;
        line-height: 1.03;
        text-transform: none;
      }

      .report-sub {
        max-width: 760px;
        margin: 0 0 .55rem;
        font-size: clamp(1.05rem, 2vw, 1.3rem);
        line-height: 1.35;
      }

      .report-byline {
        margin: 0 0 1.1rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .82rem;
        letter-spacing: .03em;
        color: var(--faint);
      }

      .report-divider {
        border: 0;
        border-top: 1px solid var(--rule);
        margin: 0 0 1.7rem;
      }

      .stat-stack { display: flex; flex-direction: column; gap: .85rem; }
      .stat-stack > div {
        display: flex;
        flex-direction: column;
        padding-bottom: .85rem;
        border-bottom: 1px dotted var(--rule);
      }
      .stat-stack > div:last-child { padding-bottom: 0; border-bottom: none; }
      .stat-stack .stat-num { font-size: 2rem; }

      .article-body p {
        margin: 0 0 1rem;
        line-height: 1.5;
      }

      .article-body blockquote {
        margin: 1.15rem 0;
        padding: .75rem 1rem;
        border-left: 4px solid var(--accent);
        background: rgba(181,18,14,.045);
        font-size: 1.05rem;
        line-height: 1.45;
      }

      .article-body .compact {
        margin-bottom: .55rem;
      }

      .article-rule {
        border: 0;
        border-top: 1px solid var(--rule);
        margin: 1.8rem 0;
      }

      .chart-card {
        margin: 1.1rem 0 1.45rem;
        border: 1px solid var(--rule);
        background: #fffdf5;
        padding: .65rem;
      }

      .chart-card img {
        display: block;
        width: 100%;
        height: auto;
      }

      .chart-card figcaption {
        margin-top: .55rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .68rem;
        line-height: 1.4;
        color: var(--faint);
      }

      .callout {
        margin: 1.2rem 0;
        padding: .85rem 1rem;
        border: 1px solid var(--ink);
        background: var(--mark);
        font-size: 1.02rem;
        line-height: 1.45;
      }

      .small-note {
        color: var(--faint);
        font-size: .88rem;
        line-height: 1.45;
      }

      .data-table {
        width: 100%;
        border-collapse: collapse;
        font-size: .88rem;
        margin-bottom: 1.6rem;
      }

      .data-table th {
        font-family: "Courier New", Courier, monospace;
        font-size: .68rem;
        letter-spacing: .07em;
        text-transform: uppercase;
        text-align: left;
        padding: .35rem .5rem .35rem 0;
        border-bottom: 2px solid var(--ink);
        white-space: nowrap;
      }

      .data-table td {
        padding: .4rem .5rem .4rem 0;
        border-bottom: 1px solid var(--rule);
        vertical-align: top;
      }

      .data-table td:last-child, .data-table th:last-child { text-align: right; }

      .tag {
        display: inline-block;
        padding: .1rem .38rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .64rem;
        letter-spacing: .04em;
        text-transform: uppercase;
        border: 1px solid var(--rule);
        color: var(--faint);
        white-space: nowrap;
      }

      .sidebox {
        border: 1px solid var(--ink);
        padding: .85rem;
        background: rgba(251,250,244,.86);
      }

      .sidebox + .sidebox { margin-top: 1rem; }
      .sidebox p { margin: 0 0 .8rem; }
      .sidebox p:last-child { margin-bottom: 0; }

      .button {
        display: inline-block;
        border: 1px solid var(--ink);
        padding: .42rem .62rem;
        color: var(--ink);
        background: var(--mark);
        font-family: "Courier New", Courier, monospace;
        font-size: .74rem;
        text-transform: uppercase;
        text-decoration: none;
      }
      .button:hover { background: #fff7ca; }

      .no, .meta, footer {
        color: var(--faint);
        font-family: "Courier New", Courier, monospace;
        font-size: .72rem;
        letter-spacing: .015em;
      }

      /* ── annotation UI ── */
      .anno-wrap { max-width: 760px; margin: 1.8rem 0; }

      .anno-status {
        font-family: "Courier New", Courier, monospace;
        font-size: .72rem;
        letter-spacing: .04em;
        color: var(--faint);
        margin-bottom: 1rem;
        display: flex;
        gap: 1.5rem;
        flex-wrap: wrap;
      }

      .anno-progress-bar {
        width: 100%;
        height: 3px;
        background: var(--rule);
        margin-bottom: 1.4rem;
      }

      .anno-progress-fill {
        height: 100%;
        background: var(--accent);
        transition: width .3s;
      }

      .anno-card {
        border: 1px solid var(--ink);
        padding: 1.2rem 1.4rem 1rem;
        background: var(--bg);
      }

      .anno-card-header {
        font-family: "Courier New", Courier, monospace;
        font-size: .72rem;
        letter-spacing: .05em;
        text-transform: uppercase;
        color: var(--faint);
        margin-bottom: 1rem;
        display: flex;
        flex-wrap: wrap;
        gap: .25rem .75rem;
      }

      .anno-card-header .character { color: var(--ink); font-weight: 700; }

      .anno-quote {
        margin: 0 0 1rem;
        padding: .6rem .9rem;
        border-left: 3px solid var(--accent);
        font-size: 1.05rem;
        font-style: italic;
        line-height: 1.5;
      }

      .anno-element-name { font-size: 1.1rem; font-weight: 700; margin: 0 0 .2rem; }

      .anno-element-desc {
        font-size: .88rem;
        color: var(--faint);
        margin: 0 0 .8rem;
        line-height: 1.45;
      }

      .anno-rationale {
        font-size: .88rem;
        margin: 0 0 .8rem;
        padding: .5rem .75rem;
        background: rgba(0,0,0,.03);
        border: 1px solid var(--rule);
        line-height: 1.5;
      }

      .anno-rationale::before {
        content: "Model says: ";
        font-family: "Courier New", Courier, monospace;
        font-size: .68rem;
        letter-spacing: .05em;
        text-transform: uppercase;
        color: var(--faint);
      }

      .anno-meta-row {
        display: flex;
        gap: .75rem;
        align-items: center;
        margin-bottom: 1.2rem;
        flex-wrap: wrap;
      }

      .conf-dots { font-size: 1rem; letter-spacing: .1em; color: var(--accent); }
      .conf-dots .empty { color: var(--rule); }

      .anno-actions { display: flex; gap: .6rem; flex-wrap: wrap; }

      .verdict-btn {
        padding: .55rem 1.1rem;
        border: 1px solid var(--ink);
        font-family: "Courier New", Courier, monospace;
        font-size: .78rem;
        font-weight: 700;
        letter-spacing: .06em;
        text-transform: uppercase;
        cursor: pointer;
        background: var(--bg);
        color: var(--ink);
      }

      .verdict-btn:hover { background: var(--mark); }
      .verdict-btn.correct:hover { background: #d4edd4; border-color: #2a7a2a; color: #2a7a2a; }
      .verdict-btn.incorrect:hover { background: #f0d4d4; border-color: var(--accent); color: var(--accent); }

      .anno-endpoint-notice {
        margin-top: 1rem;
        padding: .6rem .8rem;
        font-family: "Courier New", Courier, monospace;
        font-size: .72rem;
        border: 1px dashed var(--rule);
        color: var(--faint);
        line-height: 1.6;
      }

      .anno-complete { padding: 2rem 0; font-size: 1.1rem; font-style: italic; color: var(--faint); }
      .anno-loading {
        padding: 2rem 0;
        font-family: "Courier New", Courier, monospace;
        font-size: .78rem;
        letter-spacing: .05em;
        text-transform: uppercase;
        color: var(--faint);
      }

      footer {
        display: flex;
        flex-wrap: wrap;
        gap: .5rem 1rem;
        justify-content: space-between;
        margin-top: 3rem;
        padding-top: .6rem;
        border-top: 1px solid var(--rule);
      }

      /* 90s-only accents; body.skin-90s reveals the visible ones. */
      .netscape-chrome,
      .footer-90s,
      .sidebar-extra,
      .pixel-tv { display: none; }

      @media (max-width: 760px) {
        html { font-size: 16px; }
        .report-layout { grid-template-columns: 1fr; }
      }


      /* ══════════════════════════════════════════════════════════════════════
         90s SEINFELD / NETSCAPE SKIN
      ══════════════════════════════════════════════════════════════════════ */

      body.skin-90s {
        /* Beige speckled "paper" texture like early web / sitcom apartment wallpaper */
        background-color: #e8e0c8;
        background-image:
          radial-gradient(circle, rgba(0,0,0,.09) 1px, transparent 1px),
          radial-gradient(circle, rgba(0,0,0,.055) 1px, transparent 1px),
          repeating-linear-gradient(-45deg, transparent 0, transparent 5px, rgba(0,0,0,.014) 5px, rgba(0,0,0,.014) 6px);
        background-size: 23px 23px, 11px 11px, 7px 7px;
        background-position: 0 0, 6px 9px, 0 0;
      }

      body.skin-90s .top-rule { display: none; }
      .netscape-chrome { display: none !important; }

      .nc-toolbar {
        display: flex;
        gap: .25rem;
        padding: .3rem .5rem;
        align-items: center;
        border-bottom: 1px solid #999;
        flex-wrap: wrap;
      }

      .nc-btn {
        padding: .22rem .55rem;
        background: #c0c0c0;
        border: 2px outset #d4d4d4;
        font-family: "Arial", sans-serif;
        font-size: .7rem;
        cursor: default;
        white-space: nowrap;
        color: #000;
      }
      .nc-btn:hover { background: #d8d8d8; }
      .nc-btn:active { border-style: inset; }

      .nc-spacer { flex: 1; }

      .nc-logo {
        font-family: "Times New Roman", serif;
        font-size: 1.6rem;
        font-weight: bold;
        color: #fff;
        background: linear-gradient(135deg, #8080ff 0%, #000080 100%);
        width: 1.8rem;
        height: 1.8rem;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 2px outset #8080ff;
        flex-shrink: 0;
      }

      .nc-location {
        display: flex;
        align-items: center;
        gap: .5rem;
        padding: .22rem .5rem;
        font-size: .73rem;
        font-family: "Arial", sans-serif;
      }

      .nc-loc-label { color: #333; white-space: nowrap; }

      .nc-url-bar {
        flex: 1;
        border: 2px inset #999;
        padding: .12rem .3rem;
        font-size: .73rem;
        background: #fff;
        font-family: "Courier New", Courier, monospace;
        color: #0000cc;
        min-width: 0;
      }

      /* ── Page grid in 90s mode ── */
      body.skin-90s .page {
        display: grid;
        grid-template-columns: 1fr;
        grid-template-areas:
          "hdr"
          "content"
          "foot90"
          "foot";
        padding: 0 0 1rem;
        width: min(100%, 1120px);
      }

      body.skin-90s .utility         { grid-area: util; padding: .35rem .6rem; }
      body.skin-90s header            { grid-area: hdr; }
      body.skin-90s .section-nav      { grid-area: nav; }
      body.skin-90s #reports,
      body.skin-90s #input            { grid-area: content; }
      body.skin-90s .footer-90s       { grid-area: foot90; }
      body.skin-90s footer            { grid-area: foot; display: none; }

      /* ── utility bar in 90s mode ── */
      body.skin-90s .utility {
        background: #d5ccb5;
        border-bottom: 1px solid #aaa;
        font-family: "Arial", sans-serif;
        font-size: .72rem;
        letter-spacing: 0;
      }

      /* ── sidebar nav ── */
      body.skin-90s .section-nav {
        flex-direction: column;
        border: 2px outset #c8c0a8;
        border-bottom: none;
        background: #ddd5bc;
        margin: .4rem .4rem 0 0;
        padding: .25rem 0 .8rem;
        align-self: start;
        overflow: visible;
        position: sticky;
        top: 0;
      }

      body.skin-90s .tab-btn {
        width: 100%;
        text-align: left;
        padding: .4rem .55rem .4rem .5rem;
        border: none;
        border-bottom: 1px solid #b8ae94;
        border-bottom-color: transparent;  /* overridden on active */
        margin-bottom: 0;
        font-family: "Arial", "Helvetica", sans-serif;
        font-size: .76rem;
        font-weight: bold;
        text-transform: uppercase;
        letter-spacing: .03em;
        color: #000080;
        background: transparent;
        display: flex;
        align-items: center;
        gap: .4rem;
      }

      body.skin-90s .tab-btn::before {
        content: '▶';
        font-size: .55rem;
        flex-shrink: 0;
        color: #000080;
      }

      body.skin-90s .tab-btn.active {
        background: #000080;
        color: #fff;
        border-bottom-color: #000060;
      }
      body.skin-90s .tab-btn.active::before { color: #fff; }
      body.skin-90s .tab-btn:hover:not(.active) { background: rgba(0,0,128,.08); }

      /* extra sidebar links (About, Substack, etc.) */
      body.skin-90s .sidebar-extra {
        display: flex;
        flex-direction: column;
        border-top: 2px solid #cc2200;
        margin-top: .5rem;
        padding-top: .3rem;
      }

      .sidebar-extra a {
        display: flex;
        align-items: center;
        gap: .4rem;
        padding: .38rem .55rem;
        font-family: "Arial", sans-serif;
        font-size: .74rem;
        font-weight: bold;
        text-transform: uppercase;
        letter-spacing: .03em;
        color: #000080;
        text-decoration: none;
        border-bottom: 1px solid #b8ae94;
      }
      .sidebar-extra a::before { content: '▶'; font-size: .5rem; color: #000080; flex-shrink: 0; }
      .sidebar-extra a:hover { background: rgba(0,0,128,.08); }

      /* ── header in 90s mode ── */
      body.skin-90s header {
        position: relative;
        overflow: hidden;
        padding: 1.8rem 1.2rem 1.5rem;
        border-bottom: 2px solid #000080;
        border-top: none;
      }

      /* the yellow blob — smooth oval, Seinfeld title-card style */
      body.skin-90s header::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 70%;
        background: #f5c200;
        border-radius: 0 0 50% 50% / 0 0 40% 40%;
        z-index: 0;
      }

      body.skin-90s header > * { position: relative; z-index: 1; }

      body.skin-90s .label {
        color: #cc2200;
        font-family: "Arial", sans-serif;
        font-weight: bold;
        font-size: .72rem;
        letter-spacing: .08em;
      }

      /* small teal diamond between label and masthead */
      body.skin-90s .label::after {
        content: ' ▼';
        color: #009ab8;
        font-size: .7em;
        vertical-align: middle;
      }

      body.skin-90s h1 {
        font-family: 'Bodoni Moda', 'Playfair Display', "Georgia", "Times New Roman", serif;
        font-weight: 700;
        font-size: clamp(2rem, 6.5vw, 4rem);
        letter-spacing: -.02em;
        line-height: .92;
        color: #000;
      }

      body.skin-90s .dek {
        color: #000080;
        font-size: clamp(.9rem, 1.6vw, 1.05rem);
        margin-top: 1rem;
        font-family: "Times New Roman", Times, serif;
      }

      /* body text in content area — typewriter/Courier feel */
      body.skin-90s .report-layout > div > p,
      body.skin-90s .anno-wrap p {
        font-family: "Courier New", Courier, monospace;
        font-size: .85rem;
        line-height: 1.65;
      }

      /* ── reports in 90s mode ── */
      body.skin-90s #reports,
      body.skin-90s #input { padding: .8rem 1rem 1rem; }

      /* stat row */
      body.skin-90s .stat-row {
        border: 2px solid #aaa;
        background: rgba(255,255,255,.35);
        padding: .8rem 1.2rem;
        gap: 1rem 2rem;
        margin-bottom: 1.4rem;
      }

      body.skin-90s .stat-num { color: #cc0000; }

      body.skin-90s .stat-row > div {
        border-right: 2px dotted #999;
        padding-right: 1.5rem;
      }
      body.skin-90s .stat-row > div:last-child {
        border-right: none;
        padding-right: 0;
      }

      body.skin-90s .report-headline {
        font-family: 'Bodoni Moda', 'Playfair Display', Georgia, "Times New Roman", serif;
        color: #000;
        font-size: clamp(1.7rem, 3.6vw, 2.7rem);
        font-weight: 700;
        letter-spacing: -.015em;
      }
      body.skin-90s .report-headline::before { content: none; }

      body.skin-90s .report-sub {
        color: #000080;
        font-family: "Times New Roman", Times, serif;
        font-size: clamp(1rem, 1.8vw, 1.15rem);
      }

      body.skin-90s .stat-stack .stat-num { color: #cc0000; }
      body.skin-90s .stat-stack > div { border-bottom-color: #b8ae94; }

      body.skin-90s .report-picker {
        border: 2px inset #aaa;
        background: rgba(255,255,255,.28);
        padding: .45rem;
      }

      body.skin-90s .report-card {
        background: #c0c0c0;
        border: 2px outset #d4d4d4;
        font-family: "Arial", sans-serif;
        box-shadow: 1px 1px 0 #666;
      }

      body.skin-90s .report-card.active {
        background: #f5c200;
        border-color: #e0b000;
      }

      body.skin-90s .report-card[disabled] {
        color: #555;
        box-shadow: none;
      }

      body.skin-90s .report-card-num,
      body.skin-90s .report-card-meta,
      body.skin-90s .report-status {
        font-family: "Courier New", Courier, monospace;
      }

      /* h2 / h3 with blue square bullet */
      body.skin-90s h2 {
        font-family: "Arial", "Helvetica", sans-serif;
        color: #000080;
        font-size: .84rem;
        letter-spacing: .04em;
      }
      body.skin-90s h2::before { content: '■  '; color: #000080; }

      body.skin-90s h3 {
        font-family: "Arial", "Helvetica", sans-serif;
        color: #000080;
        font-size: 1.4rem;
        font-weight: bold;
      }
      body.skin-90s h3::before { content: '■  '; color: #000080; }

      body.skin-90s h4 {
        font-family: "Arial", "Helvetica", sans-serif;
        color: #000080;
        font-size: 1.15rem;
        font-weight: bold;
      }
      body.skin-90s h4::before { content: '▸  '; color: #000080; }

      /* retro TV icon */
      body.skin-90s .pixel-tv {
        display: inline-block;
        vertical-align: middle;
        margin-right: .6rem;
        margin-top: -.25rem;
      }
      body.skin-90s .pixel-tv svg {
        display: block;
      }

      /* content area headings get underline link style like the reference */
      body.skin-90s .report-layout > div h2,
      body.skin-90s .report-layout > div h3,
      body.skin-90s .report-layout > div h4 {
        text-decoration: underline;
        text-underline-offset: .15em;
      }

      /* links */
      body.skin-90s a { color: #0000cc; }
      body.skin-90s a:visited { color: #551a8b; }
      body.skin-90s a:hover { background: #ffff00; color: #cc0000; }

      /* tables */
      body.skin-90s .data-table th {
        background: #000080;
        color: #fff;
        font-family: "Arial", sans-serif;
        border-bottom: none;
        padding: .38rem .5rem;
      }
      body.skin-90s .data-table tr:nth-child(even) td { background: rgba(255,255,255,.2); }

      body.skin-90s .tag {
        background: #c0c0c0;
        border: 1px outset #c0c0c0;
        color: #000;
        font-family: "Arial", sans-serif;
      }

      /* report layout */
      body.skin-90s .report-layout {
        grid-template-columns: minmax(0, 1.2fr) minmax(220px, .55fr);
        gap: 1.2rem;
      }

      /* sidebox */
      body.skin-90s .sidebox {
        background: rgba(255,255,255,.3);
        border: 2px inset #aaa;
      }

      body.skin-90s .button {
        background: #c0c0c0;
        border: 2px outset #c0c0c0;
        color: #000;
        font-family: "Arial", sans-serif;
      }
      body.skin-90s .button:hover { background: #b8b8b8; border-style: inset; }

      /* annotation card */
      body.skin-90s .anno-card {
        border: 2px inset #aaa;
        background: rgba(255,255,255,.4);
      }

      body.skin-90s .anno-quote {
        border-left: 4px solid #000080;
        background: rgba(255,255,255,.25);
      }

      body.skin-90s .anno-rationale {
        background: #e8e0c8;
        border: 1px solid #999;
        font-family: "Courier New", Courier, monospace;
        font-size: .8rem;
      }

      body.skin-90s .anno-progress-fill { background: #000080; }
      body.skin-90s .conf-dots { color: #000080; }

      body.skin-90s .verdict-btn {
        background: #c0c0c0;
        border: 2px outset #d4d4d4;
        color: #000;
        font-family: "Arial", sans-serif;
        font-weight: bold;
        letter-spacing: .03em;
        box-shadow: 1px 1px 0 #666;
      }
      body.skin-90s .verdict-btn:hover { background: #d4d4d4; }
      body.skin-90s .verdict-btn:active { border-style: inset; box-shadow: none; }
      body.skin-90s .verdict-btn.correct:hover { background: #c0d0c0; color: #004400; border-color: #aaa; }
      body.skin-90s .verdict-btn.incorrect:hover { background: #d0c0c0; color: #440000; border-color: #aaa; }

      /* 90s footer */
      body.skin-90s .footer-90s { display: block; }

      .footer-90s {
        padding: .8rem 1rem;
        border-top: 2px solid #888;
        background: rgba(0,0,0,.06);
        font-family: "Times New Roman", Times, serif;
        font-size: .82rem;
      }

      .footer-90s-links {
        display: flex;
        gap: .3rem;
        align-items: center;
        flex-wrap: wrap;
        margin-bottom: .5rem;
      }

      .footer-90s-links a {
        color: #0000cc;
        text-decoration: underline;
      }

      /* 88×31 retro AI badges */
      .ai-badges {
        display: flex;
        align-items: center;
        gap: .35rem;
        flex-shrink: 0;
      }

      .ai-badge {
        display: inline-flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 88px;
        height: 31px;
        font-family: "Arial", sans-serif;
        font-size: .5rem;
        font-weight: bold;
        letter-spacing: .04em;
        text-transform: uppercase;
        border: 2px outset;
        line-height: 1.25;
        text-decoration: none;
        overflow: hidden;
        flex-shrink: 0;
        cursor: default;
        text-align: center;
      }

      .ai-badge-claude {
        background: linear-gradient(160deg, #d4845a 0%, #8c3a1a 55%, #5a1e08 100%);
        border-color: #e09070;
        color: #fff;
        text-shadow: 1px 1px 0 rgba(0,0,0,.5);
      }

      .ai-badge-openai {
        background: linear-gradient(160deg, #606070 0%, #202030 60%, #080810 100%);
        border-color: #707080;
        color: #e8e8ff;
        text-shadow: 1px 1px 0 rgba(0,0,0,.6);
      }

      .footer-90s-copy {
        font-family: "Times New Roman", Times, serif;
        font-size: .72rem;
        color: #555;
        margin-top: .25rem;
      }

      @media (max-width: 700px) {
        body.skin-90s .page { grid-template-areas: "hdr" "content" "foot90" "foot"; }
      }

      /* ── multi-post additions (skin-aware) ─────────────────────────────────── */
      /* Masthead title links home but keeps its look even under the 90s skin */
      header h1 a, body.skin-90s header h1 a { color: inherit; text-decoration: none; background: transparent; }
      body.skin-90s header h1 a:hover { color: #cc0000; background: transparent; }

      /* Back-to-issue link on article pages */
      .home-link {
        display: inline-block;
        font-family: "Arial", "Helvetica", sans-serif;
        font-weight: bold;
        font-size: .8rem;
        letter-spacing: .04em;
        margin-bottom: 1.1rem;
      }

      /* Front-page issue index */
      .issue-intro {
        font-family: "Times New Roman", Times, serif;
        font-style: italic;
        font-size: 1.12rem;
        color: #000080;
        border-bottom: 1px solid var(--rule);
        padding-bottom: 1.2rem;
        margin: 0 0 .2rem;
      }
      .issue-list { display: flex; flex-direction: column; }
      .issue-item { padding: 1.7rem 0; border-bottom: 1px solid var(--rule); }
      .issue-item:first-of-type { border-top: 4px double var(--ink); }
      .issue-kicker {
        font-family: "Courier New", Courier, monospace;
        font-size: .74rem; letter-spacing: .1em; text-transform: uppercase;
        color: #cc0000; margin: 0 0 .35rem;
      }
      .issue-hed {
        font-family: "Playfair Display", Georgia, serif;
        font-weight: 900; font-size: clamp(1.5rem, 3.4vw, 2.15rem);
        line-height: 1.08; margin: 0;
      }
      .issue-hed::before { content: none; }
      .issue-hed a, body.skin-90s .issue-hed a { color: var(--ink); text-decoration: none; background: transparent; }
      .issue-hed a:hover, body.skin-90s .issue-hed a:hover { color: #cc0000; background: transparent; }
      .issue-sub {
        font-family: "Times New Roman", Times, serif;
        font-size: 1.08rem; color: #1a1a1a; margin: .35rem 0 0; max-width: 42em;
      }
      .issue-byline { font-family: "Courier New", Courier, monospace; font-size: .82rem; color: var(--faint); margin: .45rem 0 0; }
      .issue-more { display: inline-block; font-family: "Arial", sans-serif; font-weight: bold; font-size: .8rem; margin-top: .55rem; }

      /* Frame → tasks figure */
      .frame-fig { margin: 2rem 0; border: 2px solid #000080; background: #fff; }
      .frame-fig > figcaption {
        border-bottom: 2px solid #000080;
        font-family: "Arial", "Helvetica", sans-serif; font-weight: bold;
        color: #000080; font-size: .92rem; padding: .5rem .8rem; background: #ece7d3;
      }
      .frame-fig > figcaption::before { content: none; }
      .ft-grid { display: block; }
      .ft-frame { position: relative; border-bottom: 1px solid #000080; background: #000; line-height: 0; }
      .ft-frame img { display: block; width: 100%; height: auto; }
      .ft-stamp {
        position: absolute; left: 0; bottom: 0;
        font-family: "Courier New", Courier, monospace; font-size: .62rem; letter-spacing: .02em;
        background: rgba(0,0,40,.82); color: #f4f1e6; padding: .18rem .45rem;
      }
      .ft-tasks { padding: .75rem .9rem; display: flex; flex-direction: column; gap: .6rem; }
      .ft-arrow { font-family: "Times New Roman", Times, serif; font-style: italic; font-size: .85rem; color: #000080; margin: 0 0 .15rem; }
      .ft-task { font-size: .9rem; line-height: 1.34; padding-left: .7rem; border-left: 3px solid #cc0000; }
      .ft-task .tt-type {
        display: inline-block; font-family: "Courier New", Courier, monospace;
        font-size: .6rem; text-transform: uppercase; letter-spacing: .06em; color: #cc0000; margin-right: .35rem;
      }
      .ft-task .tt-name { font-weight: bold; }
      .ft-task .tt-visual {
        display: inline-block; font-size: .58rem; text-transform: uppercase; letter-spacing: .05em;
        background: #ffff00; color: #6a5400; padding: .02rem .3rem; margin-left: .3rem; border: 1px solid #d4c200;
      }
      .ft-task .tt-q { display: block; color: var(--faint); font-style: italic; margin-top: .12rem; }
      .source-note { font-size: .72rem; color: var(--faint); padding: .5rem .8rem; border-top: 1px dotted var(--rule); }
      .source-note .tt-visual { background: #ffff00; color: #6a5400; padding: 0 .25rem; font-size: .65rem; }
      /* frame figure is stacked (image over tasks) at every width — naturally responsive */