/* Decorative, shared Code → Visual Construction layer. */
body{isolation:isolate}
body > main,body > .site-footer{position:relative;z-index:1}
.archive-system{position:fixed;z-index:0;inset:0;overflow:hidden;pointer-events:none;isolation:isolate;background:linear-gradient(90deg,rgba(2,8,19,.87),rgba(2,8,19,.67) 48%,rgba(2,8,19,.83));opacity:var(--archive-opacity,.74);transition:opacity .8s ease}
.archive-system::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 75% 49%,transparent 9%,rgba(2,8,19,.11) 54%,rgba(2,8,19,.5) 96%),linear-gradient(180deg,rgba(2,8,19,.5),transparent 21%,transparent 77%,rgba(2,8,19,.48))}
.archive-system canvas{position:absolute;inset:0 0 0 37%;display:block;width:63%;height:100%;opacity:.82}
.archive-code{position:absolute;z-index:1;left:0;top:0;bottom:0;width:43%;overflow:hidden;opacity:.58;transform:translate3d(0,var(--archive-scroll,0px),0);transition:transform .4s linear;mask-image:linear-gradient(90deg,#000 0%,#000 75%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,#000 0%,#000 75%,transparent 100%)}
.archive-code-head{position:absolute;z-index:2;top:clamp(95px,15vh,160px);left:clamp(22px,3vw,56px);display:flex;align-items:center;gap:12px;color:rgba(180,216,229,.52);font:600 9px/1.5 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.18em;white-space:nowrap}
.archive-code-head::before{content:"";width:5px;height:5px;border:1px solid rgba(143,223,255,.45);transform:rotate(45deg)}
.archive-code-window{position:absolute;inset:clamp(132px,20vh,220px) 0 88px clamp(16px,2.5vw,45px);overflow:hidden;mask-image:linear-gradient(180deg,transparent,#000 12%,#000 84%,transparent);-webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 84%,transparent)}
.archive-code-track{padding-top:12vh;animation:archive-code-scroll var(--code-duration,52s) linear infinite;will-change:transform}
.archive-code-line{position:relative;display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;min-height:19px;white-space:pre;color:rgba(239,247,250,.42);font:500 9px/19px ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.012em}
.archive-code-line .line-no{color:rgba(197,218,228,.24);font-variant-numeric:tabular-nums}
.archive-code-line code{font:inherit;overflow:hidden;text-overflow:clip}
.archive-code-line .code-key{color:rgba(161,219,242,.72)}
.archive-code-line .code-num{color:rgba(192,213,223,.53)}
.archive-code-line .code-comment{color:rgba(181,200,208,.36)}
.archive-code-line.is-current{color:rgba(245,250,253,.82);background:linear-gradient(90deg,rgba(143,223,255,.065),transparent 88%)}
.archive-code-line.is-current::before{content:"";position:absolute;left:-10px;top:2px;bottom:2px;width:1px;background:rgba(143,223,255,.34)}
.archive-code-line.is-current code::after{content:"";display:inline-block;width:1px;height:10px;margin-left:3px;vertical-align:-1px;background:rgba(143,223,255,.48);animation:archive-cursor 1.2s steps(1) infinite}
.archive-system.is-paused .archive-code-track,.archive-system.is-paused .archive-code-line.is-current code::after{animation-play-state:paused}
.archive-runtime{position:absolute;z-index:2;left:clamp(22px,3vw,56px);bottom:clamp(28px,5vh,60px);display:grid;grid-template-columns:repeat(2,max-content);gap:7px 22px;color:rgba(200,220,229,.33);font:500 9px/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:.08em}
.archive-runtime span:nth-child(2n){color:rgba(220,239,247,.47);font-variant-numeric:tabular-nums}
.archive-runtime .is-running{color:rgba(143,223,255,.55)}
@keyframes archive-code-scroll{to{transform:translate3d(0,calc(-1 * var(--code-distance,500px)),0)}}
@keyframes archive-cursor{50%{opacity:.18}}
html.boot-lock .archive-system{opacity:0}
@media(max-width:900px){
  .archive-system{opacity:var(--archive-opacity,.56);background:linear-gradient(90deg,rgba(2,8,19,.88),rgba(2,8,19,.74))}
  .archive-system canvas{inset:64px 0 auto 36%;width:64%;height:38vh;opacity:.68}
  .archive-code{width:58%;opacity:.45;mask-image:linear-gradient(90deg,#000,transparent 92%);-webkit-mask-image:linear-gradient(90deg,#000,transparent 92%)}
  .archive-code-head{top:72px;left:18px;font-size:7px}
  .archive-code-window{inset:94px 0 auto 12px;height:48px}
  .archive-code-track{padding-top:0}
  .archive-code-line{color:rgba(239,247,250,.6)}
  .archive-runtime{display:none}
}
@media(max-width:720px){
  .archive-system canvas{inset:128px -8% auto 24%;width:84%;height:250px;opacity:.60}
  .archive-code{opacity:.34}
  .archive-code-window{height:34px}
  .archive-code-line{grid-template-columns:27px minmax(0,1fr);min-height:17px;font-size:8px;line-height:17px}
}
@media(prefers-reduced-motion:reduce){.archive-code-track,.archive-code-line.is-current code::after{animation:none!important}.archive-system{transition:none}}