/* Share Tech Mono, self-hosted. Google Fonts is unreachable under this
   host's CSP (default-src 'self'), and vendoring matches how Canyon Watch
   already treats third-party assets. SIL OFL 1.1 — see fonts/OFL.txt. */
@font-face {
  font-family: 'Share Tech Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/share-tech-mono-latin-400.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

  :root{
    --g:#00ff41;
    --g-dim:#0a8f28;
    --bg:#000;
    --red:#ff003c;
    --cyan:#00fff9;
  }

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

  html,body{background:var(--bg);color:var(--g);font-family:'Share Tech Mono',ui-monospace,Menlo,Consolas,monospace;overflow-x:hidden}

  body{
    min-height:100vh;
    letter-spacing:.06em;
    text-shadow:0 0 6px rgba(0,255,65,.55), 0 0 22px rgba(0,255,65,.18);
    cursor:crosshair;
  }

  ::selection{background:var(--g);color:#000;text-shadow:none}

  /* ── rain ───────────────────────────────────────────── */
  #rain{position:fixed;inset:0;z-index:0;display:block;opacity:.75}

  /* ── crt overlays ───────────────────────────────────── */
  .scan{
    position:fixed;inset:0;z-index:60;pointer-events:none;
    background:repeating-linear-gradient(180deg,rgba(0,0,0,0) 0 2px,rgba(0,0,0,.38) 2px 4px);
    mix-blend-mode:multiply;
  }
  .sweep{
    position:fixed;left:0;right:0;height:180px;z-index:61;pointer-events:none;
    background:linear-gradient(180deg,transparent,rgba(0,255,65,.055),transparent);
    animation:sweep 7s linear infinite;
  }
  @keyframes sweep{0%{top:-200px}100%{top:110%}}
  .vig{
    position:fixed;inset:0;z-index:59;pointer-events:none;
    background:radial-gradient(ellipse at center,transparent 42%,rgba(0,0,0,.82) 100%);
  }
  .flicker{position:fixed;inset:0;z-index:62;pointer-events:none;background:rgba(0,255,65,.02);animation:flick 4.2s steps(2,end) infinite}
  @keyframes flick{0%,96%,100%{opacity:0}97%{opacity:.5}98%{opacity:0}99%{opacity:.35}}

  /* ── layout ─────────────────────────────────────────── */
  main{position:relative;z-index:10;max-width:1120px;margin:0 auto;padding:0 26px 140px}

  section{padding:9vh 0;border-bottom:1px solid rgba(0,255,65,.13)}
  section:last-of-type{border:none}

  /* ── hero ───────────────────────────────────────────── */
  .hero{min-height:100vh;display:flex;flex-direction:column;justify-content:center;border:none;padding-top:6vh}

  .boot{font-size:clamp(10px,1.15vw,13px);color:var(--g-dim);min-height:8.6em;line-height:1.72;margin-bottom:2.4rem}
  .boot .warn{color:var(--red);text-shadow:0 0 8px rgba(255,0,60,.7)}

  .mark{position:relative;line-height:.86;margin:0 0 .7rem -.06em}
  .mark span{
    display:block;
    font-size:clamp(2.9rem,11.2vw,9.4rem);
    font-weight:400;
    letter-spacing:-.02em;
  }
  .mark .zero{color:#fff;text-shadow:0 0 12px #fff,0 0 40px var(--g),0 0 80px var(--g)}
  .mark .tld{font-size:clamp(1.1rem,4.2vw,3.5rem);letter-spacing:.16em}
  .glitch{position:relative;display:inline-block}
  .glitch::before,.glitch::after{
    content:attr(data-t);position:absolute;left:0;top:0;width:100%;
    background:var(--bg);overflow:hidden;
  }
  .glitch::before{color:var(--cyan);text-shadow:-2px 0 var(--cyan);animation:gl1 3.1s steps(1) infinite}
  .glitch::after{color:var(--red);text-shadow:2px 0 var(--red);animation:gl2 2.3s steps(1) infinite}
  @keyframes gl1{
    0%,92%,100%{clip-path:inset(100% 0 0 0);transform:none}
    93%{clip-path:inset(12% 0 71% 0);transform:translate(-5px,-2px)}
    95%{clip-path:inset(58% 0 22% 0);transform:translate(6px,1px)}
    97%{clip-path:inset(33% 0 49% 0);transform:translate(-3px,2px)}
  }
  @keyframes gl2{
    0%,90%,100%{clip-path:inset(100% 0 0 0);transform:none}
    91%{clip-path:inset(70% 0 12% 0);transform:translate(5px,2px)}
    94%{clip-path:inset(21% 0 63% 0);transform:translate(-6px,-1px)}
    98%{clip-path:inset(46% 0 38% 0);transform:translate(3px,-2px)}
  }

  .rule{display:flex;align-items:center;gap:14px;color:var(--g-dim);font-size:clamp(10px,1.1vw,13px);margin:1.8rem 0 1.1rem}
  .rule::before,.rule::after{content:'';height:1px;background:linear-gradient(90deg,transparent,var(--g-dim),transparent);flex:1}

  .cycler{font-size:clamp(.85rem,2vw,1.35rem);min-height:1.6em;color:var(--g)}
  .cycler .cur{background:var(--g);color:#000;text-shadow:none;animation:blink 1s steps(1) infinite}
  @keyframes blink{50%{opacity:0}}

  .scrollcue{margin-top:auto;padding-top:5vh;color:var(--g-dim);font-size:11px;animation:pulse 2.4s ease-in-out infinite}
  @keyframes pulse{50%{opacity:.25}}

  /* ── headings ───────────────────────────────────────── */
  h2{
    font-size:clamp(.7rem,1.5vw,.86rem);font-weight:400;color:var(--g-dim);
    letter-spacing:.42em;text-transform:uppercase;margin-bottom:2.4rem;
  }
  h2::before{content:'// ';color:var(--g)}

  /* ── trace ──────────────────────────────────────────── */
  .term{
    border:1px solid rgba(0,255,65,.28);
    background:rgba(0,12,4,.72);
    -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
    box-shadow:0 0 40px rgba(0,255,65,.09),inset 0 0 60px rgba(0,255,65,.04);
  }
  .term .bar{
    display:flex;align-items:center;gap:9px;padding:9px 14px;
    border-bottom:1px solid rgba(0,255,65,.22);font-size:11px;color:var(--g-dim);
  }
  .dot{width:8px;height:8px;border:1px solid var(--g-dim);border-radius:50%}
  .term pre{
    padding:20px 18px 24px;font-family:inherit;font-size:clamp(10.5px,1.25vw,14px);
    line-height:1.85;white-space:pre-wrap;word-break:break-word;min-height:15em;
  }
  .term .to{color:#0a6b20}
  .term .hit{color:#fff;text-shadow:0 0 10px #fff}
  .term .loss{color:var(--red);text-shadow:0 0 12px rgba(255,0,60,.8)}

  /* ── redacted grid ──────────────────────────────────── */
  .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(258px,1fr));gap:1px;background:rgba(0,255,65,.18)}
  .cell{
    background:#000;padding:26px 22px 30px;position:relative;overflow:hidden;
    transition:background .25s;
  }
  .cell:hover{background:rgba(0,255,65,.045)}
  .cell .idx{font-size:10px;color:var(--g-dim);letter-spacing:.3em}
  .cell h3{font-size:1rem;font-weight:400;margin:.75rem 0 1rem;letter-spacing:.14em}
  .blk{font-size:.92rem;line-height:1.55;color:var(--g);opacity:.72;word-break:break-all}
  .cell::after{
    content:'ACCESS DENIED';position:absolute;inset:auto 0 0 0;padding:6px 22px;
    font-size:10px;letter-spacing:.32em;color:var(--red);
    border-top:1px solid rgba(255,0,60,.32);background:rgba(255,0,60,.06);
    transform:translateY(101%);transition:transform .22s;
  }
  .cell:hover::after{transform:none}

  /* ── negations ──────────────────────────────────────── */
  .neg{list-style:none;font-size:clamp(1rem,3.1vw,2.15rem);line-height:1.5}
  .neg li{padding:.42em 0;border-bottom:1px solid rgba(0,255,65,.08);opacity:.28;transition:opacity .3s,transform .3s,color .3s}
  .neg li.on{opacity:1}
  .neg li:hover{transform:translateX(12px);color:#fff}
  .neg em{font-style:normal;background:var(--g);color:#000;text-shadow:none;padding:0 .22em}
  .neg s{text-decoration:none;background:linear-gradient(var(--g),var(--g));background-size:100% 2px;background-position:0 55%;background-repeat:no-repeat;opacity:.5}

  /* ── stats ──────────────────────────────────────────── */
  .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:26px;text-align:center}
  .stat .n{font-size:clamp(2.2rem,7vw,4.4rem);line-height:1;color:#fff;text-shadow:0 0 14px #fff,0 0 46px var(--g)}
  .stat .l{font-size:10px;letter-spacing:.3em;color:var(--g-dim);margin-top:.7rem}

  /* ── outro ──────────────────────────────────────────── */
  .outro{text-align:center;padding-top:12vh}
  .outro .q{font-size:clamp(1.05rem,3.4vw,2.3rem);line-height:1.42;margin-bottom:2.6rem}
  .outro .q b{color:#fff;font-weight:400;text-shadow:0 0 14px #fff}
  .prompt{
    display:inline-flex;align-items:center;gap:.5em;font-size:clamp(.95rem,2.4vw,1.5rem);
    border:1px solid rgba(0,255,65,.3);padding:.7em 1.1em;background:rgba(0,12,4,.7);
  }
  .prompt .ps1{color:var(--g-dim)}
  .prompt .cur{display:inline-block;width:.62em;height:1.15em;background:var(--g);animation:blink 1.05s steps(1) infinite}

  footer{
    position:relative;z-index:10;text-align:center;padding:0 26px 70px;
    font-size:10px;letter-spacing:.34em;color:#0a5f1c;
  }
  footer a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(0,255,65,.2)}
  footer a:hover{color:var(--g)}

  .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}
  .reveal.in{opacity:1;transform:none}

  @media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}}
