:root,[data-theme=dark]{--color-primary: #800020;--color-primary-dark: #4C0013;--color-secondary: #D4AF37;--color-bg: #0A0A0A;--color-surface: #1E1E1E;--color-text: #FFFFFF;--color-text-muted: #A0A0A0;--color-card: #1a1a1a;--color-card-hover: #222222;--color-input-bg: #333333;--color-border: rgba(255, 255, 255, .1);--color-border-subtle: rgba(255, 255, 255, .06);--color-overlay: rgba(0, 0, 0, .8);--color-header-bg: rgba(10, 10, 10, .92);--color-nav-bg: rgba(10, 10, 10, .92);--color-nav-border: rgba(128, 0, 32, .2);--color-modal-bg: linear-gradient(180deg, #1e1e1e 0%, #151515 100%);--color-popup-bg: linear-gradient(160deg, #1a1a2e 0%, #16213e 50%, #0f0f23 100%);--color-text-secondary: #cccccc;--color-text-dim: #888888;--color-text-faint: #666666;--color-text-ghost: #555555;--color-text-subtle: #aaaaaa;--color-white-alpha-03: rgba(255, 255, 255, .03);--color-white-alpha-05: rgba(255, 255, 255, .05);--color-white-alpha-08: rgba(255, 255, 255, .08);--color-chat-bubble-them: #333333;--color-status-dot-border: #0f0f0f;--color-card-shadow: 0 4px 20px rgba(0, 0, 0, .3);--color-card-border: rgba(255, 255, 255, .06);--color-story-ring-bg: #0f0f0f;--color-story-name: #e0e0e0;--color-story-label: #bbb;--radius-lg: 16px;--shadow-lg: 0 10px 30px -10px rgba(128, 0, 32, .3);font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:var(--color-text);background-color:var(--color-bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}[data-theme=light]{--color-primary: #800020;--color-primary-dark: #4C0013;--color-secondary: #B8941F;--color-bg: #F5F5F7;--color-surface: #FFFFFF;--color-text: #1C1C1E;--color-text-muted: #6E6E73;--color-card: #FFFFFF;--color-card-hover: #F0F0F2;--color-input-bg: #F2F2F7;--color-border: rgba(0, 0, 0, .1);--color-border-subtle: rgba(0, 0, 0, .05);--color-overlay: rgba(0, 0, 0, .45);--color-header-bg: rgba(255, 255, 255, .95);--color-nav-bg: rgba(255, 255, 255, .95);--color-nav-border: rgba(0, 0, 0, .08);--color-modal-bg: linear-gradient(180deg, #ffffff 0%, #f8f8fa 100%);--color-popup-bg: #ffffff;--color-text-secondary: #3A3A3C;--color-text-dim: #636366;--color-text-faint: #8E8E93;--color-text-ghost: #C7C7CC;--color-text-subtle: #636366;--color-white-alpha-03: rgba(0, 0, 0, .02);--color-white-alpha-05: rgba(0, 0, 0, .04);--color-white-alpha-08: rgba(0, 0, 0, .06);--color-chat-bubble-them: #E8E8ED;--color-status-dot-border: #FFFFFF;--color-card-shadow: 0 2px 12px rgba(0, 0, 0, .08);--color-card-border: rgba(0, 0, 0, .08);--color-story-ring-bg: #FFFFFF;--color-story-name: #3A3A3C;--color-story-label: #6E6E73;--radius-lg: 16px;--shadow-lg: 0 4px 20px rgba(0, 0, 0, .08);color-scheme:light;color:var(--color-text);background-color:var(--color-bg)}*{box-sizing:border-box;margin:0;padding:0}body{min-height:100vh;width:100%;margin:0;display:flex;flex-direction:column;background-color:var(--color-bg);overflow-x:hidden}#root{width:100%;min-height:100vh;margin:0 auto;background-color:var(--color-bg);position:relative;display:flex;flex-direction:column}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#80002080;border-radius:3px}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}h1,h2,h3{font-weight:700;line-height:1.1;letter-spacing:-.02em}h1{font-size:2rem}h2{font-size:1.5rem}h3{font-size:1.25rem}.flex-center{display:flex;justify-content:center;align-items:center}.text-gradient{background:linear-gradient(to right,#ff4d6d,#800020);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.btn-primary{background:linear-gradient(135deg,var(--color-primary) 0%,var(--color-primary-dark) 100%);color:#fff;border:none;padding:12px 24px;border-radius:999px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 15px #80002066}.btn-primary:active{transform:scale(.98)}.glass-panel{background:#1e1e1e99;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--color-border)}[data-theme=light] .glass-panel{background:#ffffffb3}body,#root,header,nav,main,.view-container{transition:background-color .3s ease,color .3s ease,border-color .3s ease}