:root{
  --bg:#04060b; --scr:#0a0e15; --fg:#c9d6de; --dim:#5c6b7a; --faint:#394552;
  --grn:#54e89c; --amb:#ffb454; --cyn:#5fd7ff; --red:#ff5f56;
  --pnk:#ff7ab8; --blu:#6ca6ff; --mag:#c39bff;
  --mono:'IBM Plex Mono',ui-monospace,monospace; --disp:'VT323',var(--mono);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--mono);font-size:15px;overflow:hidden}
::selection{background:var(--pnk);color:#180810}
body::before{content:'';position:fixed;inset:0;pointer-events:none;
  background:radial-gradient(620px 420px at 12% 6%,rgba(84,232,156,.06),transparent 60%),
             radial-gradient(720px 520px at 88% 94%,rgba(255,122,184,.06),transparent 60%);
  animation:drift 26s ease-in-out infinite alternate}
@keyframes drift{to{transform:translate(2%,3%) scale(1.04)}}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:#1c2432;border-radius:6px}
*::-webkit-scrollbar-thumb:hover{background:#2a3547}

/* ── CRT screen ─────────────────────────── */
#screen{position:fixed;inset:0;display:flex;flex-direction:column;
  background:linear-gradient(180deg,#0a0f16,#070a10 60%,#0a0e15);animation:flick 7s infinite}
#screen.on{animation:crtOn .7s cubic-bezier(.2,.8,.2,1) both,flick 7s .7s infinite}
#screen.shake{animation:shake .55s linear}
@keyframes crtOn{0%{transform:scaleY(.004);filter:brightness(6)}55%{transform:scaleY(1.01);filter:brightness(1.6)}100%{transform:scaleY(1);filter:brightness(1)}}
@keyframes flick{0%,91%,94%,100%{opacity:1}92.5%{opacity:.965}}
@keyframes shake{10%{transform:translate(-7px,3px)}30%{transform:translate(6px,-4px)}50%{transform:translate(-5px,-2px)}70%{transform:translate(7px,4px)}90%{transform:translate(-3px,2px)}}
.scan{position:fixed;inset:0;z-index:500;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(3,7,11,.17) 0 1px,transparent 1px 3px)}
.vig{position:fixed;inset:0;z-index:501;pointer-events:none;
  background:radial-gradient(120% 92% at 50% 50%,transparent 58%,rgba(0,0,0,.52))}
.sheen{position:fixed;inset:-40%;z-index:499;pointer-events:none;
  background:radial-gradient(38% 28% at 30% 22%,rgba(130,205,255,.05),transparent 70%);
  animation:sheen 19s linear infinite alternate}
@keyframes sheen{to{transform:translate(16%,9%)}}

/* ── boot logo ─────────────────────────── */
#logo{position:absolute;inset:0;z-index:30;display:flex;flex-direction:column;gap:20px;
  align-items:center;justify-content:center;background:linear-gradient(180deg,#070b11,#05070c)}
.l-mark svg{width:96px;height:96px;filter:drop-shadow(0 0 16px rgba(84,232,156,.35));animation:float 3s ease-in-out infinite alternate}
@keyframes float{to{transform:translateY(-7px)}}
.l-name{font-family:var(--disp);font-size:clamp(46px,8vw,78px);letter-spacing:.16em;line-height:1;
  text-shadow:0 0 20px rgba(84,232,156,.28)}
.l-name b{color:var(--grn);font-weight:400}
.l-cur{color:var(--grn);animation:blinkc 1s steps(1) infinite}
@keyframes blinkc{50%{opacity:0}}
.l-sub{color:var(--dim);font-size:12px;letter-spacing:.28em;text-transform:uppercase}
.lbar{display:flex;gap:5px;margin-top:6px}
.lbar i{width:15px;height:22px;background:#131e2a;animation:cell 1.3s infinite}
.lbar i:nth-child(2){animation-delay:.15s}.lbar i:nth-child(3){animation-delay:.3s}
.lbar i:nth-child(4){animation-delay:.45s}.lbar i:nth-child(5){animation-delay:.6s}
.lbar i:nth-child(6){animation-delay:.75s}.lbar i:nth-child(7){animation-delay:.9s}
.lbar i:nth-child(8){animation-delay:1.05s}
@keyframes cell{0%,25%{background:#131e2a;box-shadow:none}48%,62%{background:var(--grn);box-shadow:0 0 12px rgba(84,232,156,.55)}85%,100%{background:#131e2a}}
.l-skip{position:absolute;bottom:26px;color:var(--faint);font-size:11px;letter-spacing:.24em;animation:blinkc 2.2s steps(1) infinite}

/* ── terminal ─────────────────────────── */
#term{flex:1;overflow-y:auto;padding:18px 20px 14px;line-height:1.55;cursor:text}
.line{white-space:pre-wrap;word-break:break-word;min-height:1.55em}
.line.pre{white-space:pre;overflow-x:auto}
.lrow{white-space:pre}
.ok{color:var(--grn);font-weight:700}.warnb{color:var(--amb);font-weight:700}
.dim{color:var(--dim)}.amb{color:var(--amb)}.cyn{color:var(--cyn)}.pnk{color:var(--pnk)}
.mag{color:var(--mag)}.red{color:var(--red)}.err{color:var(--red)}.blu{color:var(--blu)}
.b{font-weight:700}
.bios{font-family:var(--disp);font-size:19px;color:var(--cyn);letter-spacing:.03em}
.bannerpre{margin:0;font-family:var(--disp);font-size:20px;line-height:1.12;color:var(--grn);
  text-shadow:0 0 12px rgba(84,232,156,.3)}
.irow{display:flex;align-items:center;gap:10px;margin-top:2px}
.p-user{color:var(--grn);font-weight:700;text-shadow:0 0 9px rgba(84,232,156,.35)}
.p-sep{color:var(--faint)}.p-path{color:var(--amb)}.p-hash{color:var(--red);font-weight:700}
#tin{flex:1;background:none;border:0;outline:0;color:var(--fg);font:inherit;padding:0;caret-color:var(--grn)}
#tin::placeholder{color:rgba(92,107,122,.55)}

/* ── vim ─────────────────────────── */
#vim{position:fixed;inset:0;z-index:90;background:#0b0f16;display:flex;flex-direction:column;animation:fadein .13s}
@keyframes fadein{from{opacity:0}}
.vtop{display:flex;justify-content:space-between;padding:8px 14px;font-size:11px;
  letter-spacing:.18em;color:var(--faint);border-bottom:1px solid #131c28}
.vscroll{flex:1;overflow:auto;padding:10px 0}
#vbuf{margin:0;font:inherit;line-height:1.5;padding:0 16px;white-space:pre;color:#d7e2ea}
.vln{display:inline-block;width:3ch;text-align:right;margin-right:14px;color:#3c4a5c;user-select:none}
.tilde{color:#3f5570}
.cur-line{background:rgba(255,255,255,.045)}
.curch{background:#cfe3ec;color:#0b0f16}
#vstatus{display:flex;justify-content:space-between;gap:12px;background:#cfe3ec;color:#101720;font-weight:700;padding:2px 12px}
#vcmd{display:flex;align-items:center;gap:8px;height:1.9em;padding:0 12px}
#vmsg{color:var(--amb)}
#vin{white-space:pre;color:var(--fg)}
.vcaret{width:.6em;height:1.1em;background:var(--grn);animation:blinkc 1s steps(1) infinite}

/* ── browser windows ─────────────────────────── */
#wins{position:fixed;inset:0;z-index:50;pointer-events:none}
.win{position:absolute;display:flex;flex-direction:column;width:min(820px,94vw);height:min(560px,78vh);
  background:#12151d;border:1px solid #2b3346;border-radius:10px;overflow:hidden;pointer-events:auto;
  box-shadow:0 24px 60px rgba(0,0,0,.6);animation:winIn .22s cubic-bezier(.2,.9,.3,1.15)}
@keyframes winIn{from{opacity:0;transform:translateY(12px) scale(.96)}}
.win.bye{opacity:0;transform:scale(.96);transition:.16s}
.wbar{display:flex;align-items:center;gap:10px;height:42px;padding:0 12px;
  background:#171b26;border-bottom:1px solid #232b3d;cursor:grab;touch-action:none;flex:none}
.wbar:active{cursor:grabbing}
.wdots{display:flex;gap:7px}
.wdots i{width:12px;height:12px;border-radius:50%}
.wdots .dr{background:#ff5f56}.wdots .da{background:#febc2e}.wdots .dg{background:#28c840}
.wtab{display:flex;align-items:center;gap:8px;background:#1e2432;border:1px solid #2b3346;
  border-radius:8px;padding:5px 6px 5px 12px;font-size:13px;color:#aebfd0;max-width:60%}
.fav{width:8px;height:8px;border-radius:2px;background:var(--pnk);box-shadow:0 0 8px rgba(255,122,184,.7);flex:none}
.wname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wbtn{border:0;background:transparent;color:#8fa2b8;font-size:15px;line-height:1;
  width:22px;height:22px;border-radius:6px;cursor:pointer;flex:none}
.wbtn:hover{background:#333d52;color:#fff}
.wgrip{flex:1}
.waddr{display:flex;align-items:center;gap:9px;margin:9px 12px;padding:6px 13px;
  background:#0c0f16;border:1px solid #232b3d;border-radius:999px;font-size:13px;color:var(--dim);flex:none}
.waddr code{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:inherit}
.wbody{flex:1;background:#0d1117}
.wbody iframe{width:100%;height:100%;border:0;display:block}

/* ── BSOD / glitch / power ─────────────────────────── */
#bsod{position:fixed;inset:0;z-index:300;background:#0078d7;color:#fff;overflow:auto;
  font-family:'Segoe UI',system-ui,sans-serif;animation:fadein .12s}
.bwrap{max-width:760px;padding:11vh 24px 48px}
.sad{font-size:clamp(72px,12vw,116px);font-weight:300;margin-bottom:22px}
.bl{font-size:clamp(17px,2.6vw,23px);line-height:1.5;margin:0}
.bpct{font-size:clamp(17px,2.6vw,23px);margin:28px 0 42px}
.brow{display:flex;gap:28px;align-items:flex-start;flex-wrap:wrap}
#qr{background:#fff;padding:8px}
.binfo{font-size:13px;line-height:1.75;opacity:.95}
.binfo p{margin:0 0 16px}
#glitch{position:fixed;inset:0;z-index:340;background:#000;overflow:hidden}
.gbars{position:absolute;inset:-20%;
  background:repeating-linear-gradient(0deg,rgba(84,232,156,.15) 0 2px,rgba(255,122,184,.12) 2px 4px,transparent 4px 9px);
  animation:gb .12s steps(2) infinite}
@keyframes gb{to{transform:translateY(14px)}}
#ghex{position:absolute;inset:0;margin:0;padding:12px;color:rgba(120,255,180,.5);
  font-size:12px;line-height:1.35;white-space:pre-wrap;font-family:var(--mono)}
#cutoff{position:fixed;inset:0;z-index:460;background:#000;display:flex;align-items:center;justify-content:center}
.cline{width:70%;height:3px;background:#fff;box-shadow:0 0 34px 5px #9fe8ff;animation:cline .6s ease-in forwards}
@keyframes cline{0%{transform:scaleY(7)}55%{transform:scaleY(1)}100%{transform:scaleY(.4) scaleX(0);opacity:0}}
#poff{position:fixed;inset:0;z-index:320;background:#020304;display:flex;flex-direction:column;
  gap:30px;align-items:center;justify-content:center;text-align:center;padding:20px}
.poff-txt{font-family:var(--disp);font-size:clamp(22px,4vw,40px);color:var(--amb);
  letter-spacing:.08em;text-shadow:0 0 18px rgba(255,180,84,.35);line-height:1.4}
.poff-sub{color:var(--faint);font-size:13px;letter-spacing:.2em}
#pbtn{width:76px;height:76px;border-radius:50%;border:2px solid var(--amb);background:transparent;
  color:var(--amb);font-size:30px;cursor:pointer;transition:.25s;animation:pulse 2s infinite}
#pbtn:hover{background:rgba(255,180,84,.12);box-shadow:0 0 36px rgba(255,180,84,.4);transform:scale(1.06)}
@keyframes pulse{50%{opacity:.45}}

@media (max-width:640px){
  #term{font-size:14px;padding:12px}
  #tin{font-size:16px}
  .bannerpre{font-size:13px}
}