:root{--btn3d-shadow-offset:4px;--btn3d-shadow-primary:0 var(--btn3d-shadow-offset) 0 #8455ef;--btn3d-shadow-primary-active:0 1px 0 #8455ef;--btn3d-shadow-success:0 var(--btn3d-shadow-offset) 0 #16a34a;--btn3d-shadow-success-active:0 1px 0 #16a34a;--btn3d-shadow-danger:0 var(--btn3d-shadow-offset) 0 #dc2626;--btn3d-shadow-danger-active:0 1px 0 #dc2626;--btn3d-shadow-neutral:0 var(--btn3d-shadow-offset) 0 #1a1a24;--btn3d-shadow-neutral-active:0 1px 0 #1a1a24;--ease-spring:cubic-bezier(0.175,0.885,0.32,1.275);--ease-spring-gentle:cubic-bezier(0.25,0.46,0.45,0.94);--ease-spring-snappy:cubic-bezier(0.68,-0.55,0.265,1.55);--xp-bar-bg:#1a1a24;--xp-bar-fill:linear-gradient(90deg,#ba9eff,#ae8dff);--xp-text:#ba9eff;--level-badge-bg:linear-gradient(135deg,#ba9eff,#8455ef);--level-badge-text:#0a0a0f;--combo-1x:var(--text-secondary);--combo-2x:#f59e0b;--combo-3x:#f97316;--combo-4x:#ef4444;--heart-full:#ef4444;--heart-empty:#374151;--heart-refill:#22c55e;--rarity-common:#6b7280;--rarity-uncommon:#22c55e;--rarity-rare:#3b82f6;--rarity-epic:#a855f7;--rarity-legendary:#f59e0b;--skill-path-bg:#1a1a24;--skill-path-complete:var(--color-primary);--skill-path-locked:#374151;--skill-node-size:56px;--skill-node-gap:32px;--frosted-bg:rgba(18,18,26,.8);--frosted-border:hsla(0,0%,100%,.08);--confetti-duration:2s;--celebration-overlay-bg:rgba(0,0,0,.7);--creature-aura-ic:rgba(96,165,250,.3);--creature-aura-ec:rgba(244,114,182,.3);--creature-aura-sc:rgba(52,211,153,.3)}@keyframes nodeGlow{0%,to{box-shadow:0 3px 0 var(--primary-shadow,#4a42cc),0 0 0 0 rgba(186,158,255,.25)}50%{box-shadow:0 3px 0 var(--primary-shadow,#4a42cc),0 0 0 12px rgba(186,158,255,0)}}.material-symbols-outlined{font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 24;-webkit-user-select:none;-moz-user-select:none;user-select:none}:root{--color-primary:#ba9eff;--color-primary-hover:#c5afff;--color-primary-dark:#8455ef;--color-primary-light:#ae8dff;--color-primary-glow:rgba(186,158,255,.3);--ease-bounce:cubic-bezier(0.34,1.56,0.64,1);--color-secondary:#53ddfc;--color-secondary-hover:#65e1ff;--color-secondary-light:#00687a;--color-secondary-dim:#40ceed;--color-tertiary:#ff86c3;--color-tertiary-container:#f673b7;--color-tertiary-dim:#f271b5;--surface:#060e20;--surface-dim:#060e20;--surface-container-lowest:#000;--surface-container-low:#091328;--surface-container:#0f1930;--surface-container-high:#141f38;--surface-container-highest:#192540;--surface-variant:#192540;--surface-bright:#1f2b49;--surface-tint:#ba9eff;--bg-primary:#060e20;--bg-secondary:#091328;--bg-tertiary:#0f1930;--bg-elevated:#141f38;--bg-card:#0f1930;--bg-overlay:rgba(0,0,0,.6);--text-primary:#dee5ff;--text-secondary:#a3aac4;--text-tertiary:#6d758c;--text-muted:#6d758c;--border-color:rgba(64,72,93,.35);--border-subtle:rgba(64,72,93,.2);--border-light:rgba(64,72,93,.12);--border-focus:var(--color-primary);--on-primary:#39008c;--on-primary-container:#2b006e;--on-secondary:#004b58;--on-secondary-container:#ecfaff;--on-tertiary:#5f003e;--on-tertiary-container:#4a002f;--on-surface:#dee5ff;--on-surface-variant:#a3aac4;--on-background:#dee5ff;--outline:#6d758c;--outline-variant:#40485d;--inverse-surface:#faf8ff;--inverse-on-surface:#4d556b;--inverse-primary:#6e3bd7;--caliber-ic:#60a5fa;--caliber-ec:#f472b6;--caliber-sc:#34d399;--caliber-ic-bg:rgba(96,165,250,.15);--caliber-ec-bg:rgba(244,114,182,.15);--caliber-sc-bg:rgba(52,211,153,.15);--color-success:#22c55e;--color-success-dark:#16a34a;--color-success-bg:rgba(34,197,94,.15);--color-warning:#f59e0b;--color-warning-dark:#d97706;--color-warning-bg:rgba(245,158,11,.15);--color-error:#ff6e84;--color-error-dark:#d73357;--color-error-bg:rgba(255,110,132,.15);--color-info:#3b82f6;--color-info-bg:rgba(59,130,246,.15);--chart-self:#ba9eff;--chart-others:#53ddfc;--chart-grid:hsla(0,0%,100%,.1);--streak-gradient-start:#ff6b35;--streak-gradient-end:#f7931e;--streak-glow:rgba(247,147,30,.3);--glass-bg:rgba(9,19,40,.4);--glass-border:rgba(186,158,255,.08);--frosted-bg:rgba(6,14,32,.6);--frosted-border:transparent;--frosted-blur:20px;--font-display:"Space Grotesk",sans-serif;--font-body:"Inter",sans-serif;--font-sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--font-mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,monospace;--text-xs:10px;--text-sm:14px;--text-base:16px;--text-md:16px;--text-lg:18px;--text-xl:20px;--text-2xl:24px;--text-3xl:30px;--text-4xl:36px;--text-5xl:48px;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--leading-tight:1.1;--leading-snug:1.25;--leading-normal:1.4;--leading-relaxed:1.5;--leading-loose:1.6;--space-0:0;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--radius-sm:2px;--radius-default:2px;--radius-md:4px;--radius-lg:4px;--radius-xl:8px;--radius-2xl:8px;--radius-3xl:12px;--radius-full:12px;--radius-circle:50%;--radius-pill:9999px;--shadow-xs:0 0 10px rgba(186,158,255,.03);--shadow-sm:0 0 15px rgba(186,158,255,.05);--shadow-md:0 0 30px rgba(186,158,255,.08);--shadow-lg:0 0 30px rgba(186,158,255,.12);--shadow-xl:0 0 40px rgba(186,158,255,.15);--shadow-glow:0 0 30px var(--color-primary-glow);--transition-fast:0.15s ease;--transition-normal:0.2s ease;--transition-slow:0.3s ease;--transition-all:all 0.2s ease;--transition-colors:background-color 0.2s ease,border-color 0.2s ease,color 0.2s ease;--z-base:1;--z-dropdown:10;--z-sticky:50;--z-fixed:100;--z-modal-backdrop:900;--z-modal:1000;--z-tooltip:1100;--z-toast:1200}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-body);background:var(--bg-primary);color:var(--text-primary);font-size:var(--text-base);line-height:var(--leading-normal);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}h1,h2,h3,h4,h5,h6{font-family:var(--font-display)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-4) var(--space-6);border-radius:var(--radius-xl);font-size:var(--text-base);font-weight:var(--font-semibold);cursor:pointer;transition:var(--transition-all);border:none;text-decoration:none;font-family:inherit}.btn-primary{background:linear-gradient(90deg,var(--color-primary) 0,var(--color-primary-dark) 100%);color:var(--on-primary);box-shadow:var(--shadow-glow)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px var(--color-primary-glow)}.btn-secondary{background:rgba(83,221,252,.1);color:var(--color-secondary);border:none}.btn-secondary:hover{background:rgba(83,221,252,.15)}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{background:var(--bg-tertiary);color:var(--text-primary)}.btn-outline{background:transparent;color:var(--color-primary);border:2px solid var(--color-primary)}.btn-outline:hover{background:var(--color-primary-light)}.btn-lg{padding:var(--space-5) var(--space-8);font-size:var(--text-lg);border-radius:var(--radius-2xl)}.btn-sm{padding:var(--space-2) var(--space-4);font-size:var(--text-sm);border-radius:var(--radius-lg)}.btn-full{width:100%}.card{background:var(--bg-card);border-radius:var(--radius-2xl);padding:var(--space-6)}.card-elevated{background:var(--bg-secondary);box-shadow:var(--shadow-md);border:none}.card-glass{background:rgba(9,19,40,.4);border:none;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.input{width:100%;padding:var(--space-4) var(--space-5);background:var(--surface-container-lowest,#000);border-radius:var(--radius-xl);color:var(--text-primary);font-size:var(--text-base);font-family:inherit;transition:var(--transition-fast);border:none}.input:focus{outline:none;border-color:transparent;box-shadow:0 0 0 2px rgba(186,158,255,.3)}.input::placeholder{color:var(--text-tertiary)}.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);font-size:var(--text-xs);font-weight:var(--font-semibold)}.badge-primary{background:var(--color-primary-light);color:var(--color-primary)}.badge-ic{background:var(--caliber-ic-bg);color:var(--caliber-ic)}.badge-ec{background:var(--caliber-ec-bg);color:var(--caliber-ec)}.badge-sc{background:var(--caliber-sc-bg);color:var(--caliber-sc)}.badge-success{background:var(--color-success-bg);color:var(--color-success)}.badge-warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge-error{background:var(--color-error-bg);color:var(--color-error)}.progress-bar{height:4px;background:var(--bg-tertiary);overflow:hidden}.progress-bar,.progress-fill{border-radius:var(--radius-pill)}.progress-fill{height:100%;background:linear-gradient(90deg,var(--color-primary) 0,var(--color-primary-hover) 100%);transition:width var(--transition-slow)}.caliber-icon{width:48px;height:48px;border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:center;font-size:24px}.caliber-icon.ic{background:var(--caliber-ic-bg)}.caliber-icon.ec{background:var(--caliber-ec-bg)}.caliber-icon.sc{background:var(--caliber-sc-bg)}.caliber-tag{padding:var(--space-2) var(--space-4);border-radius:var(--radius-pill);font-size:var(--text-xs);font-weight:var(--font-semibold)}.caliber-tag.ic{background:var(--caliber-ic-bg);color:var(--caliber-ic)}.caliber-tag.ec{background:var(--caliber-ec-bg);color:var(--caliber-ec)}.caliber-tag.sc{background:var(--caliber-sc-bg);color:var(--caliber-sc)}.tab-bar{display:flex;gap:var(--space-2);padding:var(--space-1);background:var(--bg-tertiary)}.tab-bar,.tab-item{border-radius:var(--radius-pill)}.tab-item{padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-weight:var(--font-medium);cursor:pointer;transition:var(--transition-fast);border:none;background:transparent;color:var(--text-secondary)}.tab-item.active,.tab-item:hover{color:var(--text-primary)}.tab-item.active{background:var(--bg-primary);box-shadow:var(--shadow-sm)}.stat-card{background:var(--bg-card);border-radius:var(--radius-2xl);padding:var(--space-5)}.stat-value{font-size:var(--text-3xl);font-weight:var(--font-bold);color:var(--text-primary)}.stat-label{font-size:var(--text-sm);color:var(--text-secondary);margin-top:var(--space-1)}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.8}}@keyframes glow{0%,to{box-shadow:0 0 20px var(--color-primary-glow)}50%{box-shadow:0 0 40px var(--color-primary-glow),0 0 60px var(--color-primary-glow)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes spin{to{transform:rotate(1turn)}}@keyframes slideInRight{0%{opacity:0;transform:translateX(20px)}to{opacity:1;transform:translateX(0)}}@keyframes slideInUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .3s ease forwards}.animate-fade-in-up{animation:fadeInUp .6s ease forwards}.animate-pulse{animation:pulse 2s infinite}.animate-glow{animation:glow 2s infinite}.animate-float{animation:float 6s ease-in-out infinite}.animate-spin{animation:spin 1s linear infinite}.animate-slide-in-right{animation:slideInRight .3s ease forwards}.animate-slide-in-up{animation:slideInUp .3s ease forwards}.stagger-1{animation-delay:.1s}.stagger-2{animation-delay:.2s}.stagger-3{animation-delay:.3s}.stagger-4{animation-delay:.4s}.stagger-5{animation-delay:.5s}@keyframes flamePulse{0%,to{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.1);filter:brightness(1.2)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes xpCountUp{0%{transform:translateY(10px);opacity:0}50%{transform:translateY(-5px);opacity:1}to{transform:translateY(0);opacity:1}}@keyframes heartBeat{0%,to{transform:scale(1)}15%{transform:scale(1.25)}30%{transform:scale(1)}45%{transform:scale(1.15)}}@keyframes comboScale{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1)}}@keyframes levelUpGlow{0%{box-shadow:0 0 0 0 var(--color-primary-glow)}50%{box-shadow:0 0 30px 10px var(--color-primary-glow)}to{box-shadow:0 0 0 0 var(--color-primary-glow)}}@keyframes badgeUnlock{0%{transform:scale(0) rotate(-180deg);opacity:0}60%{transform:scale(1.2) rotate(10deg);opacity:1}to{transform:scale(1) rotate(0deg);opacity:1}}@keyframes progressShimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.animate-flame-pulse{animation:flamePulse 1.5s ease-in-out infinite}.animate-shimmer{background-size:200% 100%;animation:shimmer 2s linear infinite}.animate-xp-count{animation:xpCountUp .6s var(--ease-spring) forwards}.animate-heart-beat{animation:heartBeat .6s ease-in-out}.animate-combo{animation:comboScale .3s var(--ease-bounce) forwards}.animate-level-up{animation:levelUpGlow 1s ease-in-out}.animate-badge-unlock{animation:badgeUnlock .8s var(--ease-spring) forwards}[data-hoverable]:hover{background-color:var(--surface-container-high)!important;box-shadow:inset 0 0 0 1px rgba(186,158,255,.1),0 0 20px rgba(186,158,255,.08)}.btn-glow:hover{box-shadow:0 0 30px rgba(186,158,255,.4);filter:brightness(1.1)}.input-focus:focus{box-shadow:0 0 0 2px rgba(186,158,255,.3)}[data-nav-item]:hover{background-color:var(--surface-container-high)}[data-pulse]{animation:pulse-subtle 3s ease-in-out infinite}@keyframes pulse-subtle{0%,to{opacity:1}50%{opacity:.92}}.text-glow-primary{text-shadow:0 0 8px rgba(186,158,255,.5)}.text-glow-secondary{text-shadow:0 0 8px rgba(83,221,252,.5)}.text-glow-tertiary{text-shadow:0 0 8px rgba(255,134,195,.5)}.answer-option-btn{-webkit-tap-highlight-color:transparent!important;-webkit-appearance:none!important}.answer-option-btn:active,.answer-option-btn:focus,.answer-option-btn:focus-visible,.answer-option-btn:focus-within{outline:none!important;box-shadow:none!important}.answer-option-btn:not(.selected):active,.answer-option-btn:not(.selected):focus,.answer-option-btn:not(.selected):focus-visible{border-color:var(--border-color)!important;border-width:2px!important}.hide-scrollbar::-webkit-scrollbar{width:0;height:0}.hide-scrollbar{-ms-overflow-style:none;scrollbar-width:none}[role=button]:active,button:active{transform:scale(.95)}[data-card]:active{transform:scale(.98)}.ethereal-glow{box-shadow:0 0 30px rgba(186,158,255,.15)}.primary-glow{box-shadow:0 0 20px rgba(186,158,255,.15)}.secondary-glow{box-shadow:0 0 20px rgba(83,221,252,.15)}.tertiary-glow{box-shadow:0 0 20px rgba(255,134,195,.15)}.ghost-border{border:1px solid rgba(64,72,93,.15)}.ghost-border-focus{border:1px solid rgba(186,158,255,.4)}.glass-float,.glass-panel{background:rgba(9,19,40,.4);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.primary-gradient{background:linear-gradient(90deg,#ba9eff,#8455ef)}