:root{
  --bg:#0d1117; --panel:#161b22; --line:#2a2f3a; --ink:#e6edf3; --dim:#8b949e;
  --accent:#7ac5ff; --accent-dim:#1f6feb33; --good:#3fb950; --warn:#d29922; --bad:#f85149;
  --chrome:34px; --taskbar:46px; --radius:8px;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);
  font:13px/1.45 ui-sans-serif,system-ui,"Segoe UI",Roboto,sans-serif;user-select:none}

#wallpaper{position:fixed;inset:0;background:radial-gradient(circle at 28% 18%,#152437,#0d1117 68%)}
#grid{position:absolute;inset:0;
  background-image:linear-gradient(#ffffff07 1px,transparent 1px),linear-gradient(90deg,#ffffff07 1px,transparent 1px);
  background-size:34px 34px}
#desktop{position:fixed;inset:0 0 var(--taskbar) 0}

/* windows */
.win{position:absolute;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:0 12px 34px #0009,0 2px 6px #0006;display:flex;flex-direction:column;overflow:hidden;
  min-width:260px;min-height:150px}
.win.focus{border-color:#3d4655;box-shadow:0 18px 46px #000b,0 0 0 1px #7ac5ff22}
.win.snapping{transition:left .12s ease,top .12s ease,width .12s ease,height .12s ease}
.win-bar{height:var(--chrome);flex:0 0 var(--chrome);display:flex;align-items:center;gap:8px;
  padding:0 6px 0 10px;background:#1b2129;border-bottom:1px solid var(--line)}
.win-title{flex:1;font-size:12.5px;color:#c9d1d9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.win-btn{width:26px;height:22px;border:0;border-radius:5px;background:transparent;color:#9aa4b2;
  font:12px/1 ui-monospace,monospace;cursor:pointer}
.win-btn:hover{background:#262d38;color:var(--ink)}
.win-btn.close:hover{background:var(--bad);color:#fff}
.win-body{flex:1;overflow:auto;background:#11151b}
.win-rz{position:absolute;z-index:5}
.win-rz.n{top:-3px;left:8px;right:8px;height:7px;cursor:ns-resize}
.win-rz.s{bottom:-3px;left:8px;right:8px;height:7px;cursor:ns-resize}
.win-rz.w{left:-3px;top:8px;bottom:8px;width:7px;cursor:ew-resize}
.win-rz.e{right:-3px;top:8px;bottom:8px;width:7px;cursor:ew-resize}
.win-rz.nw{left:-3px;top:-3px;width:12px;height:12px;cursor:nwse-resize}
.win-rz.ne{right:-3px;top:-3px;width:12px;height:12px;cursor:nesw-resize}
.win-rz.sw{left:-3px;bottom:-3px;width:12px;height:12px;cursor:nesw-resize}
.win-rz.se{right:-3px;bottom:-3px;width:12px;height:12px;cursor:nwse-resize}

/* snap */
#snapGhost{position:fixed;z-index:900;border:2px solid var(--accent);background:#7ac5ff1f;
  border-radius:var(--radius);pointer-events:none;transition:all .09s ease}
#snapPicker{position:fixed;z-index:950;top:6px;left:50%;transform:translateX(-50%);
  display:flex;gap:10px;padding:10px;background:#161b22f2;border:1px solid var(--line);
  border-radius:12px;box-shadow:0 14px 40px #000a}
.sp-layout{display:grid;gap:3px;width:88px;height:56px;padding:4px;border-radius:7px;
  border:1px solid var(--line);background:#0f141a;cursor:pointer}
.sp-layout:hover{border-color:var(--accent);background:#12202e}
.sp-cell{background:#2b3644;border-radius:3px}
.sp-layout:hover .sp-cell{background:#345070}
.sp-cell:hover{background:var(--accent)}

/* taskbar */
#taskbar{position:fixed;left:0;right:0;bottom:0;height:var(--taskbar);z-index:1000;
  display:flex;align-items:center;gap:8px;padding:0 10px;
  background:#0f141acc;border-top:1px solid var(--line)}
.tb-start{display:flex;align-items:center;gap:8px;height:32px;padding:0 12px;border:1px solid var(--line);
  border-radius:7px;background:#1b2129;color:var(--ink);cursor:pointer;font-size:12.5px}
.tb-start:hover{border-color:var(--accent);background:#1f2a35}
.tb-logo{width:11px;height:11px;border-radius:3px;background:linear-gradient(135deg,#7ac5ff,#3fb950)}
.tb-tasks{display:flex;gap:6px;flex:1;overflow:hidden}
.tb-task{max-width:190px;height:32px;padding:0 12px;border:1px solid var(--line);border-radius:7px;
  background:#161b22;color:#b9c2cd;cursor:pointer;font-size:12.5px;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.tb-task.active{background:var(--accent-dim);border-color:#3f6d99;color:#dbeeff}
.tb-right{display:flex;align-items:center;gap:12px;color:var(--dim);font-size:12px}
.tb-stat{font-variant-numeric:tabular-nums;min-width:46px;text-align:right}
.tb-clock{font-variant-numeric:tabular-nums;color:#c9d1d9}

/* start menu */
#startMenu{position:fixed;left:10px;bottom:calc(var(--taskbar) + 8px);z-index:1001;width:300px;
  background:#161b22f5;border:1px solid var(--line);border-radius:12px;padding:10px;
  box-shadow:0 18px 50px #000b}
.sm-head{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--dim);padding:2px 6px 8px}
.sm-apps{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.sm-app{display:flex;align-items:center;gap:9px;padding:9px 10px;border-radius:8px;background:#1b2129;
  border:1px solid transparent;cursor:pointer;font-size:12.5px;color:var(--ink)}
.sm-app:hover{border-color:var(--accent);background:#1f2a35}
.sm-ico{width:16px;text-align:center;opacity:.9}
.sm-foot{margin-top:9px;padding:7px 6px 2px;border-top:1px solid var(--line);
  color:var(--dim);font-size:11px;font-variant-numeric:tabular-nums}

/* panes */
.pane{padding:12px;height:100%;overflow:auto}
.mon-row{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 5px}
.mon-label{color:var(--dim);font-size:11.5px}
.mon-val{font-variant-numeric:tabular-nums;font-size:12.5px}
.bar{height:7px;border-radius:4px;background:#232b35;overflow:hidden;margin-bottom:13px}
.bar>i{display:block;height:100%;border-radius:4px;background:var(--good);transition:width .4s ease}
.bar>i.warn{background:var(--warn)}
.bar>i.bad{background:var(--bad)}
.mon-meta{color:var(--dim);font-size:11px;line-height:1.7;border-top:1px solid var(--line);
  padding-top:9px;margin-top:4px}

.fb-bar{display:flex;align-items:center;gap:6px;padding:8px 10px;border-bottom:1px solid var(--line);
  background:#151a21;position:sticky;top:0;z-index:2;flex-wrap:wrap}
.fb-up{border:1px solid var(--line);background:#1b2129;color:var(--ink);border-radius:6px;
  height:25px;padding:0 10px;cursor:pointer;font-size:12px}
.fb-up:hover{border-color:var(--accent)}
.fb-crumb{color:var(--accent);cursor:pointer;font-size:12px}
.fb-crumb:hover{text-decoration:underline}
.fb-sep{color:#4a5563}
.fb-list{width:100%;border-collapse:collapse;font-size:12.5px}
.fb-list tr{border-bottom:1px solid #1c222a}
.fb-list tr:hover{background:#171d25}
.fb-list td{padding:6px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fb-list td.sz{text-align:right;color:var(--dim);font-variant-numeric:tabular-nums;width:88px}
.fb-list td.dt{color:var(--dim);width:150px;font-variant-numeric:tabular-nums}
.fb-dir{color:var(--accent);cursor:pointer}
.fb-file{color:#c9d1d9}
.fb-ico{display:inline-block;width:16px;opacity:.85}
.fb-empty{padding:22px;color:var(--dim);text-align:center}

.term{height:100%;display:flex;flex-direction:column;background:#0b0f14}
.term-out{flex:1;overflow:auto;padding:10px 12px;font:12.5px/1.55 ui-monospace,Consolas,monospace;
  white-space:pre-wrap;word-break:break-word;user-select:text}
.term-in{display:flex;align-items:center;gap:7px;padding:8px 12px;border-top:1px solid var(--line);
  background:#0f141a}
.term-ps{color:var(--good);font:12.5px ui-monospace,monospace}
.term-in input{flex:1;background:transparent;border:0;outline:0;color:var(--ink);
  font:12.5px ui-monospace,Consolas,monospace}
.term-err{color:var(--bad)}
.term-dim{color:var(--dim)}
.term-ok{color:var(--good)}

/* ---- Task Manager ---- */
.tm{display:flex;height:100%;background:#0f141a}
.tm-side{width:186px;flex:0 0 186px;border-right:1px solid var(--line);overflow-y:auto;
  background:#11161d;padding:6px}
.tm-row{display:flex;gap:9px;align-items:center;padding:7px;border-radius:7px;cursor:pointer;
  border:1px solid transparent;margin-bottom:3px}
.tm-row:hover{background:#171d25}
.tm-row.sel{background:var(--accent-dim);border-color:#3f6d99}
.tm-spark{width:52px;height:32px;flex:0 0 52px;background:#0b0f14;border:1px solid #232b35;
  border-radius:4px}
.tm-rowtext{display:flex;flex-direction:column;gap:1px;min-width:0}
.tm-rowtext b{font-size:12px;font-weight:600;color:#dbe3ec}
.tm-now{font-size:11.5px;color:var(--dim);font-variant-numeric:tabular-nums}
.tm-main{flex:1;display:flex;flex-direction:column;padding:12px 14px;min-width:0}
.tm-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px}
.tm-title{font-size:15px;font-weight:600}
.tm-site{font-size:11.5px;color:var(--dim);font-variant-numeric:tabular-nums}
.tm-chart{flex:1;min-height:120px;background:#0b0f14;border:1px solid #232b35;border-radius:6px}
.tm-axis{display:flex;justify-content:space-between;font-size:10.5px;color:var(--dim);
  padding:4px 1px 9px;font-variant-numeric:tabular-nums}
.tm-facts{display:grid;grid-template-columns:1fr 1fr;gap:3px 18px;font-size:11.5px;
  border-top:1px solid var(--line);padding-top:9px}
.tm-facts div{display:flex;justify-content:space-between;gap:10px;min-width:0}
.tm-facts span{color:var(--dim)}
.tm-facts b{font-weight:500;color:#c9d1d9;font-variant-numeric:tabular-nums;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
