  :root{
    --bg-0:#03050A; --bg-1:#05070D; --bg-2:#08101A;
    --srf-0:#0B1220; --srf-1:#101827; --srf-2:#121A24;
    --cgb-0:#1A2A38; --cgb-1:#2C3E4D; --cgb-2:#5C7080;
    --mag:#FF2D9A; --cyan:#23D9FF; --purple:#7B5CFF; --amber:#D6A35A;
    --ink-0:#F1F3F5; --ink-1:#A6B0BD; --ink-2:#6F7B8A;
    --line:rgba(166,176,189,0.14);
    --line-s:rgba(166,176,189,0.28);
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html,body{background:var(--bg-0);color:var(--ink-0);
    font-family:'Space Grotesk','Noto Sans SC',system-ui,sans-serif;
    -webkit-font-smoothing:antialiased;overflow-x:hidden;}
  body::-webkit-scrollbar{width:0}
  a{color:inherit;text-decoration:none}
  button{font:inherit;color:inherit;cursor:pointer;background:none;border:none}
  img{display:block;max-width:100%}

  /* Typography */
  .cond{font-family:'Barlow Condensed',sans-serif;letter-spacing:-0.005em;}
  .mono{font-family:'JetBrains Mono',monospace;}
  .grot{font-family:'Space Grotesk',sans-serif;}

  /* Atmospherics */
  .grid-bg{position:absolute;inset:0;pointer-events:none;
    background-image:linear-gradient(rgba(92,112,128,0.05) 1px,transparent 1px),
                     linear-gradient(90deg,rgba(92,112,128,0.05) 1px,transparent 1px);
    background-size:64px 64px;
    -webkit-mask-image:radial-gradient(ellipse at 50% 0%,#000 30%,transparent 85%);
            mask-image:radial-gradient(ellipse at 50% 0%,#000 30%,transparent 85%);}
  .scan{position:absolute;inset:0;pointer-events:none;
    background:repeating-linear-gradient(to bottom,rgba(255,255,255,0.015) 0 1px,transparent 1px 3px);
    mix-blend-mode:overlay;z-index:2;}
  .noise{position:absolute;inset:0;pointer-events:none;opacity:0.35;mix-blend-mode:overlay;z-index:2;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/><feColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.5 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");}

  /* Buttons */
  .btn-sys{
    display:inline-flex;align-items:center;gap:10px;padding:13px 20px;
    font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:14px;
    text-transform:uppercase;letter-spacing:0.18em;
    background:transparent;color:var(--ink-0);
    border:1px solid var(--line-s);
    clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
    transition:all 160ms;white-space:nowrap;position:relative;
  }
  .btn-sys:hover{border-color:var(--cyan);color:var(--cyan);box-shadow:inset 0 0 0 1px rgba(35,217,255,0.4);}
  .btn-sys.danger{color:var(--mag);border-color:rgba(255,45,154,0.5);}
  .btn-sys.danger:hover{color:#fff;background:rgba(255,45,154,0.12);box-shadow:inset 0 0 0 1px var(--mag);}
  .btn-sys.primary{color:var(--bg-0);background:var(--cyan);border-color:var(--cyan);}
  .btn-sys.primary:hover{background:#fff;border-color:#fff;box-shadow:0 0 24px rgba(35,217,255,0.5);}
  .btn-sys .idx{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-2);letter-spacing:0.1em;}
  .btn-sys:hover .idx{color:inherit}

  /* Tag */
  .sys-tag{display:inline-flex;align-items:center;gap:8px;padding:5px 10px;
    font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.18em;
    text-transform:uppercase;color:var(--ink-1);
    border:1px solid var(--line);background:rgba(11,18,32,0.7);}
  .sys-tag.cyan{color:var(--cyan);border-color:rgba(35,217,255,0.4);}
  .sys-tag.mag{color:var(--mag);border-color:rgba(255,45,154,0.45);}
  .sys-tag.amb{color:var(--amber);border-color:rgba(214,163,90,0.4);}
  .sys-tag .dot{width:5px;height:5px;background:currentColor;box-shadow:0 0 6px currentColor;}

  /* Archive box */
  .archive{position:relative;background:var(--srf-0);border:1px solid var(--line);
    clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));}
  .archive::before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--cyan),transparent);opacity:0.4;}

  /* Hero title */
  .hero-title{font-family:'Barlow Condensed',sans-serif;font-weight:800;
    letter-spacing:-0.015em;line-height:0.88;text-transform:uppercase;}

  /* Classified stamp */
  .stamp{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;
    border:1px solid var(--mag);color:var(--mag);font-family:'JetBrains Mono',monospace;
    font-size:9.5px;letter-spacing:0.2em;text-transform:uppercase;
    transform:rotate(-2deg);background:rgba(255,45,154,0.05);}

  /* Coord label */
  .coord{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:0.14em;color:var(--ink-2);}
  .coord.cyan{color:var(--cyan)}.coord.mag{color:var(--mag)}.coord.amb{color:var(--amber)}.coord.ink0{color:var(--ink-0)}

  /* Animations */
  @keyframes blink{0%,70%,100%{opacity:1}80%,90%{opacity:.2}}
  @keyframes pulse{0%,100%{opacity:.6}50%{opacity:1}}
  @keyframes splashOut{to{opacity:0;visibility:hidden}}
  @keyframes barFill{from{width:0}to{width:88%}}
  .blink{animation:blink 1.8s infinite}
  .pulse{animation:pulse 2.4s infinite ease-in-out}

  /* ───────── Splash overlay ───────── */
  #splash{
    position:fixed;inset:0;z-index:9999;background:#000;
    display:flex;align-items:center;justify-content:center;flex-direction:column;
    overflow:hidden;
  }
  #splash.dismiss{animation:splashOut .42s ease-in-out forwards;animation-delay:.05s}
  #splash .vignette{position:absolute;inset:0;
    background:radial-gradient(ellipse at 50% 50%,transparent 40%,#000 90%);}
  #splash .top-l{position:absolute;top:24px;left:28px;display:flex;gap:14px;align-items:center}
  #splash .top-r{position:absolute;top:24px;right:28px}
  #splash .bot-l{position:absolute;bottom:28px;left:28px}
  #splash .bot-r{position:absolute;bottom:28px;right:28px}
  #splash .stage{display:flex;flex-direction:column;align-items:center;gap:32px;position:relative;z-index:5}
  #splash .word{font-family:'Barlow Condensed',sans-serif;font-weight:700;font-size:42px;
    letter-spacing:0.18em;text-transform:uppercase;line-height:1;}
  #splash .sysline{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.28em;color:var(--cyan)}
  #splash .specs{display:grid;grid-template-columns:repeat(4,auto);gap:28px;margin-top:12px}
  #splash .specs > div{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:0.16em;
    color:var(--ink-1);padding:6px 10px;border:1px solid var(--line)}
  #splash .specs > div.crit{color:var(--mag)}
  #splash .progress{width:360px;margin-top:14px}
  #splash .track{height:2px;background:var(--cgb-0);position:relative;overflow:hidden}
  #splash .fill{position:absolute;top:0;left:0;bottom:0;background:var(--cyan);
    box-shadow:0 0 8px var(--cyan);width:0;animation:barFill 1.8s ease-out forwards}
  #splash .progress .meta{display:flex;justify-content:space-between;margin-top:6px;
    font-family:'JetBrains Mono',monospace;font-size:9px}
  #splash .progress .meta .l{color:var(--ink-2)}#splash .progress .meta .r{color:var(--cyan)}

  /* ───────── Header/footer hex-seal mark (static) ───────── */
  .rcc-mark{display:block}

  /* ───────── Splash CRYSTAL SIGIL mosaic (24 shards assembling) ───────── */
  @keyframes shardFly{
    0%   {opacity:0;transform:translateX(420px) translateY(-60px) rotate(160deg) scale(.2)}
    35%  {opacity:1}
    100% {opacity:1;transform:translateX(0) translateY(0) rotate(0) scale(1)}
  }
  @keyframes shardGlow{
    0%,100%{filter:drop-shadow(0 0 0 transparent)}
    50%    {filter:drop-shadow(0 0 8px currentColor)}
  }
  @keyframes wipeReveal{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
  @keyframes underlineDraw{from{stroke-dashoffset:240}to{stroke-dashoffset:0}}
  @keyframes haloPulse{
    0%,100%{filter:drop-shadow(0 0 4px rgba(35,217,255,.15)) drop-shadow(0 0 8px rgba(255,45,154,.10))}
    50%    {filter:drop-shadow(0 0 14px rgba(35,217,255,.45)) drop-shadow(0 0 22px rgba(255,45,154,.30))}
  }

  .crystal-mark{display:block;animation:haloPulse 4s ease-in-out infinite;animation-delay:2.2s}
  .crystal-mark .shard{
    opacity:0;transform-origin:center;transform-box:fill-box;
    stroke:#05070D;stroke-width:.5;stroke-linejoin:miter;
    animation:shardFly .55s cubic-bezier(.2,.85,.2,1) forwards;
  }
  /* color tokens for shards */
  .c-dark   {fill:#0B1220}
  .c-mid    {fill:#1A2A38}
  .c-light  {fill:#2C3E4D}
  .c-white  {fill:#F1F3F5}
  .c-cyan   {fill:#23D9FF;color:#23D9FF}
  .c-mag    {fill:#FF2D9A;color:#FF2D9A}
  /* delays — right→center→left swarm pattern */
  .crystal-mark .t1  {animation-delay:.05s}
  .crystal-mark .t2  {animation-delay:.10s}
  .crystal-mark .t3  {animation-delay:.15s}
  .crystal-mark .t4  {animation-delay:.20s}
  .crystal-mark .t5  {animation-delay:.25s}
  .crystal-mark .t6  {animation-delay:.30s}
  .crystal-mark .t7  {animation-delay:.35s}
  .crystal-mark .t8  {animation-delay:.40s}
  .crystal-mark .t9  {animation-delay:.45s}
  .crystal-mark .t10 {animation-delay:.50s}
  .crystal-mark .t11 {animation-delay:.55s}
  .crystal-mark .t12 {animation-delay:.60s}
  .crystal-mark .t13 {animation-delay:.65s}
  .crystal-mark .t14 {animation-delay:.70s}
  .crystal-mark .t15 {animation-delay:.75s}
  .crystal-mark .t16 {animation-delay:.80s}
  .crystal-mark .t17 {animation-delay:.85s}
  .crystal-mark .t18 {animation-delay:.90s}
  .crystal-mark .t19 {animation-delay:.95s}
  .crystal-mark .t20 {animation-delay:1.00s}
  .crystal-mark .t21 {animation-delay:1.05s}
  .crystal-mark .t22 {animation-delay:1.10s}
  .crystal-mark .t23 {animation-delay:1.15s}
  .crystal-mark .t24 {animation-delay:1.20s}
  /* the two neon "eye rays" pulse after assembly */
  .crystal-mark .glow-cyan{animation:shardFly .55s cubic-bezier(.2,.85,.2,1) forwards,
                                     shardGlow 2.6s ease-in-out infinite 2s;}
  .crystal-mark .glow-mag {animation:shardFly .55s cubic-bezier(.2,.85,.2,1) forwards,
                                     shardGlow 2.6s ease-in-out infinite 2.3s;}

  /* wordmark / sysline reveal (clip-path wipe) — fires after mosaic assembled */
  #splash .word{opacity:0;animation:wipeReveal .9s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:1.8s;
    will-change:clip-path;clip-path:inset(0 100% 0 0)}
  #splash .word.shown{opacity:1}
  #splash .underline-svg{display:block;margin:18px auto;overflow:visible}
  #splash .underline-svg line{stroke-dasharray:240;stroke-dashoffset:240;
    animation:underlineDraw .8s ease-out forwards;animation-delay:2.4s}
  #splash .sysline{opacity:0;animation:wipeReveal .7s cubic-bezier(.2,.8,.2,1) forwards;animation-delay:2.7s;
    clip-path:inset(0 100% 0 0)}
  #splash .specs{opacity:0;animation:wipeReveal .6s ease-out forwards;animation-delay:3.0s;clip-path:inset(0 100% 0 0)}
  #splash .progress{opacity:0;animation:wipeReveal .6s ease-out forwards;animation-delay:3.15s;clip-path:inset(0 100% 0 0)}

  #skip{position:absolute;bottom:28px;right:28px;z-index:10;
    font-family:'Barlow Condensed',sans-serif;font-weight:600;font-size:11px;
    text-transform:uppercase;letter-spacing:0.18em;padding:9px 14px;color:var(--ink-0);
    border:1px solid var(--line-s);
    clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
    transition:all 160ms;}
  #skip:hover{border-color:var(--cyan);color:var(--cyan)}

  /* ───────── Site header ───────── */
  header.site{
    position:relative;z-index:10;
    display:grid;grid-template-columns:auto 1fr auto auto;gap:32px;align-items:center;
    padding:18px 40px;border-bottom:1px solid var(--line);
    background:linear-gradient(180deg,rgba(3,5,10,0.9),rgba(3,5,10,0.65));
    backdrop-filter:blur(8px);
  }
  .logo-word{display:flex;align-items:center;gap:12px}
  .logo-word .name{font-family:'Barlow Condensed',sans-serif;font-weight:700;
    font-size:15px;letter-spacing:0.08em;text-transform:uppercase;line-height:1.05}
  .logo-word .sub{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--ink-2);
    margin-top:3px;letter-spacing:0.18em}
  nav.main{display:flex;gap:2px;align-items:center}
  nav.main .nav-item{display:flex;align-items:center;gap:8px;padding:0 14px;position:relative}
  nav.main .nav-item .num{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--ink-2);letter-spacing:0.18em}
  nav.main .nav-item .lab{font-family:'Barlow Condensed',sans-serif;font-size:14px;font-weight:600;
    text-transform:uppercase;letter-spacing:0.14em;color:var(--ink-1);transition:color 160ms;cursor:pointer}
  nav.main .nav-item:hover .lab{color:var(--ink-0)}
  nav.main .nav-item.on .lab{color:var(--ink-0)}
  nav.main .nav-item.on .num{color:var(--cyan)}
  nav.main .nav-item.on::after{content:"";position:absolute;bottom:-19px;left:0;right:0;height:2px;
    background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
  .lang{display:flex;align-items:center;gap:8px;border:1px solid var(--line-s);padding:6px 10px}
  .lang .on{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--cyan);letter-spacing:0.18em}
  .lang .sep{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-2)}
  .lang .alt{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-1);letter-spacing:0.18em;cursor:pointer}

  /* ───────── Hero ───────── */
  section.hero{position:relative;min-height:820px;overflow:hidden}
  .hero .bg{position:absolute;inset:0;background-image:url('/public/hero-raccoon.png');
    background-size:cover;background-position:right center}
  .hero .grad-l{position:absolute;inset:0;
    background:linear-gradient(90deg,rgba(3,5,10,0.96) 0%,rgba(3,5,10,0.82) 30%,rgba(3,5,10,0.35) 55%,rgba(3,5,10,0) 75%)}
  .hero .grad-v{position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(3,5,10,0.55) 0%,transparent 20%,transparent 70%,rgba(3,5,10,0.9) 100%)}
  .hud-top{position:absolute;top:24px;left:40px;right:40px;display:flex;justify-content:space-between;align-items:center;z-index:3}
  .hud-top .hr{width:80px;height:1px;background:var(--line)}
  .hero .col{position:relative;z-index:3;padding:70px 40px 80px;max-width:1100px}
  .hero .tagrow{display:flex;gap:10px;margin-bottom:28px;flex-wrap:wrap}
  .hero h1{font-size:152px;color:var(--ink-0);margin:0;text-shadow:0 0 40px rgba(3,5,10,0.6)}
  .hero h1.outline{margin-top:-8px;color:transparent;-webkit-text-stroke:1.5px var(--ink-0)}
  .hero .ticker{margin-top:28px;display:flex;align-items:center;gap:14px;max-width:720px}
  .hero .ticker .bar{width:40px;height:1px;background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
  .hero .ticker .fill{flex:1;height:1px;background:var(--line)}
  .hero .lead{margin-top:20px;font-family:'Barlow Condensed',sans-serif;font-size:26px;font-weight:600;
    line-height:1.2;color:var(--ink-0);max-width:640px;letter-spacing:0.04em;text-transform:uppercase}
  .hero .sub{margin-top:14px;font-size:15px;line-height:1.75;color:var(--ink-1);max-width:540px}
  .hero .cta-row{margin-top:36px;display:flex;gap:12px;flex-wrap:wrap}
  .hero .stat-strip{margin-top:52px;display:grid;grid-template-columns:repeat(6,1fr);
    border:1px solid var(--line);max-width:940px}
  .hero .stat-strip > div{padding:12px 14px;border-right:1px solid var(--line);background:rgba(3,5,10,0.45)}
  .hero .stat-strip > div:last-child{border-right:none}
  .hero .stat-strip > div.crit{background:rgba(255,45,154,0.06)}
  .hero .stat-strip .n{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--ink-2);letter-spacing:0.16em}
  .hero .stat-strip .v{font-family:'Barlow Condensed',sans-serif;font-size:13px;font-weight:600;
    margin-top:4px;color:var(--ink-0);text-transform:uppercase;letter-spacing:0.08em}
  .hero .stat-strip > div.crit .v{color:var(--mag)}
  .hero .archive-mini{position:absolute;right:40px;bottom:44px;z-index:3;
    padding:14px 18px;min-width:260px;background:rgba(3,5,10,0.75)}
  .hero .archive-mini .head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
  .hero .archive-mini .dot{width:8px;height:8px;background:var(--mag);box-shadow:0 0 8px var(--mag)}
  .hero .scroll-hint{position:absolute;left:40px;bottom:24px;display:flex;gap:10px;align-items:center;z-index:3}
  .hero .scroll-hint .v{width:1px;height:28px;background:var(--cyan)}

  .term{font-family:'JetBrains Mono',monospace;font-size:11.5px;line-height:1.85;color:var(--ink-1)}
  .term .cmd{color:var(--cyan)}
  .term .out{color:var(--ink-1);padding-left:14px}
  .term .warn{color:var(--amber);padding-left:14px}

  /* ───────── Live Feed (hero archive-mini) ───────── */
  #liveFeed{min-width:300px}
  #liveFeed .head-right{display:flex;align-items:center;gap:8px}
  #liveFeed .frame-ctr{font-size:9.5px;letter-spacing:0.18em;color:var(--ink-2);
    padding:2px 6px;border:1px solid var(--line);background:rgba(35,217,255,0.04)}
  #liveFeed .lf-dot{display:inline-block;width:8px;height:8px;background:var(--mag);
    box-shadow:0 0 8px var(--mag)}
  #liveFeed .hb-window{height:18px;margin:6px 0 8px;overflow:hidden;
    border-top:1px dashed var(--line);border-bottom:1px dashed var(--line);position:relative}
  #liveFeed .hb-svg{display:block;width:200%;height:100%;
    animation:hbScroll 4.5s linear infinite}
  #liveFeed .hb-line{fill:none;stroke:var(--cyan);stroke-width:1;
    stroke-linecap:round;stroke-linejoin:round;opacity:0.85;
    filter:drop-shadow(0 0 3px rgba(35,217,255,0.6))}
  #liveFeed .ticker-row{margin-top:4px;padding-top:6px;border-top:1px dashed var(--line);
    color:var(--amber);min-height:1.85em;display:flex;align-items:baseline}
  #liveFeed .ticker-text{display:inline-block;color:var(--amber);white-space:nowrap;overflow:hidden;}
  #liveFeed .ticker-cursor{color:var(--cyan);margin-left:1px}
  @keyframes hbScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
  @keyframes valFlash{0%,100%{color:var(--cyan)}50%{color:#fff}}
  #liveFeed .claw-val.flash{animation:valFlash .14s ease-out}

  /* ───────── Generic section header ───────── */
  .sect{position:relative;padding:120px 40px 80px;border-top:1px solid var(--line)}
  .sect.bg1{background:var(--bg-1);padding:100px 40px}
  .sect.bg1.tall{padding:120px 40px}
  .sect-head{display:grid;grid-template-columns:1fr auto;align-items:end;gap:32px;margin-bottom:48px;position:relative}
  .sect-tag{display:flex;align-items:center;gap:14px;margin-bottom:14px}
  .sect-tag .hr{width:60px;height:1px}
  .sect-tag .hr.mag{background:var(--mag)}
  .sect-tag .hr.cyan{background:var(--cyan)}
  .sect-tag .hr.amb{background:var(--amber)}
  .sect h2{font-family:'Barlow Condensed',sans-serif;font-size:96px;font-weight:800;line-height:0.9;
    text-transform:uppercase;letter-spacing:-0.01em;margin:0}
  .sect .kicker{margin-top:8px;font-family:'Barlow Condensed',sans-serif;font-size:22px;color:var(--ink-2);
    letter-spacing:0.1em;text-transform:uppercase}

  /* ───────── Project files ───────── */
  .proj-wrap{display:grid;grid-template-columns:1fr;gap:40px;position:relative}
  article.proj{position:relative}
  article.proj .header-strip{display:flex;justify-content:space-between;align-items:center;
    padding:12px 18px;border-bottom:1px solid var(--line)}
  article.proj.mag .header-strip{background:rgba(255,45,154,0.08);border-top:1px solid rgba(255,45,154,0.45)}
  article.proj.cyan .header-strip{background:rgba(35,217,255,0.06);border-top:1px solid rgba(35,217,255,0.45)}
  article.proj .grid{display:grid;grid-template-columns:1.1fr 1fr;background:var(--srf-0);
    border:1px solid var(--line);border-top:none}
  article.proj .img-region{position:relative;min-height:360px;border-right:1px solid var(--line);
    padding:22px;display:flex;flex-direction:column;justify-content:space-between}
  article.proj.mag .img-region{background:linear-gradient(135deg,#0a0418,#05070D 40%,#1a0824)}
  article.proj.cyan .img-region{background:linear-gradient(135deg,#0a1018,#05070D 40%,#1a1824)}
  article.proj .img-region::before{content:"";position:absolute;inset:0;
    background-image:repeating-linear-gradient(45deg,rgba(255,255,255,0.02) 0 2px,transparent 2px 6px)}
  article.proj .img-region > *{position:relative;z-index:2}

  /* When the image-region has a real cover image */
  article.proj .img-region.has-image{
    background-size:cover;background-position:center;background-repeat:no-repeat;
  }
  article.proj .img-region.has-image::before{
    background-image:
      linear-gradient(180deg, rgba(3,5,10,0.55) 0%, rgba(3,5,10,0.05) 30%, rgba(3,5,10,0.05) 70%, rgba(3,5,10,0.85) 100%),
      repeating-linear-gradient(45deg,rgba(255,255,255,0.025) 0 2px,transparent 2px 6px);
  }
  /* subtle scanline + grain on cover */
  article.proj .img-region.has-image::after{
    content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
    background:repeating-linear-gradient(to bottom,rgba(255,255,255,0.018) 0 1px,transparent 1px 3px);
    mix-blend-mode:overlay;
  }
  article.proj .img-mid{text-align:center;padding:0 30px}
  article.proj .img-mid .lbl{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--ink-2);
    letter-spacing:0.18em;margin-bottom:10px}
  article.proj .img-mid .desc{font-family:'Barlow Condensed',sans-serif;font-size:18px;font-weight:600;
    color:var(--ink-1);line-height:1.4;text-transform:uppercase;letter-spacing:0.08em}
  article.proj .row{display:flex;justify-content:space-between}
  article.proj .corners{position:absolute;inset:12px;pointer-events:none}
  article.proj .corners::before,article.proj .corners::after,
  article.proj .corners > span::before,article.proj .corners > span::after{
    content:"";position:absolute;width:14px;height:14px;border-style:solid;border-width:1px 0 0 1px}
  article.proj.mag .corners::before,article.proj.mag .corners::after,
  article.proj.mag .corners > span::before,article.proj.mag .corners > span::after{border-color:var(--mag)}
  article.proj.cyan .corners::before,article.proj.cyan .corners::after,
  article.proj.cyan .corners > span::before,article.proj.cyan .corners > span::after{border-color:var(--cyan)}
  article.proj .corners::before{top:0;left:0}
  article.proj .corners::after{top:0;right:0;border-width:1px 1px 0 0}
  article.proj .corners > span{display:block;position:absolute;inset:0}
  article.proj .corners > span::before{bottom:0;left:0;border-width:0 0 1px 1px}
  article.proj .corners > span::after{bottom:0;right:0;border-width:0 1px 1px 0}

  article.proj .content{padding:28px 28px 24px;display:flex;flex-direction:column}
  article.proj .content h3{font-family:'Barlow Condensed',sans-serif;font-size:46px;font-weight:800;
    letter-spacing:0.02em;text-transform:uppercase;line-height:1;margin:8px 0 0}
  article.proj .content p.desc{margin-top:18px;font-size:13.5px;line-height:1.75;color:var(--ink-1)}
  article.proj .tags{margin-top:18px;display:flex;flex-wrap:wrap;gap:6px}
  article.proj .note{margin-top:20px;padding:12px 14px;border-style:dashed;border-width:1px;background:rgba(3,5,10,0.4)}
  article.proj.mag .note{border-color:rgba(255,45,154,0.4)}
  article.proj.cyan .note{border-color:rgba(35,217,255,0.4)}
  article.proj .note .head{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:0.18em;margin-bottom:6px}
  article.proj.mag .note .head{color:var(--mag)}
  article.proj.cyan .note .head{color:var(--cyan)}
  article.proj .note .quote{font-family:'Barlow Condensed',sans-serif;font-size:16px;font-weight:600;
    letter-spacing:0.06em;text-transform:uppercase}
  article.proj .footer{margin-top:24px;display:flex;justify-content:space-between;align-items:center;
    padding-top:16px;border-top:1px dashed var(--line)}
  article.proj .footer .meta{display:flex;gap:18px}
  article.proj .footer .meta .v{font-family:'JetBrains Mono',monospace;font-size:12px;margin-top:2px}
  article.proj .footer .meta .v.cyan{color:var(--cyan)}
  article.proj .footer .meta .v.ink{color:var(--ink-0)}
  article.proj .footer .actions{display:flex;gap:8px}

  /* ───────── Entity File ───────── */
  .entity{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:stretch;position:relative}
  .entity h2{font-size:80px}
  .entity p{margin-top:16px;font-size:15px;line-height:1.9;color:var(--ink-1);max-width:520px}
  .entity p.first{margin-top:32px}
  .entity p.amb{color:var(--amber);font-style:italic}
  .dossier{border:1px solid var(--line-s);background:var(--bg-0);position:relative}
  .dossier .head{display:flex;justify-content:space-between;align-items:center;
    padding:14px 20px;border-bottom:1px solid var(--line-s);background:rgba(35,217,255,0.03)}
  .dossier .body{padding:24px;display:grid;grid-template-columns:170px 1fr;gap:24px}
  .dossier .portrait{aspect-ratio:3/4;border:1px solid var(--line);
    background:linear-gradient(180deg,#0a0812,#05070D);position:relative;
    display:flex;flex-direction:column;justify-content:space-between;padding:12px;text-align:center;
    overflow:hidden;}
  .dossier .portrait.has-photo{background-size:cover;background-position:center}
  .dossier .portrait.has-photo > *{position:relative;z-index:2}
  .dossier .portrait.has-photo::before{
    content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
    background:linear-gradient(180deg,rgba(3,5,10,0.55) 0%,rgba(3,5,10,0) 25%,rgba(3,5,10,0) 70%,rgba(3,5,10,0.85) 100%);
  }
  .dossier .portrait.has-photo::after{
    content:"";position:absolute;inset:0;pointer-events:none;z-index:1;
    background:repeating-linear-gradient(to bottom,rgba(255,255,255,0.022) 0 1px,transparent 1px 3px);
    mix-blend-mode:overlay;
  }
  .dossier .portrait .lbl{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--ink-2);letter-spacing:0.2em}
  .dossier .portrait .lbl.cyan{color:var(--cyan);margin-top:6px}
  .dossier .info .name{font-family:'Barlow Condensed',sans-serif;font-size:28px;font-weight:700;
    letter-spacing:0.05em;text-transform:uppercase;line-height:1}
  .dossier .fields{border-top:1px solid var(--line-s);display:grid;grid-template-columns:1fr 1fr}
  .dossier .fields > div{padding:16px 20px}
  .dossier .fields > div:nth-child(odd){border-right:1px solid var(--line)}
  .dossier .fields > div:nth-child(n+3){border-top:1px solid var(--line)}
  .dossier .fields .v{margin-top:4px;font-family:'Barlow Condensed',sans-serif;font-size:18px;font-weight:700;
    letter-spacing:0.06em;text-transform:uppercase}
  .dossier .stamp-row{padding:14px 20px;border-top:1px solid var(--line-s);
    display:flex;justify-content:space-between;align-items:center;background:rgba(255,45,154,0.04)}

  /* ───────── Internal Notes ───────── */
  .notes-wrap{border:1px solid var(--line-s);position:relative}
  .notes-head{display:grid;grid-template-columns:90px 110px 120px 1fr 80px;gap:0;padding:12px 20px;
    background:rgba(214,163,90,0.06);border-bottom:1px solid var(--line-s)}
  .memo{display:grid;grid-template-columns:90px 110px 120px 1fr 80px;gap:0;
    padding:22px 20px;border-bottom:1px dashed var(--line);align-items:baseline;position:relative}
  .memo:last-child{border-bottom:none}
  .memo .id{font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:0.18em}
  .memo .id.mag{color:var(--mag)}.memo .id.cyan{color:var(--cyan)}.memo .id.amb{color:var(--amber)}
  .memo .date{font-family:'JetBrains Mono',monospace;font-size:11.5px;color:var(--ink-2)}
  .memo .body h4{font-family:'Barlow Condensed',sans-serif;font-size:22px;font-weight:700;
    text-transform:uppercase;letter-spacing:0.02em;line-height:1.3;margin:0}
  .memo .body p{margin-top:8px;font-size:13px;line-height:1.7;color:var(--ink-1)}
  .memo .read{text-align:right;font-family:'JetBrains Mono',monospace;font-size:10.5px;
    color:var(--cyan);letter-spacing:0.18em;cursor:pointer}
  .notes-foot{display:flex;justify-content:space-between;padding:14px 20px;border-top:1px solid var(--line-s);
    background:rgba(3,5,10,0.6)}
  .notes-foot .more{font-family:'JetBrains Mono',monospace;font-size:10.5px;color:var(--cyan);letter-spacing:0.18em;cursor:pointer}

  /* ───────── Contact ───────── */
  .contact-wrap{display:grid;grid-template-columns:1fr 1.15fr;gap:56px;align-items:stretch;position:relative}
  .contact-left h2{font-size:80px}
  .contact-left p{margin-top:16px;font-size:15px;line-height:1.9;color:var(--ink-1);max-width:440px}
  .contact-left p.first{margin-top:28px}
  .contact-left p.amb{color:var(--amber);font-style:italic;font-size:14px}
  .contact-left .actions{margin-top:36px;display:grid;grid-template-columns:1fr;gap:10px;max-width:420px}
  .tx-panel{border:1px solid var(--line-s);background:var(--bg-0);position:relative}
  .tx-panel .head{display:flex;justify-content:space-between;padding:14px 20px;
    border-bottom:1px solid var(--line-s);background:rgba(255,45,154,0.04)}
  .tx-panel .body{padding:24px}
  .tx-panel .channels{padding-left:14px;display:grid;grid-template-columns:110px 1fr;row-gap:4px}
  .tx-panel .channels .k{color:var(--mag)}
  .tx-panel .channels .v{color:var(--ink-0)}
  .tx-panel .form{border-top:1px solid var(--line-s);padding:24px;
    display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .tx-panel .form > div{padding:10px 12px;border:1px solid var(--line);background:rgba(3,5,10,0.45)}
  .tx-panel .form > div .v{margin-top:4px;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-0)}

  /* ───────── Footer ───────── */
  footer.site{padding:64px 40px 32px;border-top:1px solid var(--line-s);background:var(--bg-0);position:relative}
  footer.site .grid-wrap{position:relative;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:48px}
  footer.site p.lead{margin-top:16px;font-size:13px;line-height:1.75;color:var(--ink-1);max-width:320px}
  footer.site p.fine{margin-top:8px;font-size:11.5px;color:var(--ink-2);line-height:1.7}
  footer.site .col-links{display:flex;flex-direction:column;gap:8px;margin-top:12px}
  footer.site .col-links a{font-family:'Barlow Condensed',sans-serif;font-size:14px;color:var(--ink-1);
    text-transform:uppercase;letter-spacing:0.1em;cursor:pointer;transition:color 160ms}
  footer.site .col-links a:hover{color:var(--cyan)}
  footer.site .footrow{margin-top:36px;padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between}

  /* ───────── Mobile ───────── */
  @media (max-width: 880px){
    header.site{grid-template-columns:auto 1fr auto;padding:14px 20px;gap:16px}
    nav.main{display:none}
    .hero{min-height:640px}
    .hero .col{padding:48px 20px 60px}
    .hero h1{font-size:72px}
    .hero h1.outline{margin-top:-4px}
    .hero .lead{font-size:18px}
    .hero .sub{font-size:13px}
    .hero .stat-strip{grid-template-columns:repeat(3,1fr);max-width:100%}
    .hero .stat-strip > div:nth-child(3){border-right:none}
    .hero .stat-strip > div:nth-child(n+4){border-top:1px solid var(--line)}
    .hero .archive-mini{display:none}
    .hud-top{left:20px;right:20px;flex-wrap:wrap;gap:8px}
    .hud-top .hr{display:none}
    .sect{padding:60px 20px 40px}
    .sect.bg1, .sect.bg1.tall{padding:60px 20px}
    .sect-head{grid-template-columns:1fr}
    .sect h2{font-size:42px}
    .sect .kicker{font-size:16px}
    article.proj .grid{grid-template-columns:1fr}
    article.proj .img-region{border-right:none;border-bottom:1px solid var(--line);min-height:240px}
    article.proj .content h3{font-size:30px}
    .entity{grid-template-columns:1fr;gap:32px}
    .entity h2{font-size:42px}
    .dossier .body{grid-template-columns:1fr}
    .dossier .portrait{aspect-ratio:4/3;max-width:200px}
    .notes-head{display:none}
    .memo{grid-template-columns:1fr;gap:8px;padding:18px 14px}
    .memo .read{text-align:left}
    .contact-wrap{grid-template-columns:1fr;gap:32px}
    .contact-left h2{font-size:42px}
    .tx-panel .form{grid-template-columns:1fr}
    footer.site{padding:40px 20px 24px}
    footer.site .grid-wrap{grid-template-columns:1fr;gap:24px}
    footer.site .footrow{flex-direction:column;gap:8px}
  }

  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:0.01ms!important;transition-duration:0.01ms!important}
    .crystal-mark .shard{opacity:1!important;transform:none!important}
  }
