:root{
    --bg:#0a0a0c;
    --surface:#131317;
    --surface-2:#17171c;
    --line:#26262d;
    --track:#26262d;
    --text:#e9e9ee;
    --muted:#8a8a95;
    --faint:#5c5c66;
    --accent:#f2a93b;
    --accent-dim:#7a5a24;
    --accent-soft:#ffdca0;
    --tint:#1c1710;
    --code-bg:#000000;
    --on-accent:#1a1206;
    color-scheme:dark;
  }
   :root{
     --bg:#f6f5f1;
     --surface:#ffffff;
     --surface-2:#f0eee7;
     --line:#dcd8ce;
     --track:#e4e1d7;
     --text:#17171b;
     --muted:#5c5a53;
     --faint:#8a887f;
     --accent:#b45f06;
     --accent-dim:#d9b988;
     --accent-soft:#8a4d05;
     --tint:#f7ecda;
     --code-bg:#eceadf;
     --on-accent:#fff8ef;
     color-scheme:light;
   }
 }
  *,*::before,*::after{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    margin:0;background:var(--bg);color:var(--text);
    font:400 17px/1.55 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
  }
  ::selection{background:var(--accent);color:var(--on-accent)}
  a{color:var(--accent)}
  a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible,[tabindex]:focus-visible{
    outline:2px solid var(--accent);outline-offset:3px;border-radius:4px;
  }
  .visually-hidden{
    position:absolute;width:1px;height:1px;margin:-1px;padding:0;
    overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
  }
  [hidden]{display:none !important}
  .wrap{width:min(680px,100% - 2.5rem);margin-inline:auto}

  /* ---------- Page header ---------- */
  .site-head{
    display:flex;justify-content:space-between;align-items:center;
    padding:1.3rem 0;border-bottom:1px solid var(--line);
  }
  .wordmark{
    font-weight:800;font-size:1rem;letter-spacing:-.01em;margin:0;
    text-decoration:none;color:var(--text);
  }
  .wordmark .strike{position:relative;color:var(--accent)}
  .wordmark .strike::after{
    content:"";position:absolute;left:-3%;right:-3%;top:54%;height:.085em;
    background:var(--accent);transform:rotate(-2.5deg);border-radius:1px;
  }
  .head-link{color:var(--muted);text-decoration:none;font-size:.92rem}
  .head-link:hover{color:var(--text);text-decoration:underline}

  /* ---------- Screens ---------- */
  .screen{padding:clamp(2.6rem,7vw,4rem) 0;border-bottom:1px solid var(--line)}
  .screen:last-of-type{border-bottom:0}
  h1{font-size:clamp(1.9rem,4.6vw,2.9rem);line-height:1.12;letter-spacing:-.02em;margin:0;font-weight:800;max-width:20ch;text-wrap:balance}
  h2{
    font-size:13px;letter-spacing:.14em;text-transform:uppercase;
    color:var(--accent);margin:0 0 1.2rem;font-weight:600;
  }
  .q-sub{margin:1.1rem 0 0;color:var(--muted);font-size:1.05rem;max-width:52ch;text-wrap:pretty}
  .punchline{
    font-size:clamp(1.9rem,4.6vw,2.7rem);font-weight:800;letter-spacing:-.02em;
    margin:1.8rem 0 0;color:var(--text);text-wrap:balance;
  }

  /* Honest reduced-motion note (only shown under prefers-reduced-motion) */
  .motion-note{
    display:none;margin:1.4rem 0 0;padding:.8rem 1rem;font-size:.88rem;color:var(--muted);
    border-left:3px solid var(--accent);background:var(--surface);
  }
  @media (prefers-reduced-motion: reduce){.motion-note{display:block}}

  /* ---------- Verdict controls (radio styled as option cards; pick = submit = lock) ---------- */
  .verdict{border:0;margin:1.6rem 0 0;padding:0}
  .verdict legend{padding:0;font-size:1.15rem;font-weight:700;letter-spacing:-.01em}
  .verdict.confidence{margin:1.6rem 0 0}
  .verdict.confidence legend{font-size:.95rem;font-weight:650;color:var(--muted)}
  .legend-hint{font-weight:400;color:var(--faint);font-size:.85rem}
  .verdict-options{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.1rem}
  .opt{position:relative}
  .opt input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
  .opt span{
    display:inline-block;padding:.8rem 1.4rem;border:1px solid var(--line);
    border-radius:12px;font-weight:650;cursor:pointer;user-select:none;
    background:var(--surface);
    transition:border-color .15s,background .15s,color .15s,opacity .2s;
  }
  .opt--sm span{padding:.45rem 1rem;font-size:.88rem}
  .opt:hover span{border-color:var(--accent)}
  .opt input:focus-visible+span{outline:2px solid var(--accent);outline-offset:3px}
  /* Short options (confidence): solid fill when picked */
  .opt--sm input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
  /* Long options (verdicts): tinted selection */
  .verdict:not(.confidence) .opt input:checked+span{
    border-color:var(--accent);background:var(--tint);color:var(--accent-soft);
  }
  .verdict.locked .opt input{cursor:default}
  .verdict.locked .opt span{cursor:default}
  .verdict.locked .opt input:not(:checked)+span{opacity:.35}
  /* Word-length verdict options: solid fill (must come after the tinted rule) */
  .verdict.solid .opt input:checked+span{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

  /* ---------- Anti-spoiler mask ---------- */
  .masked{transition:filter .5s ease,opacity .5s ease}
  .masked[data-masked]{filter:blur(14px);opacity:.3;pointer-events:none;user-select:none}
  /* Unlock choreography: children rise in with a ~200ms cascade */
  .masked:not([data-masked])>*{animation:rise .45s ease both}
  .masked:not([data-masked])>*:nth-child(2){animation-delay:.05s}
  .masked:not([data-masked])>*:nth-child(3){animation-delay:.1s}
  .masked:not([data-masked])>*:nth-child(4){animation-delay:.15s}
  .masked:not([data-masked])>*:nth-child(5){animation-delay:.2s}
  .masked:not([data-masked])>*:nth-child(6){animation-delay:.25s}
  .masked:not([data-masked])>*:nth-child(n+7){animation-delay:.3s}
  @keyframes rise{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}

  /* ---------- Demo container ---------- */
  .demo{
    position:relative;
    background:var(--surface);border:1px solid var(--line);border-radius:16px;
    padding:clamp(1.4rem,4vw,2.2rem);margin-top:1.8rem;
  }
  .fig-tag{
    position:absolute;top:.9rem;right:1rem;font-size:.65rem;letter-spacing:.14em;
    text-transform:uppercase;color:var(--faint);border:1px solid var(--line);
    border-radius:999px;padding:.2rem .55rem;font-weight:600;pointer-events:none;
  }
  .demo-caption{margin:.9rem 0 0;font-size:.85rem;color:var(--muted)}

  /* ---------- Map (simplified outlines, inline SVG) ---------- */
  .map-svg{display:block;width:100%;height:auto;margin-top:.4rem}
  .grat line{stroke:var(--line);stroke-width:1;opacity:.5}
  .grat .eq{opacity:.9;stroke-dasharray:7 6}
  .land{fill:var(--surface-2);stroke:var(--line);stroke-width:1.5}
  .land-hi{stroke:var(--faint)}
  .gl{fill:var(--tint);stroke:var(--accent);stroke-width:2}
  .gl-path{vector-effect:non-scaling-stroke}
  #drag-map .gl{cursor:grab;touch-action:none}
  #drag-map .gl.dragging{cursor:grabbing}
  .map-label{fill:var(--muted);font-size:13px;letter-spacing:.06em}
  .map-eq{font-size:11px;fill:var(--faint);letter-spacing:.12em;text-transform:uppercase}

  /* ---------- Estimate verdict (approved input type: estimate) ---------- */
  .est-row{display:flex;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:1.1rem}
  .est-slider{flex:1 1 220px;accent-color:var(--accent)}
  .est-slider:disabled{opacity:.5}
  .est-readout{font-size:1.7rem;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums;min-width:3.2ch;text-align:right}

  /* ---------- Reveal: stat panel + shared-scale ---------- */
  .stat-grid{display:grid;gap:1rem;margin:1.5rem 0}
  @media (min-width:560px){.stat-grid{grid-template-columns:repeat(3,1fr)}}
  .stat{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:1rem 1.2rem}
  .stat-num{display:block;font-size:1.55rem;font-weight:800;color:var(--accent);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
  .stat-cap{font-size:.85rem;color:var(--muted)}
  .scale{margin:1.6rem 0 .2rem}
  .scale-track{position:relative;height:8px;border-radius:999px;background:var(--track);margin-top:2rem}
  .scale-mark{position:absolute;top:-4px;width:2px;height:16px;background:var(--muted)}
  .scale-mark i{
    position:absolute;left:50%;transform:translateX(-50%);font-style:normal;
    font-size:.8rem;color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums;
  }
  .scale-mark.truth{background:var(--accent)}
  .scale-mark.truth i{bottom:22px;color:var(--accent);font-weight:700}
  .scale-mark.you i{top:22px}
  .scale-ends{display:flex;justify-content:space-between;font-size:.75rem;color:var(--faint);margin-top:2.1rem;font-variant-numeric:tabular-nums}
  .drag-readout{margin:1rem 0 0;font-variant-numeric:tabular-nums}

  /* ---------- Buttons ---------- */
  .btn{
    display:inline-block;padding:.75rem 1.4rem;font:inherit;font-weight:700;cursor:pointer;
    background:var(--accent);color:var(--on-accent);border:0;border-radius:10px;
    transition:filter .2s;
  }
  .btn:hover{filter:brightness(1.08)}
  .btn:disabled{opacity:.45;cursor:default;filter:none}
  .btn--ghost{background:transparent;color:var(--text);border:1px solid var(--line)}
  .btn--ghost:hover{border-color:var(--accent);filter:none}

  /* ---------- Rebuilt model card ---------- */
  .model-card{
    border:1px solid var(--line);border-left:3px solid var(--accent);
    border-radius:12px;background:var(--surface);padding:1.5rem;margin-top:1.4rem;
  }
  .model-card dl{margin:0}
  .model-card dt{
    font-size:12px;letter-spacing:.13em;text-transform:uppercase;
    color:var(--accent);font-weight:700;margin:0 0 .35rem;
  }
  .model-card dd{margin:0 0 1.15rem;color:var(--text)}
  .model-card dd:last-of-type{margin-bottom:0}
  code{
    font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.9em;
    background:var(--code-bg);color:var(--accent);padding:.1em .4em;border-radius:5px;
  }
  .model-card .btn{margin-top:1.3rem}

  /* ---------- Evidence ---------- */
  .sources{list-style:none;margin:0 0 1.4rem;padding:0}
  .sources li{padding:.9rem 0;border-top:1px solid var(--line);color:var(--muted)}
  .sources li:first-child{border-top:0;padding-top:0}
  .sources .cite{display:block;color:var(--faint);font-size:.82rem;margin-top:.25rem}
  details.try{
    border:1px solid var(--line);border-radius:12px;background:var(--surface);
    padding:0;margin:0 0 1.4rem;
  }
  details.try summary{cursor:pointer;font-weight:700;padding:1rem 1.2rem;list-style:none}
  details.try summary::-webkit-details-marker{display:none}
  details.try summary::after{content:"+";float:right;color:var(--accent);font-weight:700}
  details.try[open] summary::after{content:"\2212"}
  details.try ol{margin:.2rem 0 0;padding:0 1.2rem 1.2rem 2.4rem;color:var(--muted)}
  details.try li{margin:.45rem 0}
  .boundary{
    font-size:.82rem;color:var(--faint);margin:0;
    border-left:2px solid var(--line);padding-left:1rem;line-height:1.6;
  }

  /* ---------- Playground (Evidence) ---------- */
  .playground{
    position:relative;border:1px solid var(--line);border-radius:12px;
    background:var(--surface);padding:1.1rem 1.2rem;margin:0 0 1.4rem;
  }
  .pg-label{margin:0 0 .9rem;font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--faint);font-weight:600}
  .pg-slider-label{font-size:.85rem;color:var(--muted);display:block;margin:.9rem 0 .2rem}
  .playground input[type=range]{width:100%;accent-color:var(--accent);margin:.2rem 0 .4rem}
  .pg-caption{margin:.4rem 0 0;font-size:.85rem;color:var(--muted)}
  .playground .fig-tag{top:.7rem;right:.8rem}
  .pg-big{margin:.2rem 0 0;font-variant-numeric:tabular-nums;color:var(--muted)}
  .pg-out{font-size:1.8rem;font-weight:800;color:var(--accent)}
  .pg-bar{height:8px;border-radius:999px;background:var(--track);margin-top:.7rem;overflow:hidden}
  .pg-bar i{display:block;height:100%;width:4%;background:var(--accent);border-radius:999px}
  #drag-demo input[type=range]{width:100%;accent-color:var(--accent);margin:.2rem 0 .4rem}

  /* ---------- Take it with you ---------- */
  .rule-card{margin-top:0}
  .scene-grid{display:grid;gap:1rem;margin-top:1.4rem}
  @media (min-width:640px){.scene-grid{grid-template-columns:repeat(3,1fr)}}
  .scene-card{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:1.1rem 1.2rem}
  .scene-card p{margin:.5rem 0 0;font-size:.92rem;color:var(--muted)}
  .scene-card em{color:var(--text);font-style:normal;font-weight:650}
  .miniapp{
    position:relative;border:1px solid var(--line);border-radius:14px;
    background:var(--surface);padding:1.3rem 1.3rem 1.4rem;margin-top:1.6rem;
  }
  .epi-blob-x{fill:var(--tint);stroke:var(--accent);stroke-width:2}
  .epi-blob-y{fill:var(--surface-2);stroke:var(--muted);stroke-width:2}
  .epi-label{fill:var(--text);font-size:12px;font-weight:650}
  .epi-num{fill:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}

  /* ---------- Related ---------- */
  .rel-grid{display:grid;gap:1rem;margin-top:1.4rem}
  @media (min-width:560px){.rel-grid{grid-template-columns:1fr 1fr}}
  .rel-card{
    display:flex;flex-direction:column;gap:.6rem;padding:1.2rem 1.2rem 1.3rem;
    border:1px dashed var(--line);border-radius:14px;color:var(--muted);
  }
  a.rel-card{text-decoration:none}
  a.rel-card:hover{border-color:var(--accent)}
  a.rel-card:hover .rel-title{color:var(--accent)}
  .rel-dir{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);font-weight:600}
  .rel-title{font-weight:700;color:var(--text);font-size:1.02rem;line-height:1.35}
  .rel-note{font-size:.85rem;color:var(--faint)}

  /* ---------- Share ---------- */
  .share{
    border:1px dashed var(--line);border-radius:14px;background:var(--surface);
    padding:1.3rem 1.3rem 1.4rem;margin-top:1.4rem;
    display:flex;flex-wrap:wrap;align-items:center;gap:1rem;justify-content:space-between;
  }
  .share p{margin:0;color:var(--muted);font-size:.95rem;flex:1 1 260px}

  /* ---------- Notify / footer ---------- */
  .notify-copy{margin:0;font-size:clamp(1.2rem,2.6vw,1.4rem);font-weight:700;letter-spacing:-.01em;max-width:24ch}
  .notify-form{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.3rem}
  .notify-form input{
    flex:1 1 220px;padding:.8rem 1rem;font:inherit;color:var(--text);
    background:var(--bg);border:1px solid var(--line);border-radius:10px;
  }
  .notify-form input::placeholder{color:var(--faint)}
  .notify-done{margin:1rem 0 0;color:var(--accent);font-weight:650}

  footer{border-top:1px solid var(--line);padding:2.6rem 0 3.2rem;font-size:.9rem;color:var(--muted)}
  .foot-nav{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;margin-bottom:1.6rem}
  .foot-nav a{color:var(--muted);text-decoration:none}
  .foot-nav a:hover{color:var(--text);text-decoration:underline}
  .honesty{margin:0 0 .4rem;font-size:.82rem;color:var(--faint)}
  .copy{margin:0;font-size:.82rem;color:var(--faint)}

  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto}
    *,*::before,*::after{transition:none !important;animation:none !important}
  }