@import"https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;500;600&display=swap";*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-sans);line-height:1.5;overflow:hidden;height:100vh;background:var(--bg-root);color:var(--text-primary)}:root{--bg-primary: var(--bg-root);--bg-secondary: var(--bg-layer-0);--bg-tertiary: var(--bg-layer-1);--bg-elevated: var(--bg-layer-2);--bg-hover: var(--bg-layer-2);--bg-active: var(--bg-layer-3);--border-primary: var(--border-default);--border-secondary: var(--border-subtle);--transition-fast: var(--dur-fast);--transition-normal: var(--dur-normal)}#root{height:100vh;display:flex;flex-direction:column}:root,[data-theme=dark]{--font-sans: "Inter", system-ui, -apple-system, sans-serif;--font-mono: "JetBrains Mono", "Fira Code", "Cascadia Code", monospace;--bg-root: #020a12;--bg-layer-0: #040d18;--bg-layer-1: #06101e;--bg-layer-2: #091425;--bg-layer-3: #0c182c;--text-primary: #eef1f7;--text-secondary: #98a2b8;--text-muted: #5e687c;--text-inverse: #020a12;--accent-primary: #00e5ff;--accent-secondary: #00b8d4;--accent-gradient: linear-gradient(135deg, #00e5ff 0%, #0068d4 100%);--accent-glow-sm: rgba(0, 229, 255, .1);--accent-glow-md: rgba(0, 229, 255, .18);--accent-glow-lg: rgba(0, 229, 255, .28);--success: #22c55e;--success-muted: #0f2e1a;--warning: #eab308;--warning-muted: #3d2400;--danger: #ef4444;--danger-muted: #3b1010;--info: #6366f1;--info-muted: #1a1850;--glass-sm: rgba(6, 16, 30, .62);--glass-md: rgba(6, 16, 30, .78);--glass-lg: rgba(6, 16, 30, .9);--glass-blur: 20px;--border-subtle: rgba(0, 229, 255, .06);--border-default: rgba(0, 229, 255, .1);--border-strong: rgba(0, 229, 255, .16);--border-accent: rgba(0, 229, 255, .35);--shadow-xs: 0 1px 2px rgba(0, 0, 0, .5);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .45);--shadow-md: 0 4px 20px rgba(0, 0, 0, .5), 0 0 0 1px rgba(0, 229, 255, .06);--shadow-lg: 0 12px 48px rgba(0, 0, 0, .6), 0 0 0 1px rgba(0, 229, 255, .08);--shadow-xl: 0 20px 64px rgba(0, 0, 0, .7);--shadow-glow: 0 0 35px rgba(0, 229, 255, .12);--shadow-glow-btn: 0 0 24px rgba(0, 229, 255, .25);--radius-xs: 4px;--radius-sm: 6px;--radius-md: 10px;--radius-lg: 14px;--radius-xl: 20px;--radius-full: 9999px;--text-2xs: .625rem;--text-xs: .75rem;--text-sm: .8125rem;--text-md: .9375rem;--text-lg: 1.125rem;--text-xl: 1.5rem;--text-2xl: 2rem;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-8: 48px;--space-12: 64px;--ease-out-expo: cubic-bezier(.19, 1, .22, 1);--ease-out-back: cubic-bezier(.34, 1.56, .64, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--dur-instant: .1s;--dur-fast: .2s;--dur-normal: .3s;--dur-slow: .5s;--taskbar-height: 48px;--header-height: 34px}[data-theme=light]{--bg-root: #f8f9fb;--bg-layer-0: #ffffff;--bg-layer-1: #f1f3f6;--bg-layer-2: #e4e6ec;--bg-layer-3: #d6d9e0;--text-primary: #111318;--text-secondary: #4b4f5c;--text-muted: #7c808e;--text-inverse: #ffffff;--accent-primary: #0097a7;--accent-secondary: #006974;--accent-gradient: linear-gradient(135deg, #0097a7 0%, #006974 100%);--accent-glow-sm: rgba(0, 151, 167, .08);--accent-glow-md: rgba(0, 151, 167, .14);--accent-glow-lg: rgba(0, 151, 167, .2);--success: #16a34a;--success-muted: #dcfce7;--warning: #d97706;--warning-muted: #fef3c7;--danger: #dc2626;--danger-muted: #fee2e2;--info: #4f46e5;--info-muted: #e0e7ff;--glass-sm: rgba(255, 255, 255, .6);--glass-md: rgba(255, 255, 255, .75);--glass-lg: rgba(255, 255, 255, .88);--border-subtle: rgba(0, 0, 0, .04);--border-default: rgba(0, 0, 0, .07);--border-strong: rgba(0, 0, 0, .12);--border-accent: rgba(0, 151, 167, .25);--shadow-xs: 0 1px 2px rgba(0, 0, 0, .04);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .06);--shadow-md: 0 4px 20px rgba(0, 0, 0, .08), 0 0 0 1px rgba(0, 0, 0, .03);--shadow-lg: 0 12px 48px rgba(0, 0, 0, .12), 0 0 0 1px rgba(0, 0, 0, .04);--shadow-xl: 0 20px 64px rgba(0, 0, 0, .18);--shadow-glow: 0 0 30px rgba(0, 151, 167, .06);--shadow-glow-btn: 0 0 20px rgba(0, 151, 167, .14)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}*:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;border-radius:var(--radius-sm)}.glass-sm{background:var(--glass-sm);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--border-subtle)}.glass-md{background:var(--glass-md);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--border-default)}.glass-lg{background:var(--glass-lg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--border-strong)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}@keyframes slideInRight{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes slideOutRight{0%{opacity:1;transform:translate(0)}to{opacity:0;transform:translate(40px)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes glowPulse{0%,to{box-shadow:0 0 12px #00e5ff1a}50%{box-shadow:0 0 24px #00e5ff38}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes bgShift{0%{background-position:0% 0%}to{background-position:8% 8%}}@keyframes valueFlash{0%{color:var(--success)}to{color:var(--text-primary)}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.animate-fade-in{animation:fadeIn var(--dur-normal) var(--ease-out-expo)}.animate-fade-in-up{animation:fadeInUp var(--dur-slow) var(--ease-out-back)}.animate-fade-in-scale{animation:fadeInScale var(--dur-normal) var(--ease-out-back)}.animate-slide-in-right{animation:slideInRight var(--dur-normal) var(--ease-out-back)}.animate-shimmer{background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.04) 50%,transparent 100%);background-size:200% 100%;animation:shimmer 2s ease-in-out infinite}.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:2px 10px;border-radius:var(--radius-full);font-size:var(--text-2xs);font-weight:600;letter-spacing:.3px;text-transform:uppercase;line-height:1.5}.badge-success{background:var(--success-muted);color:var(--success);border:1px solid color-mix(in srgb,var(--success) 25%,transparent)}.badge-warning{background:var(--warning-muted);color:var(--warning);border:1px solid color-mix(in srgb,var(--warning) 25%,transparent)}.badge-danger{background:var(--danger-muted);color:var(--danger);border:1px solid color-mix(in srgb,var(--danger) 25%,transparent)}.badge-info{background:var(--info-muted);color:var(--info);border:1px solid color-mix(in srgb,var(--info) 25%,transparent)}.badge-accent{background:var(--accent-glow-sm);color:var(--accent-primary);border:1px solid var(--border-accent)}.desktop-bg{background:radial-gradient(ellipse at 15% 50%,rgba(0,229,255,.025) 0%,transparent 55%),radial-gradient(ellipse at 85% 15%,rgba(99,102,241,.02) 0%,transparent 50%),radial-gradient(ellipse at 50% 85%,rgba(0,151,167,.015) 0%,transparent 50%),var(--bg-root);animation:bgShift 25s ease-in-out infinite alternate}.desktop-bg:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(rgba(0,229,255,.025) 1px,transparent 1px);background-size:44px 44px;pointer-events:none;opacity:.5}[data-theme=light] .desktop-bg{background:radial-gradient(ellipse at 15% 50%,rgba(0,151,167,.03) 0%,transparent 55%),radial-gradient(ellipse at 85% 15%,rgba(79,70,229,.025) 0%,transparent 50%),radial-gradient(ellipse at 50% 85%,rgba(0,151,167,.02) 0%,transparent 50%),var(--bg-root)}[data-theme=light] .desktop-bg:before{background-image:radial-gradient(rgba(0,0,0,.03) 1px,transparent 1px)}@media (max-width: 768px){:root{--taskbar-height: 44px;--radius-xl: 12px}.desktop-bg:before{background-size:28px 28px}}@media (max-width: 480px){:root{--taskbar-height: 40px;--radius-lg: 8px;--radius-xl: 10px}.desktop-bg:before{display:none}}
