@import"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800&family=Quicksand:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--color-primary: #8B5CF6;--color-primary-light: #A78BFA;--color-primary-lighter: #C4B5FD;--color-primary-dark: #7C3AED;--color-primary-glow: rgba(139, 92, 246, .25);--color-sunset-pink: #E8A0B0;--color-sunset-coral: #E0A0A0;--color-sunset-peach: #E0B080;--color-sunset-orange: #D89050;--color-sunset-yellow: #D8C850;--color-sunset-gold: #D0A030;--color-pastel-lavender: #C8A0D8;--color-pastel-pink: #E8A0C0;--color-pastel-peach: #E8C0A0;--color-pastel-yellow: #E8D888;--color-pastel-mint: #90D8A8;--color-pastel-sky: #88C8E8;--color-pastel-blue: #A0B8E0;--color-accent-red: #F87171;--color-accent-orange: #FB923C;--color-accent-yellow: #FBBF24;--color-accent-green: #4ADE80;--color-accent-teal: #2DD4BF;--color-accent-blue: #60A5FA;--color-accent-indigo: #818CF8;--color-accent-purple: #A78BFA;--color-accent-pink: #F472B6;--color-surface-0: #05060B;--color-surface-1: #120B24;--color-surface-2: #1A102E;--color-surface-3: #231743;--color-surface-elevated: rgba(32, 22, 60, .96);--color-surface-overlay: rgba(245, 87, 108, .1);--color-text-primary: #F6F3FF;--color-text-secondary: #C9C3E8;--color-text-muted: #9A91C5;--color-text-disabled: #6F678F;--color-text-inverse: #0B0817;--color-success: #10B981;--color-success-light: #D1FAE5;--color-warning: #F59E0B;--color-warning-light: #FEF3C7;--color-error: #EF4444;--color-error-light: #FEE2E2;--color-info: #3B82F6;--color-info-light: #DBEAFE;--color-border: rgba(255, 255, 255, .06);--color-border-strong: rgba(255, 255, 255, .12);--color-border-focus: #F68D3F;--color-border-light: rgba(255, 255, 255, .06);--gradient-primary: linear-gradient(135deg, #F5576C 0%, #F68D3F 100%);--gradient-sunset: linear-gradient(135deg, #FDA4AF 0%, #FDBA74 50%, #FDE047 100%);--gradient-sunrise: linear-gradient(135deg, #FDE047 0%, #FDBA74 50%, #FDA4AF 100%);--gradient-warm: linear-gradient(135deg, #FECDD3 0%, #FED7AA 100%);--gradient-cool: linear-gradient(135deg, #E9D5FF 0%, #BAE6FD 100%);--gradient-rainbow: linear-gradient(135deg, #FDA4AF 0%, #FDBA74 25%, #FDE047 50%, #A7F3D0 75%, #BAE6FD 100%);--gradient-surface: linear-gradient(135deg, #15102B 0%, #20163C 55%, #2D1D52 100%);--gradient-card: linear-gradient(135deg, #1A102E 0%, #2E1F5A 60%, rgba(246, 141, 63, .22) 100%);--gradient-glow: radial-gradient(800px 400px at 50% 0%, rgba(143, 88, 255, .18), rgba(246, 141, 63, .12) 40%, transparent 70%);--gradient-card-hover: linear-gradient(135deg, rgba(245, 87, 108, .08) 0%, rgba(139, 92, 246, .08) 100%);--shadow-sm: 0 2px 8px rgba(139, 92, 246, .08), 0 1px 3px rgba(0, 0, 0, .04);--shadow-md: 0 8px 24px rgba(139, 92, 246, .12), 0 4px 8px rgba(0, 0, 0, .04);--shadow-lg: 0 16px 48px rgba(139, 92, 246, .16), 0 8px 16px rgba(0, 0, 0, .04);--shadow-xl: 0 24px 64px rgba(139, 92, 246, .2), 0 12px 24px rgba(0, 0, 0, .06);--shadow-glow-primary: 0 0 30px rgba(139, 92, 246, .3);--shadow-glow-sunset: 0 0 40px rgba(253, 164, 175, .25), 0 0 80px rgba(253, 186, 116, .15);--shadow-glow-soft: 0 4px 20px rgba(139, 92, 246, .15);--shadow-inset: inset 0 2px 4px rgba(139, 92, 246, .06);--blur-sm: 4px;--blur-md: 8px;--blur-lg: 16px;--color-mode: light}body{background:linear-gradient(135deg,#05060b,#120b24 40%,#25144a)}:root.dark,[data-theme=dark]{--color-primary: #A78BFA;--color-primary-light: #C4B5FD;--color-primary-lighter: #DDD6FE;--color-primary-dark: #8B5CF6;--color-primary-glow: rgba(167, 139, 250, .3);--color-sunset-pink: #FCA5A5;--color-sunset-coral: #F87171;--color-sunset-peach: #FDBA74;--color-sunset-orange: #FB923C;--color-sunset-yellow: #FDE047;--color-sunset-gold: #FBBF24;--color-surface-0: #0F0A1A;--color-surface-1: #1A1425;--color-surface-2: #241C32;--color-surface-3: #2E2440;--color-surface-elevated: rgba(36, 28, 50, .98);--color-surface-overlay: rgba(167, 139, 250, .05);--color-text-primary: #FAF5FF;--color-text-secondary: #E9D5FF;--color-text-muted: #C4B5FD;--color-text-disabled: #7C6F9A;--color-text-inverse: #1F1235;--color-success: #34D399;--color-success-light: rgba(52, 211, 153, .15);--color-warning: #FBBF24;--color-warning-light: rgba(251, 191, 36, .15);--color-error: #F87171;--color-error-light: rgba(248, 113, 113, .15);--color-info: #60A5FA;--color-info-light: rgba(96, 165, 250, .15);--color-border: rgba(196, 181, 253, .15);--color-border-strong: rgba(196, 181, 253, .3);--color-border-focus: #A78BFA;--color-border-light: rgba(255, 255, 255, .08);--gradient-surface: linear-gradient(180deg, #1A1425 0%, #0F0A1A 100%);--gradient-glow: radial-gradient(800px 400px at 50% 0%, rgba(167, 139, 250, .12), rgba(253, 164, 175, .06) 40%, transparent 70%);--gradient-card-hover: linear-gradient(135deg, rgba(167, 139, 250, .08) 0%, rgba(253, 164, 175, .08) 100%);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3), 0 1px 3px rgba(0, 0, 0, .2);--shadow-md: 0 8px 24px rgba(0, 0, 0, .4), 0 4px 8px rgba(0, 0, 0, .2);--shadow-lg: 0 16px 48px rgba(0, 0, 0, .5), 0 8px 16px rgba(0, 0, 0, .3);--shadow-xl: 0 24px 64px rgba(0, 0, 0, .6), 0 12px 24px rgba(0, 0, 0, .3);--shadow-glow-primary: 0 0 30px rgba(167, 139, 250, .4);--shadow-glow-sunset: 0 0 40px rgba(253, 164, 175, .2), 0 0 80px rgba(253, 186, 116, .1);--shadow-glow-soft: 0 4px 20px rgba(167, 139, 250, .25);--shadow-inset: inset 0 2px 4px rgba(0, 0, 0, .2);--color-mode: dark}:root.high-contrast,[data-high-contrast=true]{--color-surface-0: #FFFFFF;--color-surface-1: #FFFFFF;--color-surface-2: #FFFFFF;--color-surface-3: #F3F4F6;--color-text-primary: #000000;--color-text-secondary: #1F2937;--color-text-muted: #374151;--color-border: rgba(0, 0, 0, .2);--color-border-strong: rgba(0, 0, 0, .4);--color-primary: #6D28D9;--color-primary-dark: #5B21B6}:root.dark.high-contrast,[data-theme=dark][data-high-contrast=true]{--color-surface-0: #000000;--color-surface-1: #0A0A0A;--color-surface-2: #141414;--color-surface-3: #1F1F1F;--color-text-primary: #FFFFFF;--color-text-secondary: #E5E7EB;--color-text-muted: #D1D5DB;--color-border: rgba(255, 255, 255, .3);--color-border-strong: rgba(255, 255, 255, .5);--color-primary: #C4B5FD}:root[data-colorblind=deuteranopia]{--color-success: #3B82F6;--color-error: #F59E0B;--color-sunset-pink: #60A5FA;--color-accent-green: #3B82F6;--color-accent-red: #F59E0B}:root[data-colorblind=protanopia]{--color-success: #06B6D4;--color-error: #F59E0B;--color-sunset-pink: #22D3EE;--color-accent-green: #06B6D4;--color-accent-red: #F59E0B}:root{--font-heading: "Nunito", system-ui, sans-serif;--font-body: "Quicksand", system-ui, sans-serif;--font-mono: "JetBrains Mono", "SF Mono", monospace;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.25rem;--text-2xl: 1.5rem;--text-3xl: 1.875rem;--text-4xl: 2.25rem;--text-5xl: 3rem;--font-normal: 400;--font-medium: 500;--font-semibold: 600;--font-bold: 700;--font-extrabold: 800;--leading-tight: 1.2;--leading-snug: 1.375;--leading-normal: 1.5;--leading-relaxed: 1.75;--tracking-tight: -.02em;--tracking-normal: 0;--tracking-wide: .02em;--tracking-wider: .05em}:root{--space-0: 0;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--space-24: 6rem}:root{--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 20px;--radius-2xl: 28px;--radius-3xl: 36px;--radius-full: 9999px}:root{--duration-fast: .15s;--duration-normal: .25s;--duration-slow: .4s;--duration-slower: .6s;--ease-out: cubic-bezier(.16, 1, .3, 1);--ease-in-out: cubic-bezier(.65, 0, .35, 1);--ease-bounce: cubic-bezier(.34, 1.56, .64, 1);--ease-spring: cubic-bezier(.175, .885, .32, 1.275)}:root.reduced-motion *,[data-reduced-motion=true] *{animation-duration:0ms!important;animation-iteration-count:1!important;transition-duration:0ms!important}:root{--z-base: 0;--z-dropdown: 10;--z-sticky: 20;--z-fixed: 30;--z-modal-backdrop: 40;--z-modal: 50;--z-tooltip: 60;--z-toast: 70}:root{--container-sm: 640px;--container-md: 768px;--container-lg: 1024px;--container-xl: 1200px;--nav-height: 64px;--bottom-nav-height: 72px}:root.grid-overlay .game-board-wrapper,:root.grid-overlay .board-section,[data-grid-overlay=true] .game-board-wrapper,[data-grid-overlay=true] .board-section{position:relative}:root.grid-overlay .game-board-wrapper:after,:root.grid-overlay .board-section:after,[data-grid-overlay=true] .game-board-wrapper:after,[data-grid-overlay=true] .board-section:after{content:"";position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(139,92,246,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(139,92,246,.2) 1px,transparent 1px);background-size:12.5% 12.5%;border-radius:inherit}.info-bubble{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);background:var(--color-surface-3);border-radius:var(--radius-sm);font-size:var(--text-xs);color:var(--color-text-muted)}[data-info-bubbles=off] .info-bubble,[data-info-bubbles=off] .hint-text,[data-info-bubbles=off] [data-info-bubble]{display:none!important}.bg-sunset-gradient{background:var(--gradient-sunset)}.bg-sunrise-gradient{background:var(--gradient-sunrise)}.bg-rainbow-gradient{background:var(--gradient-rainbow)}.text-gradient-sunset{background:var(--gradient-sunset);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.text-gradient-primary{background:var(--gradient-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.accent-dot{display:inline-block;width:8px;height:8px;border-radius:var(--radius-full);background:var(--gradient-sunset)}.accent-dot-lg{width:12px;height:12px}.hover-glow{transition:box-shadow var(--duration-normal) var(--ease-out)}.hover-glow:hover{box-shadow:var(--shadow-glow-soft)}@keyframes bubble-pop{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.bubble-hover:hover{animation:bubble-pop .3s var(--ease-spring)}*,*: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-body);font-size:var(--text-base);line-height:var(--leading-normal);color:var(--color-text-primary);background:var(--color-surface-0)}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);font-weight:var(--font-bold);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight);color:var(--color-text-primary)}h1{font-size:var(--text-4xl)}h2{font-size:var(--text-2xl)}h3{font-size:var(--text-xl)}h4{font-size:var(--text-lg)}p{color:var(--color-text-secondary);line-height:var(--leading-relaxed)}a{color:var(--color-primary);text-decoration:none;transition:color var(--duration-fast) var(--ease-out)}a:hover{color:var(--color-primary-dark);text-decoration:underline}code,.mono{font-family:var(--font-mono)}.text-muted{color:var(--color-text-muted)}.text-success{color:var(--color-success)}.text-warning{color:var(--color-warning)}.text-error{color:var(--color-error)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-semibold);line-height:1;color:var(--color-text-primary);background:var(--color-surface-3);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--duration-fast) var(--ease-out);min-height:44px;white-space:nowrap}.btn:hover{background:var(--color-surface-elevated);border-color:var(--color-border-strong);transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{background:var(--gradient-primary);border-color:var(--color-primary);box-shadow:var(--shadow-sm),var(--shadow-glow-primary)}.btn-primary:hover{background:var(--color-primary-light);border-color:var(--color-primary-light)}.btn-accent{background:var(--gradient-accent);border:none;color:var(--color-surface-0)}.btn-ghost{background:transparent;border-color:transparent}.btn-ghost:hover{background:var(--color-surface-3);border-color:var(--color-border)}.btn-icon{width:44px;height:44px;padding:0;border-radius:var(--radius-lg)}.btn-sm{padding:var(--space-2) var(--space-3);font-size:var(--text-xs);min-height:36px}.btn-lg{padding:var(--space-4) var(--space-6);font-size:var(--text-base);min-height:52px}.reset-button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);font-family:var(--font-body);font-size:var(--text-sm);font-weight:var(--font-bold);color:#fff;background:var(--color-primary);border:none;border-radius:var(--radius-lg);cursor:pointer;min-height:44px;text-shadow:0 1px 2px rgba(0,0,0,.2)}.reset-button:hover:not(:disabled){background:var(--color-primary-dark)}.reset-button:disabled{background:var(--color-surface-3);color:var(--color-text-disabled);text-shadow:none;cursor:not-allowed}.reset-button-secondary{background:var(--color-surface-3);color:var(--color-text-primary);border:1px solid var(--color-border);text-shadow:none}.reset-button-secondary:hover:not(:disabled){background:var(--color-surface-elevated)}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;font-size:var(--text-lg);background:var(--color-surface-3);border:1px solid var(--color-border);border-radius:var(--radius-full);cursor:pointer}.icon-button:hover{background:var(--color-surface-elevated)}.hud{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-4)}.hud-compact{padding:var(--space-3)}.hud-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--space-3)}.hud-row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-2) var(--space-3);background:var(--color-surface-3);border-radius:var(--radius-md);gap:var(--space-3)}.hud-label{font-size:var(--text-sm);color:var(--color-text-muted);white-space:nowrap}.hud-value{font-size:var(--text-base);font-weight:var(--font-bold);color:var(--color-text-primary)}.stats-bar{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--text-sm)}.stats-bar .stat{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);background:var(--color-surface-3);border-radius:var(--radius-md);white-space:nowrap}.stats-bar .stat-icon{font-size:var(--text-base)}.stats-bar .stat-value{font-weight:var(--font-bold);color:var(--color-text-primary)}.stats-bar .stat-label{color:var(--color-text-muted);font-size:var(--text-xs)}.stats-bar .divider{width:1px;height:20px;background:var(--color-border);margin:0 var(--space-1)}.stats-bar .stat--success .stat-value{color:var(--color-success)}.stats-bar .stat--warning .stat-value{color:var(--color-warning)}.stats-bar .stat--gold .stat-value{color:var(--color-accent-gold)}.stats-bar .powerups{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);background:var(--color-primary-light);border-radius:var(--radius-md);font-size:var(--text-xs);color:var(--color-primary-dark)}.action-bar{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--space-3);padding:var(--space-4);margin-top:var(--space-4);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.action-bar-group{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}.action-chip{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);background:var(--color-surface-3);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--color-text-secondary)}.game-controls{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg)}.promotion-buttons{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-top:var(--space-3)}.promotion-buttons button{display:inline-flex;align-items:center;justify-content:center;padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-weight:var(--font-semibold);background:var(--color-surface-3);border:1px solid var(--color-border);border-radius:var(--radius-md);cursor:pointer;min-height:40px}.promotion-buttons button:hover:not(:disabled){background:var(--color-surface-elevated);border-color:var(--color-primary)}.promotion-buttons button:disabled{opacity:.5;cursor:not-allowed}.promotion-option{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-4);background:var(--color-surface-3);border:2px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;min-width:80px}.promotion-option:hover{background:var(--color-surface-elevated);border-color:var(--color-primary)}.bundle-button-wrap{position:relative}.bundle-lock-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:#0009;color:var(--color-text-muted);font-size:var(--text-xs);border-radius:var(--radius-md);pointer-events:none}.card{background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-xl);padding:var(--space-6);transition:all var(--duration-normal) var(--ease-out)}.card-interactive{cursor:pointer}.card-interactive:hover{border-color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.card-interactive:hover .card-title{color:var(--color-primary)}.card-header{margin-bottom:var(--space-4)}.card-title{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary);transition:color var(--duration-fast) var(--ease-out)}.card-description{font-size:var(--text-sm);color:var(--color-text-muted);margin-top:var(--space-1)}.card-disabled{opacity:.4;cursor:not-allowed}.card-disabled:hover{transform:none;box-shadow:none;border-color:var(--color-border)}.panel{background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-5)}.form-group{display:flex;flex-direction:column;gap:var(--space-2)}.form-label{font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text-secondary)}.form-input,.form-select,.form-textarea{padding:var(--space-3) var(--space-4);font-family:var(--font-body);font-size:var(--text-base);color:var(--color-text-primary);background:var(--color-surface-1);border:1px solid var(--color-border);border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out);min-height:44px}.form-input:hover,.form-select:hover,.form-textarea:hover{border-color:var(--color-border-strong)}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--color-border-focus);box-shadow:0 0 0 3px #38bdf833}.form-input::placeholder{color:var(--color-text-disabled)}.form-select{cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394A3B8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-3) center;padding-right:var(--space-10)}.form-textarea{min-height:100px;resize:vertical}.form-checkbox,.form-radio{display:flex;align-items:center;gap:var(--space-3);cursor:pointer;-webkit-user-select:none;user-select:none}.form-checkbox input,.form-radio input{width:20px;height:20px;accent-color:var(--color-primary);cursor:pointer}.nav-bar{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-2);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-xl)}.nav-link{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-4);font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text-secondary);background:transparent;border-radius:var(--radius-md);text-decoration:none;transition:all var(--duration-fast) var(--ease-out)}.nav-link:hover{color:var(--color-text-primary);background:var(--color-surface-3)}.nav-link.active{color:var(--color-text-primary);background:var(--color-primary)}.bottom-nav{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:space-around;align-items:center;height:var(--bottom-nav-height);padding:var(--space-2) var(--space-4);padding-bottom:calc(var(--space-2) + env(safe-area-inset-bottom,0));background:var(--color-surface-elevated);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--color-border);z-index:var(--z-fixed)}.bottom-nav-link{display:flex;flex-direction:column;align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);font-size:var(--text-xs);font-weight:var(--font-medium);color:var(--color-text-muted);text-decoration:none;border-radius:var(--radius-md);transition:all var(--duration-fast) var(--ease-out)}.bottom-nav-link:hover{color:var(--color-text-primary);background:var(--color-surface-3)}.bottom-nav-link.active{color:var(--color-primary)}.modal-backdrop{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:var(--z-modal-backdrop);animation:fadeIn var(--duration-fast) var(--ease-out)}.modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:calc(100% - var(--space-8));max-width:560px;max-height:calc(100vh - var(--space-8));display:flex;flex-direction:column;overflow:hidden;background:var(--color-surface-1);border:1px solid var(--color-border);border-radius:var(--radius-2xl);padding:var(--space-6);z-index:var(--z-modal);animation:slideUp var(--duration-normal) var(--ease-out)}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:var(--space-5)}.modal-title{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:var(--font-bold)}.modal-body{color:var(--color-text-secondary);display:flex;flex-direction:column;align-items:center;text-align:center;overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}.modal-body::-webkit-scrollbar{width:8px}.modal-body::-webkit-scrollbar-track{background:var(--color-surface-2);border-radius:4px}.modal-body::-webkit-scrollbar-thumb{background:var(--color-surface-3);border-radius:4px}.modal-body::-webkit-scrollbar-thumb:hover{background:var(--color-border-strong)}.modal-body ul,.modal-body ol{text-align:left;margin:0 auto;padding-left:var(--space-5)}.modal-body h3{width:100%;text-align:left;margin:var(--space-4) 0 var(--space-2)}.modal-body .promotion-buttons{justify-content:center}.summary-stats{display:flex;flex-direction:column;gap:var(--space-2);width:100%;max-width:360px;margin:0 auto}.summary-row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-2) var(--space-3);background:var(--color-surface-3);border-radius:var(--radius-md);gap:var(--space-4)}.summary-label{font-size:var(--text-sm);color:var(--color-text-secondary);white-space:nowrap}.summary-value{font-size:var(--text-base);font-weight:var(--font-bold);color:var(--color-text-primary);text-align:right}.summary-value--success{color:var(--color-success)}.summary-value--gold{color:var(--color-accent-gold)}.summary-row--total{background:var(--color-surface-2);border:1px solid var(--color-border);margin-top:var(--space-2);padding:var(--space-3)}.summary-row--total .summary-label{font-weight:var(--font-bold);color:var(--color-text-primary)}.summary-row--total .summary-value{font-size:var(--text-lg)}.modal-footer{display:flex;gap:var(--space-3);justify-content:flex-end;margin-top:var(--space-6)}.badge{display:inline-flex;align-items:center;padding:var(--space-1) var(--space-2);font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--color-text-primary);background:var(--color-surface-3);border-radius:var(--radius-full)}.badge-primary{background:var(--color-primary)}.badge-success{background:var(--color-success);color:var(--color-surface-0)}.badge-warning{background:var(--color-warning);color:var(--color-surface-0)}.badge-error{background:var(--color-error)}.price-tag{font-family:var(--font-mono);font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-sunset-orange)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--space-3)}.stat-item{display:flex;flex-direction:column;gap:var(--space-1);padding:var(--space-3) var(--space-4);background:var(--color-surface-1);border:1px solid var(--color-border);border-radius:var(--radius-md)}.stat-label{font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wide)}.stat-value{font-family:var(--font-mono);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary)}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:var(--space-3) var(--space-4);text-align:left;border-bottom:1px solid var(--color-border)}.table th{font-size:var(--text-xs);font-weight:var(--font-semibold);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wide);background:var(--color-surface-1)}.table td{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text-secondary)}.table tr:hover td{background:var(--color-surface-3)}.flex{display:flex}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-2{gap:var(--space-2)}.gap-3{gap:var(--space-3)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.grid{display:grid}.grid-cols-2{grid-template-columns:repeat(2,1fr)}.grid-cols-3{grid-template-columns:repeat(3,1fr)}.mt-2{margin-top:var(--space-2)}.mt-4{margin-top:var(--space-4)}.mt-6{margin-top:var(--space-6)}.mb-2{margin-bottom:var(--space-2)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.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}.skip-link{position:absolute;top:-100%;left:var(--space-4);padding:var(--space-3) var(--space-4);background:var(--color-primary);color:var(--color-text-primary);border-radius:var(--radius-md);z-index:var(--z-toast);font-weight:var(--font-semibold)}.skip-link:focus{top:var(--space-4)}:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px}:focus:not(:focus-visible){outline:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,-45%)}to{opacity:1;transform:translate(-50%,-50%)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-pulse{animation:pulse 2s var(--ease-in-out) infinite}@media(max-width:768px){.hide-mobile{display:none!important}.grid-cols-2,.grid-cols-3{grid-template-columns:1fr}}@media(min-width:769px){.hide-desktop{display:none!important}}@media(min-width:960px){.bottom-nav{display:none}}@media(orientation:portrait){.app-shell{padding:var(--space-2);padding-bottom:calc(var(--bottom-nav-height) + var(--space-2))}.app-header{padding:var(--space-2) var(--space-3);margin-bottom:var(--space-2)}.page-header{margin-bottom:var(--space-2)}.page-title{font-size:var(--text-xl);margin-bottom:var(--space-1)}.page-subtitle{font-size:var(--text-sm)}.mode-grid{grid-template-columns:1fr;gap:var(--space-3)}.mode-card{padding:var(--space-4)}.mode-card-icon{width:40px;height:40px;margin-bottom:var(--space-3);font-size:var(--text-xl)}.game-container{gap:var(--space-2)}.game-hud{padding:var(--space-2) var(--space-3)}.game-controls{gap:var(--space-2);flex-direction:column;align-items:stretch}.game-controls .btn{width:100%;justify-content:center}.hud-grid{display:flex;flex-direction:column;gap:var(--space-2)}.hud-row{display:flex;justify-content:space-between;align-items:center;padding:var(--space-2);background:var(--color-surface-1);border-radius:var(--radius-sm)}.shop-grid{grid-template-columns:1fr;gap:var(--space-3)}.shop-item,.survival-shop{padding:var(--space-3)}.survival-shop-grid{grid-template-columns:repeat(2,1fr);gap:var(--space-2)}.leaderboard-row{grid-template-columns:40px 1fr repeat(3,60px);gap:var(--space-1);padding:var(--space-2);font-size:var(--text-xs)}.leaderboard-row>*:nth-child(n+6){display:none}.settings-item{padding:var(--space-2) var(--space-3)}.settings-section{margin-bottom:var(--space-4)}.panel{padding:var(--space-3)}.modal-content{padding:var(--space-4);max-height:85vh}.notice{padding:var(--space-2) var(--space-3);font-size:var(--text-xs)}.action-bar{flex-direction:column;gap:var(--space-2)}.action-bar-group{flex-wrap:wrap;gap:var(--space-2)}.btn{padding:var(--space-2) var(--space-3);font-size:var(--text-sm)}.btn-lg{padding:var(--space-3) var(--space-4)}.form-input,.form-select,.form-textarea{padding:var(--space-2) var(--space-3)}.portrait-banner{padding:var(--space-2) var(--space-3);margin-bottom:var(--space-2);font-size:var(--text-xs)}.tab-buttons{flex-wrap:wrap;gap:var(--space-1)}.tab-button{padding:var(--space-2) var(--space-3);font-size:var(--text-xs)}.auth-modal{max-width:90vw;padding:var(--space-4)}}@media(orientation:portrait)and (max-width:360px){:root{font-size:14px}.app-shell{padding:var(--space-1);padding-bottom:calc(var(--bottom-nav-height) + var(--space-1))}.mode-card-footer{flex-direction:column;align-items:flex-start;gap:var(--space-2)}.survival-shop-grid{grid-template-columns:1fr}}.board-section{container-type:inline-size;container-name:board}.game-controls{container-type:inline-size;container-name:controls}.stats-bar{container-type:inline-size;container-name:stats}@container stats (max-width: 400px){.stats-bar .stat-label{display:none}.stats-bar .stat{padding:var(--space-1)}.stats-bar .divider{margin:0}}@container stats (max-width: 300px){.stats-bar{gap:var(--space-1);padding:var(--space-1) var(--space-2);font-size:var(--text-xs)}.stats-bar .stat-icon{font-size:var(--text-sm)}}@container controls (max-width: 400px){.game-controls{flex-direction:column;gap:var(--space-2)}.game-controls .btn,.game-controls .reset-button{width:100%;justify-content:center}}.summary-stats{container-type:inline-size;container-name:summary}@container summary (max-width: 300px){.summary-row{padding:var(--space-1) var(--space-2);gap:var(--space-2)}.summary-label{font-size:var(--text-xs)}.summary-value{font-size:var(--text-sm)}}.popup-overlay-backdrop{position:fixed;inset:0;z-index:1000;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:flex-end;justify-content:center;padding:0}.popup-overlay-content{background:var(--color-surface-1);border-radius:var(--radius-xl) var(--radius-xl) 0 0;width:100%;max-height:85vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 -4px 32px #0000004d}.popup-overlay-header{display:flex;align-items:center;justify-content:space-between;padding:var(--space-4);border-bottom:1px solid var(--color-border);position:sticky;top:0;background:var(--color-surface-1);z-index:1}.popup-overlay-title{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-lg);font-weight:var(--font-semibold)}.popup-overlay-icon{font-size:var(--text-xl)}.popup-overlay-close{width:32px;height:32px;border:none;background:var(--color-surface-2);border-radius:var(--radius-full);font-size:var(--text-lg);color:var(--color-text-secondary);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s}.popup-overlay-close:hover{background:var(--color-surface-3)}.popup-overlay-body{padding:var(--space-5);display:flex;flex-direction:column;align-items:center;text-align:center;overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch}.popup-overlay-body::-webkit-scrollbar{width:8px}.popup-overlay-body::-webkit-scrollbar-track{background:var(--color-surface-2);border-radius:4px}.popup-overlay-body::-webkit-scrollbar-thumb{background:var(--color-surface-3);border-radius:4px}.popup-overlay-body::-webkit-scrollbar-thumb:hover{background:var(--color-border-strong)}.popup-overlay-body ul,.popup-overlay-body ol{text-align:left;margin:0 auto}.popup-overlay-body h3{width:100%;text-align:left;margin:var(--space-4) 0 var(--space-2);font-size:var(--text-base);font-weight:var(--font-semibold)}.popup-overlay-body .promotion-buttons{justify-content:center}@media(min-width:768px){.popup-overlay-backdrop{align-items:center;padding:var(--space-6)}.popup-overlay-content{border-radius:var(--radius-xl);max-width:520px;max-height:85vh}.popup-overlay-body{padding:var(--space-6)}}.bank-panel{background:var(--color-surface-2);border-radius:var(--radius-lg);padding:var(--space-4)}.bank-title{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-lg);margin-bottom:var(--space-4)}.bank-icon{font-size:var(--text-xl)}.bank-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);margin-bottom:var(--space-4)}.bank-stat{text-align:center;padding:var(--space-2);background:var(--color-surface-3);border-radius:var(--radius-md)}.bank-stat-label{display:block;font-size:var(--text-xs);color:var(--color-text-muted);margin-bottom:var(--space-1)}.bank-stat-value{display:block;font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--color-text-primary)}.bank-interest{color:var(--color-success)!important}.bank-info{margin-bottom:var(--space-4);color:var(--color-text-secondary)}.bank-actions{display:flex;flex-direction:column;gap:var(--space-3)}.bank-action-group{display:flex;flex-direction:column;gap:var(--space-2)}.bank-action-label{font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-secondary)}.bank-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-2)}.bank-buttons>.btn{width:100%;min-width:0}.bank-hint{margin-top:var(--space-4);font-size:var(--text-sm);color:var(--color-text-muted);font-style:italic}.bank-panel-compact{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);background:var(--color-surface-2);border-radius:var(--radius-lg)}.bank-summary{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-sm)}.bank-amount{font-weight:var(--font-bold);color:var(--color-text-primary)}.bank-rate{color:var(--color-text-muted)}.bank-next{color:var(--color-success);font-weight:var(--font-semibold)}.bank-actions-compact{display:flex;flex-wrap:wrap;gap:var(--space-1)}.powerups-panel{background:var(--color-surface-2);border-radius:var(--radius-lg);padding:var(--space-4)}.powerups-title{display:flex;align-items:center;gap:var(--space-2);font-size:var(--text-lg);margin-bottom:var(--space-4)}.powerups-icon{font-size:var(--text-xl)}.powerup-cards{display:flex;flex-direction:column;gap:var(--space-3)}.powerup-card{background:var(--color-surface-3);border-radius:var(--radius-md);padding:var(--space-3);border:2px solid transparent;transition:border-color .15s}.powerup-card.purchased{border-color:var(--color-success);background:#4ade801a}.powerup-header{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-2)}.powerup-icon{font-size:var(--text-xl)}.powerup-name{flex:1;font-weight:var(--font-semibold);color:var(--color-text-primary)}.powerup-cost{font-size:var(--text-sm);color:var(--color-accent-gold);font-weight:var(--font-bold)}.powerup-description{font-size:var(--text-sm);color:var(--color-text-muted);margin-bottom:var(--space-2)}.powerup-bonus{font-size:var(--text-sm);color:var(--color-success);font-weight:var(--font-semibold);margin-bottom:var(--space-2);padding:var(--space-1) var(--space-2);background:#4ade801a;border-radius:var(--radius-sm)}.powerup-buy-btn{width:100%}.powerups-hint{margin-top:var(--space-4);font-size:var(--text-sm);color:var(--color-text-muted);font-style:italic}.powerups-panel-compact{display:flex;flex-direction:column;gap:var(--space-2);padding:var(--space-3);background:var(--color-surface-2);border-radius:var(--radius-lg)}.powerups-row{display:flex;gap:var(--space-2)}.powerup-btn{flex:1;padding:var(--space-2) var(--space-3);background:var(--color-surface-3);border:2px solid transparent;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-semibold);color:var(--color-text-primary);cursor:pointer;transition:all .15s}.powerup-btn:hover:not(:disabled){background:var(--color-surface-elevated)}.powerup-btn:disabled{opacity:.5;cursor:not-allowed}.powerup-btn.active{border-color:var(--color-success);background:#4ade801a;color:var(--color-success)}.carried-moves-badge{font-size:var(--text-xs);color:var(--color-success);font-weight:var(--font-semibold);text-align:center;padding:var(--space-1);background:#4ade801a;border-radius:var(--radius-sm)}.survival-menu-buttons{display:flex;gap:var(--space-2);padding:var(--space-2) 0}.survival-menu-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--space-1);padding:var(--space-2);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);font-size:var(--text-xs);color:var(--color-text-secondary);cursor:pointer;transition:all .15s}.survival-menu-btn:hover{background:var(--color-surface-3);color:var(--color-text-primary)}.survival-menu-btn-icon{font-size:var(--text-xl)}.active-powerups{display:flex;gap:var(--space-2);padding:var(--space-1) var(--space-2);background:#4ade801a;border-radius:var(--radius-md);font-size:var(--text-xs);color:var(--color-success);font-weight:var(--font-semibold)}.active-powerup{display:flex;align-items:center;gap:var(--space-1)}body{margin:0;min-width:320px;min-height:100vh;min-height:100dvh;overflow-x:hidden}#root{min-height:100vh;min-height:100dvh}.app{min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:var(--color-surface-0);background-image:var(--gradient-glow);position:relative}.app:before{content:"";position:fixed;top:0;left:0;right:0;height:400px;background:var(--gradient-glow);pointer-events:none;z-index:-1}.app-shell{flex:1;display:flex;flex-direction:column;max-width:var(--container-xl);width:100%;margin:0 auto;padding:var(--space-4);padding-bottom:calc(var(--bottom-nav-height) + var(--space-4))}@media(min-width:960px){.app-shell{padding-bottom:var(--space-4)}.app-shell--game .app-header{min-height:52px;padding:var(--space-2) var(--space-4);margin-bottom:var(--space-2);border-radius:var(--radius-lg)}.app-shell--game .page-content,.app-shell--game #main-content{min-height:0;flex:1;display:flex;flex-direction:column;overflow:hidden}.app-shell--game #main-content>.game-cockpit{flex:1}}.app-shell--game{max-width:none;height:100dvh;min-height:0;overflow:hidden;padding:var(--space-3)}html:has(.app-shell--game),body:has(.app-shell--game),#root:has(.app-shell--game),.app:has(.app-shell--game){height:100dvh;min-height:0;overflow:hidden}.app-shell--game .page-content,.app-shell--game #main-content{min-height:0}@media(max-width:959px){.app-shell--game{height:100dvh;max-height:100dvh;min-height:0;overflow:hidden;padding-top:var(--space-2);padding-right:0;padding-bottom:calc(var(--bottom-nav-height) + var(--space-2));padding-left:0}.app-shell--game .app-header{flex:none;min-height:50px;margin:0 var(--space-2) var(--space-1);padding:var(--space-2) var(--space-3);border-radius:var(--radius-lg)}.app-shell--game .page-content,.app-shell--game #main-content{flex:1;display:flex;flex-direction:column;overflow:hidden}.app-shell--game #main-content>.game-cockpit{flex:1}}@media(max-width:959px)and (max-height:500px){.app-shell--game{padding-top:var(--space-1);padding-bottom:calc(var(--bottom-nav-height) + var(--space-1))}.app-shell--game .app-header{min-height:42px;margin-bottom:var(--space-1);padding-top:var(--space-1);padding-bottom:var(--space-1)}}@media(max-width:959px)and (max-height:760px){.app-shell--game .app-header{padding-top:var(--space-1);padding-bottom:var(--space-1)}}.app-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-4);background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-xl)}.app-brand{display:flex;align-items:center;gap:var(--space-3)}.app-logo{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:var(--font-bold);color:var(--color-text-primary);letter-spacing:var(--tracking-tight)}.app-logo-accent{background:var(--gradient-sunset);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.desktop-nav{display:none}@media(min-width:960px){.desktop-nav{display:flex;align-items:center;gap:var(--space-2)}}.page-content{flex:1;display:flex;flex-direction:column;gap:var(--space-4)}.page-header{margin-bottom:var(--space-2)}.page-title{font-family:var(--font-heading);font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--color-text-primary);margin:0 0 var(--space-2)}.page-subtitle{font-size:var(--text-base);color:var(--color-text-muted);margin:0}.mode-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--space-4)}.mode-card{position:relative;display:flex;flex-direction:column;padding:var(--space-5);background:var(--gradient-card);border:1px solid var(--color-border);border-radius:var(--radius-xl);text-decoration:none;color:inherit;transition:all var(--duration-normal) var(--ease-out);overflow:hidden}.mode-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-primary);opacity:0;transition:opacity var(--duration-fast) var(--ease-out)}.mode-card:hover{border-color:var(--color-primary);transform:translateY(-4px);box-shadow:var(--shadow-lg),var(--shadow-glow-primary)}.mode-card:hover:before{opacity:1}.mode-card-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;margin-bottom:var(--space-4);background:var(--color-surface-3);border-radius:var(--radius-lg);font-size:var(--text-2xl)}.mode-card-title{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-semibold);color:var(--color-text-primary);margin-bottom:var(--space-2)}.mode-card-description{font-size:var(--text-sm);color:var(--color-text-muted);line-height:var(--leading-relaxed);flex:1}.mode-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--color-border)}.mode-card-status{font-size:var(--text-xs);font-weight:var(--font-semibold);text-transform:uppercase;letter-spacing:var(--tracking-wide)}.mode-card-status-free{color:var(--color-success)}.mode-card-status-owned{color:var(--color-accent-sky)}.mode-card-status-locked{color:var(--color-warning)}.mode-card-status-soon{color:var(--color-text-muted)}.mode-card-disabled{opacity:.5;cursor:not-allowed}.mode-card-disabled:hover{transform:none;box-shadow:none;border-color:var(--color-border)}.mode-card-disabled:hover:before{opacity:0}.portrait-banner{display:none;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-4);background:#fbbf241a;border:1px solid rgba(251,191,36,.3);border-radius:var(--radius-lg);color:var(--color-warning);font-size:var(--text-sm);font-weight:var(--font-medium)}@media(orientation:portrait){.portrait-banner{display:flex}}.game-container{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);width:100%}.game-board-wrapper{display:flex;justify-content:center;align-items:center;width:100%;max-width:600px}.game-controls{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3);width:100%;max-width:600px}.game-hud{width:100%;max-width:600px;padding:var(--space-4);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-xl)}.game-status{text-align:center;padding:var(--space-3);margin-bottom:var(--space-4);background:var(--color-surface-1);border-radius:var(--radius-md)}.game-status-text{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-semibold)}.game-status-check{color:var(--color-warning)}.game-status-checkmate{color:var(--color-error)}.game-status-stalemate{color:var(--color-info)}.survival-shop{width:100%;max-width:600px;padding:var(--space-5);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-xl)}.survival-shop-title{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-bold);margin-bottom:var(--space-4);color:var(--color-sunset-orange)}.survival-shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--space-3)}.survival-shop-item{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-3);background:var(--color-surface-1);border:1px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--duration-fast) var(--ease-out)}.survival-shop-item:hover{border-color:var(--color-primary);background:var(--color-surface-3)}.survival-shop-item-disabled{opacity:.4;cursor:not-allowed}.survival-summary{width:100%;max-width:500px;padding:var(--space-6);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-2xl);text-align:center}.survival-summary-title{font-family:var(--font-heading);font-size:var(--text-2xl);font-weight:var(--font-bold);background:var(--gradient-sunset);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:var(--space-6)}.promotion-modal{display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-6);text-align:center}.promotion-title{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:var(--font-bold)}.promotion-options{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-3)}.promotion-option{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);padding:var(--space-4);min-width:80px;background:var(--color-surface-3);border:1px solid var(--color-border);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--duration-fast) var(--ease-out)}.promotion-option:hover{border-color:var(--color-primary);background:var(--color-primary)}.leaderboard-table{width:100%;overflow-x:auto}.leaderboard-row{display:grid;grid-template-columns:50px 1fr repeat(5,80px);gap:var(--space-2);padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);align-items:center}.leaderboard-row:first-child{background:var(--color-surface-1);font-weight:var(--font-semibold);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:var(--tracking-wide);color:var(--color-text-muted)}.leaderboard-row:not(:first-child):hover{background:var(--color-surface-3)}.leaderboard-rank{font-family:var(--font-mono);font-weight:var(--font-bold)}.leaderboard-rank-1{color:var(--color-sunset-gold)}.leaderboard-rank-2{color:silver}.leaderboard-rank-3{color:#cd7f32}.leaderboard-player{font-weight:var(--font-medium);color:var(--color-text-primary)}.leaderboard-stat{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--color-text-secondary);text-align:right}.shop-section{margin-bottom:var(--space-8)}.shop-section-title{font-family:var(--font-heading);font-size:var(--text-xl);font-weight:var(--font-bold);margin-bottom:var(--space-4)}.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:var(--space-4)}.shop-item{display:flex;flex-direction:column;padding:var(--space-5);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-xl);transition:all var(--duration-normal) var(--ease-out)}.shop-item:hover{border-color:var(--color-border-strong)}.shop-item-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:var(--space-3)}.shop-item-name{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-semibold)}.shop-item-type{font-size:var(--text-xs);color:var(--color-text-muted);text-transform:uppercase;letter-spacing:var(--tracking-wide)}.shop-item-price{font-family:var(--font-mono);font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--color-sunset-orange)}.shop-item-free{color:var(--color-success)}.shop-item-footer{display:flex;align-items:center;gap:var(--space-3);margin-top:auto;padding-top:var(--space-4)}.settings-section{margin-bottom:var(--space-6)}.settings-section-title{font-family:var(--font-heading);font-size:var(--text-lg);font-weight:var(--font-semibold);margin-bottom:var(--space-4);padding-bottom:var(--space-2);border-bottom:1px solid var(--color-border)}.settings-group{display:flex;flex-direction:column;gap:var(--space-3)}.settings-item{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-3) var(--space-4);background:var(--color-surface-1);border:1px solid var(--color-border);border-radius:var(--radius-md)}.settings-item-label{display:flex;flex-direction:column;gap:var(--space-1)}.settings-item-title{font-weight:var(--font-medium);color:var(--color-text-primary)}.settings-item-description{font-size:var(--text-sm);color:var(--color-text-muted)}.auth-divider{display:flex;align-items:center;gap:var(--space-4);margin:var(--space-5) 0;color:var(--color-text-muted);font-size:var(--text-sm)}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:var(--color-border)}.auth-social-btn{display:flex;align-items:center;justify-content:center;gap:var(--space-3);width:100%;padding:var(--space-4);font-weight:var(--font-semibold)}.notice{padding:var(--space-3) var(--space-4);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--font-medium)}.notice-success{background:#22c55e1a;border:1px solid rgba(34,197,94,.3);color:var(--color-success)}.notice-error{background:#ef44441a;border:1px solid rgba(239,68,68,.3);color:var(--color-error)}.notice-warning{background:#fbbf241a;border:1px solid rgba(251,191,36,.3);color:var(--color-warning)}.notice-info{background:#38bdf81a;border:1px solid rgba(56,189,248,.3);color:var(--color-info)}.tos-modal{max-height:80vh;overflow-y:auto}.tos-section{margin-bottom:var(--space-5)}.tos-section h3{font-size:var(--text-base);font-weight:var(--font-semibold);margin-bottom:var(--space-2);color:var(--color-text-primary)}.tos-section ul{padding-left:var(--space-5);color:var(--color-text-secondary)}.tos-section li{margin-bottom:var(--space-2)}.dev-banner{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);margin-bottom:var(--space-4);background:linear-gradient(90deg,var(--color-pastel-lavender),var(--color-pastel-pink));border:1px solid var(--color-primary-light);border-radius:var(--radius-lg);font-size:var(--text-sm);color:var(--color-text-secondary)}.dev-banner strong{color:var(--color-primary-dark)}.app-root{min-height:100vh;display:flex;flex-direction:column}.app-container{flex:1;display:flex;flex-direction:column;max-width:900px;margin:0 auto;padding:var(--space-4);width:100%}.app-container>.app-header{flex-direction:column;align-items:flex-start;text-align:center;margin-bottom:var(--space-4)}.app-container>.app-header h1{font-family:var(--font-heading);font-size:var(--text-2xl);font-weight:var(--font-bold);color:var(--color-text-primary);margin:0;width:100%}.app-subtitle{font-size:var(--text-sm);color:var(--color-text-muted);margin:var(--space-1) 0 0;width:100%}.app-main{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.app-status{padding:var(--space-2) var(--space-4);margin:var(--space-2) 0;background:var(--color-surface-3);border-radius:var(--radius-md);font-size:var(--text-sm);color:var(--color-text-secondary);text-align:center}.app-status-check{background:var(--color-accent-gold);color:var(--color-surface-0)}.app-status-checkmate{background:var(--color-error);color:#fff}.app-status-emphasis{font-weight:var(--font-bold);color:var(--color-text-primary)}.board-section{display:flex;justify-content:center;align-items:center;margin:var(--space-4) 0;width:var(--board-size, 100%);height:var(--board-size, auto);max-width:var(--board-size, 500px)}.promotion-section{display:flex;flex-direction:column;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin:var(--space-4) 0}.controls-section{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:var(--space-3);padding:var(--space-4);background:var(--color-surface-2);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-top:var(--space-4)}.home-main{flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--space-4);padding:var(--space-4) 0}