:root{--tb:#101010;--tbh:#2b2b2b;--acc:#0078d7;font:12px "Segoe UI","Segoe UI Variable",system-ui,sans-serif}
*{box-sizing:border-box;margin:0;user-select:none}html,body{height:100%;overflow:hidden;background:#000;color:#fff}
button{font:inherit;color:inherit;background:none;border:0;cursor:default}[hidden]{display:none!important}
svg{fill:none;stroke:currentColor;stroke-width:1;width:16px;height:16px}
#desktop{position:fixed;inset:0 0 40px 0;background:url(../assets/wallpapers/default.svg) center/cover}
#icons{position:absolute;inset:0;padding:4px;display:flex;flex-direction:column;flex-wrap:wrap;align-content:flex-start}
.di{width:76px;height:84px;padding:4px;text-align:center;text-shadow:0 1px 3px #000;border:1px solid transparent}
.di img{width:40px;height:40px;display:block;margin:2px auto 4px}.di:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.2)}
.di.sel{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.35)}
#taskbar{position:fixed;left:0;right:0;bottom:0;height:40px;background:var(--tb);display:flex;align-items:stretch;z-index:9000}
#startbtn{width:48px;display:grid;place-items:center}#startbtn svg{width:17px;height:17px;fill:#fff;stroke:none}#startbtn:hover,.tb:hover,#tasks .task:hover{background:var(--tbh)}
#startbtn:hover svg{fill:#76b9ed}
#search{width:268px;background:#f2f2f2;color:#000;display:flex;align-items:center;gap:8px;padding:0 10px}#search svg{stroke:#000}
#search input{flex:1;border:0;background:none;outline:0;font:14px "Segoe UI",sans-serif;user-select:text}#search input::placeholder{color:#444}
.tb{width:48px;display:grid;place-items:center}.tb:disabled{opacity:.9}
#tasks{display:flex;flex:1;min-width:0}.task{width:48px;position:relative;display:grid;place-items:center}.task img{width:24px;height:24px}
.task::after{content:"";position:absolute;left:50%;bottom:0;width:0;height:2px;background:#76b9ed;transform:translateX(-50%);transition:width .15s}
.task.run::after{width:16px}.task.act{background:#3b3b3b}.task.act::after{width:48px}.task.act:hover{background:#4a4a4a}
#tray{display:flex;align-items:center}.ti{margin:0 6px;stroke-width:1.2}.t{margin:0 6px;font-size:11px}
#clock{padding:0 8px;text-align:right;line-height:15px;height:100%;display:flex;flex-direction:column;justify-content:center}
#showdesk{width:6px;height:100%;border-left:1px solid #555;margin-left:2px}#showdesk:hover{background:var(--tbh)}
#windows{position:fixed;inset:0 0 40px 0;pointer-events:none}
.win{position:absolute;pointer-events:auto;background:#fff;color:#000;border:1px solid #888;box-shadow:0 8px 24px rgba(0,0,0,.35);display:flex;flex-direction:column}
.win.f{border-color:var(--acc);box-shadow:0 12px 36px rgba(0,0,0,.5)}.win.max{border:0}
.tbar{height:31px;display:flex;align-items:center;background:#fff;flex:none}.win:not(.f) .tbar{color:#777}
.tbar img{width:16px;height:16px;margin:0 8px}.ti2{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wc{width:46px;height:31px;display:grid;place-items:center}.wc svg{width:10px;height:10px;stroke:#000}@media(hover:hover){.wc:hover{background:#e5e5e5}.wc.x:hover{background:#e81123}.wc.x:hover svg{stroke:#fff}}
.wb{flex:1;min-height:0;position:relative;overflow:auto;user-select:text;outline:0}
.rz{position:absolute;z-index:2}.rz[data-d=n]{top:-4px;left:6px;right:6px;height:7px;cursor:n-resize}.rz[data-d=s]{bottom:-4px;left:6px;right:6px;height:7px;cursor:s-resize}
.rz[data-d=e]{right:-4px;top:6px;bottom:6px;width:7px;cursor:e-resize}.rz[data-d=w]{left:-4px;top:6px;bottom:6px;width:7px;cursor:w-resize}
.rz[data-d=ne]{top:-4px;right:-4px;width:10px;height:10px;cursor:ne-resize}.rz[data-d=nw]{top:-4px;left:-4px;width:10px;height:10px;cursor:nw-resize}
.rz[data-d=se]{bottom:-4px;right:-4px;width:10px;height:10px;cursor:se-resize}.rz[data-d=sw]{bottom:-4px;left:-4px;width:10px;height:10px;cursor:sw-resize}
#snap{position:fixed;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.5);z-index:8000;pointer-events:none}
#start{position:fixed;left:0;bottom:40px;width:660px;height:600px;max-height:calc(100% - 40px);background:#1f1f1f;display:flex;z-index:9500;box-shadow:0 0 12px rgba(0,0,0,.5)}
#start.open{animation:sin .22s cubic-bezier(.1,.9,.2,1)}#start.closing{animation:sout .12s ease-in forwards}
@keyframes sin{from{transform:translateY(60px);opacity:0}}@keyframes sout{to{transform:translateY(40px);opacity:0}}
.rail{width:48px;display:flex;flex-direction:column}.rail button{height:48px;display:grid;place-items:center}.rail button:hover{background:#3b3b3b}.rail .sp{flex:1}
.apps{width:290px;overflow-y:auto;padding-top:6px}.apps::-webkit-scrollbar{width:6px}.apps::-webkit-scrollbar-thumb{background:#555}
.ai{display:flex;align-items:center;gap:12px;height:40px;padding:0 12px;width:100%;text-align:left;font-size:13px}.ai:hover{background:#3b3b3b}.ai img{width:24px;height:24px}
.ah{padding:6px 14px;font-size:13px;font-weight:600}
.tiles{flex:1;padding:20px 12px}.tiles h3{font-size:14px;font-weight:600;margin:0 0 14px 4px}#tilegrid{display:grid;grid-template-columns:repeat(3,100px);gap:4px}
.tile{height:100px;background:var(--acc);padding:8px;position:relative;text-align:left}.tile:hover{outline:2px solid rgba(255,255,255,.5);outline-offset:-2px}
.tile img{width:32px;height:32px;position:absolute;left:34px;top:26px}.tile span{position:absolute;left:8px;bottom:6px}
#ctx{position:fixed;background:#2b2b2b;border:1px solid #444;padding:2px 0;min-width:190px;z-index:9800;box-shadow:2px 2px 6px rgba(0,0,0,.4);animation:cin .12s ease-out;transform-origin:top left}
@keyframes cin{from{opacity:0;transform:scaleY(.92)}}.ci{padding:6px 28px}.ci:hover{background:#414141}.ci.dis{color:#777}.ci.dis:hover{background:none}.cs{height:1px;background:#444;margin:3px 0}
.calc{background:#e6e6e6;height:100%;display:flex;flex-direction:column;color:#000}.calc .d{height:96px;text-align:right;padding:10px 12px;font-size:44px;font-weight:300;overflow:hidden}.calc .d small{display:block;font-size:12px;height:16px;color:#666}
.calc .g{flex:1;display:grid;grid-template-columns:repeat(4,1fr);gap:2px;padding:2px}.calc button{background:#f9f9f9;font-size:16px}.calc button.n{background:#fff;font-weight:600}.calc button:hover{background:#d0d0d0}.calc button.eq{background:var(--acc);color:#fff}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.tbar,.rz{touch-action:none}
.wc{position:relative;z-index:3;touch-action:manipulation}
button,.task,.di{-webkit-tap-highlight-color:transparent}