/* ============================================================
   AlexOS ’96 → 2026 · single stylesheet
   retro desktop + time-travel + modern portfolio
   ============================================================ */
*{margin:0;padding:0;box-sizing:border-box;}
:root{
  /* retro palette */
  --face:#c0c0c0; --hi:#ffffff; --sh:#808080; --dksh:#000; --lt:#dfdfdf;
  --title:#000082; --title2:#1084d0; --teal:#0a8a8a; --sel:#000082;
  --ui:Tahoma,"MS Sans Serif",Geneva,Verdana,sans-serif;
  --px:"Pixelify Sans",monospace;
  --vt:"VT323",monospace;
  /* modern palette */
  --bg:#0b0b0c; --ink:#f1efe9; --acc:#c6ff3a; --mut:#8f8f96;
  --sans:"Inter",system-ui,sans-serif;
  --disp:"Archivo",sans-serif;
  /* custom pixel cursors (original artwork) */
  --cur-arrow:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M4 2 L4 19 L8.4 15 L11 21.5 L13.6 20.4 L11 14 L18 14 Z' fill='%23ffffff' stroke='%23000000' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E") 4 2, default;
  --cur-hand:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M8 2 a1.6 1.6 0 0 1 1.6 1.6 V10 h1 V3.6 a1.6 1.6 0 0 1 3.2 0 V10 h1 V5.6 a1.6 1.6 0 0 1 3.2 0 V13 c0 4-2.6 7-6.6 7 c-2.6 0-3.9-1-5.3-2.9 L3 12.6 c-.8-.9-.7-2.1 .2-2.7 c.8-.6 2-.4 2.6 .4 l.6 .8 V3.6 A1.6 1.6 0 0 1 8 2 z' fill='%23ffffff' stroke='%23000000' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 8 2, pointer;
  --cur-arrow-lime:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M4 2 L4 19 L8.4 15 L11 21.5 L13.6 20.4 L11 14 L18 14 Z' fill='%23c6ff3a' stroke='%23081018' stroke-width='1.4' stroke-linejoin='round'/%3E%3C/svg%3E") 4 2, auto;
  --cur-hand-lime:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M8 2 a1.6 1.6 0 0 1 1.6 1.6 V10 h1 V3.6 a1.6 1.6 0 0 1 3.2 0 V10 h1 V5.6 a1.6 1.6 0 0 1 3.2 0 V13 c0 4-2.6 7-6.6 7 c-2.6 0-3.9-1-5.3-2.9 L3 12.6 c-.8-.9-.7-2.1 .2-2.7 c.8-.6 2-.4 2.6 .4 l.6 .8 V3.6 A1.6 1.6 0 0 1 8 2 z' fill='%23c6ff3a' stroke='%23081018' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") 8 2, pointer;
}
html,body{height:100%;}
body{
  font-family:var(--ui);font-size:12px;overflow:hidden;background:#000;
  cursor:var(--cur-arrow);
  -webkit-font-smoothing:antialiased;
}
button,a,span.tbtn,.dicon,.fitem{cursor:var(--cur-hand);}
img{user-select:none;-webkit-user-drag:none;}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.blink{animation:blink 1.1s steps(2,start) infinite;}
@keyframes blink{to{visibility:hidden;}}

/* ============ INTRO SPLASH ============ */
#intro{position:fixed;inset:0;z-index:9000;background:#000;color:#fff;display:flex;align-items:center;justify-content:center;text-align:center;}
#intro.off{display:none;}
.intro-logo{font-family:var(--px);font-weight:700;font-size:clamp(64px,16vw,160px);line-height:.9;color:#fff;text-shadow:0 0 24px rgba(198,255,58,.35);}
.intro-logo span{color:var(--acc);}
.intro-tag{font-family:var(--vt);font-size:clamp(18px,3.4vw,26px);color:#9a9aa2;margin-top:14px;letter-spacing:.08em;}
.intro-press{font-family:var(--vt);font-size:clamp(14px,2.6vw,20px);color:var(--acc);margin-top:56px;}

/* ============ DESKTOP ============ */
#desk{position:fixed;inset:0 0 40px 0;background:var(--teal);display:none;overflow:hidden;z-index:1;}
#desk.on{display:block;}
#desk.bg-teal{background:var(--teal);}
#desk.bg-clouds{background:linear-gradient(180deg,#3a7bd5 0%,#7fb2e8 46%,#cfe6ff 62%,#3f9e4d 62.2%,#2f7d3c 100%);}
#desk.bg-bricks{background:
  repeating-linear-gradient(0deg,#7a3b2e 0 22px,#5f2c22 22px 24px),
  repeating-linear-gradient(90deg,transparent 0 44px,rgba(0,0,0,.35) 44px 46px);}
#desk.bg-grape{background:linear-gradient(135deg,#2b1055 0%,#7597de 100%);}
#desk.bg-midnight{background:#050510;background-image:radial-gradient(1px 1px at 12% 22%,#fff 60%,transparent),radial-gradient(1px 1px at 38% 68%,#fff 60%,transparent),radial-gradient(1.5px 1.5px at 66% 30%,#fff 60%,transparent),radial-gradient(1px 1px at 84% 58%,#fff 60%,transparent),radial-gradient(1px 1px at 52% 12%,#8fd4ff 60%,transparent),radial-gradient(1px 1px at 24% 84%,#fff 60%,transparent),radial-gradient(1.2px 1.2px at 90% 10%,#fff 60%,transparent);}

/* desktop icons */
#icons{position:absolute;top:14px;left:12px;bottom:10px;display:flex;flex-direction:column;flex-wrap:wrap;align-content:flex-start;gap:6px;z-index:2;}
.dicon{width:84px;padding:8px 4px 6px;text-align:center;color:#fff;border:1px dotted transparent;user-select:none;}
.dicon .ic{font-size:27px;line-height:1;filter:drop-shadow(1px 1px 0 rgba(0,0,0,.55));display:block;}
.dicon .lbl{display:inline-block;margin-top:5px;font-size:11px;line-height:1.25;padding:1px 3px;text-shadow:1px 1px 0 rgba(0,0,0,.6);}
.dicon:hover{border-color:rgba(255,255,255,.35);}
.dicon.sel .lbl{background:var(--sel);}
.dicon.sel{border-color:rgba(255,255,255,.6);}

/* ============ WINDOW CHROME ============ */
.win{position:absolute;background:var(--face);border:2px solid;border-color:var(--hi) var(--dksh) var(--dksh) var(--hi);
  box-shadow:inset -1px -1px 0 var(--sh),inset 1px 1px 0 var(--lt),2px 2px 0 rgba(0,0,0,.28);
  display:flex;flex-direction:column;min-width:240px;}
.win.blur .tbar{background:linear-gradient(90deg,#7b7b7b,#b5b5b5);color:#ececec;}
.win.min{display:none;}
.tbar{display:flex;align-items:center;gap:4px;height:24px;padding:0 3px 0 6px;color:#fff;font-weight:700;font-size:11.5px;
  background:linear-gradient(90deg,var(--title),var(--title2));user-select:none;touch-action:none;}
.tbar .ti{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tbtn{width:18px;height:16px;line-height:14px;text-align:center;font-size:10px;font-weight:700;color:#000;
  background:var(--face);border:1px solid;border-color:var(--hi) var(--dksh) var(--dksh) var(--hi);
  box-shadow:inset -1px -1px 0 var(--sh),inset 1px 1px 0 var(--lt);}
.tbtn:active{border-color:var(--dksh) var(--hi) var(--hi) var(--dksh);box-shadow:inset 1px 1px 0 var(--sh);}
.wbody{flex:1;overflow:auto;padding:10px;position:relative;}
.win canvas{display:block;}

/* beveled button */
.btn{font-family:var(--ui);font-size:11.5px;padding:5px 14px;background:var(--face);color:#000;
  border:2px solid;border-color:var(--hi) var(--dksh) var(--dksh) var(--hi);
  box-shadow:inset -1px -1px 0 var(--sh),inset 1px 1px 0 var(--lt);}
.btn:active:not(:disabled){border-color:var(--dksh) var(--hi) var(--hi) var(--dksh);box-shadow:inset 1px 1px 0 var(--sh);}
.btn:disabled{color:#7a7a7a;text-shadow:1px 1px 0 #fff;}
.inset{border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);background:#fff;}
.dim{color:#555;margin-top:6px;}
.trow{display:flex;gap:8px;margin-top:12px;}

/* ============ TASKBAR ============ */
#taskbar{position:fixed;left:0;right:0;bottom:0;height:40px;background:var(--face);z-index:5000;display:none;
  align-items:center;gap:6px;padding:4px 6px;border-top:2px solid;border-color:var(--hi) transparent transparent transparent;}
#taskbar.on{display:flex;}
#startbtn{font-weight:700;display:flex;align-items:center;gap:6px;height:30px;}
#startbtn .flag{color:#0a8a8a;font-size:14px;text-shadow:1px 1px 0 #fff;}
#startbtn.pressed{border-color:var(--dksh) var(--hi) var(--hi) var(--dksh);box-shadow:inset 1px 1px 0 var(--sh);}
#tasks{flex:1;display:flex;gap:5px;overflow:hidden;height:30px;}
.taskbtn{min-width:120px;max-width:180px;padding:0 10px;font-size:11px;display:flex;align-items:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  background:var(--face);border:2px solid;border-color:var(--hi) var(--dksh) var(--dksh) var(--hi);box-shadow:inset -1px -1px 0 var(--sh),inset 1px 1px 0 var(--lt);}
.taskbtn.on{border-color:var(--dksh) var(--hi) var(--hi) var(--dksh);box-shadow:inset 1px 1px 0 var(--sh);background:var(--lt);font-weight:700;}
#updbtn{height:30px;font-weight:700;color:#084;}
#clock{min-width:76px;height:30px;display:flex;align-items:center;justify-content:center;font-family:var(--vt);font-size:17px;
  border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);background:var(--lt);}

/* ============ START MENU ============ */
#startmenu{position:fixed;left:6px;bottom:42px;width:224px;background:var(--face);z-index:5001;display:none;
  border:2px solid;border-color:var(--hi) var(--dksh) var(--dksh) var(--hi);box-shadow:3px 3px 0 rgba(0,0,0,.35);
  padding:3px 3px 3px 0;}
#startmenu.on{display:block;}
#startmenu .sm-wrap{display:flex;}
#startmenu .sm-side{width:26px;background:linear-gradient(180deg,var(--title),var(--title2));color:#cfe3ff;
  font-family:var(--px);font-size:15px;display:flex;align-items:flex-end;justify-content:center;padding:8px 0;}
#startmenu .sm-side span{writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.06em;}
#startmenu .sm-items{flex:1;display:flex;flex-direction:column;padding:2px;}
.sm-it{display:flex;align-items:center;gap:9px;padding:6px 10px;font-size:12px;color:#000;}
.sm-it .ic{font-size:16px;width:20px;text-align:center;}
.sm-it:hover{background:var(--sel);color:#fff;}
.sm-sep{height:2px;margin:3px 2px;border-top:1px solid var(--sh);border-bottom:1px solid var(--hi);}

/* ============ TIP + DIALOG ============ */
#tip{left:50%;top:38%;width:min(340px,86vw);transform:translate(-50%,-50%);z-index:6000;display:none;}
#tip.on{display:block;}
#tip p{line-height:1.5;}
.dlg{left:50%;top:44%;width:min(360px,88vw);transform:translate(-50%,-50%);z-index:7500;display:none;}
.dlg.on{display:block;}

/* ============ INSTALL ============ */
#install{position:fixed;inset:0;z-index:9000;background:rgba(0,0,20,.82);display:none;align-items:center;justify-content:center;}
#install.on{display:flex;}
.inst-card{position:static;width:min(380px,90vw);}
.inst-card h2{font-family:var(--px);font-size:19px;margin-bottom:4px;}
.pbar{height:20px;margin-top:14px;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);background:#fff;padding:2px;}
.pfill{height:100%;width:0;background:repeating-linear-gradient(90deg,var(--title) 0 10px,var(--title2) 10px 12px);}
.pct{text-align:right;font-family:var(--vt);font-size:16px;margin-top:4px;}

/* ============ ENTRY 2026 GLITCH ============ */
#entry26{position:fixed;inset:0;z-index:9400;background:#000;display:none;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center;}
#entry26.on{display:flex;}
#entry26 h2{font-family:var(--vt);font-size:clamp(18px,4vw,28px);letter-spacing:.4em;color:#8a8a92;text-transform:uppercase;}
#entry26 .big{font-family:var(--px);font-weight:700;font-size:clamp(90px,26vw,260px);line-height:1;color:var(--acc);
  text-shadow:4px 0 0 #ff2d78,-4px 0 0 #22d3ee;animation:flick .08s steps(2) infinite;}
#entry26 p{font-family:var(--vt);font-size:clamp(14px,3vw,20px);color:#8a8a92;margin-top:12px;letter-spacing:.2em;}
@keyframes flick{0%{opacity:1}50%{opacity:.86}100%{opacity:1}}

/* ============ TIME TRAVEL ============ */
#tt{position:fixed;inset:0;z-index:9500;background:#000;display:none;color:#fff;}
#tt.on{display:block;}
#ttcv{position:absolute;inset:0;width:100%;height:100%;}
.tt-date{position:absolute;top:26px;left:50%;transform:translateX(-50%);font-family:var(--vt);font-size:clamp(16px,3.4vw,24px);color:#ffb03a;letter-spacing:.25em;text-shadow:0 0 12px rgba(255,176,58,.8);}
.tt-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;pointer-events:none;}
.tt-center h2{font-family:var(--disp);font-weight:900;font-size:clamp(30px,7vw,84px);letter-spacing:-.02em;color:#fff;text-shadow:0 0 30px rgba(198,255,58,.5);}
.tt-center p{font-family:var(--vt);font-size:clamp(15px,3vw,22px);color:var(--acc);margin-top:10px;letter-spacing:.3em;}
.tt-gauges{position:absolute;left:0;right:0;bottom:34px;display:flex;justify-content:center;gap:clamp(20px,8vw,90px);}
.ttg{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 18px;border:1px solid rgba(255,176,58,.55);background:rgba(20,10,0,.55);box-shadow:0 0 18px rgba(255,176,58,.25) inset;}
.ttg .lbl{font-family:var(--vt);font-size:15px;letter-spacing:.35em;color:#ffb03a;text-transform:uppercase;}
.ttg .val{font-family:var(--vt);font-size:clamp(19px,4.4vw,30px);color:#fff;}
.ttg b{color:#ffb03a;}
.tt-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;}

/* ============ SCREENSAVER ============ */
#saver{position:fixed;inset:0;z-index:8000;background:#000;display:none;}
#saver.on{display:block;}
#savercv{position:absolute;inset:0;width:100%;height:100%;}
.saver-msg{position:absolute;left:0;right:0;bottom:44px;text-align:center;font-family:var(--vt);font-size:19px;color:#9a9aa2;letter-spacing:.12em;line-height:1.7;}
.saver-msg b{color:var(--acc);}

/* ============ SHUTDOWN ============ */
#shutdown{position:fixed;inset:0;z-index:9800;background:#d8871e;display:none;align-items:center;justify-content:center;text-align:center;}
#shutdown.on{display:flex;}
.sd-box{padding:20px;}
.sd-big{font-family:var(--ui);font-weight:700;font-size:clamp(22px,5.4vw,42px);color:#000;line-height:1.35;}
#reboot{margin-top:34px;font-family:var(--vt);font-size:18px;background:none;border:none;color:#000;text-decoration:underline;}
#reboot:hover{color:#fff;}

/* ============ APP BODIES ============ */
/* folder */
.folder{display:grid;grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:8px;}
.fitem{text-align:center;padding:8px 4px;border:1px dotted transparent;color:#000;}
.fitem .ic{font-size:24px;display:block;}
.fitem .fl{font-size:10.5px;display:block;margin-top:4px;line-height:1.3;}
.fitem:hover{border-color:#777;background:rgba(255,255,255,.35);}
.fbar{font-size:10.5px;border-top:1px solid var(--sh);box-shadow:0 1px 0 var(--hi) inset;padding:4px 6px;color:#333;display:flex;justify-content:space-between;}
/* notepad-ish text */
.doc{background:#fff;height:100%;padding:12px 14px;font-size:12.5px;line-height:1.65;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);overflow:auto;}
.doc h3{font-family:var(--px);font-size:17px;margin-bottom:8px;}
.doc p{margin-bottom:10px;}
.doc .hl{background:#ffffa8;}
.doc ul{margin:6px 0 10px 18px;}
.doc li{margin-bottom:6px;line-height:1.5;}
.doc .tag{display:inline-block;background:var(--lt);border:1px solid var(--sh);padding:0 6px;margin:0 4px 4px 0;font-size:10.5px;}
/* pdf view */
.pdfbar{display:flex;gap:6px;align-items:center;margin-bottom:8px;font-size:11px;}
.pdfdoc{background:#fff;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);padding:26px 30px;color:#111;font-family:Georgia,serif;min-height:340px;}
.pdfdoc h1{font-size:22px;letter-spacing:.02em;}
.pdfdoc .sub{color:#444;font-style:italic;margin:2px 0 12px;}
.pdfdoc h4{font-size:12px;letter-spacing:.18em;text-transform:uppercase;border-bottom:1px solid #999;padding-bottom:3px;margin:16px 0 8px;}
.pdfdoc p,.pdfdoc li{font-size:12.5px;line-height:1.6;}
.pdfdoc ul{margin-left:16px;}
/* kid pix */
.kp{display:flex;gap:8px;height:100%;}
.kp-tools{display:flex;flex-direction:column;gap:6px;}
.kp-colors{display:grid;grid-template-columns:repeat(2,22px);gap:4px;}
.kp-sw{width:22px;height:22px;border:2px solid;border-color:var(--hi) var(--dksh) var(--dksh) var(--hi);}
.kp-sw.on{outline:2px solid #000;outline-offset:1px;}
.kp-cv{flex:1;background:#fff;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);position:relative;overflow:hidden;}
.kp-cv canvas{position:absolute;inset:0;width:100%;height:100%;cursor:crosshair;}
.kp .btn{padding:3px 8px;font-size:10.5px;}
/* quiz */
.qz .qq{font-family:var(--px);font-size:16px;margin-bottom:12px;line-height:1.4;}
.qz .qopt{display:block;width:100%;text-align:left;margin-bottom:6px;}
.qz .qfb{min-height:20px;margin-top:8px;font-weight:700;}
.qz .qscore{font-family:var(--vt);font-size:16px;}
/* napster */
.nap .np-now{background:#0c3b0c;color:#7bff7b;font-family:var(--vt);font-size:15px;padding:6px 8px;margin-bottom:8px;display:flex;justify-content:space-between;gap:8px;}
.nap .np-vis{display:flex;gap:3px;align-items:flex-end;height:18px;}
.nap .np-vis i{width:5px;background:#7bff7b;height:4px;}
.nap .np-track{display:flex;justify-content:space-between;align-items:center;padding:6px 8px;border:1px dotted transparent;}
.nap .np-track:hover{background:rgba(255,255,255,.35);border-color:#777;}
.nap .np-track .nm b{display:block;font-weight:700;}
.nap .np-track .nm span{font-size:10px;color:#444;}
.nap .np-ctl{display:flex;gap:6px;margin-bottom:8px;}
/* aims chat */
.im .log{background:#fff;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);height:230px;overflow:auto;padding:8px;font-size:12.5px;line-height:1.5;}
.im .log p{margin-bottom:6px;}
.im .log .u{color:#0000cc;font-weight:700;}
.im .log .b{color:#cc0000;font-weight:700;}
.im .log .sys{color:#777;font-style:italic;}
.im .sendrow{display:flex;gap:6px;margin-top:8px;}
.im .sendrow input{flex:1;font-family:var(--ui);font-size:12px;padding:5px 6px;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);}
/* games hub */
.ghub .gh-it{display:flex;align-items:center;gap:10px;padding:9px 8px;border:1px dotted transparent;}
.ghub .gh-it:hover{border-color:#777;background:rgba(255,255,255,.35);}
.ghub .gh-it .ic{font-size:22px;}
.ghub .gh-it b{display:block;}
.ghub .gh-it span{font-size:10.5px;color:#444;}
/* minesweeper */
.ms{display:inline-block;background:var(--face);padding:8px;}
.ms-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;}
.ms-lcd{background:#000;color:#ff2a2a;font-family:var(--vt);font-size:22px;padding:0 6px;min-width:52px;text-align:center;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);}
.ms-face{width:34px;height:30px;font-size:16px;}
.ms-grid{display:grid;gap:0;border:3px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);touch-action:none;}
.ms-c{width:24px;height:24px;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;
  background:var(--face);border:2px solid;border-color:var(--hi) var(--dksh) var(--dksh) var(--hi);user-select:none;}
.ms-c.open{border:1px solid #9a9a9a;background:#bdbdbd;}
.ms-c.boom{background:#f00;}
.ms-c.n1{color:#0000ff}.ms-c.n2{color:#008000}.ms-c.n3{color:#ff0000}.ms-c.n4{color:#000080}
.ms-c.n5{color:#800000}.ms-c.n6{color:#008080}.ms-c.n7{color:#000}.ms-c.n8{color:#808080}
/* snake */
.sn{background:#0c3b0c;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);}
.sn-hud{display:flex;justify-content:space-between;font-family:var(--vt);font-size:16px;margin-bottom:6px;padding:0 2px;}
.sn-kbd{font-size:10px;color:#555;margin-top:6px;text-align:center;}
/* backgrounds */
.bggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.bgt{text-align:center;}
.bgt .swa{height:46px;border:2px solid;border-color:var(--sh) var(--hi) var(--hi) var(--sh);}
.bgt.on .swa{outline:2px solid var(--sel);outline-offset:2px;}
.bgt .bl{font-size:10.5px;margin-top:4px;display:block;}
/* nostalgia */
.nos .nos-it{display:flex;gap:10px;margin-bottom:11px;line-height:1.5;}
.nos .nos-it .yr{font-family:var(--vt);font-size:16px;color:var(--sel);min-width:44px;font-weight:700;}
/* bin */
.bin .bin-it{display:flex;align-items:center;gap:8px;padding:6px 4px;border-bottom:1px dotted #999;}
.bin .bin-empty{text-align:center;color:#666;padding:26px 0;font-style:italic;}

/* ============ CLIPPY ============ */
#clippy{position:fixed;right:18px;bottom:52px;z-index:6500;display:none;width:150px;filter:drop-shadow(2px 3px 0 rgba(0,0,0,.3));}
#clippy.on{display:block;}
.clip-bubble{position:absolute;right:64px;bottom:64px;width:190px;background:#ffffc8;border:1px solid #777;border-radius:8px;
  padding:9px 11px;font-size:11.5px;line-height:1.45;box-shadow:2px 2px 0 rgba(0,0,0,.2);}
.clip-bubble::after{content:"";position:absolute;right:-7px;bottom:14px;width:12px;height:12px;background:#ffffc8;
  border-right:1px solid #777;border-bottom:1px solid #777;transform:rotate(-45deg);}
.clip-body{position:relative;width:86px;height:104px;margin-left:auto;
  background:linear-gradient(135deg,#e8e8e8,#b9b9b9);
  border:5px solid #8f8f8f;border-radius:44px 44px 38px 38px;cursor:var(--cur-hand);}
.clip-body::before{content:"";position:absolute;left:16px;top:26px;width:44px;height:58px;
  border:6px solid #cfcfcf;border-radius:26px 26px 22px 22px;box-shadow:inset 0 0 0 2px #8f8f8f;}
.clip-eyes{position:absolute;top:12px;left:0;right:0;display:flex;justify-content:center;gap:12px;z-index:2;}
.clip-eyes i{width:12px;height:15px;background:#fff;border:1px solid #555;border-radius:50%;position:relative;animation:eyeblink 4.6s infinite;}
.clip-eyes i::after{content:"";position:absolute;left:3px;top:5px;width:5px;height:6px;background:#000;border-radius:50%;}
@keyframes eyeblink{0%,94%,100%{transform:scaleY(1)}96%{transform:scaleY(.1)}}
.clip-mouth{position:absolute;top:44px;left:50%;transform:translateX(-50%);width:16px;height:8px;border:2px solid #555;border-top:none;border-radius:0 0 12px 12px;z-index:2;}
.clip-x{position:absolute;top:-8px;right:-6px;width:20px;height:20px;font-size:10px;background:var(--face);
  border:2px solid;border-color:var(--hi) var(--dksh) var(--dksh) var(--hi);}

/* ============================================================
   MODERN 2026
   ============================================================ */
#modern{position:fixed;inset:0;z-index:7000;background:var(--bg);color:var(--ink);overflow-y:auto;display:none;
  font-family:var(--sans);letter-spacing:-.01em;cursor:var(--cur-arrow-lime);scrollbar-color:#3a3a40 var(--bg);}
#modern.on{display:block;}
#modern a,#modern .back96,#modern .mbrand,#modern button{cursor:var(--cur-hand-lime);}
.mprog{position:fixed;top:0;left:0;height:3px;width:0;z-index:60;background:linear-gradient(90deg,#0b0b0c,#5a5a60,var(--acc));box-shadow:0 0 12px rgba(198,255,58,.45);}
.maurora{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;}
.maurora i{position:absolute;width:46vw;height:46vw;border-radius:50%;filter:blur(120px);opacity:.16;}
.maurora i:nth-child(1){background:#c6ff3a;top:-14vw;left:-10vw;animation:aurA 26s ease-in-out infinite alternate;}
.maurora i:nth-child(2){background:#3a7bff;bottom:-16vw;right:-8vw;animation:aurB 32s ease-in-out infinite alternate;}
.maurora i:nth-child(3){background:#ff2d78;top:34%;left:56%;width:30vw;height:30vw;animation:aurC 38s ease-in-out infinite alternate;}
@keyframes aurA{to{transform:translate(9vw,6vh) scale(1.15);}}
@keyframes aurB{to{transform:translate(-8vw,-7vh) scale(1.2);}}
@keyframes aurC{to{transform:translate(-12vw,8vh);}}

.mnav{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;
  padding:20px clamp(20px,4vw,56px);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  background:rgba(11,11,12,.7);border-bottom:1px solid rgba(255,255,255,.08);}
.mbrand{font-family:var(--disp);font-weight:800;font-size:19px;letter-spacing:-.02em;transition:color .4s;}
.mbrand:hover{color:var(--acc);}
.mlinks{display:flex;align-items:center;gap:clamp(14px,2.6vw,30px);font-size:13.5px;font-weight:500;}
.mlinks a{color:var(--ink);text-decoration:none;position:relative;padding:4px 0;}
.mlinks a::after{content:"";position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--acc);transition:width .3s cubic-bezier(.2,.9,.2,1);}
.mlinks a:hover::after{width:100%;}
.back96{font-size:12px;font-weight:600;color:var(--mut);border:1px solid rgba(255,255,255,.16);padding:7px 13px;border-radius:99px;user-select:none;transition:.3s;}
.back96:hover{color:#0b0b0c;background:var(--acc);border-color:var(--acc);}

.mhero{position:relative;height:100vh;min-height:560px;overflow:hidden;z-index:1;}
.mfield{position:absolute;inset:0;width:100%;height:100%;display:block;}
.meye{position:absolute;left:clamp(20px,4vw,56px);bottom:96px;z-index:2;font-size:12.5px;font-weight:600;letter-spacing:.28em;text-transform:uppercase;color:var(--mut);opacity:0;transition:opacity 1.2s .4s;}
.meye.on{opacity:1;}
.mscrollcue{position:absolute;right:clamp(20px,4vw,56px);bottom:40px;z-index:2;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--mut);opacity:0;transition:opacity 1.2s .8s;animation:cue 2.2s ease-in-out infinite;}
.mscrollcue.on{opacity:1;}
@keyframes cue{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}

.mstate{position:relative;z-index:1;padding:clamp(90px,18vh,200px) clamp(20px,6vw,90px);}
.mbig{font-family:var(--disp);font-weight:800;font-size:clamp(38px,6.6vw,96px);line-height:1.04;letter-spacing:-.03em;max-width:1250px;}
.mbig em{font-style:italic;color:var(--acc);}

.mlabel{font-size:12px;font-weight:600;letter-spacing:.3em;text-transform:uppercase;color:var(--mut);}
.mcaps{position:relative;z-index:1;padding:clamp(70px,12vh,150px) clamp(20px,6vw,90px);}
.mcaps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,1.8vw,26px);margin-top:34px;}
.mcap{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);padding:clamp(22px,2.4vw,36px);
  transition:transform .4s cubic-bezier(.2,.9,.2,1),border-color .4s;}
.mcap:hover{transform:translateY(-6px);border-color:rgba(198,255,58,.55);}
.mcap h3{font-family:var(--disp);font-weight:800;font-size:clamp(19px,1.7vw,25px);letter-spacing:-.01em;padding-bottom:14px;position:relative;margin-bottom:16px;}
.mcap h3::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:3px;background:var(--acc);transition:width .4s;}
.mcap:hover h3::after{width:100%;}
.mcap p{color:var(--mut);font-size:14px;line-height:1.9;}

.mcloud{position:relative;z-index:1;}
.mcloud-stage{position:relative;height:100vh;min-height:520px;overflow:hidden;}
.mcloud-cv{position:absolute;inset:0;width:100%;height:100%;}
.mcloud-flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;}
.mcloud-final{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;
  font-family:var(--disp);font-weight:900;letter-spacing:-.035em;line-height:.95;text-align:center;opacity:0;pointer-events:none;}
.mcloud-final .l2{color:var(--acc);}
.mcloud-final.show{opacity:1;}

.mwork{position:relative;z-index:1;padding:clamp(70px,12vh,150px) 0;}
.mwork .mlabel{padding:0 clamp(20px,6vw,90px);}
.mswipe{padding:8px clamp(20px,6vw,90px) 0;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--acc);opacity:.9;transition:opacity .5s;}
.mswipe.off{opacity:0;}
.mgrid{display:flex;gap:clamp(14px,2vw,28px);overflow-x:auto;padding:34px clamp(20px,6vw,90px) 26px;
  scroll-snap-type:x mandatory;scrollbar-width:none;}
.mgrid::-webkit-scrollbar{display:none;}
.mcard{position:relative;flex:0 0 auto;width:min(76vw,440px);height:clamp(440px,64vh,600px);overflow:hidden;
  scroll-snap-align:center;background:#141416;border:1px solid rgba(255,255,255,.08);display:block;text-decoration:none;color:var(--ink);}
.mcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.9,.2,1),filter .8s;filter:saturate(.92) brightness(.92);}
.mcard:hover img{transform:scale(1.07);filter:saturate(1.05) brightness(1);}
.mcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,12,.16) 0%,rgba(11,11,12,0) 34%,rgba(11,11,12,.88) 100%);}
.mnum{position:absolute;top:18px;left:22px;z-index:2;font-family:var(--disp);font-weight:900;font-size:54px;letter-spacing:-.03em;
  color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.65);transition:.4s;}
.mcard:hover .mnum{color:var(--acc);-webkit-text-stroke:1.5px transparent;}
.mcap2{position:absolute;left:22px;right:22px;bottom:20px;z-index:2;}
.mcap2 .go{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--acc);
  margin-bottom:10px;transform:translateY(6px);opacity:0;transition:.4s;}
.mcard:hover .go{transform:none;opacity:1;}
.mcap2 h3{font-family:var(--disp);font-weight:800;font-size:clamp(24px,2.2vw,32px);letter-spacing:-.02em;}
.mcap2 p{color:#c9c7bf;font-size:13px;margin-top:4px;}
.mdots{display:flex;gap:8px;justify-content:center;padding-top:6px;}
.mdots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.18);transition:.3s;}
.mdots i.on{background:var(--acc);width:22px;border-radius:99px;}

.mabout{position:relative;z-index:1;display:grid;grid-template-columns:minmax(260px,380px) 1fr;gap:clamp(28px,5vw,80px);
  align-items:center;padding:clamp(80px,14vh,170px) clamp(20px,6vw,90px);}
.mportrait{position:relative;}
.mportrait::after{content:"";position:absolute;inset:0;transform:translate(14px,14px);border:2px solid var(--acc);z-index:-1;}
.mportrait img{width:100%;display:block;filter:grayscale(18%);transition:filter .5s;}
.mportrait:hover img{filter:grayscale(0);}
.mabout-txt h2{font-family:var(--disp);font-weight:800;font-size:clamp(30px,3.4vw,50px);letter-spacing:-.025em;line-height:1.08;margin-bottom:26px;}
.mabout-txt p{color:#c9c7bf;font-size:clamp(14.5px,1.15vw,16.5px);line-height:1.85;margin-bottom:18px;max-width:720px;}
.mabout-txt a{color:inherit;text-decoration:underline;text-decoration-color:rgba(198,255,58,.6);}
.acc{color:var(--acc);font-weight:700;}

.mcontact{position:relative;z-index:1;text-align:center;padding:clamp(100px,20vh,220px) 20px;}
.mcontact h2{font-family:var(--disp);font-weight:900;font-size:clamp(64px,15vw,190px);letter-spacing:-.04em;line-height:.95;}
.mword{display:inline-block;}
.mlime{color:var(--acc);}
.memail{display:inline-block;margin-top:38px;font-family:var(--disp);font-weight:700;font-size:clamp(19px,3.4vw,42px);letter-spacing:-.02em;
  color:var(--ink);text-decoration:none;background-image:linear-gradient(var(--acc),var(--acc));background-repeat:no-repeat;
  background-size:100% 2px;background-position:0 100%;transition:background-size .35s cubic-bezier(.2,.9,.2,1),color .35s;padding:0 4px 4px;}
.memail:hover{background-size:100% 100%;color:#0b0b0c;}
.mclinks{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:44px;}
.mclinks a{font-size:13px;font-weight:600;letter-spacing:.06em;color:var(--ink);text-decoration:none;
  border:1px solid rgba(255,255,255,.2);border-radius:99px;padding:13px 26px;transition:.3s;}
.mclinks a:hover{background:var(--acc);color:#0b0b0c;border-color:var(--acc);transform:translateY(-3px);}

.mfoot{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;
  padding:26px clamp(20px,4vw,56px);border-top:1px solid rgba(255,255,255,.08);
  font-size:10.5px;letter-spacing:.14em;color:var(--mut);}

/* scroll reveal */
.rv{opacity:0;transform:translateY(64px);transition:opacity .9s cubic-bezier(.16,.8,.26,1),transform .9s cubic-bezier(.16,.8,.26,1);}
.rv.in{opacity:1;transform:none;}

/* toast */
#toast{position:fixed;right:18px;bottom:18px;z-index:7100;display:none;max-width:330px;background:#141416;color:var(--ink);
  border:1px solid rgba(198,255,58,.5);border-radius:12px;padding:14px 40px 14px 16px;font-family:var(--sans);font-size:13px;line-height:1.5;
  box-shadow:0 10px 40px rgba(0,0,0,.5);animation:toastin .5s cubic-bezier(.2,.9,.2,1);}
#toast.on{display:block;}
#toast a{color:var(--acc);font-weight:600;cursor:var(--cur-hand-lime);}
#toast a:hover{text-decoration:underline;}
#toastx{position:absolute;top:8px;right:10px;background:none;border:none;color:var(--mut);font-size:13px;cursor:var(--cur-hand-lime);}
#toastx:hover{color:var(--acc);}
@keyframes toastin{from{transform:translateY(18px);opacity:0}to{transform:none;opacity:1}}

/* modern scrollbars */
#modern::-webkit-scrollbar{width:10px;}
#modern::-webkit-scrollbar-track{background:var(--bg);}
#modern::-webkit-scrollbar-thumb{background:#3a3a40;border-radius:6px;}
#modern::-webkit-scrollbar-thumb:hover{background:var(--acc);}

/* retro inner scrollbars */
.wbody::-webkit-scrollbar,.doc::-webkit-scrollbar,.im .log::-webkit-scrollbar{width:14px;height:14px;}
.wbody::-webkit-scrollbar-track,.doc::-webkit-scrollbar-track,.im .log::-webkit-scrollbar-track{background:var(--lt);}
.wbody::-webkit-scrollbar-thumb,.doc::-webkit-scrollbar-thumb,.im .log::-webkit-scrollbar-thumb{background:var(--face);border:1px solid;border-color:var(--hi) var(--dksh) var(--dksh) var(--hi);}

::selection{background:var(--sel);color:#fff;}
#modern ::selection{background:var(--acc);color:#0b0b0c;}

/* drag ghost helpers */
.noselect{user-select:none;-webkit-user-select:none;}

/* ============ RESPONSIVE ============ */
@media (max-width:760px){
  #icons{top:10px;left:8px;gap:2px;}
  .dicon{width:76px;padding:6px 2px 5px;}
  .dicon .ic{font-size:23px;}
  /* windows stack near-full width, user scrolls the desk */
  #desk{overflow-y:auto;}
  .win{position:relative !important;left:0 !important;top:0 !important;width:calc(100% - 16px) !important;margin:10px 8px;min-height:0;}
  #tip,.dlg{position:fixed;left:50%;width:min(340px,92vw);}
  #tasks{display:none;}
  #clock{min-width:64px;font-size:15px;}
  .taskbtn{min-width:0;}
  .clip-bubble{width:160px;right:58px;}
  /* modern */
  .mcaps-grid{grid-template-columns:1fr;}
  .mabout{grid-template-columns:1fr;padding:60px 20px;gap:30px;}
  .mportrait{max-width:340px;}
  .mstate{padding:70px 20px;}
  .mcaps{padding:56px 20px;}
  .mwork .mlabel,.mswipe{padding-left:20px;padding-right:20px;}
  .mgrid{padding-left:20px;padding-right:20px;}
  .mcard{width:82vw;height:64vw;min-height:400px;}
  .mcontact{padding:80px 20px;}
  .meye{left:20px;bottom:84px;}
  .mscrollcue{right:20px;bottom:36px;}
  .tt-gauges{gap:14px;bottom:22px;}
  .ttg{padding:8px 12px;}
  .mlinks{gap:12px;font-size:12.5px;}
  .back96{padding:6px 10px;}
  #toast{right:12px;left:12px;max-width:none;}
}