@font-face { font-family: "Orbitron"; src: url("../fonts/orbitron-latin-500-normal.woff2") format("woff2"); font-style: normal; font-weight: 500; font-display: swap; }

:root[data-win11-ai] {
  --ai-glow: color-mix(in srgb, var(--accent) 45%, #8beaff);
  --ai-edge: rgba(42, 119, 173, .23);
  --ai-halo: rgba(25, 151, 226, .14);
  --ai-surface: rgba(235, 245, 254, .87);
  --ai-surface-strong: rgba(245, 250, 255, .97);
  --ai-desktop-top: #163b6e;
  --ai-desktop-bottom: #10294d;
  --text: #163047;
  --text-2: #4e697c;
  --text-3: #70869a;
  --bg-win: #edf4fb;
  --bg-card: #f8fbff;
  --bg-card-2: #e7f0f9;
  --bg-hover: rgba(30, 122, 193, .07);
  --bg-press: rgba(30, 122, 193, .11);
  --bg-sel: rgba(32, 136, 215, .13);
  --stroke: rgba(45, 104, 153, .12);
  --stroke-2: rgba(45, 104, 153, .2);
  --input-line: rgba(45, 104, 153, .38);
  --acrylic: var(--ai-surface);
  --acrylic-2: var(--ai-surface-strong);
  --taskbar: rgba(222, 238, 252, .87);
  --shadow-win: 0 18px 65px rgba(1, 17, 45, .27), 0 0 0 1px rgba(62, 151, 218, .23);
  --shadow-win-idle: 0 12px 40px rgba(1, 17, 45, .18);
  --shadow-fly: 0 16px 55px rgba(1, 17, 45, .25);
  --chart-grid: rgba(48, 109, 156, .1);
  --scroll: rgba(50, 112, 156, .3);
}

:root[data-win11-ai][data-theme="dark"] {
  --ai-edge: rgba(112, 193, 244, .22);
  --ai-halo: rgba(44, 175, 251, .13);
  --ai-surface: rgba(12, 28, 47, .91);
  --ai-surface-strong: rgba(12, 29, 48, .97);
  --ai-desktop-top: #07182e;
  --ai-desktop-bottom: #030a17;
  --text: #e9f3ff;
  --text-2: #b0c4d7;
  --text-3: #8099b1;
  --bg-win: #0f2135;
  --bg-card: #142b42;
  --bg-card-2: #10253a;
  --bg-hover: rgba(108, 197, 255, .08);
  --bg-press: rgba(108, 197, 255, .12);
  --bg-sel: rgba(53, 159, 236, .2);
  --stroke: rgba(122, 183, 227, .12);
  --stroke-2: rgba(122, 183, 227, .21);
  --input-line: rgba(122, 183, 227, .4);
  --taskbar: rgba(7, 20, 36, .9);
  --shadow-win: 0 20px 70px rgba(0, 0, 0, .55), 0 0 0 1px rgba(105, 201, 255, .25), 0 0 28px -17px rgba(66, 189, 255, .35);
  --shadow-win-idle: 0 12px 40px rgba(0, 0, 0, .42);
  --shadow-fly: 0 18px 60px rgba(0, 0, 0, .5);
  --chart-grid: rgba(121, 188, 238, .1);
  --scroll: rgba(135, 197, 239, .3);
}

@media (prefers-color-scheme: dark) {
  :root[data-win11-ai]:not([data-theme="light"]) {
    --ai-edge: rgba(112, 193, 244, .22);
    --ai-halo: rgba(44, 175, 251, .13);
    --ai-surface: rgba(12, 28, 47, .91);
    --ai-surface-strong: rgba(12, 29, 48, .97);
    --ai-desktop-top: #07182e;
    --ai-desktop-bottom: #030a17;
    --text: #e9f3ff;
    --text-2: #b0c4d7;
    --text-3: #8099b1;
    --bg-win: #0f2135;
    --bg-card: #142b42;
    --bg-card-2: #10253a;
    --bg-hover: rgba(108, 197, 255, .08);
    --bg-press: rgba(108, 197, 255, .12);
    --bg-sel: rgba(53, 159, 236, .2);
    --stroke: rgba(122, 183, 227, .12);
    --stroke-2: rgba(122, 183, 227, .21);
    --input-line: rgba(122, 183, 227, .4);
    --taskbar: rgba(7, 20, 36, .9);
    --shadow-win: 0 20px 70px rgba(0, 0, 0, .55), 0 0 0 1px rgba(105, 201, 255, .25), 0 0 28px -17px rgba(66, 189, 255, .35);
    --shadow-win-idle: 0 12px 40px rgba(0, 0, 0, .42);
    --shadow-fly: 0 18px 60px rgba(0, 0, 0, .5);
    --chart-grid: rgba(121, 188, 238, .1);
    --scroll: rgba(135, 197, 239, .3);
  }
}

:root[data-win11-ai] body > .wallpaper[data-wp="bloom"],
:root[data-win11-ai] body > .wallpaper[data-wp="tech"] {
  background-image: url("../wp/win11-ai-field.svg"), radial-gradient(ellipse at 76% 39%, rgba(12, 94, 165, .17), transparent 52%), linear-gradient(145deg, var(--ai-desktop-top), var(--ai-desktop-bottom));
  background-size: cover; background-position: center;
}
:root[data-win11-ai] body > .wallpaper::before {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(98, 171, 221, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(98, 171, 221, .045) 1px, transparent 1px);
  background-size: 72px 72px; mask-image: linear-gradient(90deg, transparent 24%, #000 68%, transparent);
}
:root[data-win11-ai] body > .wallpaper::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .24;
  background: radial-gradient(ellipse at 72% 46%, rgba(73, 193, 255, .2), transparent 42%);
  animation: win11-ai-breathe 15s ease-in-out infinite;
}
@keyframes win11-ai-breathe { 0%, 100% { opacity: .15; } 50% { opacity: .55; } }

:root[data-win11-ai] .desk-icon { border-radius: 7px; text-shadow: 0 1px 4px rgba(0, 8, 24, .95), 0 0 9px rgba(0, 12, 35, .8); transition: background .15s, border-color .15s; }
:root[data-win11-ai] .desk-icon:hover { background: rgba(63, 156, 224, .13); border-color: rgba(130, 211, 255, .3); box-shadow: 0 0 16px -10px rgba(80, 206, 255, .6); }
:root[data-win11-ai] .desk-icon.sel, :root[data-win11-ai] .desk-icon:focus-visible { background: rgba(58, 151, 226, .22); border-color: rgba(126, 215, 255, .62); box-shadow: 0 0 0 1px rgba(137, 218, 255, .1) inset; }
:root[data-win11-ai] .desk-icon > .ic { filter: drop-shadow(0 3px 5px rgba(0, 5, 20, .4)) drop-shadow(0 0 7px rgba(95, 189, 255, .12)); }
:root[data-win11-ai] .desk-icon:hover > .ic { filter: drop-shadow(0 3px 5px rgba(0, 5, 20, .4)) drop-shadow(0 0 9px rgba(95, 202, 255, .35)); }
:root[data-win11-ai] .tile-letter { border-radius: 11px; box-shadow: 0 1px 0 rgba(255, 255, 255, .25) inset, 0 0 0 1px rgba(193, 228, 255, .2) inset, 0 4px 10px rgba(0, 8, 26, .23); }
:root[data-win11-ai] .tile-letter::after { background: linear-gradient(145deg, rgba(226, 246, 255, .3), transparent 48%, rgba(15, 74, 128, .12)); }
:root[data-win11-ai] .tile-letter .arrow { box-shadow: 0 0 0 1px rgba(31, 102, 163, .15); }
:root[data-win11-ai] .start-app:hover { background: var(--bg-hover); box-shadow: 0 0 0 1px var(--stroke) inset; }
:root[data-win11-ai] .start-app, :root[data-win11-ai] .start-rec button { border-radius: 7px; min-width: 0; }

:root[data-win11-ai] .taskbar { background: var(--taskbar); border-top-color: var(--ai-edge); box-shadow: 0 -1px 20px -9px var(--ai-halo); }
:root[data-win11-ai] .taskbar::before { content: ""; position: absolute; top: -1px; left: 22%; right: 22%; height: 1px; pointer-events: none; background: linear-gradient(90deg, transparent, var(--ai-glow), transparent); opacity: .5; }
:root[data-win11-ai] .tb-btn { border-radius: 6px; }
:root[data-win11-ai] .tb-btn:hover, :root[data-win11-ai] .tb-btn.focused { background: var(--bg-hover); box-shadow: 0 0 0 1px var(--ai-edge) inset; }
:root[data-win11-ai] .tb-btn.focused .dot { background: var(--ai-glow); box-shadow: 0 0 7px var(--ai-halo); }
:root[data-win11-ai] .tb-btn[title="开始"] .ic { background: linear-gradient(145deg, #99edff, #2081f5); mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2 2h9v9H2zm11 0h9v9h-9zM2 13h9v9H2zm11 0h9v9h-9z' fill='white'/%3E%3C/svg%3E") center / 23px 23px no-repeat; }
:root[data-win11-ai] .tb-btn[title="开始"] .ic svg { opacity: 0; }
:root[data-win11-ai] .tb-widget .ic { position: relative; }
:root[data-win11-ai] .tb-widget .ic::after { content: "AI"; position: absolute; right: -5px; bottom: -1px; font: 700 6px/10px var(--font); letter-spacing: .02em; text-align: center; width: 13px; height: 10px; color: #b4f1ff; background: #11375b; border: 1px solid rgba(125, 215, 255, .45); border-radius: 3px; }

:root[data-win11-ai] .win { border-radius: 10px; box-shadow: var(--shadow-win-idle), 0 0 0 1px var(--stroke-2); }
:root[data-win11-ai] .win.active { box-shadow: var(--shadow-win); }
:root[data-win11-ai] .win.max { border-radius: 0; box-shadow: none; }
:root[data-win11-ai] .win-title { background: linear-gradient(90deg, color-mix(in srgb, var(--bg-win) 94%, var(--ai-glow)), var(--bg-win) 65%); box-shadow: 0 1px 0 var(--stroke); }
:root[data-win11-ai] .win-title .ic { filter: drop-shadow(0 0 4px var(--ai-halo)); }
:root[data-win11-ai] .wc:hover { background: var(--bg-hover); }
:root[data-win11-ai] .wc.close:hover { background: #c42b1c; color: #fff; }
:root[data-win11-ai] .flyout { border-color: var(--ai-edge); background: var(--ai-surface); box-shadow: var(--shadow-fly), 0 0 30px -22px var(--ai-glow); }
:root[data-win11-ai] .menu { border-color: var(--ai-edge); background: var(--ai-surface-strong); }
:root[data-win11-ai] .dialog { background: var(--bg-card); box-shadow: var(--shadow-fly), 0 0 0 1px var(--ai-edge); }
:root[data-win11-ai] .start-search { border-radius: 9px; border-color: var(--ai-edge); border-bottom-color: var(--accent); }
:root[data-win11-ai] .start-search:focus-within { box-shadow: 0 0 0 3px var(--ai-halo); }
:root[data-win11-ai] .start-foot { background: color-mix(in srgb, var(--bg-win) 85%, transparent); border-top-color: var(--stroke); }
:root[data-win11-ai] .start-user .av, :root[data-win11-ai] .set-me .av { box-shadow: 0 0 0 1px var(--ai-edge), 0 0 20px -12px var(--ai-glow); }
:root[data-win11-ai] .qs-tile button { border-radius: 8px; }
:root[data-win11-ai] .qs-tile button.on { box-shadow: 0 0 14px -8px var(--ai-glow); }
:root[data-win11-ai] .menu button { border-radius: 5px; }
:root[data-win11-ai] .snap-preview { border-color: rgba(136, 217, 255, .6); background: rgba(73, 162, 232, .16); box-shadow: 0 0 25px -15px rgba(112, 214, 255, .55); }

:root[data-win11-ai] .cmdbar { background: color-mix(in srgb, var(--bg-card-2) 75%, transparent); border-color: var(--stroke); }
:root[data-win11-ai] .inp, :root[data-win11-ai] .sel { border-radius: 6px; border-color: var(--stroke-2); }
:root[data-win11-ai] .inp:focus, :root[data-win11-ai] .sel:focus { border-bottom-color: var(--accent); box-shadow: 0 0 0 2px var(--ai-halo); }
:root[data-win11-ai] .btn { border-radius: 6px; }
:root[data-win11-ai] .btn.primary { box-shadow: 0 0 13px -9px var(--ai-glow); }
:root[data-win11-ai] .srow { border-radius: 8px; border-color: var(--stroke); }
:root[data-win11-ai] .rail button, :root[data-win11-ai] .fx-side button, :root[data-win11-ai] .perf-item { border-radius: 6px; }
:root[data-win11-ai] .rail button.on, :root[data-win11-ai] .perf-item.on { background: var(--bg-sel); box-shadow: 0 0 0 1px var(--stroke) inset; }
:root[data-win11-ai] .lg-text { background: var(--bg-card-2); }
:root[data-win11-ai] .toast, :root[data-win11-ai] .desk-up { border: 1px solid var(--ai-edge); background: var(--ai-surface-strong); box-shadow: var(--shadow-fly); }
:root[data-win11-ai] button:focus-visible { outline-color: var(--ai-glow); }

:root[data-win11-ai] .lock-clock::before { content: "ZHEOYOO / AI DESKTOP"; display: block; margin-bottom: 18px; font: 500 10px/1.5 "Orbitron", var(--font); letter-spacing: .2em; color: #a9e8ff; text-shadow: 0 0 12px rgba(88, 192, 255, .4); }
:root[data-win11-ai] .lock-clock .t { font-family: "Orbitron", var(--font); font-size: clamp(64px, 10vw, 108px); font-weight: 500; letter-spacing: -.02em; text-shadow: 0 0 28px rgba(106, 204, 255, .23), 0 1px 4px rgba(0, 8, 24, .7); }
:root[data-win11-ai] .lock-clock .d { margin-top: 12px; font-size: 16px; letter-spacing: .1em; color: #d0e5ff; }
:root[data-win11-ai] .lock-hint { font-size: 12px; letter-spacing: .1em; color: #c4deef; }
:root[data-win11-ai] .lock-panel { padding: 25px 24px 18px; border: 1px solid rgba(139, 207, 255, .25); border-radius: 15px; background: rgba(9, 25, 45, .65); box-shadow: 0 18px 70px rgba(0, 6, 20, .3), 0 0 35px -24px rgba(100, 208, 255, .45); backdrop-filter: blur(24px); }
:root[data-win11-ai] .lock-panel:has(.lock-setup) { width: min(500px, calc(100vw - 32px)); padding: 12px; max-height: calc(100dvh - 40px); overflow-y: auto; }
:root[data-win11-ai] .lock-panel .avatar { background: rgba(33, 99, 153, .18); border: 1px solid rgba(146, 220, 255, .32); box-shadow: 0 0 30px -15px rgba(111, 211, 255, .65); }
:root[data-win11-ai] .lock-panel .lock-name { color: #edf7ff; }
:root[data-win11-ai] .lock-field { border-radius: 6px; background: rgba(8, 24, 43, .6); border-color: rgba(147, 211, 255, .3); border-bottom-color: #89d8ff; }
:root[data-win11-ai] .lock-field:focus-within { background: rgba(10, 32, 55, .9); border-bottom-color: #86dfff; box-shadow: 0 0 0 2px rgba(107, 209, 255, .1); }
:root[data-win11-ai] .lock-field input, :root[data-win11-ai] .lock-field:focus-within input, :root[data-win11-ai] .lock-field button, :root[data-win11-ai] .lock-field:focus-within button { color: #edf7ff; }
:root[data-win11-ai] .lock-field input::placeholder, :root[data-win11-ai] .lock-field:focus-within input::placeholder { color: #a0b8d1; }
:root[data-win11-ai] .lock-field button.go, :root[data-win11-ai] .lock-field:focus-within button.go { background: rgba(73, 168, 232, .22); color: #c2f1ff; }
:root[data-win11-ai] .lock-sub, :root[data-win11-ai] .lock-link { color: #cae5fa; }
:root[data-win11-ai] .lock-msg.err { color: #ffb9be; }
:root[data-win11-ai] .lock-setup { width: 100%; padding: 12px; box-shadow: none; background: rgba(11, 30, 51, .95); color: #edf7ff; }
:root[data-win11-ai] .lock-setup .muted, :root[data-win11-ai] .lock-setup ol { color: #b5cbe0; }
:root[data-win11-ai] .lock-setup .secret { background: #102b45; color: #d5edff; }

@media (max-width: 760px) {
  :root[data-win11-ai] body > .wallpaper[data-wp="bloom"], :root[data-win11-ai] body > .wallpaper[data-wp="tech"] { background-position: 67% center; }
  :root[data-win11-ai] body > .wallpaper::before { background-size: 52px 52px; opacity: .6; }
  :root[data-win11-ai] .lock-clock::before { font-size: 8px; letter-spacing: .15em; }
  :root[data-win11-ai] .lock-clock .t { font-size: clamp(54px, 15vw, 80px); }
  :root[data-win11-ai] .lock-clock .d { font-size: 13px; }
  :root[data-win11-ai] .lock-panel { padding: 22px 20px 16px; }
  :root[data-win11-ai] .lock-panel:has(.lock-setup) { padding: 8px; }
  :root[data-win11-ai] .lock-setup { padding: 8px; }
  :root[data-win11-ai] .lock-setup .qr img { width: 120px; height: 120px; }
}

@media (prefers-reduced-motion: reduce) {
  :root[data-win11-ai] body > .wallpaper::after { animation: none; }
  :root[data-win11-ai] .desk-icon { transition: none; }
}