:root{
  --c-bg1:#030704; --c-bg2:#06100a; --c-accent:#72ff62; --c-accent2:#59e9ff;
  --c-text:#e5f8e3; --c-muted:#88aa8a; --c-win:#06100a; --c-titlebar:#0c1c12;
  --c-border:#1c3a24;
}
:root[data-theme="amber"]{
  --c-accent:#ffb347; --c-accent2:#ff8a3d; --c-text:#f8ecd8; --c-muted:#b89a72;
  --c-win:#100a06; --c-titlebar:#1c130c; --c-border:#3a2a1c;
}
:root[data-theme="magenta"]{
  --c-accent:#ff59d6; --c-accent2:#c98bff; --c-text:#fbe5f8; --c-muted:#aa88a4;
  --c-win:#0f0610; --c-titlebar:#1c0c1c; --c-border:#3a1c38;
}
:root[data-theme="mono"]{
  --c-accent:#e5e5e5; --c-accent2:#9adfff; --c-text:#eaeaea; --c-muted:#888888;
  --c-win:#0a0a0a; --c-titlebar:#141414; --c-border:#2a2a2a;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;height:100%;overflow:hidden;}
body{
  font-family:"Lucida Console",Monaco,Consolas,monospace;
  color:var(--c-text);
  background:
    radial-gradient(circle at 20% 15%, color-mix(in srgb, var(--c-accent) 8%, transparent), transparent 45%),
    radial-gradient(circle at 80% 85%, color-mix(in srgb, var(--c-accent2) 8%, transparent), transparent 45%),
    var(--c-bg1);
  user-select:none;
  cursor:url("/assets/cr0sshairs-ship-cursor.svg") 20 9, auto;
}
a,button,.icon,.task-btn,.ql-btn{
  cursor:url("/assets/cr0sshairs-ship-cursor.svg") 20 9, pointer;
}
#desktop{position:absolute;inset:0 0 44px 0;overflow:hidden;}
#matrix-bg{position:absolute;inset:0;z-index:0;}

/* icons */
#icons{position:absolute;top:16px;left:16px;z-index:1;display:flex;flex-direction:column;gap:22px;}
#icons.icons-grid{flex-direction:row;flex-wrap:wrap;max-width:min(560px,calc(100% - 32px));}
.icon{width:84px;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;padding:6px;border:1px solid transparent;border-radius:4px;}
.icon:hover{border-color:var(--c-border);background:rgba(114,255,98,.05);}
.icon .glyph{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:22px;border:1px solid var(--c-accent2);color:var(--c-accent2);background:rgba(6,16,10,.8);}
.icon .label{font-size:11px;text-align:center;color:var(--c-text);line-height:1.3;text-shadow:0 1px 2px #000;}
.icon:focus-visible,.icon.selected{outline:2px solid #fff;outline-offset:2px;background:rgba(89,233,255,.12);}

/* windows */
.win{
  position:absolute;min-width:280px;min-height:180px;
  background:var(--c-win);border:1px solid var(--c-accent2);
  box-shadow:0 10px 30px rgba(0,0,0,.55);
  display:flex;flex-direction:column;overflow:hidden;
}
.win.active{border-color:var(--c-accent);z-index:50;}
.win .titlebar{
  background:var(--c-titlebar);color:var(--c-accent2);
  padding:8px 8px 8px 12px;display:flex;align-items:center;gap:8px;
  cursor:move;border-bottom:1px solid var(--c-border);font-size:13px;letter-spacing:.03em;
}
.win.active .titlebar{color:var(--c-accent);}
.win .titlebar .ttl{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.win .titlebar button{
  width:22px;height:22px;line-height:1;border:1px solid var(--c-border);background:transparent;
  color:inherit;cursor:pointer;font:inherit;font-size:12px;
}
.win .titlebar button:hover{background:rgba(89,233,255,.16);border-color:var(--c-accent2);}
.win .titlebar button.danger:hover{background:rgba(255,80,80,.18);border-color:#ff5050;color:#ff9a9a;}
.win .body{flex:1;position:relative;background:#000;}
.win iframe{width:100%;height:100%;border:0;background:#fff;}
.win .resize{position:absolute;right:0;bottom:0;width:16px;height:16px;cursor:nwse-resize;}
.win .resize::after{content:"";position:absolute;right:3px;bottom:3px;width:8px;height:8px;border-right:2px solid var(--c-border);border-bottom:2px solid var(--c-border);}
.win.maximized{border-radius:0;}
.win.maximized .resize{display:none;}

/* taskbar */
#taskbar{
  position:absolute;left:0;right:0;bottom:0;height:44px;
  background:var(--c-titlebar);border-top:1px solid var(--c-accent);
  display:flex;align-items:center;gap:8px;padding:0 10px;
  font-size:12px;
}
#taskbar .brand{color:var(--c-accent);font-weight:bold;padding-right:10px;border-right:1px solid var(--c-border);margin-right:4px;white-space:nowrap;}
#taskbar .quicklaunch{display:flex;gap:6px;padding-left:10px;border-left:1px solid var(--c-border);margin-left:4px;}
.ql-btn{
  border:1px solid var(--c-accent2);background:rgba(89,233,255,.06);color:var(--c-accent2);
  padding:6px 12px;cursor:pointer;font:inherit;font-size:12px;white-space:nowrap;
}
.ql-btn:hover{background:rgba(89,233,255,.16);}
#taskbar .tasks{flex:1;display:flex;gap:6px;overflow-x:auto;}
.task-btn{
  border:1px solid var(--c-border);background:rgba(255,255,255,.02);color:var(--c-muted);
  padding:6px 12px;cursor:pointer;font:inherit;font-size:12px;white-space:nowrap;
}
.task-btn.active{color:var(--c-accent);border-color:var(--c-accent);background:rgba(114,255,98,.08);}
#clock{color:var(--c-muted);white-space:nowrap;padding-left:8px;}

/* status tray */
#taskbar .tray{
  display:flex;align-items:center;gap:6px;padding:0 10px;margin-left:4px;
  border-left:1px solid var(--c-border);cursor:pointer;
}
#taskbar .tray:hover{background:rgba(89,233,255,.08);}
.tray-dot{width:8px;height:8px;border-radius:50%;background:var(--c-muted);flex:none;}
.tray-dot.online{background:var(--c-accent);box-shadow:0 0 6px rgba(114,255,98,.7);}
.tray-dot.offline{background:#ff5050;box-shadow:0 0 6px rgba(255,80,80,.6);}
.tray-dot.issue{background:#ffcf59;box-shadow:0 0 6px rgba(255,207,89,.6);}
.tray-label{color:var(--c-muted);white-space:nowrap;}

/* boot sequence */
#cr0ssh-boot{
  position:fixed;inset:0;z-index:99999;background:#000;color:var(--c-accent);
  display:flex;flex-direction:column;justify-content:flex-start;
  padding:48px;opacity:1;transition:opacity .35s ease;
}
#cr0ssh-boot pre{
  margin:0;font:inherit;font-size:15px;line-height:1.5;white-space:pre-wrap;
}
#cr0ssh-boot.boot-hide{opacity:0;}
#cr0ssh-boot-skip{
  position:absolute;right:24px;bottom:24px;
  border:1px solid var(--c-border);background:transparent;color:var(--c-muted);
  padding:6px 14px;font:inherit;font-size:12px;cursor:pointer;
}
#cr0ssh-boot-skip:hover{border-color:var(--c-accent2);color:var(--c-accent2);}

@media (max-width:720px){
  #icons{top:10px;left:10px;gap:14px;flex-direction:row;flex-wrap:wrap;max-width:calc(100% - 20px);}
  .icon{width:72px;padding:8px 4px;}
  .icon .glyph{width:48px;height:48px;font-size:24px;}

  /* mobile windows: full-screen "app" view, no drag/resize chrome */
  .win.mobile{
    left:0 !important;top:0 !important;width:100% !important;height:100% !important;
    border-left:0;border-right:0;box-shadow:none;
  }
  .win.mobile .titlebar{padding:10px 8px 10px 14px;font-size:14px;}
  .win.mobile .titlebar button{width:34px;height:34px;font-size:16px;}

  #taskbar{height:52px;padding:0 6px;gap:4px;}
  #taskbar .brand{display:none;}
  #taskbar .quicklaunch{padding-left:6px;margin-left:2px;gap:4px;}
  .ql-btn{padding:8px 6px;font-size:11px;}
  #taskbar .tasks{gap:4px;}
  .task-btn{padding:8px 10px;max-width:90px;overflow:hidden;text-overflow:ellipsis;}
  #clock{font-size:11px;padding-left:4px;}
  #taskbar .tray{padding:0 6px;margin-left:2px;}
  .tray-label{display:none;}

  #cr0ssh-boot{padding:20px;}
  #cr0ssh-boot pre{font-size:13px;}
}

/* toasts */
#cr0ssh-toast-host{position:fixed;left:50%;bottom:60px;transform:translateX(-50%);z-index:2000;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none;}
.cr0ssh-toast{
  background:rgba(6,16,10,.95);border:1px solid var(--c-accent2);color:var(--c-accent2);
  padding:10px 16px;font-size:12px;opacity:0;transform:translateY(8px);
  transition:opacity .25s ease,transform .25s ease;white-space:nowrap;
}
.cr0ssh-toast.show{opacity:1;transform:translateY(0);}

/* right-click context menu */
#cr0ssh-ctx-menu{
  position:fixed;z-index:2000;background:var(--c-titlebar);border:1px solid var(--c-accent2);
  min-width:220px;box-shadow:0 10px 30px rgba(0,0,0,.6);padding:4px;
}
#cr0ssh-ctx-menu button{
  display:block;width:100%;text-align:left;background:transparent;border:0;color:var(--c-text);
  padding:9px 12px;font:inherit;font-size:12px;cursor:pointer;
}
#cr0ssh-ctx-menu button:hover{background:rgba(114,255,98,.12);color:var(--c-accent);}

/* about dialog */
#cr0ssh-about{
  position:fixed;inset:0;z-index:3000;background:rgba(0,0,0,.6);
  display:flex;align-items:center;justify-content:center;padding:20px;
}
#cr0ssh-about .about-box{
  background:var(--c-titlebar);border:1px solid var(--c-accent2);
  padding:24px;min-width:320px;max-width:420px;box-shadow:0 10px 30px rgba(0,0,0,.6);
}
#cr0ssh-about pre{
  margin:0 0 16px 0;white-space:pre-wrap;color:var(--c-text);font:inherit;font-size:13px;line-height:1.6;
}
#cr0ssh-about button{
  border:1px solid var(--c-border);background:transparent;color:var(--c-muted);
  padding:6px 16px;font:inherit;font-size:12px;cursor:pointer;
}
#cr0ssh-about button:hover{border-color:var(--c-accent2);color:var(--c-accent2);}

/* screen fx */
.cr0ssh-glitch{animation:cr0ssh-glitch-anim .45s steps(2,end);}
@keyframes cr0ssh-glitch-anim{
  0%{filter:none;}
  20%{filter:hue-rotate(90deg) saturate(3);}
  40%{filter:invert(.8);}
  60%{filter:hue-rotate(200deg) saturate(3);}
  80%{filter:invert(.3);}
  100%{filter:none;}
}
#desktop.cr0ssh-shake{animation:cr0ssh-shake-anim .45s ease;}
@keyframes cr0ssh-shake-anim{
  0%,100%{transform:translate(0,0);}
  20%{transform:translate(-6px,3px);}
  40%{transform:translate(6px,-3px);}
  60%{transform:translate(-4px,2px);}
  80%{transform:translate(4px,-2px);}
}
#desktop.cr0ssh-dive{animation:cr0ssh-dive-anim .9s ease;}
@keyframes cr0ssh-dive-anim{
  0%{transform:none;filter:none;}
  50%{transform:rotate(1deg) translateY(10px);filter:brightness(.6) saturate(1.4);}
  100%{transform:none;filter:none;}
}
.cr0ssh-bug{
  position:fixed;z-index:1500;color:#c98bff;font:700 16px monospace;pointer-events:none;
  text-shadow:0 0 6px rgba(201,139,255,.8);
}

/* fake crash overlay */
#cr0ssh-crash{
  position:fixed;inset:0;z-index:9999;background:#000;color:#72ff62;
  font-family:"Lucida Console",Monaco,Consolas,monospace;font-size:15px;line-height:1.6;
  padding:40px;
}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition-duration:.01ms !important;animation:none !important;}
}