: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;
}
*{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%, rgba(114,255,98,.05), transparent 45%),
    radial-gradient(circle at 80% 85%, rgba(89,233,255,.05), 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;}
.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;}

@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;}
}

/* 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);}

/* 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;}
}