.page-header{text-align:center;margin-bottom:2rem}.page-header h1{margin:0 0 .5rem;font-size:2rem;color:var(--text)}.page-header p{color:var(--muted);font-size:1.1rem}.level-selector{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-bottom:2rem}.level-btn{padding:.75rem 1.5rem;border:2px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);color:var(--text);font-weight:600;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease}.level-btn:hover{background:var(--surface-2);transform:translateY(-2px)}.level-btn.active{background:var(--surface-brand);border:1px solid var(--primary)}.step-selector{margin:30px 0;text-align:center;border:1px solid var(--border-strong);background:var(--surface)}.step-selector h3{color:var(--text);margin-bottom:20px;font-size:1.3rem}.step-buttons{display:flex;justify-content:center;gap:15px;flex-wrap:wrap;margin-bottom:20px}.step-btn{padding:12px 24px;border:2px solid var(--border-strong);border-radius:8px;background:var(--surface);color:var(--text);font-weight:600;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease}.step-btn:hover{background:var(--surface-2);transform:translateY(-2px)}.step-btn.active{background:var(--surface-brand);color:var(--text);border:1px solid var(--border-strong)}.validated-icon{color:var(--success);margin-left:6px;font-weight:700}.explanation-type-selector{background:var(--surface-2);padding:20px;border-radius:12px;border:1px solid var(--border);margin-top:20px}.explanation-type-selector h4{color:var(--text);margin:0 0 15px;font-size:1.1rem}.explanation-buttons{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.explanation-btn{padding:10px 20px;border:2px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text);font-weight:500;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease;font-size:.95rem}.explanation-btn:hover{background:var(--surface-2);transform:translateY(-1px)}.explanation-btn.active{background:var(--primary);color:var(--text-inverse);border-color:var(--primary)}.loading-logo-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;gap:20px;text-align:center;width:100%}.loading-logo-spin{width:80px;height:80px;animation:logo-spin 2s linear infinite;filter:drop-shadow(0 0 15px rgba(var(--primary-rgb),.4))}.loading-logo-container p{font-weight:600;color:var(--primary);font-size:1.1rem;letter-spacing:.5px;margin:0}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}*,*:before,*:after{box-sizing:border-box}html,body,#root{height:100%}:root{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--bg: radial-gradient(90dvh circle, #ffffff 0%, #f5f4fc 40%, #faf4f4 75%, #eee7e7 100%), conic-gradient(from 210deg at 80% 8%, rgba(126, 120, 231, .045), transparent 30%, rgba(6,182,212,.045) 60%, transparent 75%);--bg-accent: #f8fafc;--text: #0a1022;--text-secondary: #49566a;--text-inverse: #fff;--muted: #6b7280;--surface: #F2F0EF;--surface-2: #f0e7e2;--surface-gradient: linear-gradient(180deg, rgb(8, 2, 112), transparent 45%);--surface-hover: #eef2ff;--progress-bg: color-mix(in srgb, var(--border) 85%, transparent);--surface-grad-1: linear-gradient(180deg, color-mix(in srgb, var(--primary) 6%, var(--surface)) 0%, var(--surface) 100%);--surface-grad-2: linear-gradient(180deg, color-mix(in srgb, var(--accent) 6%, var(--surface)) 0%, var(--surface) 100%);--surface-brand: linear-gradient(135deg, color-mix(in srgb, var(--primary) 10%, var(--surface)) 0%, color-mix(in srgb, var(--accent) 8%, var(--surface-2)) 100%);--surface-glass: linear-gradient(135deg, var(--surface-2), var(--surface));--panel-surface: linear-gradient(180deg, color-mix(in srgb, var(--primary) 1%, var(--surface)) 0%, color-mix(in srgb, var(--primary) .5%, var(--surface)) 100%);--border: #f1ebff;--border-soft: color-mix(in srgb, #e6eaf2 75%, #ffffff);--border-strong: #c6d2ff;--border-contrast: color-mix(in srgb, var(--primary) 28%, #94a3b8 72%);--border-gradient: linear-gradient(135deg, #c7d2fe 0%, #a7f3d0 45%, #fbcfe8 100%);--primary: #4f46e5;--primary-2: #06b6d4;--secondary: #f97316;--accent: #f43f5e;--info: #06b6d4;--success: #16a34a;--danger: #ef4444;--warning: #f59e0b;--brand-gradient: linear-gradient(135deg, #4f46e5 0%, #22d3ee 50%, #f43f5e 100%);--cta-gradient: linear-gradient(135deg, #625be2 0%, #8b5cf6 100%);--cta-gradient-hover: linear-gradient(135deg, #7872e2 0%, #ab88fc 100%);--stat-gradient-blue: linear-gradient(180deg, #60a5fa 0%, #3b82f6 100%);--stat-gradient-orange: linear-gradient(180deg, #fbbf24 0%, #f59e0b 100%);--radius: 12px;--radius-lg: 20px;--shadow: 0 10px 28px rgba(15,23,42,.1);--shadow-sm: 0 6px 18px rgba(15,23,42,.08);--shadow-md: 0 8px 22px rgba(15,23,42,.14);--shadow-card: 0 10px 26px rgba(15,23,42,.12);--shadow-hover: 0 16px 40px rgba(15,23,42,.18);--btn-radius: var(--radius);--btn-primary-bg: var(--cta-gradient);--btn-primary-hover-bg: var(--cta-gradient);--btn-primary-text: var(--text-inverse);--btn-primary-hover: linear-gradient(135deg, #4338ca 0%, #7c3aed 100%);--btn-shadow: 0 8px 20px rgba(79,70,229,.28);--btn-hover-shadow: 0 12px 28px rgba(79,70,229,.34);--btn-active-shadow: 0 6px 18px rgba(79,70,229,.3);--btn-secondary-bg: var(--surface);--btn-secondary-text: var(--text);--btn-secondary-border: var(--border-contrast);--btn-secondary-hover-bg: #eef2ff;--btn-ghost-text: var(--primary);--btn-ghost-hover-bg: color-mix(in srgb, var(--primary) 12%, var(--surface));--btn-danger-bg: var(--danger);--btn-success-bg: var(--success);--btn-info-bg: var(--info);--btn-warning-bg: var(--warning);--btn-validate-bg: linear-gradient(135deg, color-mix(in srgb, var(--primary) 10%, #4338ca) 0%, color-mix(in srgb, var(--primary) 45%, var(--primary-2)) 100%);--btn-validate-hover-bg: linear-gradient(135deg, var(--primary) 0%, color-mix(in srgb, var(--primary) 32%, var(--primary-2)) 100%);--btn-reset-bg: linear-gradient(135deg, #ae91ff 0%, color-mix(in srgb, #ef4444 34%, var(--accent)) 100%);--btn-reset-hover-bg: linear-gradient(135deg, color-mix(in srgb, #f37a7a 10%, #bca4fd) 0%, color-mix(in srgb, #f38888 48%, var(--accent)) 100%);--btn-random-bg: linear-gradient(135deg, #823fff 0%, color-mix(in srgb, #823fff 34%, var(--secondary)) 100%);--btn-random-hover-bg: linear-gradient(135deg, color-mix(in srgb, #9962ff 10%, #a0677f) 0%, color-mix(in srgb, #823fff 50%, var(--secondary)) 100%);--btn-not-learned-bg: linear-gradient(135deg, #823fff 0%, color-mix(in srgb, #823fff 34%, var(--secondary)) 100%);--btn-not-learned-hover-bg: linear-gradient(135deg, color-mix(in srgb, #823fff 10%, #a0677f) 0%, color-mix(in srgb, #823fff 50%, var(--secondary)) 100%);--ring-strong-color: color-mix(in srgb, var(--primary) 40%, transparent);--glow-primary: 0 10px 32px color-mix(in srgb, var(--primary) 22%, transparent)}.card-vivid{background:linear-gradient(var(--surface),var(--surface)) padding-box,var(--border-gradient) border-box,var(--surface-gradient);border:1px solid transparent;border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}.card-vivid:hover{box-shadow:var(--shadow-hover)}.item{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease,background .15s ease}.item:hover{border-color:var(--border-contrast);background:var(--surface-hover);box-shadow:var(--shadow-hover);transform:translateY(-1px)}.btn-primary:hover{background:var(--btn-primary-hover);box-shadow:var(--btn-hover-shadow),var(--glow-primary)}.progress{height:8px;border-radius:999px;background:var(--progress-bg);overflow:hidden;border:1px solid var(--border-soft)}.progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--primary) 0%,var(--primary-2) 100%);box-shadow:inset 0 -4px 8px #ffffff59}a{font-weight:500;color:var(--primary);text-decoration:none}a:hover{opacity:.9}body{margin:0;min-width:320px;min-height:100svh;color:var(--text);background:var(--bg);transition:background-color .25s ease,color .25s ease}.app-layout{min-height:100svh;display:flex;flex-direction:column}.bottom-sticky-bar{position:sticky;bottom:calc(12px + env(safe-area-inset-bottom));z-index:1000;width:100%;display:flex;justify-content:space-between;align-items:flex-end;gap:10px;padding-left:max(12px,(100vw - 1200px) / 2 + 12px);padding-right:max(20px,(100vw - 1200px) / 2 + 20px);pointer-events:none;height:0;overflow:visible;margin-bottom:12px}.sticky-left-controls{display:flex;align-items:flex-end;gap:10px}.bottom-sticky-bar>*{pointer-events:auto}.main-content{width:100%;max-width:1200px;margin:0 auto auto;padding:1rem;padding-bottom:96px}@media (max-width: 768px){.main-content{padding:.75rem;padding-bottom:84px}}@media (max-width: 480px){.main-content{padding:.5rem;padding-bottom:80px}}h1{font-size:2rem;line-height:1.2;font-weight:700;letter-spacing:.2px}h2{font-size:1.6rem;line-height:1.25;font-weight:600;margin:0 0 8px}h3{font-size:1.15rem;line-height:1.3;font-weight:600;margin:0 0 6px}p{margin:0 0 8px}.muted{color:var(--muted)}button{font-family:inherit}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 30%,transparent);outline-offset:2px}input,select,textarea{font-family:inherit;border:1px solid var(--border);border-radius:var(--radius);padding:.5rem .75rem;transition:border-color .2s ease,box-shadow .2s ease}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent)}.btn{font-family:inherit;display:inline-block;border-radius:var(--btn-radius);padding:.6rem 1.2rem;font-weight:500;cursor:pointer;transition:background .2s ease,box-shadow .2s ease,border-color .2s ease,color .2s ease;border:none}.btn:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 30%,transparent);outline-offset:2px}.btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-text);box-shadow:var(--btn-shadow)}.btn-primary:hover{background:var(--btn-primary-hover);box-shadow:var(--btn-hover-shadow)}.btn-primary:active{box-shadow:var(--btn-active-shadow)}.btn-secondary{background:var(--btn-secondary-bg);color:var(--btn-secondary-text);border:1px solid var(--btn-secondary-border);box-shadow:var(--shadow-sm)}.btn-secondary:hover{background:var(--btn-secondary-hover-bg)}.btn-danger{background:var(--btn-danger-bg);color:var(--text-inverse);box-shadow:var(--shadow-sm)}.btn-danger:hover{filter:brightness(.96)}:root[data-theme=dark]{--bg: radial-gradient(90dvh circle at 80% 18%, #0b1220 0%, #121735 55%, #0e1327 100%), conic-gradient(from 0deg at 10% 10%, rgba(139,92,246,.16), transparent 35%, rgba(34,211,238,.12) 65%, transparent 80%);--bg-accent: #0f1726;--text: #e6edf7;--text-secondary: #a8b3cf;--surface: #0f1726;--surface-2: #111a2b;--surface-3: #171a36;--surface-gradient: linear-gradient(180deg, rgba(139,92,246,.18), transparent 50%);--surface-hover: #131c30;--surface-glass: linear-gradient(135deg, color-mix(in srgb, #ffffff 6%, var(--surface-2)), var(--surface));--panel-surface: linear-gradient(180deg, color-mix(in srgb, var(--primary) 6%, var(--surface)) 0%, color-mix(in srgb, var(--primary) 3%, var(--surface)) 100%);--border: #24324a;--border-soft: #1d2740;--border-strong: #475569;--border-contrast: color-mix(in srgb, var(--primary) 40%, #334155 60%);--primary: #8b5cf6;--primary-hover: #7c3aed;--secondary: #fb923c;--accent: #f472b6;--success: #34d399;--danger: #fb7185;--warning: #fbbf24;--cta-gradient: linear-gradient(135deg, #7c3aed 0%, #6366f1 100%);--shadow: 0 10px 30px rgba(0,0,0,.45);--shadow-sm: 0 8px 22px rgba(0,0,0,.4);--shadow-md: 0 10px 28px rgba(0,0,0,.48);--shadow-card: 0 12px 32px rgba(0,0,0,.52);--shadow-hover: 0 16px 40px rgba(0,0,0,.58);--ring-strong: 0 0 0 3px color-mix(in srgb, var(--primary) 50%, transparent);--glow-primary: 0 12px 36px color-mix(in srgb, var(--primary) 35%, transparent)}:root[data-theme=dark] body{background:var(--bg);color:var(--text)}:root[data-theme=dark] a{color:var(--primary)}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-card)}.modal-overlay{position:fixed;inset:0;background:#0206178c;display:flex;align-items:center;justify-content:center;z-index:2000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.modal-content{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:0 20px 48px #0f172a59;width:90%;max-width:400px;max-height:90vh;overflow-y:auto;animation:modalSlideIn .28s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:24px 24px 16px;border-bottom:1px solid var(--border)}.modal-header h2{margin:0;font-size:1.5rem;font-weight:700;color:var(--text)}.close-btn{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--muted);padding:4px;border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.close-btn:hover{background:var(--surface-2);color:var(--text)}.login-form{padding:24px}.form-group input{width:100%;padding:12px 16px;border:1px solid var(--border);border-radius:8px;font-size:1rem;box-sizing:border-box;background:var(--surface);color:var(--text)}.form-group input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent)}.form-group input::placeholder{color:#9ca3af}.error-message{background:color-mix(in srgb,var(--danger) 12%,var(--surface));border:1px solid color-mix(in srgb,var(--danger) 35%,transparent);color:var(--danger);padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:.9rem;display:flex;align-items:center;gap:8px;cursor:pointer;transition:background .2s ease,box-shadow .2s ease,transform .2s ease;margin-top:8px}.form-options{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 24px 0}.remember-option{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:.9rem}.forgot-password-link{background:none;border:none;color:var(--primary);font-weight:600;cursor:pointer;padding:6px 0;border-radius:6px;transition:color .2s ease}.forgot-password-link:hover{color:color-mix(in srgb,var(--primary) 70%,transparent);text-decoration:underline}.login-btn{width:100%;background:var(--primary);color:var(--text-inverse);border:none;border-radius:10px;padding:12px 16px;font-weight:700;font-size:1rem;letter-spacing:.2px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease}.login-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px color-mix(in srgb,var(--primary) 28%,transparent)}.login-btn:active:not(:disabled){transform:translateY(0);opacity:.7;cursor:not-allowed}.login-btn:disabled{opacity:.7;cursor:not-allowed;filter:grayscale(.15)}.separator{display:flex;align-items:center;text-align:center;margin:20px 0;color:var(--muted);font-size:.85rem;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.separator:before,.separator:after{content:"";flex:1;border-bottom:1px solid var(--border)}.separator:before{margin-right:12px}.separator:after{margin-left:12px}.google-login-container{display:flex;justify-content:center;width:100%}.google-login-container>div{width:100%!important}.modal-footer{padding:16px 24px 24px;text-align:center;border-top:1px solid var(--border)}.modal-footer p{margin:0 0 12px;color:var(--muted);font-size:.9rem}.register-link{background:none;border:2px solid var(--primary);color:var(--primary);padding:10px 20px;border-radius:8px;font-weight:600;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease;font-size:.9rem}.register-link:hover{background:var(--primary);color:var(--text-inverse);transform:translateY(-1px)}@media (max-width: 480px){.modal-content{width:95%;margin:20px}.modal-header,.login-form,.modal-footer{padding-left:20px;padding-right:20px}}.register-modal{max-width:600px;max-height:90vh}.register-form{padding:24px;max-height:70vh;overflow-y:auto}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:600;color:var(--text);font-size:.9rem}.form-group input,.form-group select{width:100%;padding:12px 16px;border:1px solid var(--border);border-radius:8px;font-size:1rem;box-sizing:border-box;background:var(--surface);color:var(--text)}.form-group input:focus,.form-group select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 12%,transparent)}.register-btn{width:100%;background:var(--primary);color:var(--text-inverse);border:none;padding:14px 20px;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:background .2s ease,box-shadow .2s ease,transform .2s ease;margin-top:8px}.register-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px color-mix(in srgb,var(--primary) 28%,transparent)}.register-btn:active:not(:disabled){transform:translateY(0)}.register-btn:disabled{opacity:.7;cursor:not-allowed}.login-link{background:none;border:2px solid var(--primary);color:var(--primary);padding:10px 20px;border-radius:8px;font-weight:600;cursor:pointer;transition:background .2s ease,color .2s ease,transform .2s ease;font-size:.9rem}.login-link:hover{background:var(--primary);color:var(--text-inverse);transform:translateY(-1px)}@media (max-width: 768px){.register-modal{width:95%;max-width:none;margin:10px}.form-row{grid-template-columns:1fr;gap:0}.register-form{padding:20px;max-height:75vh}}@media (max-width: 480px){.register-form{padding:16px}.form-group input,.form-group select{padding:10px 12px;font-size:.9rem}.register-btn{padding:12px 16px;font-size:.9rem}}.register-form::-webkit-scrollbar{width:6px}.register-form::-webkit-scrollbar-track{background:var(--surface-2);border-radius:3px}.register-form::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--border) 80%,transparent);border-radius:3px}.register-form::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--text-secondary) 50%,transparent)}.app-header{width:100%;background:var(--surface);color:var(--text);position:sticky;top:0;z-index:1000;border-bottom:1px solid var(--border-strong);-webkit-backdrop-filter:saturate(1.1) blur(6px);backdrop-filter:saturate(1.1) blur(6px)}.header-content{max-width:1200px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;justify-content:space-between;gap:20px}.mobile-menu-btn{display:none;width:42px;height:36px;border-radius:8px;border:1px solid var(--border-strong);background:var(--surface);align-items:center;justify-content:center;gap:4px;padding:0 8px;cursor:pointer}.mobile-menu-btn .bar{display:block;width:100%;height:2px;background:var(--text)}.logo{font-size:1.3rem;font-weight:700;color:var(--text);text-decoration:none;display:flex;align-items:center;gap:8px;transition:opacity .2s ease}.logo:hover{opacity:.85}.logo img{height:32px;width:auto;display:block}.main-nav{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;padding:8px 12px;border-radius:999px;background:linear-gradient(135deg,var(--surface-2) 0%,var(--surface) 100%);border:1px solid var(--border-strong);box-shadow:var(--shadow-sm);-webkit-backdrop-filter:saturate(1.2) blur(10px);backdrop-filter:saturate(1.2) blur(10px)}.main-nav a{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;color:var(--text);text-decoration:none;padding:10px 18px;border-radius:999px;font-weight:600;background:var(--surface);border:1px solid var(--border-strong);box-shadow:var(--shadow-sm);transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,color .2s ease}.main-nav a:hover{transform:translateY(-3px);background-color:var(--surface-hover);box-shadow:var(--shadow)}.main-nav a:active{transform:translateY(-1px)}.main-nav a.active{background:var(--surface-brand);color:var(--text);box-shadow:0 10px 25px color-mix(in srgb,var(--primary) 22%,transparent);border:1px solid var(--border-strong)}.main-nav a[aria-selected=true]{background:var(--surface-brand);color:var(--text);box-shadow:0 10px 25px color-mix(in srgb,var(--primary) 22%,transparent);border:1px solid var(--primary)}.main-nav a.active:hover,.main-nav a[aria-selected=true]:hover{background:var(--surface-brand);color:var(--text)}.main-nav .nav-item.disabled,.drawer-nav .nav-item.disabled{color:var(--text-muted);opacity:.5;cursor:not-allowed;pointer-events:none;-webkit-user-select:none;user-select:none}.main-nav .nav-item.disabled{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;border-radius:999px;font-weight:600;background:var(--surface);border:1px solid var(--border-strong);box-shadow:var(--shadow-sm)}.drawer-nav .nav-item.disabled{padding:12px 10px;border-radius:8px;border:1px solid var(--border-strong);background:var(--surface-2)}.main-nav a:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 35%,transparent);outline-offset:2px}:root[data-theme=dark] .main-nav{box-shadow:var(--shadow-md)}:root[data-theme=dark] .main-nav a{border-color:var(--border);box-shadow:0 6px 16px #0006}:root[data-theme=dark] .main-nav a.active{box-shadow:0 12px 30px color-mix(in srgb,var(--primary) 35%,transparent)}.auth-section{display:flex;align-items:center;gap:12px}.login-trigger{color:var(--text);font-weight:600;padding:10px 18px;background:var(--surface);border-radius:999px;border:1px solid var(--border-strong);cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease;box-shadow:var(--shadow-sm)}.login-trigger:hover{background:var(--surface-hover);transform:translateY(-2px);box-shadow:var(--shadow)}.login-trigger:active{transform:translateY(0)}.user-dropdown{position:relative;display:inline-block}.user-profile-btn{color:var(--text);background:var(--surface);border:1px solid var(--border-strong);padding:10px 18px;border-radius:999px;font-weight:600;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease;display:flex;align-items:center;gap:8px;box-shadow:var(--shadow-sm)}.user-profile-btn:hover{background:var(--surface-hover);transform:translateY(-2px);box-shadow:var(--shadow)}.dropdown-menu{position:absolute;top:100%;right:0;background:var(--surface);border-radius:12px;box-shadow:0 8px 25px #0f172a1f;min-width:180px;z-index:1000;margin-top:8px;overflow:hidden;border:1px solid var(--border-strong)}.dropdown-item{display:block;width:100%;padding:12px 16px;color:var(--text);text-decoration:none;background:none;border:none;text-align:left;font-size:.9rem;font-weight:500;cursor:pointer;transition:background-color .2s ease}.dropdown-item:hover{background-color:var(--surface-2)}.dropdown-item.logout-btn{color:var(--danger);border-top:1px solid var(--border)}.dropdown-item.logout-btn:hover{background-color:color-mix(in srgb,var(--danger) 12%,var(--surface))}@media (max-width: 768px){.header-content{flex-direction:row;align-items:center;gap:12px;padding:12px 16px}.mobile-menu-btn{display:inline-flex;order:-1;flex-direction:column}.main-nav{display:none}.logo{order:0;margin:0 auto;text-align:center}.auth-section{order:1}}@media (max-width: 480px){.main-nav a{flex:1 1 100%;min-width:0;text-align:center;padding:9px 12px;font-size:.9rem}}:root[data-theme=dark] .login-trigger,:root[data-theme=dark] .user-profile-btn{border-color:var(--border);box-shadow:0 6px 18px #00000073}.backdrop{position:fixed;inset:0;background:#0006;z-index:999}.mobile-drawer{position:fixed;top:0;left:0;height:100vh;width:80%;max-width:320px;background:var(--surface);border-right:1px solid var(--border-strong);transform:translate(-110%);transition:transform .25s ease;z-index:1000;padding:16px;box-shadow:var(--shadow-md)}.mobile-drawer.open{transform:translate(0)}.drawer-close{border:none;background:transparent;color:var(--text);font-size:1.25rem;cursor:pointer}.drawer-nav{display:flex;flex-direction:column;gap:10px;margin-top:12px}.drawer-nav a{padding:12px 10px;border-radius:8px;text-decoration:none;color:var(--text);border:1px solid var(--border-strong);background:var(--surface-2)}.site-footer{background:var(--surface);border-top:1px solid var(--border-strong);margin-bottom:0;width:100%;flex-shrink:0}.footer-inner{max-width:1200px;margin:0 auto;padding:16px 20px;display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--muted);font-size:.95rem}.footer-links{display:flex;gap:12px}.footer-links a{color:var(--muted);text-decoration:none;transition:color .2s}.footer-links a:hover{color:var(--text)}@media (max-width: 640px){.footer-inner{flex-direction:column;text-align:center;gap:6px}}.token-usage-bar{background:var(--surface-brand);border:1px solid #dee2e6;border-radius:12px;box-shadow:0 2px 4px #0000000d;transition:all .3s ease;width:80%;display:flex;flex-direction:column;align-content:center;justify-content:center;margin:12px auto;padding:8px}.token-usage-bar.loading{background:linear-gradient(90deg,#f8f9fa 25%,#e9ecef,#f8f9fa 75%);background-size:200% 100%;animation:loading-shimmer 1.5s infinite}@keyframes loading-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.token-usage-bar.error{background:#f8d7da;border-color:#f5c6cb}.token-usage-bar.exhausted{background:linear-gradient(135deg,#fff3cd,#f8d7da);border-color:#f5c6cb}.upgrade-prompt{display:flex;justify-content:space-between;align-items:center;gap:12px}.upgrade-prompt span{color:#856404;font-weight:600;font-size:14px}.btn-sm{padding:6px 12px;font-size:12px;border-radius:6px}.token-usage-bar.free-user{background:var(--surface-brand);border-color:#b8d4f1;width:80%;display:flex;flex-direction:column;align-content:center;justify-content:center;margin:12px auto;padding:4px}.usage-item{display:flex;flex-direction:row;align-items:center;justify-content:space-around;margin:8px 0}.usage-label{font-size:13px;font-weight:500;color:var(--text)}.usage-count{font-size:14px;font-weight:600;color:var(--text)}.usage-progress{width:60%;height:8px;background:#e9ecef;border-radius:4px;overflow:hidden;position:relative}.progress-fill{height:100%;transition:width .5s ease;border-radius:4px}.progress-fill.free{background:linear-gradient(90deg,#28a745,#20c997)}.progress-fill.free.warning{background:linear-gradient(90deg,#ffc107,#fd7e14);animation:pulse-warning 2s infinite}.progress-fill.free.danger{background:linear-gradient(90deg,#fd7e14,#dc3545);animation:pulse-warning 2s infinite}.usage-percentage{font-size:12px;font-weight:600;color:#6c757d}.budget-usage-indicator{display:flex;flex-direction:column;gap:8px}.budget-header{display:flex;justify-content:space-between;align-items:center}.budget-label{font-size:14px;font-weight:500;color:var(--text-primary)}.budget-amount{font-size:15px;font-weight:600;color:#212529;font-family:Courier New,monospace}.progress-bar{width:100%;height:10px;background:#e9ecef;border-radius:5px;overflow:hidden;position:relative}.progress-fill.budget{background:linear-gradient(90deg,#28a745,#ffc107);transition:all .3s ease}.progress-fill.budget.warning{background:linear-gradient(90deg,#ffc107,#fd7e14)}.progress-fill.budget.danger{background:linear-gradient(90deg,#fd7e14,#dc3545);animation:pulse-warning 2s infinite}@keyframes pulse-warning{0%,to{opacity:1}50%{opacity:.7}}.percentage{color:#6c757d;font-weight:500}.remaining{color:#495057;font-weight:600;font-family:Courier New,monospace}@media (max-width: 768px){.token-usage-bar{padding:12px;margin:12px 0}.free-usage-indicator{gap:12px}.usage-item{padding:10px}.upgrade-prompt{flex-direction:column;text-align:center}.budget-header{flex-direction:column;gap:4px;align-items:flex-start}}@media (prefers-color-scheme: dark){.token-usage-bar{background:var(--surface-brand);border-color:var(--border-strong);color:#e2e8f0}.budget-label,.percentage{color:var(--text)}.budget-amount,.remaining{color:var(--text);font-family:Courier New,monospace}.usage-progress,.progress-bar{background:#4a5568}.percentage,.remaining{color:#a0aec0}}.signup-prompt-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .3s ease}.signup-prompt-modal{background:#fff;border-radius:16px;padding:32px;max-width:420px;width:90%;max-height:90vh;overflow-y:auto;position:relative;box-shadow:0 20px 40px #00000026;animation:slideUp .3s ease}.signup-prompt-close{position:absolute;top:16px;right:16px;background:#f8f9fa;border:none;width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:18px;color:#6c757d;transition:all .2s ease}.signup-prompt-close:hover{background:#e9ecef;color:#495057}.signup-prompt-content{text-align:center}.signup-prompt-icon{font-size:48px;margin-bottom:16px;animation:bounce 2s infinite}.signup-prompt-title{font-size:24px;font-weight:700;color:#212529;margin:0 0 12px}.signup-prompt-message{font-size:16px;color:#6c757d;margin:0 0 24px;line-height:1.5}.signup-prompt-form{text-align:left}.form-group{margin-bottom:20px}.form-group label{display:block;font-size:14px;font-weight:600;color:#495057;margin-bottom:8px}.form-group input{width:100%;padding:12px 16px;border:2px solid #e9ecef;border-radius:8px;font-size:16px;transition:all .2s ease;box-sizing:border-box}.form-group input:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px #007bff1a}.signup-prompt-error{background:#f8d7da;color:#721c24;padding:12px;border-radius:6px;font-size:14px;margin-bottom:20px;border:1px solid #f5c6cb}.signup-prompt-actions{display:flex;gap:12px;margin-bottom:20px}.btn{flex:1;padding:12px 20px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s ease}.btn-primary{background:linear-gradient(135deg,#007bff,#0056b3);color:#fff}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#0056b3,#004085);transform:translateY(-1px)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{background:#f8f9fa;color:#495057;border:2px solid #e9ecef}.btn-secondary:hover{background:#e9ecef;transform:translateY(-1px)}.signup-prompt-terms{font-size:12px;color:#6c757d;margin:0;line-height:1.4}.signup-prompt-terms a{color:#007bff;text-decoration:none}.signup-prompt-terms a:hover{text-decoration:underline}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-10px)}60%{transform:translateY(-5px)}}@media (max-width: 480px){.signup-prompt-modal{padding:24px;margin:16px}.signup-prompt-actions{flex-direction:column}.btn{width:100%}}[data-theme=dark] .signup-prompt-modal{background:var(--surface);color:var(--text);border:1px solid var(--border)}[data-theme=dark] .signup-prompt-close{background:var(--surface-2);color:var(--muted)}[data-theme=dark] .signup-prompt-close:hover{background:var(--surface-hover);color:var(--text)}[data-theme=dark] .signup-prompt-title{color:var(--text)}[data-theme=dark] .signup-prompt-message,[data-theme=dark] .form-group label{color:var(--text-secondary)}[data-theme=dark] .form-group input{background:var(--surface);border-color:var(--border);color:var(--text)}[data-theme=dark] .form-group input:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.1)}[data-theme=dark] .btn-secondary{background:var(--surface-2);color:var(--text);border-color:var(--border)}[data-theme=dark] .btn-secondary:hover{background:var(--surface-hover)}[data-theme=dark] .signup-prompt-terms{color:var(--text-secondary)}[data-theme=dark] .signup-prompt-terms a{color:var(--primary)}.floating-actions{position:relative;z-index:1000;width:auto;display:flex;align-items:flex-end;gap:10px;margin-left:auto}.floating-actions .fab{pointer-events:auto}.fab{width:60px;height:60px;border-radius:24px;border:1px solid var(--border);cursor:pointer;color:var(--text);font-size:22px;display:inline-flex;align-items:center;justify-content:center;gap:0;line-height:1;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:transform .2s ease,box-shadow .2s ease,background .2s ease,color .2s ease}.fab:hover{transform:translateY(-2px);box-shadow:0 20px 42px #0f172a2e}.fab:active{transform:translateY(0);box-shadow:0 10px 24px #0f172a24}.fab.small{width:50px;height:50px;font-size:18px}.fab.small.idea{background:linear-gradient(150deg,color-mix(in srgb,var(--warning) 85%,var(--surface)),color-mix(in srgb,var(--warning) 45%,transparent));color:var(--text);border:1px solid color-mix(in srgb,var(--warning) 40%,transparent);box-shadow:var(--shadow-sm)}.fab.small.report{background:linear-gradient(150deg,color-mix(in srgb,var(--danger) 80%,var(--surface)),color-mix(in srgb,var(--danger) 40%,transparent));color:var(--text);border:1px solid color-mix(in srgb,var(--danger) 42%,transparent);box-shadow:var(--shadow-sm)}.fab.primary{color:var(--text-inverse);border:none;box-shadow:var(--shadow);background:var(--btn-primary-bg)}button.ghost{background:color-mix(in srgb,var(--primary) 12%,transparent);border:none;border-radius:999px;padding:.45rem 1.05rem;font-size:.85rem;font-weight:600;color:var(--primary);cursor:pointer;transition:background .2s ease,color .2s ease,box-shadow .2s ease}button.ghost:hover:not(:disabled){background:color-mix(in srgb,var(--primary) 16%,transparent);box-shadow:0 10px 22px color-mix(in srgb,var(--primary) 18%,transparent)}button.ghost:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}.bottom-sticky-bar .chat-window,.bottom-sticky-bar .feedback-window{position:absolute;right:24px;bottom:88px;max-height:min(78dvh,720px);background:var(--surface);border:1px solid var(--border);border-radius:14px;box-shadow:0 16px 34px #0f172a38;overflow:hidden;display:flex;flex-direction:column;z-index:1000;pointer-events:auto}.chat-window.assistant{background:color-mix(in srgb,var(--surface) 96%,transparent);border:3px solid var(--border-strong);width:min(720px,60vw)}.assistant-layout{display:flex;flex-direction:row;gap:0;min-height:480px}.assistant-sidebar{display:flex;flex-direction:column;gap:1rem;width:260px;padding:1.2rem;background:var(--surface-brand);border-right:1px solid var(--border);color:var(--text);overflow-y:auto;box-shadow:inset -1px 0 0 var(--border)}.assistant-sidebar.visible,.assistant-sidebar.hidden-mobile{display:flex}.assistant-thread-list{display:flex;flex-direction:column;gap:.8rem}.assistant-thread-list-header{display:flex;justify-content:space-between;align-items:center;gap:.6rem}.assistant-thread-list-header h5{margin:0;font-size:1rem;color:var(--text)}.assistant-thread-list ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.6rem}.assistant-thread-list li button{width:100%;text-align:left;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:.8rem .9rem;display:flex;flex-direction:column;gap:.35rem;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;font:inherit;color:inherit}.assistant-thread-list li button:hover{border-color:var(--primary);box-shadow:var(--shadow);background:var(--surface-hover)}.assistant-thread-list li.active button{border-color:var(--primary);background:color-mix(in srgb,var(--primary) 12%,var(--surface));box-shadow:var(--shadow-md)}.assistant-thread-list li.active{display:flex;flex-direction:column;background:var(--surface-glass);padding:.4rem;border-radius:12px;border:1px solid var(--border-strong);gap:.4rem}.assistant-thread-title{font-weight:600;color:var(--text)}.assistant-thread-recap{font-size:.85rem;color:var(--text-secondary)}.assistant-thread-meta{font-size:.75rem;color:var(--text-secondary)}.assistant-thread-actions{margin-top:.4rem;display:flex;flex-wrap:wrap;gap:.35rem}.assistant-thread-actions .ghost{padding:.28rem .7rem;font-size:.72rem}.assistant-empty-list{font-size:.85rem;color:var(--text-secondary);background:var(--surface-2);border:1px dashed var(--border);border-radius:12px;padding:1rem}.assistant-main{flex:1;display:flex;flex-direction:column;gap:1rem;padding:1.2rem;background:var(--surface);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);overflow-x:hidden;overflow-y:auto}.assistant-session{display:flex;flex-direction:column;gap:1rem;height:100%}.assistant-session-header{display:flex;flex-direction:column;gap:.8rem}.assistant-session-header>button{align-self:flex-start}.assistant-session-meta h5{margin:0;font-size:1.15rem;color:var(--text)}.assistant-session-meta p{margin:.2rem 0 0;font-size:.9rem;color:var(--text-secondary)}.assistant-messages{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:.85rem;padding-right:.4rem}.assistant-placeholder{font-size:.9rem;color:var(--text-secondary)}.assistant-entry{background:var(--surface);border-radius:14px;border:1px solid var(--border);padding:.85rem 1rem;display:flex;flex-direction:column;gap:.45rem;box-shadow:var(--shadow-sm)}.assistant-entry.user{border-left:4px solid var(--primary)}.assistant-entry.assistant{border-left:4px solid var(--success)}.assistant-entry.error{border-left:4px solid var(--danger);background:color-mix(in srgb,var(--danger) 8%,var(--surface))}.assistant-meta{font-size:.78rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.08em;display:flex;align-items:center;gap:.6rem}.assistant-meta .ghost{padding:.2rem .6rem;font-size:.7rem;letter-spacing:normal;text-transform:none}.assistant-text{font-size:.95rem;color:var(--text);white-space:pre-wrap;word-break:break-word;overflow-wrap:anywhere}.assistant-sources{font-size:.85rem;color:var(--text-secondary)}.assistant-sources ul{margin:.4rem 0 0;padding-left:1.1rem;display:flex;flex-direction:column;gap:.35rem}.assistant-sources li{display:flex;flex-direction:column;gap:.18rem}.assistant-sources a{color:var(--primary);text-decoration:underline;font-size:.8rem;width:fit-content}.assistant-error{color:var(--danger);font-size:.9rem}.assistant-form{display:flex;flex-direction:column;gap:.6rem}.assistant-form textarea{width:100%;border-radius:12px;border:1px solid var(--border);padding:.6rem .8rem;min-height:80px;resize:vertical;font-size:.95rem;background:var(--surface);color:var(--text)}.assistant-actions{display:flex;justify-content:flex-end;gap:.5rem}.assistant-actions button{border:none;border-radius:999px;padding:.45rem 1.1rem;font-size:.9rem;font-weight:600;cursor:pointer}.assistant-actions button.ghost{background:color-mix(in srgb,var(--primary) 12%,transparent);color:var(--primary)}.assistant-actions button:not(.ghost){background:var(--btn-primary-bg);color:var(--text-inverse);box-shadow:var(--shadow)}.assistant-suggestions{display:flex;flex-wrap:wrap;gap:.4rem;max-width:100%}.assistant-suggestions button{border:none;border-radius:16px;padding:.35rem .7rem;font-size:.85rem;cursor:pointer;background:color-mix(in srgb,var(--primary) 18%,transparent);color:var(--primary)}.chat-header{background:var(--primary);color:var(--text-inverse);padding:14px 18px;font-weight:600;letter-spacing:.2px}.chat-header.assistant{background:linear-gradient(135deg,var(--primary-hover),var(--primary));color:var(--text-inverse)}.chat-header.idea{background:linear-gradient(135deg,color-mix(in srgb,var(--warning) 85%,var(--surface)),var(--warning));color:var(--text)}.chat-header.report{background:linear-gradient(135deg,color-mix(in srgb,var(--danger) 85%,var(--surface)),var(--danger));color:var(--text-inverse)}.message.assistant .meta{font-size:12px;color:var(--text-secondary);margin-bottom:6px;text-transform:lowercase;letter-spacing:.4px}.feedback-window{background:linear-gradient(150deg,var(--surface),var(--surface-2));width:40dvh}.feedback-window.idea{border-left:4px solid var(--warning);background:color-mix(in srgb,var(--warning) 18%,var(--surface))}.feedback-window.report{border-left:4px solid var(--danger);background:color-mix(in srgb,var(--danger) 16%,var(--surface))}.feedback-form{padding:16px;display:flex;flex-direction:column;gap:14px}.field .label{font-size:12px;color:var(--text-secondary);margin-bottom:6px;text-transform:uppercase;letter-spacing:.6px}.field textarea{width:100%;border:1px solid var(--border-strong);border-radius:12px;padding:14px 16px;font:inherit;outline:none;resize:vertical;min-height:150px;background:var(--surface);transition:border-color .16s ease,box-shadow .16s ease,background .2s ease}.field textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px color-mix(in srgb,var(--primary) 18%,transparent);background:var(--surface)}@media (max-width: 960px){.assistant-layout{flex-direction:column;min-height:0}.bottom-sticky-bar .chat-window.assistant{width:min(520px,80vw)}.assistant-sidebar{width:100%;border-right:none;border-bottom:1px solid rgba(148,163,184,.25);box-shadow:0 10px 28px #0f172a1f;border-radius:18px 18px 0 0}.assistant-sidebar.hidden-mobile{display:none}.assistant-thread-list ul{max-height:280px;overflow-y:auto}.assistant-main{width:100%}}@media (max-width: 600px){.bottom-sticky-bar .chat-window,.bottom-sticky-bar .feedback-window{right:16px;width:min(420px,95vw);bottom:88px;max-height:calc(100dvh - 120px)}}.theme-toggle{position:static;color:var(--text);font-weight:600;padding:10px 14px;background:var(--surface);border-radius:999px;border:1px solid var(--border-strong);cursor:pointer;box-shadow:var(--shadow-sm);display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;max-width:max-content;width:auto;white-space:nowrap;margin-left:0}.theme-toggle:hover{background:var(--surface-hover);transform:translateY(-1px);box-shadow:var(--shadow)}.scroll-top-btn{position:relative;right:auto;bottom:auto;width:42px;height:42px;border-radius:999px;border:1px solid var(--border-strong);background:var(--surface);color:var(--primary);box-shadow:var(--shadow-sm);cursor:pointer;opacity:0;transform:translateY(8px);pointer-events:none;transition:opacity .25s ease,transform .25s ease;z-index:900;font-size:1.2rem;display:flex;align-items:center;justify-content:center}.scroll-top-btn.visible{opacity:1;transform:translateY(0);pointer-events:auto}.scroll-top-btn:focus-visible{outline:3px solid color-mix(in srgb,var(--primary) 40%,transparent);outline-offset:3px}.scroll-top-btn:hover{background:var(--surface-hover);box-shadow:var(--shadow)}@media (max-width: 640px){.scroll-top-btn{width:38px;height:38px}}.development-notice-banner{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#78350f;z-index:9999;box-shadow:0 -4px 20px #00000026;border-top:2px solid #d97706;animation:slideUp .4s ease-out}.development-notice-content{display:flex;align-items:center;padding:16px 20px;gap:16px;max-width:1400px;margin:0 auto}.development-notice-icon{font-size:1.5rem;flex-shrink:0;animation:bounce 2s infinite}@keyframes bounce{0%,20%,50%,80%,to{transform:translateY(0)}40%{transform:translateY(-5px)}60%{transform:translateY(-3px)}}.development-notice-text{flex:1;display:flex;flex-direction:column;gap:4px;line-height:1.4}.development-notice-text strong{font-size:.95rem;font-weight:600;color:#451a03}.development-notice-text span{font-size:.85rem;opacity:.9}.development-notice-close{background:#fff3;border:1px solid rgba(255,255,255,.3);color:#451a03;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;font-weight:700;transition:all .2s ease;flex-shrink:0}.development-notice-close:hover{background:#ffffff4d;transform:scale(1.1)}@media (prefers-color-scheme: dark){.development-notice-banner{background:linear-gradient(135deg,#92400e,#78350f);color:#fef3c7;border-top-color:#451a03}.development-notice-text strong{color:#fef3c7}.development-notice-close{background:#0003;border-color:#0000004d;color:#fef3c7}.development-notice-close:hover{background:#0000004d}}@media (max-width: 768px){.development-notice-content{padding:12px 16px;gap:12px}.development-notice-icon{font-size:1.2rem}.development-notice-text strong{font-size:.875rem}.development-notice-text span{font-size:.75rem}.development-notice-close{width:28px;height:28px;font-size:1rem}}@media (max-width: 480px){.development-notice-content{flex-direction:column;text-align:center;gap:8px}.development-notice-text{align-items:center}.development-notice-close{position:absolute;top:8px;right:8px}}.cookie-consent-banner{position:fixed;bottom:0;left:0;right:0;background:linear-gradient(135deg,#1e40af,#1e3a8a);color:#e0e7ff;z-index:9998;box-shadow:0 -4px 20px #00000026;border-top:2px solid #1d4ed8;animation:slideUp .4s ease-out}@keyframes slideUp{0%{transform:translateY(100%);opacity:0}to{transform:translateY(0);opacity:1}}.cookie-consent-content{display:flex;align-items:flex-start;padding:16px 20px;gap:16px;max-width:1400px;margin:0 auto}.cookie-consent-icon{font-size:1.5rem;flex-shrink:0;margin-top:2px;animation:rotate 3s linear infinite}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.cookie-consent-text{flex:1;display:flex;flex-direction:column;gap:6px;line-height:1.4}.cookie-consent-text strong{font-size:.95rem;font-weight:600;color:#fff}.cookie-consent-text span{font-size:.85rem;opacity:.9}.cookie-consent-details{margin-top:12px;padding:12px;background:#ffffff1a;border-radius:8px;border:1px solid rgba(255,255,255,.2);animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.cookie-category{margin-bottom:16px}.cookie-category:last-child{margin-bottom:0}.cookie-category-label{display:flex;align-items:flex-start;gap:12px;cursor:pointer;padding:8px;border-radius:6px;transition:background-color .2s ease}.cookie-category-label:hover{background:#ffffff0d}.cookie-checkbox{width:18px;height:18px;flex-shrink:0;margin-top:2px;cursor:pointer;accent-color:#3b82f6}.cookie-checkbox:disabled{opacity:.6;cursor:not-allowed;accent-color:#6b7280}.cookie-category-content{flex:1}.cookie-category-content strong{font-size:.8rem;color:#fff;display:block;margin-bottom:4px;font-weight:600}.cookie-category-content p{font-size:.75rem;opacity:.8;margin:0;line-height:1.4}.cookie-customize-actions{margin-top:16px;padding-top:12px;border-top:1px solid rgba(255,255,255,.2);display:flex;justify-content:center}.cookie-consent-actions{display:flex;flex-direction:column;gap:8px;flex-shrink:0;align-items:flex-end}.cookie-consent-btn{padding:8px 16px;border:none;border-radius:6px;font-size:.8rem;font-weight:500;cursor:pointer;transition:all .2s ease;white-space:nowrap;min-height:36px}.cookie-consent-btn.primary{background:#3b82f6;color:#fff;border:1px solid #2563eb}.cookie-consent-btn.primary:hover{background:#2563eb;transform:translateY(-1px);box-shadow:0 4px 12px #3b82f64d}.cookie-consent-btn.secondary{background:#ffffff1a;color:#e0e7ff;border:1px solid rgba(255,255,255,.2)}.cookie-consent-btn.secondary:hover{background:#fff3;transform:translateY(-1px)}.cookie-consent-close{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#e0e7ff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.2rem;font-weight:700;transition:all .2s ease;flex-shrink:0;margin-left:8px}.cookie-consent-close:hover{background:#fff3;transform:scale(1.1)}@media (prefers-color-scheme: dark){.cookie-consent-banner{background:linear-gradient(135deg,#1e293b,#0f172a);color:#e2e8f0;border-top-color:#334155}.cookie-consent-text strong{color:#f1f5f9}.cookie-consent-details{background:#0003;border-color:#ffffff1a}.cookie-category-label:hover{background:#ffffff0d}.cookie-consent-btn.secondary{background:#ffffff0d;border-color:#ffffff1a}.cookie-consent-btn.secondary:hover{background:#ffffff1a}.cookie-consent-close{background:#ffffff0d;border-color:#ffffff1a}.cookie-consent-close:hover{background:#ffffff1a}}@media (max-width: 768px){.cookie-consent-content{padding:12px 16px;gap:12px}.cookie-consent-icon{font-size:1.2rem}.cookie-consent-text strong{font-size:.875rem}.cookie-consent-text span{font-size:.75rem}.cookie-consent-actions{flex-direction:row;flex-wrap:wrap;gap:6px;align-items:center}.cookie-consent-btn{padding:6px 12px;font-size:.75rem;min-height:32px}.cookie-consent-close{width:28px;height:28px;font-size:1rem;margin-left:0}}@media (max-width: 480px){.cookie-consent-content{flex-direction:column;gap:12px}.cookie-consent-text{text-align:center;align-items:center}.cookie-consent-actions{width:100%;justify-content:center;flex-direction:column;gap:8px}.cookie-consent-btn{width:100%;max-width:200px}.cookie-consent-close{position:absolute;top:8px;right:8px}.cookie-category-label{padding:6px}.cookie-checkbox{width:16px;height:16px}}.username-modal-overlay{position:fixed;inset:0;background:#020617bf;display:flex;align-items:center;justify-content:center;z-index:3000;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:20px}.username-modal-content{background:var(--surface);border-radius:var(--radius-lg);border:1px solid var(--border);box-shadow:0 25px 50px -12px #00000080;width:100%;max-width:450px;padding:32px;animation:usernameModalIn .3s ease-out}@keyframes usernameModalIn{0%{opacity:0;transform:translateY(20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.username-modal-header{text-align:center;margin-bottom:24px}.username-modal-header h2{margin:0 0 12px;font-size:1.75rem;font-weight:800;background:linear-gradient(135deg,var(--primary),#a78bfa);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.username-modal-header p{color:var(--muted);line-height:1.5;margin:0}.username-form .form-group{margin-bottom:24px}.username-form label{display:block;margin-bottom:8px;font-weight:600;font-size:.95rem;color:var(--text)}.input-wrapper{position:relative;display:flex;flex-direction:column}.username-form input{width:100%;padding:14px 16px;background:var(--surface-2);border:2px solid var(--border);border-radius:12px;font-size:1.1rem;color:var(--text);transition:all .2s ease;box-sizing:border-box}.username-form input:focus{outline:none;border-color:var(--primary);background:var(--surface);box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 15%,transparent)}.availability-hint{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-size:.85rem;font-weight:600}.availability-hint.success{color:#10b981}.availability-hint.error{color:#ef4444}.field-hint{margin:8px 0 0;font-size:.8rem;color:var(--muted)}.submit-username-btn{width:100%;padding:14px;background:var(--primary);color:#fff;border:none;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .2s ease}.submit-username-btn:hover:not(:disabled){background:color-mix(in srgb,var(--primary) 85%,black);transform:translateY(-2px);box-shadow:0 10px 20px -5px color-mix(in srgb,var(--primary) 30%,transparent)}.submit-username-btn:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.5)}
