:root{--color-bg: #0b0c0e;--color-surface-base: #141519;--color-surface-elevated: #1c1d22;--color-surface-overlay: rgba(20, 21, 25, .88);--color-primary: hsl(262, 82%, 75%);--color-primary-glow: hsla(262, 82%, 75%, .15);--color-secondary: hsl(172, 72%, 48%);--color-secondary-glow: hsla(172, 72%, 48%, .15);--text-primary: #fcfdfe;--text-secondary: #94a3b8;--text-dim: #64748b;--accent-gradient: linear-gradient(135deg, var(--color-primary), var(--color-secondary));--success: #3ef07d;--warning: #fbc531;--error: #ff5e57;--border-subtle: rgba(255, 255, 255, .06);--border-strong: rgba(255, 255, 255, .12);--border-accent: hsla(262, 82%, 75%, .4);--space-unit: 4px;--space-xs: calc(var(--space-unit) * 1);--space-sm: calc(var(--space-unit) * 2);--space-md: calc(var(--space-unit) * 4);--space-lg: calc(var(--space-unit) * 6);--space-xl: calc(var(--space-unit) * 8);--font-main: "Inter Variable", "Inter", system-ui, sans-serif;--font-code: "JetBrains Mono", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-full: 9999px;--shadow-deep: 0 8px 32px rgba(0, 0, 0, .6);--shadow-glow: 0 0 16px var(--color-primary-glow);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-base: .3s cubic-bezier(.4, 0, .2, 1);--sidebar-width: 280px;--header-height: 60px}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;width:100%;margin:0;padding:0;background:var(--color-bg)}html{font-size:16px;-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{font-family:var(--font-main);font-size:var(--text-base);line-height:1.6;color:var(--text-primary);background:var(--color-bg);overflow:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{height:100%;width:100%;display:flex;overflow:hidden}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::webkit-scrollbar-thumb{background:var(--border-strong);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--text-secondary)}.glass{background:var(--color-surface-overlay);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border-subtle)}.glass-elevated{background:var(--color-surface-elevated);border:1px solid var(--border-strong);box-shadow:var(--shadow-deep)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);padding:var(--space-sm) var(--space-md);border:none;border-radius:var(--radius-md);font-family:var(--font-sans);font-size:var(--text-sm);font-weight:500;cursor:pointer;transition:all var(--transition);outline:none;white-space:nowrap}.btn:focus-visible{box-shadow:0 0 0 2px var(--bg-primary),0 0 0 4px var(--accent-primary)}.btn-primary{background:var(--accent-gradient);color:#000;font-weight:700;box-shadow:var(--shadow-glow)}.btn-primary:hover{transform:translateY(-1px);box-shadow:var(--shadow-glow)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--color-surface-elevated);color:var(--text-primary);border:1px solid var(--border-strong)}.btn-secondary:hover{background:var(--color-surface-base);border-color:var(--color-primary)}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-icon{padding:var(--space-sm);border-radius:var(--radius-sm)}.btn-sm{padding:var(--space-xs) var(--space-sm);font-size:var(--text-xs)}.input{width:100%;padding:var(--space-sm) var(--space-md);background:var(--color-surface-base);border:1px solid var(--border-strong);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font-main);font-size:var(--text-base);transition:all var(--transition-fast);outline:none}.input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-glow)}.input::placeholder{color:var(--text-dim)}textarea.input{resize:none;min-height:var(--input-height);line-height:1.5}select.input{appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%2394a3b8' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:36px}h1{font-size:var(--text-2xl);font-weight:700}h2{font-size:var(--text-xl);font-weight:600}h3{font-size:var(--text-lg);font-weight:600}a{color:var(--text-accent);text-decoration:none;transition:color var(--transition)}a:hover{color:var(--accent-primary)}code{font-family:var(--font-code);font-size:.875em;background:var(--color-surface-elevated);padding:2px 6px;border-radius:var(--radius-sm);color:var(--color-secondary)}pre{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);padding:var(--space-md);overflow-x:auto;font-family:var(--font-mono);font-size:var(--text-sm);line-height:1.7}pre code{background:none;padding:0;border-radius:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:translate(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:translate(0)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}@keyframes typing{0%,60%,to{transform:translateY(0)}30%{transform:translateY(-4px)}}.fade-in{animation:fadeIn .3s ease-out forwards}.typing-indicator{display:inline-flex;gap:4px;padding:12px 16px}.typing-indicator span{width:8px;height:8px;border-radius:50%;background:var(--text-tertiary);animation:typing 1.4s ease-in-out infinite}.typing-indicator span:nth-child(2){animation-delay:.2s}.typing-indicator span:nth-child(3){animation-delay:.4s}.badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:500}.badge-primary{background:var(--accent-glow);color:var(--text-accent)}.badge-success{background:#22c55e26;color:var(--success)}.badge-warning{background:#f59e0b26;color:var(--warning)}.divider{height:1px;background:var(--border);margin:var(--space-md) 0}.modal-overlay{position:fixed;inset:0;background:#0009;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--space-md);animation:fadeIn .2s ease-out}.modal-content{background:var(--color-surface-base);border:1px solid var(--border-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-deep);max-width:520px;width:100%;max-height:85dvh;overflow-y:auto;padding:var(--space-xl);animation:fadeIn .3s ease-out}@media(max-width:768px){:root{--sidebar-width: 100%;--header-height: 52px;--text-base: .875rem}}@supports (padding: max(0px)){#app{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}}