/* CAT INTELLIGENCE AGENCY — the home page.
   Pixel kittens on a 2D floor, a 3D agency. Night first; the day shift (localStorage
   "cc_theme") restates the page's surfaces, while the hero and the footer stay night.
   Anton for titles, Press Start 2P for small pixel labels, Archivo for reading,
   JetBrains Mono for addresses and templates. */

:root{
  color-scheme:dark;
  --ink:#0b0716;
  --bg:#0b0716; --bg-2:#100a1f; --card:#140d26; --card-2:#1a1130; --line:#2d2049; --line-2:#3d2d63;
  --text:#f2edff; --text-soft:#c0b5dc; --text-faint:#9a90bd;
  --mint:#14f195; --violet:#9945ff; --gold:#f5c542; --tear:#5ab8ff; --orange:#e8742c; --pink:#ff4fd8; --bad:#ff6b5a;
  --mint-text:#5ef0b4; --violet-text:#b994ff; --gold-text:#f5c542; --orange-text:#ff9a57; --tear-text:#8ccfff; --pink-text:#ff8ae6;
  --shadow-ink:rgba(0,0,0,.55);
  --display:Anton,Impact,"Arial Narrow Bold",sans-serif;
  --pixel:"Press Start 2P",ui-monospace,monospace;
  --sans:Archivo,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --px:3px;
  --corners:polygon(0 var(--px),var(--px) var(--px),var(--px) 0,calc(100% - var(--px)) 0,calc(100% - var(--px)) var(--px),100% var(--px),100% calc(100% - var(--px)),calc(100% - var(--px)) calc(100% - var(--px)),calc(100% - var(--px)) 100%,var(--px) 100%,var(--px) calc(100% - var(--px)),0 calc(100% - var(--px)));
}
:root[data-theme="light"]{
  color-scheme:light;
  --bg:#f3f0fb; --bg-2:#ebe6f7; --card:#ffffff; --card-2:#faf8ff; --line:#d9d0ee; --line-2:#1b1430;
  --text:#1b1430; --text-soft:#43395f; --text-faint:#5f5680;
  --mint-text:#08774d; --violet-text:#6d28c9; --gold-text:#7f5a00; --orange-text:#a4460f; --tear-text:#1b6aa8; --pink-text:#b0199a;
  --shadow-ink:rgba(27,20,48,.9);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%}
a{color:var(--violet-text);text-underline-offset:3px}
a:hover{color:var(--mint-text)}
:focus-visible{outline:3px solid var(--mint);outline-offset:3px}
p{margin:0 0 14px;color:var(--text-soft)}
b,strong{color:var(--text)}
code,pre,.post,.ca,.slot{font-variant-ligatures:none}
code{font-family:var(--mono);font-size:.86em;background:var(--bg-2);border:1px solid var(--line);padding:1px 5px;overflow-wrap:anywhere}
code .nw{white-space:nowrap}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:12px;top:12px;z-index:60;background:var(--card);color:var(--text);padding:8px 12px}
.wrap{max-width:1180px;margin:0 auto;padding:0 24px}
@media (max-width:520px){.wrap{padding:0 16px}}
.kitten{image-rendering:pixelated}

/* ── the bar ───────────────────────────────────────────────────────────── */
.bar{position:sticky;top:0;z-index:30;background:rgba(11,7,22,.88);backdrop-filter:blur(10px) saturate(1.3);-webkit-backdrop-filter:blur(10px) saturate(1.3);
  border-bottom:3px solid var(--mint);box-shadow:0 3px 0 0 rgba(153,69,255,.55)}
.bar .wrap{display:flex;align-items:center;gap:12px;min-height:62px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:#f2edff;min-width:0}
.brand:hover{color:#f2edff}
.brand img{width:32px;height:32px;flex:none;image-rendering:pixelated;border:2px solid var(--mint);background:#0b0716}
.brand .name{font-family:var(--display);font-size:21px;line-height:1;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap}
.brand .name em{font-style:normal;color:var(--mint)}
.navlinks{margin-left:auto;display:flex;align-items:center;gap:2px}
.navlinks a{font-family:var(--pixel);font-size:10px;letter-spacing:.02em;color:#c0b5dc;text-decoration:none;padding:9px 10px;white-space:nowrap}
.navlinks a:hover{color:var(--mint)}
.navlinks a.box{color:#0b0716;background:var(--mint);clip-path:var(--corners);margin-left:6px}
.navlinks a.box:hover{background:#f2edff;color:#0b0716}
.shift{font-family:system-ui,"Segoe UI Symbol","Apple Symbols",sans-serif;font-size:16px;line-height:1;width:36px;height:34px;flex:none;
  border:2px solid rgba(242,237,255,.3);background:transparent;color:#c0b5dc;cursor:pointer;margin-left:8px;clip-path:var(--corners)}
.shift:hover{color:#fff;border-color:var(--mint)}
@media (max-width:860px){.navlinks .opt{display:none}}
@media (max-width:460px){
  .bar .wrap{gap:6px}
  .brand{gap:7px}
  .brand .name{font-size:15.5px}
  .brand img{width:26px;height:26px}
  .navlinks a.box{font-size:8px;padding:9px 6px;margin-left:0}
  .shift{margin-left:5px;width:32px}
}
@media (max-width:374px){.brand .name{font-size:13.5px}.navlinks a.box{font-size:7px;padding:9px 5px}}

/* ── buttons ───────────────────────────────────────────────────────────── */
.cta{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.btn{--b:var(--violet);--f:#fff;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:13px 18px;
  font:800 13.5px/1.1 var(--sans);letter-spacing:.07em;text-transform:uppercase;text-decoration:none;color:var(--f);background:var(--b);
  border:0;cursor:pointer;clip-path:var(--corners);box-shadow:inset 0 -4px 0 rgba(0,0,0,.28),inset 0 3px 0 rgba(255,255,255,.18);transition:transform .08s steps(2)}
.btn:hover{color:var(--f);transform:translateY(-2px)}
.btn:active{transform:translateY(1px)}
.btn.mint{--b:var(--mint);--f:#04160e}
.btn.gold{--b:var(--gold);--f:#241800}
.btn.ghost{--b:transparent;--f:var(--text);box-shadow:inset 0 0 0 2px var(--line-2)}
.btn.ghost:hover{box-shadow:inset 0 0 0 2px var(--mint)}
.btn .arr{font-family:var(--mono);font-weight:400}
.btn small,.agent-links button small{font:400 8px/1.3 var(--pixel);letter-spacing:0;text-transform:none;opacity:.9}
.btn[disabled]{--b:transparent;--f:var(--text-faint);cursor:not-allowed;box-shadow:inset 0 0 0 2px var(--line-2);transform:none;opacity:1}
.btn[disabled]::before{content:"";width:8px;height:8px;flex:none;background:currentColor;opacity:.6;
  clip-path:polygon(0 0,100% 0,100% 100%,0 100%,0 0,25% 25%,25% 75%,75% 75%,75% 25%,25% 25%)}

/* ── hero: the 3D agency ───────────────────────────────────────────────── */
.hero{position:relative;isolation:isolate;overflow:hidden;color:#f2edff;
  background:
    radial-gradient(2px 2px at 62% 12%,#cfc6ea 50%,transparent 51%),radial-gradient(2px 2px at 71% 31%,#cfc6ea 50%,transparent 51%),
    radial-gradient(3px 3px at 83% 18%,#5ef0b4 50%,transparent 51%),radial-gradient(2px 2px at 91% 40%,#cfc6ea 50%,transparent 51%),
    radial-gradient(3px 3px at 55% 44%,#b994ff 50%,transparent 51%),radial-gradient(2px 2px at 77% 8%,#fff 50%,transparent 51%),
    radial-gradient(2px 2px at 96% 22%,#fff 50%,transparent 51%),radial-gradient(2px 2px at 48% 6%,#cfc6ea 50%,transparent 51%),
    radial-gradient(80% 50% at 75% 105%,rgba(153,69,255,.22),transparent 70%),#0b0716;
  min-height:clamp(640px,calc(100svh - 65px),940px);border-bottom:3px solid var(--mint);
  --text:#f2edff;--text-soft:#d4cbef;--text-faint:#a79dca;--line-2:#5a4a86;--mint-text:#5ef0b4}
.hero-scene{position:absolute;inset:0;z-index:1}
#hq{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity 1.2s ease;touch-action:pan-y;outline:none}
.hero[data-scene="ready"] #hq{opacity:1;cursor:grab}
.hero[data-scene="ready"] #hq:active{cursor:grabbing}
.hero[data-scene="ready"] #hq.point{cursor:pointer}
#hq:focus-visible{outline:3px solid var(--mint);outline-offset:-3px}
.hero-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:78% 70%;z-index:1;display:block;pointer-events:none;transition:opacity 1.2s ease}
.hero[data-scene="ready"] .hero-poster{opacity:0}
/* On a wide screen the roster picture stands in the scene's column, bottom-aligned, running
   on to the right edge; its left edge melts into the night behind the words. */
@media (min-width:901px){
  .stage{position:relative}
  .hero-poster{inset:auto auto 6% 0;width:calc(100% + max(24px, (100vw - 1180px) / 2 + 24px));max-width:none;height:auto;aspect-ratio:1200/514;object-fit:cover;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 14%),linear-gradient(180deg,transparent 0,#000 24%);-webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg,transparent 0,#000 14%),linear-gradient(180deg,transparent 0,#000 24%);mask-composite:intersect}
}
/* scrims that keep the words readable over the scene */
.hero::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:
    linear-gradient(90deg,rgba(11,7,22,.92) 0%,rgba(11,7,22,.74) 26%,rgba(11,7,22,.2) 44%,rgba(11,7,22,0) 54%),
    linear-gradient(0deg,rgba(11,7,22,.6) 0%,rgba(11,7,22,0) 14%)}
.hero-grid{min-height:inherit;display:grid;grid-template-columns:minmax(0,550px) minmax(0,1fr);pointer-events:none;
  grid-template-areas:"top stage" "bottom stage";grid-template-rows:auto 1fr;column-gap:24px;padding-top:clamp(40px,8vh,92px);padding-bottom:64px}
.hero-top,.hero-bottom{position:relative;z-index:3;pointer-events:auto}
.hero-top{grid-area:top}
.hero-bottom{grid-area:bottom;align-self:start}
.stage{grid-area:stage;min-height:320px;pointer-events:none}
.cia-chip{display:inline-flex;align-items:center;gap:9px;font:400 12px/1 var(--pixel);color:#241800;background:var(--gold);text-decoration:none;
  padding:9px 12px 8px 9px;clip-path:var(--corners);box-shadow:inset 0 -3px 0 rgba(0,0,0,.25)}
.cia-chip small{font:600 11px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;color:#4a3500}
.cia-chip:hover{color:#241800;background:#ffd968}
.coin{width:14px;height:14px;background:#241800;clip-path:polygon(30% 0,70% 0,70% 15%,85% 15%,85% 30%,100% 30%,100% 70%,85% 70%,85% 85%,70% 85%,70% 100%,30% 100%,30% 85%,15% 85%,15% 70%,0 70%,0 30%,15% 30%,15% 15%,30% 15%)}
.hero h1{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(56px,6.6vw,96px);line-height:.9;letter-spacing:.01em;margin:22px 0 18px;color:#fff;
  text-shadow:4px 4px 0 #2a1650}
.hero h1 span,.hero h1 em{display:block}
.hero h1 em{font-style:normal;color:var(--mint);text-shadow:4px 4px 0 #0a4a33}
.headline{font:400 clamp(15px,1.55vw,20px)/1.5 var(--pixel);color:#fff;margin:0 0 22px}
.lead{font-size:clamp(16px,1.3vw,18px);line-height:1.6;color:var(--text-soft);max-width:480px;margin:0 0 26px}
.hint{position:absolute;right:20px;bottom:18px;z-index:3;margin:0;font:400 9px/1.4 var(--pixel);color:#d4cbef;background:rgba(11,7,22,.78);padding:9px 11px 8px;
  box-shadow:0 0 0 2px rgba(94,240,180,.45);opacity:0;transition:opacity .6s;pointer-events:none}
.hint .touch{display:none}
@media (hover:none){.hint .pc{display:none}.hint .touch{display:inline}}
.hero[data-scene="ready"] .hint{opacity:1}
.hero[data-scene="ready"].touched .hint{opacity:0}
@media (prefers-reduced-motion:reduce){.hint{transition:none}}

@media (max-width:900px){
  .hero{min-height:0}
  .hero-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"top" "stage" "bottom";grid-template-rows:auto auto auto;padding-top:28px;padding-bottom:36px}
  .stage{position:relative;height:clamp(300px,94vw,500px);min-height:0;margin:-8px -24px 0}
  .hero-poster{inset:auto auto 0 -37.3%;width:137%;max-width:none;height:auto;aspect-ratio:1200/514;object-fit:cover;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 30%);mask-image:linear-gradient(180deg,transparent 0,#000 30%)}
  .hero[data-scene="poster"] .stage,.hero[data-scene="loading"] .stage,.hero[data-scene="fallback"] .stage{box-shadow:inset 0 3px 0 rgba(20,241,149,.35),inset 0 -3px 0 rgba(20,241,149,.35)}
  /* The scrim darkens behind the title and, below the stage, behind the words, never over the kittens. */
  .hero::after{background:linear-gradient(180deg,rgba(11,7,22,.72) 0%,rgba(11,7,22,.2) 30%,rgba(11,7,22,0) 40%)}
  .hero-bottom::before{content:"";position:absolute;z-index:-1;top:0;bottom:-64px;left:-50vw;right:-50vw;
    background:linear-gradient(180deg,rgba(11,7,22,0) 0,rgba(11,7,22,.9) 26px,rgba(11,7,22,.97) 100%)}
  .hero h1{font-size:clamp(50px,13.4vw,84px);margin-top:18px}
  .hint{right:12px;bottom:10px}
}
@media (max-width:520px){.stage{margin:-8px -16px 0}}

/* ── the name tag that floats above a kitten ───────────────────────────── */
.nametag{--accent:var(--mint);position:absolute;left:0;top:0;z-index:4;display:grid;justify-items:center;gap:6px;
  padding:10px 12px 9px;background:#0b0716;color:#fff;text-align:center;white-space:nowrap;pointer-events:none;
  box-shadow:0 0 0 3px var(--accent),6px 6px 0 3px rgba(0,0,0,.5);will-change:transform}
.nametag[hidden]{display:none}
.nametag::after{content:"";position:absolute;left:var(--arrow,50%);bottom:-15px;width:12px;height:12px;margin-left:-6px;background:var(--accent);
  clip-path:polygon(0 0,100% 0,100% 25%,75% 25%,75% 50%,62.5% 50%,62.5% 75%,37.5% 75%,37.5% 50%,25% 50%,25% 25%,0 25%)}
.nt-code{font:400 11px/1.2 var(--pixel);color:var(--accent);letter-spacing:.02em;text-transform:uppercase}
.nt-beat{font:400 8px/1.3 var(--pixel);color:#e6e0ff;text-transform:uppercase}
.nt-open{font:400 8px/1 var(--pixel);color:#0b0716;background:var(--accent);border:0;padding:7px 8px 6px;cursor:pointer;margin-top:2px;pointer-events:auto;display:inline-flex;align-items:center;gap:6px}
.nt-open::after{content:"";width:6px;height:8px;background:currentColor;clip-path:polygon(0 0,50% 0,50% 25%,75% 25%,75% 37.5%,100% 37.5%,100% 62.5%,75% 62.5%,75% 75%,50% 75%,50% 100%,0 100%)}
.nametag.hover .nt-open{display:none}

/* ── sections ──────────────────────────────────────────────────────────── */
section{scroll-margin-top:72px}
.agents,.onx,.cia,.cmc{padding:92px 0}
@media (max-width:600px){.agents,.onx,.cia,.cmc{padding:62px 0}}
.kicker{display:inline-block;font:400 10px/1.4 var(--pixel);letter-spacing:.04em;text-transform:uppercase;color:var(--mint-text);margin:0 0 16px;
  padding-left:16px;position:relative}
.kicker::before{content:"";position:absolute;left:0;top:2px;width:9px;height:9px;background:currentColor}
h2{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:clamp(38px,5.2vw,68px);line-height:.95;letter-spacing:.01em;margin:0 0 18px;color:var(--text)}
h2 em{font-style:normal;color:var(--mint-text)}
.sub{font-size:clamp(16px,1.4vw,18px);max-width:760px;margin:0 0 40px}
h3{margin:0}

/* ── the agents ────────────────────────────────────────────────────────── */
.agents{background:linear-gradient(180deg,rgba(153,69,255,.10),transparent 420px),var(--bg)}
.agent{--accent:var(--mint);position:relative;display:flex;flex-direction:column;background:var(--card);min-width:0;
  box-shadow:0 0 0 3px var(--accent),8px 8px 0 3px var(--shadow-ink);margin:3px}
.agent-floor{position:relative;height:272px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;flex:none;
  background:
    radial-gradient(3px 3px at 18% 22%,#cfc6ea 50%,transparent 51%),radial-gradient(3px 3px at 74% 14%,#cfc6ea 50%,transparent 51%),
    radial-gradient(3px 3px at 88% 40%,var(--accent) 50%,transparent 51%),radial-gradient(3px 3px at 30% 48%,var(--accent) 50%,transparent 51%),
    radial-gradient(60% 80% at 50% 100%,color-mix(in srgb,var(--accent) 36%,transparent),transparent 72%),#0b0716}
.agent-floor::before{content:"";position:absolute;left:0;right:0;bottom:0;height:46px;z-index:0;border-top:3px solid var(--mint);
  background:url(floor-tile-256.png) 0 0/256px 256px repeat;image-rendering:pixelated;box-shadow:inset 0 12px 14px -8px rgba(0,0,0,.7)}
.agent-floor::after{content:"";position:absolute;left:50%;bottom:34px;width:112px;height:14px;margin-left:-56px;z-index:1;background:rgba(0,0,0,.6);
  clip-path:polygon(18% 0,82% 0,82% 25%,94% 25%,94% 50%,100% 50%,100% 75%,94% 75%,94% 100%,6% 100%,6% 75%,0 75%,0 50%,6% 50%,6% 25%,18% 25%)}
.agent-floor .kitten{position:relative;z-index:2;margin-bottom:38px;width:auto;height:auto;max-width:none;transform-origin:bottom center}
.agent:hover .agent-floor .kitten,.agent:focus-within .agent-floor .kitten{animation:hop .5s steps(1) infinite}
@keyframes hop{0%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.agent-body{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1;min-width:0}
.agent-no{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font:400 9px/1.4 var(--pixel);text-transform:uppercase;color:var(--text-faint);margin:0 0 12px}
.status{font:400 8px/1 var(--pixel);text-transform:uppercase;color:var(--accent);padding:5px 6px 4px;box-shadow:inset 0 0 0 2px var(--accent)}
.status.soft{background:var(--mint);color:#04160e;box-shadow:none}
:root[data-theme="light"] .status{color:var(--text)}
:root[data-theme="light"] .status.soft{color:#04160e}
.agent h3{font-family:var(--display);font-weight:400;text-transform:uppercase;font-size:36px;line-height:1;letter-spacing:.01em;color:var(--text);margin:0 0 12px}
.beat{font-size:14.5px;margin:0 0 12px}
.beat b{font:400 8px/1 var(--pixel);text-transform:uppercase;color:var(--accent);margin-right:6px;vertical-align:1px}
:root[data-theme="light"] .beat b{color:var(--text)}
.catch{font:800 17px/1.35 var(--sans);color:var(--text);margin:0 0 12px;padding-left:12px;box-shadow:inset 4px 0 0 var(--accent)}
.bio{font-size:14.5px;margin:0 0 16px}
.aside{font-size:13px;color:var(--text-faint);margin:-4px 0 16px;padding:8px 10px;background:var(--bg-2);box-shadow:inset 0 0 0 1px var(--line)}
details.file{margin-top:auto;border-top:2px dashed var(--line)}
details.file summary{cursor:pointer;list-style:none;font:400 9px/1.4 var(--pixel);text-transform:uppercase;color:var(--text);padding:14px 0 4px;display:flex;align-items:center;gap:8px}
details.file summary::-webkit-details-marker{display:none}
details.file summary::before{content:"";width:8px;height:8px;background:var(--accent);clip-path:polygon(0 0,50% 0,50% 25%,75% 25%,75% 50%,100% 50%,100% 50%,75% 50%,75% 75%,50% 75%,50% 100%,0 100%);transition:transform .15s steps(2)}
details.file[open] summary::before{transform:rotate(90deg)}
.file-body{margin:10px 0 0}
.facts{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;font-size:14px}
.facts dt{font:400 8px/1.4 var(--pixel);text-transform:uppercase;color:var(--text-faint);margin-top:10px}
.facts dd{margin:0;color:var(--text-soft)}
.file-label{font:400 8px/1.4 var(--pixel);text-transform:uppercase;color:var(--text-faint);margin:6px 0 8px}
.tpl{color:var(--accent);margin-left:6px}
.post{font:400 12.5px/1.6 var(--mono);white-space:pre-wrap;overflow-wrap:anywhere;margin:0;color:var(--text);background:var(--bg-2);padding:12px 14px;border:1px solid var(--line)}
.slot{font-family:var(--mono);color:var(--tear-text);background:rgba(90,184,255,.12);border-bottom:1px dashed currentColor;padding:0 2px}
.fine{font-size:13px;color:var(--text-faint);margin:10px 0 0}
.agent-links{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:16px;font:400 9px/1.4 var(--pixel);text-transform:uppercase}
.agent-links a{color:var(--text);text-decoration:none;box-shadow:inset 0 -3px 0 var(--accent);padding:3px 0}
.agent-links a:hover{color:var(--accent)}
:root[data-theme="light"] .agent-links a:hover{color:var(--text);box-shadow:inset 0 -12px 0 color-mix(in srgb,var(--accent) 40%,transparent)}
.agent-links button{font:400 9px/1.4 var(--pixel);text-transform:uppercase;color:var(--text-faint);background:none;border:2px dashed var(--line-2);padding:7px 9px;cursor:not-allowed;display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap}
:root[data-theme="light"] .agent-links button{border-color:#b9aed6}

.agent.wide{flex-direction:row}
.agent.wide .agent-floor{width:min(42%,340px);height:auto;min-height:320px}
/* The software agent's card is tall on a wide screen: its kitten stands at twice its size. */
@media (min-width:1081px){
  .agent-grid .agent.wide .agent-floor .kitten{width:292px;height:414px}
  .agent-grid .agent.wide .agent-floor::after{width:200px;margin-left:-100px;height:20px;bottom:30px}
  .agent-grid .agent.wide .agent-floor{background:
    radial-gradient(3px 3px at 18% 12%,#cfc6ea 50%,transparent 51%),radial-gradient(3px 3px at 74% 9%,#cfc6ea 50%,transparent 51%),
    radial-gradient(3px 3px at 86% 26%,var(--accent) 50%,transparent 51%),radial-gradient(3px 3px at 24% 34%,var(--accent) 50%,transparent 51%),
    radial-gradient(3px 3px at 60% 20%,#cfc6ea 50%,transparent 51%),
    radial-gradient(70% 60% at 50% 100%,color-mix(in srgb,var(--accent) 34%,transparent),transparent 72%),#0b0716}
}
.agent.director{margin-bottom:40px}
.agent.director .agent-body{padding:30px 32px}
.agent.director h3{font-size:50px}
.agent.director .bio{font-size:16px;max-width:620px}
.agent.director details.file{margin-top:8px}
.agent-grid{display:grid;gap:36px 30px;grid-template-columns:repeat(3,minmax(0,1fr))}
.agent-grid .agent.wide{grid-column:span 2}
@media (max-width:1080px){.agent-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){
  .agent-grid{grid-template-columns:minmax(0,1fr)}
  .agent-grid .agent.wide{grid-column:auto}
  .agent.wide{flex-direction:column}
  .agent.wide .agent-floor{width:auto;height:272px;min-height:0}
  .agent.director .agent-body{padding:22px}
  .agent.director h3{font-size:40px}
}
.agent:target{animation:flash 1.2s steps(2) 2}
@keyframes flash{50%{box-shadow:0 0 0 6px var(--accent),8px 8px 0 6px var(--shadow-ink)}}

/* ── how the cats work on X ────────────────────────────────────────────── */
.onx{background:var(--bg-2);border-top:3px solid var(--line);border-bottom:3px solid var(--line)}
.onx-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:52px;align-items:start}
@media (max-width:980px){.onx-grid{grid-template-columns:minmax(0,1fr);gap:44px}}
.rules-title{font:400 10px/1.4 var(--pixel);text-transform:uppercase;color:var(--text);margin:0 0 20px}
.rules{list-style:none;margin:0;padding:0;display:grid;gap:22px;counter-reset:rule}
.rules li{counter-increment:rule;display:grid;grid-template-columns:52px minmax(0,1fr);gap:4px 16px}
.rules li::before{content:counter(rule);grid-row:span 2;width:44px;height:44px;display:grid;place-content:center;font:400 16px/1 var(--pixel);color:#04160e;background:var(--mint);clip-path:var(--corners);box-shadow:inset 0 -4px 0 rgba(0,0,0,.25)}
.rules h3{font:800 19px/1.3 var(--sans);color:var(--text);margin:8px 0 4px}
.rules p{font-size:15px;margin:0}
.casefile{--accent:var(--tear);position:relative;margin:0;background:var(--card);padding:26px 24px 24px;box-shadow:0 0 0 3px var(--tear),10px 10px 0 3px var(--shadow-ink)}
@media (max-width:600px){.casefile{padding:22px 16px 18px}}
.casefile figcaption{font-size:14px;color:var(--text-soft);margin:0 0 16px;padding-right:120px}
@media (max-width:600px){.casefile figcaption{padding-right:0;padding-top:38px}}
.case-stamp{position:absolute;top:18px;right:16px;font:400 12px/1 var(--pixel);text-transform:uppercase;color:var(--bad);border:3px dashed var(--bad);padding:9px 10px 8px;transform:rotate(-7deg);background:var(--card)}
.thread{display:grid;gap:10px}
.post-card{background:var(--bg-2);border:1px solid var(--line);padding:12px 14px}
.post-card .post{background:none;border:0;padding:0}
.who{display:flex;align-items:center;gap:10px;margin-bottom:10px;font-size:14px;flex-wrap:wrap}
.who img{width:40px;height:40px;border-radius:50%;background:#0b0716;box-shadow:0 0 0 2px var(--mint)}
.who b{color:var(--text)}
.lead-line{display:flex;flex-wrap:wrap;gap:16px 24px;align-items:center;justify-content:space-between;margin-top:52px;padding:22px 24px;background:var(--card);box-shadow:0 0 0 3px var(--line-2)}
.lead-line p{margin:0;font-size:16px}

/* ── $CIA ──────────────────────────────────────────────────────────────── */
.cia{background:radial-gradient(50% 60% at 18% 40%,rgba(245,197,66,.13),transparent 70%),var(--bg)}
.cia-grid{display:grid;grid-template-columns:minmax(0,400px) minmax(0,1fr);gap:60px;align-items:start}
@media (max-width:900px){.cia-grid{grid-template-columns:minmax(0,1fr);gap:40px}}
.cia-portrait{position:relative;max-width:400px;margin:3px}
@media (min-width:901px){.cia-portrait{position:sticky;top:104px}}
.cia-portrait img{display:block;width:100%;height:auto;image-rendering:pixelated;box-shadow:0 0 0 3px var(--gold),12px 12px 0 3px var(--shadow-ink);background:#0b0716}
@media (max-width:900px){.cia-portrait{max-width:300px}}
.ticker{position:absolute;right:-14px;bottom:-22px;margin:0;font:400 clamp(40px,5vw,64px)/1 var(--display);color:var(--gold);background:#0b0716;padding:6px 14px 8px;box-shadow:0 0 0 3px var(--gold);transform:rotate(-4deg)}
@media (max-width:520px){.ticker{right:-6px}}
.cia h2 em{color:var(--gold-text)}
.cia .kicker{color:var(--gold-text)}
.coin-facts{display:grid;grid-template-columns:170px minmax(0,1fr);margin:0 0 26px;border-top:2px solid var(--line)}
.coin-facts dt,.coin-facts dd{padding:13px 0;border-bottom:2px solid var(--line);margin:0}
.coin-facts dt{font:400 9px/1.6 var(--pixel);text-transform:uppercase;color:var(--text-faint);padding-top:16px}
.coin-facts dd{color:var(--text);font-size:16px}
.coin-facts .note{color:var(--text-faint);font-size:14px}
@media (max-width:560px){.coin-facts{grid-template-columns:minmax(0,1fr)}.coin-facts dt{border-bottom:0;padding-bottom:0}.coin-facts dd{padding-top:6px}}
.ca-slot{display:grid;gap:8px}
.ca{display:block;font:400 14px/1.4 var(--mono);color:var(--text);background:var(--bg-2);border:2px dashed var(--line-2);padding:12px 14px;overflow-wrap:anywhere;user-select:all}
.ca[data-empty="true"]{color:var(--text-faint);font-style:italic;user-select:none}
.ca-note{font:400 9px/1.6 var(--pixel);text-transform:uppercase;color:var(--gold-text);text-wrap:balance}
.ca[data-empty="false"]{border-style:solid;border-color:var(--gold,#f5c542);color:var(--text)}
.ca-copy{justify-self:start;font:400 10px/1 var(--pixel);text-transform:uppercase;letter-spacing:1px;padding:10px 14px;min-height:44px;background:var(--gold,#f5c542);color:#1a1204;border:0;box-shadow:4px 4px 0 var(--shadow-ink);cursor:pointer}
.ca-copy:hover{filter:brightness(1.08)}
.ca-copy:focus-visible{outline:3px solid var(--text);outline-offset:2px}
.ca-note a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.scam{margin-top:32px;position:relative;background:var(--card);padding:22px 24px 20px 24px;box-shadow:0 0 0 3px var(--bad),8px 8px 0 3px var(--shadow-ink)}
.scam-title{font:400 12px/1.4 var(--pixel);text-transform:uppercase;color:var(--bad);margin:0 0 10px}
:root[data-theme="light"] .scam-title{color:#b8372a}
.scam p{font-size:15.5px}
.scam p:last-child{margin:0}
.scam .crying{display:flex;align-items:center;gap:12px;font-weight:800;color:var(--tear-text)}
.scam .crying img{width:72px;height:auto;flex:none}

/* ── CoinMarketCat ─────────────────────────────────────────────────────── */
.cmc{background:linear-gradient(180deg,rgba(20,241,149,.07),transparent 380px),var(--bg-2);border-top:3px solid var(--line)}
.cmc-head{display:grid;grid-template-columns:320px minmax(0,1fr);gap:48px;align-items:end;margin-bottom:44px}
@media (max-width:900px){.cmc-head{grid-template-columns:minmax(0,1fr);gap:26px}}
.cmc-art{position:relative;height:360px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden;
  background:radial-gradient(60% 70% at 50% 100%,rgba(20,241,149,.3),transparent 72%),#0b0716;box-shadow:0 0 0 3px var(--mint),10px 10px 0 3px var(--shadow-ink);margin:3px}
@media (max-width:900px){.cmc-art{max-width:320px;height:330px}}
.cmc-art::before{content:"";position:absolute;left:0;right:0;bottom:0;height:52px;border-top:3px solid var(--mint);background:url(floor-tile-256.png) 0 0/256px 256px repeat;image-rendering:pixelated}
.cmc-art::after{content:"";position:absolute;left:50%;top:40%;width:220px;height:220px;margin:-110px 0 0 -110px;border:3px dashed rgba(20,241,149,.45);border-radius:50%;animation:turn 40s linear infinite}
@keyframes turn{to{transform:rotate(360deg)}}
.cmc-art .kitten{position:relative;z-index:2;width:auto;height:auto;max-width:none;margin-bottom:44px}
.cmc .sub{margin-bottom:0}
.pitch{list-style:none;margin:0 0 40px;padding:0;display:grid;gap:18px;grid-template-columns:repeat(6,minmax(0,1fr))}
.pitch li{grid-column:span 2}
.pitch li:nth-child(n+4){grid-column:span 3}
@media (max-width:980px){.pitch{grid-template-columns:repeat(2,minmax(0,1fr))}.pitch li,.pitch li:nth-child(n+4){grid-column:auto}.pitch li:last-child{grid-column:1 / -1}}
@media (max-width:640px){.pitch{grid-template-columns:minmax(0,1fr)}}
.pitch li{background:var(--card);padding:20px 22px;box-shadow:0 0 0 2px var(--line-2)}
:root[data-theme="light"] .pitch li{box-shadow:0 0 0 2px var(--line)}
.pitch h3{font:800 18px/1.3 var(--sans);color:var(--text);margin:0 0 8px;display:flex;gap:10px;align-items:center}
.pitch h3::before{content:"";width:10px;height:10px;flex:none;background:var(--mint)}
.pitch p{font-size:15px;margin:0}
.get{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px 48px;margin-bottom:36px;padding:26px 28px;background:var(--card);box-shadow:0 0 0 3px var(--mint)}
@media (max-width:800px){.get{grid-template-columns:minmax(0,1fr);padding:22px 18px}}
.get-title{font:400 10px/1.4 var(--pixel);text-transform:uppercase;color:var(--mint-text);margin:0 0 12px}
.steps{margin:0;padding:0;list-style:none;counter-reset:s;display:grid;gap:12px}
.steps li{counter-increment:s;display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;color:var(--text-soft);font-size:15px}
.steps li::before{content:counter(s);width:28px;height:28px;display:grid;place-content:center;font:400 11px/1 var(--pixel);background:var(--violet);color:#fff;clip-path:var(--corners)}
.need{margin:0 0 14px;padding:0;list-style:none;display:grid;gap:8px}
.need li{position:relative;padding-left:20px;color:var(--text-soft);font-size:15px}
.need li::before{content:"";position:absolute;left:0;top:.55em;width:8px;height:8px;background:var(--mint)}

/* ── footer ────────────────────────────────────────────────────────────── */
.foot{background:#0b0716;color:#f2edff;padding:0 0 40px;--text-soft:#c0b5dc;--text-faint:#a79dca}
.foot::before{content:"";display:block;height:40px;border-top:3px solid var(--mint);background:url(floor-tile-256.png) 0 0/256px 256px repeat;image-rendering:pixelated;margin-bottom:34px}
.foot-top{display:flex;flex-wrap:wrap;gap:20px 32px;align-items:center;justify-content:space-between}
.foot-links{display:flex;flex-wrap:wrap;gap:6px 18px}
.foot-links a{font:400 9px/2 var(--pixel);text-transform:uppercase;color:#c0b5dc;text-decoration:none}
.foot-links a:hover{color:var(--mint)}
.legal{margin-top:26px;padding-top:20px;border-top:2px solid #2d2049}
.legal p{font-size:13.5px;color:var(--text-faint);margin:0 0 4px;max-width:900px}

/* ── the dossier panel ─────────────────────────────────────────────────── */
.dossier{--accent:var(--mint);width:min(820px,calc(100vw - 32px));max-height:calc(100dvh - 48px);padding:0;border:0;background:var(--card);color:var(--text);
  box-shadow:0 0 0 3px var(--accent),12px 12px 0 3px rgba(0,0,0,.6);overflow:auto;overscroll-behavior:contain}
.dossier::backdrop{background:rgba(6,3,14,.74);backdrop-filter:blur(3px)}
.dossier[open]{animation:pop .22s steps(3)}
@keyframes pop{from{transform:translateY(16px) scale(.97);opacity:0}}
.dossier-inner{position:relative}
.dossier-close{position:absolute;top:10px;right:10px;z-index:5;width:40px;height:40px;font:400 14px/1 var(--pixel);color:#fff;background:#0b0716;border:0;cursor:pointer;box-shadow:inset 0 0 0 3px var(--accent)}
.dossier-close:hover{background:var(--accent);color:#0b0716}
.dossier .agent{box-shadow:none;margin:0;flex-direction:row}
.dossier .agent .agent-floor{width:min(40%,320px);position:sticky;top:0;align-self:flex-start;height:min(560px,calc(100dvh - 54px));min-height:360px}
/* On a wide screen the kitten in a file stands at twice its size (Popcat, holding its radar out, at one and a half). */
@media (min-width:641px) and (min-height:620px){
  .dossier .agent .agent-floor::after{width:190px;margin-left:-95px;height:20px;bottom:30px}
}
.dossier .agent-body{padding:26px 28px 28px}
.dossier .agent h3{font-size:46px;padding-right:44px}
.dossier .agent .kitten{animation:none!important}
@media (max-width:640px){
  .dossier{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
  .dossier .agent{flex-direction:column}
  .dossier .agent .agent-floor{width:auto;align-self:stretch;min-height:0;height:250px;position:relative}
  .dossier .agent-body{padding:20px 18px 22px}
  .dossier .agent h3{font-size:38px}
}