/* ═══════════════════════════════════════════════
   macOS Web — 基础样式
   变量体系 / 桌面外壳 / 窗口系统 / Dock / 系统面板
   ═══════════════════════════════════════════════ */

/* ───────── 主题变量 ───────── */
:root{
  --accent:#ff9500; --accent-rgb:255,149,0;
  --accent-text:#fff;

  --font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",
         "PingFang SC","Hiragino Sans GB","Microsoft YaHei",system-ui,sans-serif;
  --font-mono:"SF Mono","JetBrains Mono",Menlo,Consolas,"Courier New",monospace;

  --radius-win:11px;
  --radius-panel:14px;
  --ease:cubic-bezier(.32,.72,0,1);
  --ease-out:cubic-bezier(.16,1,.3,1);

  --menubar-h:25px;
  --shadow-win:0 22px 70px rgba(0,0,0,.28),0 2px 8px rgba(0,0,0,.14),0 0 0 .5px rgba(0,0,0,.14);
  --shadow-panel:0 12px 40px rgba(0,0,0,.18),0 0 0 .5px rgba(0,0,0,.08);
}

html[data-theme="light"]{
  --bg:#f5f5f7;
  --surface:#ffffff;
  --surface-solid:#fff;
  --surface-2:#f7f7f9;
  --surface-3:#ececf0;
  --sidebar:rgba(246,246,248,.78);
  --hairline:rgba(0,0,0,.10);
  --hairline-soft:rgba(0,0,0,.06);
  --text:#1d1d1f;
  --text-2:#6e6e73;
  --text-3:#a1a1a6;
  --glass:rgba(255,255,255,.62);
  --glass-strong:rgba(250,250,252,.86);
  --glass-menu:rgba(252,252,254,.76);
  --hover:rgba(0,0,0,.055);
  --active:rgba(0,0,0,.10);
  --menubar-bg:rgba(255,255,255,.45);
  --menubar-text:#1d1d1f;
  --dock-bg:rgba(255,255,255,.42);
  --dock-border:rgba(255,255,255,.55);
  --input-bg:rgba(0,0,0,.045);
  --selection:rgba(var(--accent-rgb),.22);
}
html[data-theme="dark"]{
  --bg:#1c1c1e;
  --surface:#252528;
  --surface-solid:#232326;
  --surface-2:#2c2c2f;
  --surface-3:#3a3a3e;
  --sidebar:rgba(38,38,41,.8);
  --hairline:rgba(255,255,255,.12);
  --hairline-soft:rgba(255,255,255,.07);
  --text:#f2f2f5;
  --text-2:#a1a1a6;
  --text-3:#6e6e73;
  --glass:rgba(40,40,44,.62);
  --glass-strong:rgba(34,34,38,.85);
  --glass-menu:rgba(44,44,48,.78);
  --hover:rgba(255,255,255,.08);
  --active:rgba(255,255,255,.14);
  --menubar-bg:rgba(22,22,25,.68);
  --menubar-text:#f2f2f5;
  --dock-bg:rgba(48,48,52,.45);
  --dock-border:rgba(255,255,255,.14);
  --input-bg:rgba(255,255,255,.07);
  --shadow-win:0 22px 70px rgba(0,0,0,.6),0 2px 8px rgba(0,0,0,.4),0 0 0 .5px rgba(255,255,255,.12);
  --shadow-panel:0 12px 40px rgba(0,0,0,.5),0 0 0 .5px rgba(255,255,255,.1);
}

/* 强调色 */
html[data-accent="orange"]{--accent:#ff9500;--accent-rgb:255,149,0;}
html[data-accent="red"]   {--accent:#ff3b30;--accent-rgb:255,59,48;}
html[data-accent="pink"]  {--accent:#ff2d55;--accent-rgb:255,45,85;}
html[data-accent="green"] {--accent:#28cd41;--accent-rgb:40,205,65;}
html[data-accent="yellow"]{--accent:#ffcc00;--accent-rgb:255,204,0;--accent-text:#3a2f00;}
html[data-accent="graphite"]{--accent:#8e8e93;--accent-rgb:142,142,147;}
html[data-accent="blue"]  {--accent:#007aff;--accent-rgb:0,122,255;}
html[data-accent="purple"]{--accent:#af52de;--accent-rgb:175,82,222;}

/* ───────── 重置 ───────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{height:100%;overflow:hidden;}
body{
  font-family:var(--font);
  font-size:13px;
  line-height:1.45;
  color:var(--text);
  background:#0a0a0c;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  user-select:none;
  cursor:default;
}
button,input,textarea,select{font:inherit;color:inherit;border:none;background:none;outline:none;}
button{cursor:default;}
input,textarea{user-select:text;cursor:text;}
ul,ol{list-style:none;}
.hidden{display:none !important;}
::-webkit-scrollbar{width:9px;height:9px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:rgba(130,130,140,.42);border-radius:5px;border:2px solid transparent;background-clip:padding-box;}
::-webkit-scrollbar-thumb:hover{background:rgba(130,130,140,.68);background-clip:padding-box;}
::selection{background:var(--selection);}

/* 通用图标尺寸 */
.ic{display:block;flex:none;}

/* ═══════════ 壁纸 ═══════════ */
.wallpaper{position:absolute;inset:0;z-index:0;background-size:cover;background-position:center;
  transition:opacity .55s ease, background .55s ease;}
.wallpaper::after{content:"";position:absolute;inset:0;pointer-events:none;}

/* ═══════════ 开机画面 ═══════════ */
.boot-screen{
  position:fixed;inset:0;z-index:9000;background:#000;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:44px;
  transition:opacity .7s ease;
}
.boot-screen.done{opacity:0;pointer-events:none;}
.boot-logo{color:#f5f5f7;animation:bootIn 1s var(--ease-out) both;}
@keyframes bootIn{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:none}}
.boot-bar{width:172px;height:5px;border-radius:3px;background:rgba(255,255,255,.22);overflow:hidden;}
.boot-bar i{display:block;height:100%;width:0;border-radius:3px;background:#f5f5f7;
  animation:bootFill 2.35s cubic-bezier(.5,.05,.4,1) .35s forwards;}
@keyframes bootFill{to{width:100%}}

/* ═══════════ 锁屏 ═══════════ */
.lock-screen{position:fixed;inset:0;z-index:8000;display:flex;align-items:center;justify-content:center;
  animation:fadeIn .4s ease both;}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.lock-bg{position:absolute;inset:-46px;background-size:cover;background-position:center;
  transform:scale(1.06);filter:blur(34px) saturate(160%);}
.lock-screen::before{content:"";position:absolute;inset:0;background:rgba(14,14,18,.46);}
.lock-screen.unlocking{animation:unlockOut .55s var(--ease) forwards;}
@keyframes unlockOut{to{opacity:0;transform:scale(1.06);filter:blur(14px)}}
.lock-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:6px;
  color:#fff;text-shadow:0 2px 18px rgba(0,0,0,.6),0 1px 3px rgba(0,0,0,.42);margin-top:-4vh;}
.lock-time{font-size:76px;font-weight:250;letter-spacing:-2px;line-height:1.05;}
.lock-date{font-size:16px;font-weight:500;opacity:.92;margin-bottom:56px;}
.lock-user{display:flex;flex-direction:column;align-items:center;gap:11px;}
.lock-avatar{width:76px;height:76px;border-radius:50%;background:linear-gradient(145deg,#ffb340,#ff7a00);
  box-shadow:0 6px 24px rgba(0,0,0,.42),inset 0 0 0 1px rgba(255,255,255,.3);
  display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:600;color:#fff;}
.lock-name{font-size:16px;font-weight:600;}
.lock-input{position:relative;display:flex;align-items:center;}
.lock-input input{width:210px;height:32px;border-radius:16px;padding:0 40px 0 15px;font-size:13px;
  background:rgba(255,255,255,.26);border:1px solid rgba(255,255,255,.42);color:#fff;
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:.2s;
  box-shadow:0 2px 12px rgba(0,0,0,.2);}
.lock-input input::placeholder{color:rgba(255,255,255,.8);}
.lock-input input:focus{background:rgba(255,255,255,.38);border-color:rgba(255,255,255,.68);}
.lock-input button{position:absolute;right:4px;width:24px;height:24px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;color:#fff;background:rgba(255,255,255,.28);transition:.15s;}
.lock-input button:hover{background:rgba(255,255,255,.46);}
.lock-hint{font-size:11px;opacity:.72;margin-top:2px;}
.lock-actions{position:absolute;bottom:-166px;display:flex;gap:36px;}
.lock-actions button{font-size:12px;color:rgba(255,255,255,.86);display:flex;flex-direction:column;
  align-items:center;gap:9px;transition:.18s;}
.lock-actions .la-icon{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;background:rgba(255,255,255,.16);backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,.22);color:#fff;}
.lock-actions button:hover{color:#fff;transform:translateY(-2px);}
.lock-actions button:hover .la-icon{background:rgba(255,255,255,.28);}

/* ═══════════ 电源遮罩 ═══════════ */
.power-overlay{position:fixed;inset:0;z-index:9500;background:rgba(0,0,0,.92);display:flex;
  align-items:center;justify-content:center;animation:fadeIn .3s ease both;}
.power-inner{display:flex;flex-direction:column;align-items:center;gap:22px;color:#e8e8ea;}
.power-spinner{width:26px;height:26px;border-radius:50%;border:2.5px solid rgba(255,255,255,.2);
  border-top-color:#fff;animation:spin .9s linear infinite;}
@keyframes spin{to{transform:rotate(360deg)}}
.power-text{font-size:13px;letter-spacing:.4px;}

/* ═══════════ 桌面 ═══════════ */
.desktop{position:fixed;inset:0;overflow:hidden;}
.desktop-icons{position:absolute;top:calc(var(--menubar-h) + 12px);right:14px;bottom:100px;
  display:flex;flex-direction:column;flex-wrap:wrap-reverse;align-content:flex-start;gap:2px;
  flex-direction:column;z-index:1;}
.di{width:96px;padding:8px 4px 6px;border-radius:7px;display:flex;flex-direction:column;
  align-items:center;gap:5px;cursor:default;text-align:center;transition:background .14s;}
.di:hover{background:rgba(255,255,255,.14);}
.di.selected{background:rgba(var(--accent-rgb),.55);}
.di-icon{width:58px;height:58px;display:flex;align-items:center;justify-content:center;filter:drop-shadow(0 2px 5px rgba(0,0,0,.35));}
.di-label{font-size:12px;color:#fff;text-shadow:0 1px 4px rgba(0,0,0,.75);line-height:1.25;
  max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:1px 4px;border-radius:4px;}
.di.selected .di-label{background:var(--accent);}

/* ═══════════ 菜单栏 ═══════════ */
.menubar{position:fixed;top:0;left:0;right:0;height:var(--menubar-h);z-index:6000;
  display:flex;align-items:center;justify-content:space-between;padding:0 10px;
  background:var(--menubar-bg);backdrop-filter:blur(22px) saturate(180%);-webkit-backdrop-filter:blur(22px) saturate(180%);
  color:var(--menubar-text);font-size:12.5px;
  box-shadow:inset 0 -.5px 0 rgba(0,0,0,.07);}
.menubar-left,.menubar-right{display:flex;align-items:center;height:100%;}
.mb-item{height:100%;padding:0 9px;display:flex;align-items:center;gap:5px;border-radius:5px;
  color:inherit;font-size:12.5px;transition:background .1s;white-space:nowrap;}
.mb-item:hover{background:var(--hover);}
.mb-item.open{background:var(--accent);color:var(--accent-text);}
.mb-apple{padding:0 10px;}
.mb-apple svg{margin-top:-2px;}
.mb-appname{font-weight:600;padding:0 9px;height:100%;display:flex;align-items:center;border-radius:5px;}
.mb-appname:hover{background:var(--hover);}
.mb-menus{display:flex;align-items:center;height:100%;}
.mb-right-item{height:100%;padding:0 8px;display:flex;align-items:center;gap:4px;border-radius:5px;transition:background .1s;}
.mb-right-item:hover{background:var(--hover);}
.mb-right-item.open{background:var(--hover);}
.mb-clock{font-variant-numeric:tabular-nums;letter-spacing:.1px;}
.mb-battery{display:flex;align-items:center;gap:4px;}
.mb-battery-txt{font-variant-numeric:tabular-nums;font-size:11.5px;}
.mb-battery-body{width:23px;height:12px;border-radius:3.5px;border:1.3px solid currentColor;
  padding:1.3px;opacity:.92;position:relative;}
.mb-battery-body::after{content:"";position:absolute;right:-3.4px;top:50%;transform:translateY(-50%);
  width:2px;height:4px;border-radius:0 2px 2px 0;background:currentColor;}
.mb-battery-fill{height:100%;border-radius:1.5px;background:currentColor;}
.mb-battery.low .mb-battery-fill{background:#ff3b30;}
.mb-battery.charging .mb-battery-fill{background:#28cd41;}

/* 下拉菜单 */
.dropdown{position:fixed;z-index:7000;min-width:190px;padding:5px;border-radius:9px;
  background:var(--glass-menu);backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);
  box-shadow:var(--shadow-panel);border:.5px solid var(--hairline);
  animation:ddIn .13s var(--ease-out) both;transform-origin:top left;}
@keyframes ddIn{from{opacity:0;transform:scale(.96) translateY(-4px)}to{opacity:1;transform:none}}
.dd-item{display:flex;align-items:center;justify-content:space-between;gap:24px;height:24px;
  padding:0 9px;border-radius:5px;font-size:13px;white-space:nowrap;transition:background .06s;}
.dd-item:hover:not(.disabled){background:var(--accent);color:var(--accent-text);}
.dd-item.disabled{color:var(--text-3);}
.dd-item .dd-key{font-size:12px;opacity:.6;}
.dd-sep{height:1px;background:var(--hairline);margin:5px 9px;}
.dd-title{padding:5px 9px 3px;font-size:11px;color:var(--text-2);font-weight:600;}
.dd-check{width:14px;display:flex;justify-content:center;}

/* ═══════════ 窗口 ═══════════ */
.windows-layer{position:fixed;inset:0;z-index:100;pointer-events:none;}
.window{position:absolute;pointer-events:auto;display:flex;flex-direction:column;
  background:var(--glass-strong);backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);
  border-radius:var(--radius-win);box-shadow:var(--shadow-win);overflow:hidden;
  border:.5px solid var(--hairline);min-width:240px;min-height:160px;
  transition:opacity .18s, transform .18s;}
.window.inactive{box-shadow:0 14px 40px rgba(0,0,0,.16),0 0 0 .5px rgba(0,0,0,.1);}
.window.inactive .titlebar{color:var(--text-3);}
.window.opening{animation:winOpen .26s var(--ease-out) both;}
@keyframes winOpen{from{opacity:0;transform:scale(.88) translateY(14px)}to{opacity:1;transform:none}}

/* 深色内容应用的标题栏跟随变深 */
.window[data-app="terminal"],.window[data-app="calculator"]{background:rgba(30,30,34,.92);}
.window[data-app="terminal"] .titlebar,.window[data-app="calculator"] .titlebar{color:#e8e8ec;}
.window[data-app="terminal"] .titlebar-title,.window[data-app="calculator"] .titlebar-title{color:#e8e8ec;}
.window[data-app="terminal"] .tb-btn,.window[data-app="calculator"] .tb-btn{color:#a8a8b0;}
.window.closing{animation:winClose .16s ease-in both;pointer-events:none;}
@keyframes winClose{to{opacity:0;transform:scale(.94)}}
.window.minimizing{animation:winMin .3s var(--ease) both;pointer-events:none;}
@keyframes winMin{to{opacity:0;transform:scale(.35) translateY(60vh)}}
.window.fullscreen{border-radius:0 !important;border:none;}

.titlebar{height:38px;flex:none;display:flex;align-items:center;padding:0 13px;gap:10px;
  position:relative;cursor:default;background:transparent;color:var(--text);}
.titlebar.draggable{cursor:default;}
.traffic{display:flex;gap:8px;align-items:center;flex:none;}
.tl{width:12px;height:12px;border-radius:50%;position:relative;display:flex;align-items:center;
  justify-content:center;color:rgba(0,0,0,.55);transition:filter .12s;}
.tl svg{opacity:0;transition:opacity .1s;width:7px;height:7px;}
.tl.close{background:#ff5f57;border:.5px solid rgba(0,0,0,.12);}
.tl.min{background:#febc2e;border:.5px solid rgba(0,0,0,.12);}
.tl.max{background:#28c840;border:.5px solid rgba(0,0,0,.12);}
.window.inactive .tl{background:var(--surface-3);border-color:var(--hairline);}
.window.inactive .tl svg{opacity:0 !important;}
.traffic:hover .tl svg{opacity:1;}
.titlebar-title{position:absolute;left:50%;transform:translateX(-50%);font-size:13px;font-weight:600;
  pointer-events:none;color:inherit;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.titlebar-extra{margin-left:auto;display:flex;align-items:center;gap:2px;z-index:2;}
.tb-btn{width:26px;height:23px;border-radius:5px;display:flex;align-items:center;justify-content:center;
  color:var(--text-2);transition:background .12s;}
.tb-btn:hover{background:var(--hover);color:var(--text);}
.tb-btn.active{background:var(--active);color:var(--text);}
.window-body{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden;position:relative;}
.resize-handle{position:absolute;z-index:5;}
.rh-n{top:0;left:10px;right:10px;height:5px;cursor:ns-resize;}
.rh-s{bottom:0;left:10px;right:10px;height:5px;cursor:ns-resize;}
.rh-w{left:0;top:10px;bottom:10px;width:5px;cursor:ew-resize;}
.rh-e{right:0;top:10px;bottom:10px;width:5px;cursor:ew-resize;}
.rh-nw{top:0;left:0;width:12px;height:12px;cursor:nwse-resize;}
.rh-ne{top:0;right:0;width:12px;height:12px;cursor:nesw-resize;}
.rh-sw{bottom:0;left:0;width:12px;height:12px;cursor:nesw-resize;}
.rh-se{bottom:0;right:0;width:12px;height:12px;cursor:nwse-resize;}
.window.resizing{transition:none !important;}

/* ═══════════ Dock ═══════════ */
.dock-wrap{position:fixed;left:0;right:0;bottom:0;z-index:5000;display:flex;justify-content:center;
  padding-bottom:6px;transition:transform .32s var(--ease), opacity .3s;pointer-events:none;}
.dock-wrap.autohide{transform:translateY(calc(100% - 5px));opacity:.0;}
.dock-wrap.autohide:hover{transform:none;opacity:1;}
.dock-wrap.autohide::before{content:"";position:absolute;left:0;right:0;bottom:0;height:6px;pointer-events:auto;}
.dock{display:flex;align-items:flex-end;gap:5px;padding:7px 8px;border-radius:20px;pointer-events:auto;
  background:var(--dock-bg);backdrop-filter:blur(28px) saturate(190%);-webkit-backdrop-filter:blur(28px) saturate(190%);
  box-shadow:0 10px 34px rgba(0,0,0,.26),inset 0 0 0 .5px var(--dock-border);
  transition:padding .22s var(--ease);}
.dock-item{position:relative;display:flex;flex-direction:column;align-items:center;
  transition:width .2s var(--ease), height .2s var(--ease), margin .2s var(--ease);}
.dock-icon{display:flex;align-items:center;justify-content:center;transition:transform .18s var(--ease);}
.dock-icon svg{width:100%;height:100%;filter:drop-shadow(0 3px 7px rgba(0,0,0,.24));}
.dock-item:hover .dock-icon{transform:translateY(-6px);}
.dock-item:active .dock-icon{transform:translateY(-2px) scale(.96);}
.dock-label{position:absolute;bottom:calc(100% + 12px);padding:4px 10px;border-radius:7px;font-size:12.5px;
  white-space:nowrap;background:var(--glass-menu);backdrop-filter:blur(24px);color:var(--text);
  border:.5px solid var(--hairline);box-shadow:0 6px 20px rgba(0,0,0,.2);
  opacity:0;pointer-events:none;transform:translateY(4px);transition:.15s;}
.dock-item:hover .dock-label{opacity:1;transform:none;}
.dock-dot{width:4px;height:4px;border-radius:2px;background:currentColor;opacity:0;margin-top:3px;
  transition:opacity .2s;color:var(--menubar-text);}
.dock-item.running .dock-dot{opacity:.75;}
.dock-sep{width:1px;align-self:stretch;margin:6px 3px;background:var(--hairline);}
.dock-trash{display:flex;flex-direction:column;align-items:center;transition:width .2s var(--ease),height .2s var(--ease);}

/* ═══════════ 启动台 ═══════════ */
.launchpad{position:fixed;inset:0;z-index:5500;display:flex;flex-direction:column;
  background:rgba(30,30,34,.36);backdrop-filter:blur(46px) saturate(180%);-webkit-backdrop-filter:blur(46px) saturate(180%);
  animation:lpIn .3s var(--ease-out) both;padding-top:calc(var(--menubar-h) + 26px);}
@keyframes lpIn{from{opacity:0;transform:scale(1.08)}to{opacity:1;transform:none}}
.launchpad.closing{animation:lpOut .24s var(--ease) both;}
@keyframes lpOut{to{opacity:0;transform:scale(1.09)}}
.lp-search{display:flex;justify-content:center;margin-bottom:34px;}
.lp-search input{width:230px;height:28px;border-radius:14px;padding:0 14px;font-size:13px;text-align:center;
  background:rgba(255,255,255,.16);border:.5px solid rgba(255,255,255,.24);color:#fff;
  backdrop-filter:blur(16px);transition:.2s;}
.lp-search input::placeholder{color:rgba(255,255,255,.6);}
.lp-search input:focus{width:270px;background:rgba(255,255,255,.24);}
.lp-grid{flex:1;display:grid;padding:0 8vw;align-content:start;
  grid-template-columns:repeat(7,1fr);gap:34px 10px;overflow-y:auto;}
.lp-app{display:flex;flex-direction:column;align-items:center;gap:9px;border-radius:12px;padding:8px 4px;
  transition:background .14s;}
.lp-app:hover{background:rgba(255,255,255,.1);}
.lp-app-icon{width:78px;height:78px;transition:transform .2s var(--ease-out);}
.lp-app:hover .lp-app-icon{transform:scale(1.07);}
.lp-app-icon svg{width:100%;height:100%;filter:drop-shadow(0 4px 12px rgba(0,0,0,.35));}
.lp-app-name{font-size:12px;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.7);text-align:center;
  max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.lp-dots{display:flex;justify-content:center;gap:9px;padding:20px 0 34px;}
.lp-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.35);transition:.2s;}
.lp-dot.on{background:#fff;}

/* ═══════════ 聚焦搜索 ═══════════ */
.spotlight{position:fixed;inset:0;z-index:6500;display:flex;justify-content:center;
  padding-top:18vh;background:rgba(0,0,0,.16);animation:fadeIn .16s ease both;}
.sp-box{width:min(680px,74vw);height:fit-content;border-radius:15px;overflow:hidden;
  background:var(--glass-strong);backdrop-filter:blur(34px) saturate(180%);-webkit-backdrop-filter:blur(34px) saturate(180%);
  box-shadow:0 26px 80px rgba(0,0,0,.4),0 0 0 .5px var(--hairline);
  animation:spIn .2s var(--ease-out) both;display:flex;flex-direction:column;}
@keyframes spIn{from{opacity:0;transform:scale(.97) translateY(-8px)}to{opacity:1;transform:none}}
.sp-input-row{display:flex;align-items:center;gap:11px;padding:0 17px;height:58px;flex:none;}
.sp-icon{color:var(--text-2);}
.sp-input-row input{flex:1;font-size:22px;font-weight:400;background:none;letter-spacing:-.3px;}
.sp-input-row input::placeholder{color:var(--text-3);}
.sp-results{max-height:400px;overflow-y:auto;border-top:.5px solid var(--hairline);padding:6px;}
.sp-results:empty{display:none;}
.sp-row{display:flex;align-items:center;gap:11px;padding:7px 11px;border-radius:7px;font-size:13px;}
.sp-row.sel{background:var(--accent);color:var(--accent-text);}
.sp-row.sel .sp-sub{color:rgba(255,255,255,.85);}
.sp-row-ic{width:26px;height:26px;flex:none;display:flex;align-items:center;justify-content:center;}
.sp-row-ic svg{width:100%;height:100%;}
.sp-main{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.sp-sub{font-size:11.5px;color:var(--text-2);}
.sp-group{padding:8px 12px 3px;font-size:11px;font-weight:600;color:var(--text-2);}

/* ═══════════ 控制中心 ═══════════ */
.control-center{position:fixed;top:calc(var(--menubar-h) + 6px);right:8px;z-index:6600;width:306px;
  padding:12px;border-radius:var(--radius-panel);display:grid;grid-template-columns:1fr 1fr;gap:11px;
  background:var(--glass-menu);backdrop-filter:blur(34px) saturate(180%);-webkit-backdrop-filter:blur(34px) saturate(180%);
  box-shadow:var(--shadow-panel);border:.5px solid var(--hairline);
  animation:ccIn .2s var(--ease-out) both;transform-origin:top right;}
@keyframes ccIn{from{opacity:0;transform:scale(.94) translateY(-8px)}to{opacity:1;transform:none}}
.cc-card{background:var(--surface);border:.5px solid var(--hairline-soft);border-radius:12px;padding:11px;
  display:flex;flex-direction:column;gap:9px;}
.cc-card.wide{grid-column:span 2;}
.cc-card-title{font-size:11.5px;font-weight:600;color:var(--text-2);}
.cc-toggle-card{background:var(--surface);border:.5px solid var(--hairline-soft);border-radius:12px;padding:11px;
  display:flex;flex-direction:column;gap:10px;}
.cc-row{display:flex;align-items:center;gap:9px;}
.cc-row-txt{flex:1;min-width:0;}
.cc-row-title{font-size:12.5px;font-weight:600;white-space:nowrap;}
.cc-row-sub{font-size:10.5px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cc-sw{width:34px;height:20px;border-radius:10px;background:var(--surface-3);position:relative;flex:none;transition:background .2s;}
.cc-sw::after{content:"";position:absolute;top:1.5px;left:1.5px;width:17px;height:17px;border-radius:50%;
  background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.28);transition:transform .2s var(--ease);}
.cc-sw.on{background:var(--accent);}
.cc-sw.on::after{transform:translateX(14px);}
.cc-icon-btn{width:29px;height:29px;border-radius:50%;background:var(--surface-3);display:flex;
  align-items:center;justify-content:center;color:var(--text-2);transition:.15s;}
.cc-icon-btn.on{background:var(--accent);color:var(--accent-text);}
.cc-slider{position:relative;height:26px;border-radius:13px;background:var(--surface-3);overflow:hidden;}
.cc-slider-fill{position:absolute;top:0;bottom:0;left:0;background:var(--surface);border-radius:13px 0 0 13px;}
.cc-slider-knob{position:absolute;top:2px;width:22px;height:22px;border-radius:50%;background:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,.32);pointer-events:none;}
.cc-slider-icon{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--text-2);z-index:2;pointer-events:none;mix-blend-mode:luminosity;}
.cc-slider input{position:absolute;inset:0;width:100%;height:100%;margin:0;-webkit-appearance:none;appearance:none;
  background:none;z-index:3;cursor:default;opacity:0;}
.cc-slider input::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;}
.cc-wide-btn{height:38px;border-radius:11px;background:var(--surface);border:.5px solid var(--hairline-soft);
  display:flex;align-items:center;padding:0 12px;gap:9px;font-size:12.5px;transition:background .15s;}
.cc-wide-btn:hover{background:var(--surface-2);}

/* ═══════════ 通知中心 ═══════════ */
.notification-center{position:fixed;top:var(--menubar-h);right:0;bottom:0;width:346px;z-index:6700;
  padding:10px 12px 12px;display:flex;flex-direction:column;gap:11px;overflow-y:auto;
  background:rgba(20,20,24,.28);backdrop-filter:blur(44px) saturate(180%);-webkit-backdrop-filter:blur(44px) saturate(180%);
  animation:ncIn .3s var(--ease) both;}
@keyframes ncIn{from{transform:translateX(100%)}to{transform:none}}
.notification-center.closing{animation:ncOut .26s var(--ease) both;}
@keyframes ncOut{to{transform:translateX(100%)}}
.nc-widget{background:var(--glass-strong);border:.5px solid var(--hairline);border-radius:15px;padding:13px;
  box-shadow:0 6px 22px rgba(0,0,0,.16);}
.nc-notif{background:var(--glass-strong);border:.5px solid var(--hairline);border-radius:15px;padding:11px 13px;
  display:flex;gap:10px;box-shadow:0 6px 22px rgba(0,0,0,.16);animation:ncItem .3s var(--ease-out) both;}
@keyframes ncItem{from{opacity:0;transform:translateX(34px)}to{opacity:1;transform:none}}
.nc-notif-icon{width:34px;height:34px;border-radius:8px;flex:none;display:flex;align-items:center;justify-content:center;}
.nc-notif-icon svg{width:100%;height:100%;}
.nc-notif-body{flex:1;min-width:0;}
.nc-notif-head{display:flex;justify-content:space-between;gap:8px;align-items:baseline;}
.nc-notif-app{font-size:12px;font-weight:600;}
.nc-notif-time{font-size:10.5px;color:var(--text-2);flex:none;}
.nc-notif-title{font-size:12.5px;font-weight:500;margin-top:1px;}
.nc-notif-text{font-size:12px;color:var(--text-2);line-height:1.4;}
.nc-empty{display:flex;flex-direction:column;align-items:center;gap:9px;padding:44px 0;color:var(--text-2);font-size:12.5px;}

/* ═══════════ 右键菜单 ═══════════ */
.context-menu{position:fixed;z-index:7500;min-width:186px;padding:5px;border-radius:9px;
  background:var(--glass-menu);backdrop-filter:blur(30px) saturate(180%);-webkit-backdrop-filter:blur(30px) saturate(180%);
  box-shadow:var(--shadow-panel);border:.5px solid var(--hairline);animation:ddIn .12s var(--ease-out) both;}
.cm-item{display:flex;align-items:center;gap:9px;height:24px;padding:0 9px;border-radius:5px;font-size:13px;transition:background .06s;}
.cm-item:hover:not(.disabled){background:var(--accent);color:var(--accent-text);}
.cm-item.disabled{color:var(--text-3);}
.cm-sep{height:1px;background:var(--hairline);margin:5px 9px;}

/* ═══════════ 通知气泡 ═══════════ */
.toasts{position:fixed;top:calc(var(--menubar-h) + 10px);right:10px;z-index:7700;display:flex;
  flex-direction:column;gap:9px;pointer-events:none;width:330px;}
.toast{pointer-events:auto;display:flex;gap:10px;padding:11px 13px;border-radius:15px;
  background:var(--glass-strong);backdrop-filter:blur(34px) saturate(180%);-webkit-backdrop-filter:blur(34px) saturate(180%);
  box-shadow:0 12px 36px rgba(0,0,0,.24),0 0 0 .5px var(--hairline);
  animation:toastIn .42s var(--ease-out) both;}
.toast.out{animation:toastOut .3s var(--ease) both;}
@keyframes toastIn{from{opacity:0;transform:translateX(110%) scale(.92)}to{opacity:1;transform:none}}
@keyframes toastOut{to{opacity:0;transform:translateX(110%) scale(.92)}}
.toast-icon{width:34px;height:34px;flex:none;border-radius:8px;display:flex;align-items:center;justify-content:center;}
.toast-icon svg{width:100%;height:100%;}
.toast-body{flex:1;min-width:0;}
.toast-head{display:flex;justify-content:space-between;gap:8px;align-items:baseline;}
.toast-app{font-size:12px;font-weight:600;}
.toast-time{font-size:10.5px;color:var(--text-2);}
.toast-title{font-size:12.5px;font-weight:500;}
.toast-text{font-size:12px;color:var(--text-2);line-height:1.38;}

/* ═══════════ 调度中心 ═══════════ */
.mission-control{position:fixed;inset:0;z-index:5200;background:rgba(24,24,28,.34);
  backdrop-filter:blur(36px) saturate(180%);-webkit-backdrop-filter:blur(36px) saturate(180%);
  display:flex;flex-direction:column;padding:calc(var(--menubar-h) + 26px) 4vw 120px;
  animation:fadeIn .26s ease both;}
.mc-grid{flex:1;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  grid-auto-rows:minmax(150px,270px);gap:26px;overflow-y:auto;align-content:start;}
.mc-card{border-radius:11px;overflow:hidden;background:var(--surface);box-shadow:0 16px 44px rgba(0,0,0,.4);
  border:.5px solid rgba(255,255,255,.2);transition:transform .2s var(--ease-out);position:relative;
  display:flex;flex-direction:column;}
.mc-card:hover{transform:scale(1.035);}
.mc-card-head{height:30px;flex:none;display:flex;align-items:center;gap:7px;padding:0 10px;
  background:var(--surface-2);font-size:12px;font-weight:600;}
.mc-card-body{flex:1;display:flex;align-items:center;justify-content:center;background:var(--surface-2);}
.mc-card-body svg{width:60px;height:60px;opacity:.85;}
.mc-hint{text-align:center;color:#fff;font-size:12.5px;opacity:.7;padding-top:22px;}

/* ═══════════ 对话框 ═══════════ */
.modal-layer{position:fixed;inset:0;z-index:8500;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.24);backdrop-filter:blur(3px);animation:fadeIn .18s ease both;}
.modal{width:min(440px,86vw);border-radius:14px;overflow:hidden;background:var(--glass-strong);
  backdrop-filter:blur(38px) saturate(180%);-webkit-backdrop-filter:blur(38px) saturate(180%);
  box-shadow:0 28px 80px rgba(0,0,0,.4),0 0 0 .5px var(--hairline);
  animation:spIn .22s var(--ease-out) both;}
.modal-head{padding:18px 20px 8px;font-size:14px;font-weight:600;text-align:center;}
.modal-body{padding:0 20px 18px;font-size:12.5px;color:var(--text-2);text-align:center;line-height:1.5;}
.modal-input{margin:0 20px 18px;}
.modal-input input,.modal-input textarea{width:100%;height:28px;border-radius:6px;padding:0 9px;font-size:13px;
  background:var(--surface);border:.5px solid var(--hairline);color:var(--text);}
.modal-input textarea{height:70px;padding:6px 9px;resize:none;line-height:1.45;}
.modal-input input:focus,.modal-input textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.18);}
.modal-foot{display:flex;border-top:.5px solid var(--hairline);}
.modal-foot button{flex:1;height:44px;font-size:13px;transition:background .12s;}
.modal-foot button:hover{background:var(--hover);}
.modal-foot button:first-child{border-right:.5px solid var(--hairline);}
.modal-foot button.primary{color:var(--accent);font-weight:600;}

/* ═══════════ 通用控件 ═══════════ */
.btn{height:24px;padding:0 12px;border-radius:6px;font-size:12.5px;background:var(--surface);
  border:.5px solid var(--hairline);box-shadow:0 1px 1.5px rgba(0,0,0,.08);transition:background .12s;}
.btn:hover{background:var(--surface-2);}
.btn:active{background:var(--surface-3);}
.btn.primary{background:var(--accent);color:var(--accent-text);border-color:transparent;}
.btn.primary:hover{filter:brightness(1.07);}
.seg{display:inline-flex;background:var(--input-bg);border-radius:7px;padding:2px;gap:2px;}
.seg button{padding:3px 12px;border-radius:5px;font-size:12px;color:var(--text-2);transition:.14s;}
.seg button.on{background:var(--surface);color:var(--text);box-shadow:0 1px 3px rgba(0,0,0,.14);font-weight:500;}

.toolbar{height:42px;flex:none;display:flex;align-items:center;gap:9px;padding:0 13px;
  border-bottom:.5px solid var(--hairline);}
.sidebar{width:172px;flex:none;background:var(--sidebar);backdrop-filter:blur(24px);
  border-right:.5px solid var(--hairline);padding:9px 7px;overflow-y:auto;}
.sb-title{font-size:11px;font-weight:600;color:var(--text-2);padding:8px 8px 4px;letter-spacing:.2px;}
.sb-item{display:flex;align-items:center;gap:8px;height:26px;padding:0 8px;border-radius:6px;font-size:12.5px;
  color:var(--text);transition:background .12s;}
.sb-item:hover{background:var(--hover);}
.sb-item.on{background:var(--active);font-weight:500;}
.sb-item .ic{color:var(--accent);}
.split{display:flex;flex:1;min-height:0;}

.empty-state{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:9px;color:var(--text-3);font-size:12.5px;}
.empty-state svg{opacity:.35;}

/* 滚动淡出等 */
.fade-bottom{mask-image:linear-gradient(#000 calc(100% - 20px),transparent);}
