.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary, #e8eef4) 100%);padding:20px}.login-container{width:100%;max-width:400px;background:var(--card-bg);border-radius:20px;padding:40px 32px;box-shadow:var(--shadow)}.login-header{text-align:center;margin-bottom:32px}.login-title{font-size:2.5rem;font-weight:800;color:var(--accent-color);margin:0 0 8px}.login-subtitle{font-size:1rem;color:var(--text-secondary);margin:0}.login-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-size:.9rem;font-weight:600;color:var(--text-primary)}.form-group input{padding:14px 16px;font-size:1rem;border:2px solid var(--border-color);border-radius:12px;background:var(--bg-primary);color:var(--text-primary);transition:border-color .2s ease,box-shadow .2s ease}.form-group input:focus{outline:none;border-color:var(--accent-color);box-shadow:0 0 0 3px #007aff26}.form-group input::placeholder{color:var(--text-secondary);opacity:.7}.error-message{font-size:.85rem;color:var(--error-color, #ef4444)}.login-button{padding:16px 24px;font-size:1.1rem;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--accent-color) 0%,#0056b3 100%);border:none;border-radius:12px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.login-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #007aff4d}.login-button:active{transform:translateY(0)}.login-info{margin-top:24px;text-align:center;font-size:.8rem;color:var(--text-secondary)}[data-theme=dark] .login-page{background:linear-gradient(135deg,#1a1a1a,#2a2a2a)}[data-theme=dark] .login-container{background:#2c2c2e}[data-theme=dark] .form-group input{background:#1c1c1e;border-color:#3a3a3c}[data-theme=dark] .form-group input:focus{border-color:var(--accent-color)}.level-select-page{height:100%;display:flex;flex-direction:column;background:var(--bg-primary);overflow:hidden}.level-select-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:var(--card-bg);box-shadow:0 2px 8px #0000001a;flex-wrap:wrap;gap:12px;flex-shrink:0;z-index:10}.header-left{display:flex;align-items:center;gap:16px}.level-select-header h1{margin:0;font-size:1.5rem;font-weight:800;color:var(--accent-color)}.user-greeting{font-size:.9rem;color:var(--text-secondary)}.header-right{display:flex;align-items:center;gap:16px}.completion-badge{padding:6px 12px;background:var(--success-color, #22c55e);color:#fff;font-size:.8rem;font-weight:600;border-radius:20px}.logout-button{padding:8px 16px;font-size:.85rem;font-weight:600;color:var(--text-secondary);background:transparent;border:2px solid var(--border-color);border-radius:8px;cursor:pointer;transition:all .2s ease}.logout-button:hover{color:var(--error-color, #ef4444);border-color:var(--error-color, #ef4444)}.highscores-button{padding:8px 16px;font-size:.85rem;font-weight:600;color:#fff;background:linear-gradient(135deg,#fbbf24,#f59e0b);border:none;border-radius:8px;cursor:pointer;transition:all .2s ease}.highscores-button:hover{transform:translateY(-2px);box-shadow:0 4px 12px #f59e0b4d}.level-select-intro{padding:16px 24px;max-width:800px;width:100%;margin:0 auto;flex-shrink:0}.level-select-intro h2{margin:0 0 8px;font-size:1.5rem;color:var(--text-primary)}.level-select-info{margin:0;font-size:.9rem;color:var(--text-secondary)}.level-grid-container{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 24px 24px}.level-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:16px;max-width:800px;margin:0 auto}.level-card{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px 16px;background:var(--card-bg);border:2px solid var(--border-color);border-radius:16px;cursor:default;transition:all .2s ease;height:140px;gap:6px}.level-card.playable{cursor:pointer}.level-card.playable:hover{transform:translateY(-4px);box-shadow:0 8px 24px #0000001f;border-color:var(--accent-color)}.level-card.available{border-color:var(--accent-color);background:linear-gradient(135deg,var(--card-bg) 0%,rgba(0,122,255,.05) 100%)}.level-card.in_progress{border-color:var(--warning-color, #f59e0b);background:linear-gradient(135deg,var(--card-bg) 0%,rgba(245,158,11,.05) 100%)}.level-card.completed{border-color:var(--success-color, #22c55e);background:linear-gradient(135deg,var(--card-bg) 0%,rgba(34,197,94,.05) 100%)}.level-card.locked{opacity:.6;background:var(--bg-secondary, #f0f0f0)}.level-number{font-size:1.1rem;font-weight:700;color:var(--text-primary)}.status-icon{font-size:1.5rem;line-height:1}.status-icon.completed{color:var(--success-color, #22c55e)}.status-icon.in-progress{color:var(--warning-color, #f59e0b)}.status-icon.locked{color:var(--text-secondary);font-size:1.2rem}.level-status{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.level-stats{font-size:.7rem;color:var(--text-secondary);margin-top:2px}.difficulty-stars{display:flex;gap:1px;font-size:.7rem;line-height:1}.difficulty-stars .star{color:#d1d5db}.difficulty-stars .star.filled{color:#fbbf24}[data-theme=dark] .difficulty-stars .star{color:#4b5563}[data-theme=dark] .difficulty-stars .star.filled{color:#fbbf24}.level-select-footer{padding:20px 24px;background:var(--card-bg);border-top:1px solid var(--border-color)}.stats-container{display:flex;justify-content:center;gap:40px;max-width:600px;margin:0 auto}.stat{display:flex;flex-direction:column;align-items:center;gap:4px}.stat-value{font-size:1.5rem;font-weight:800;color:var(--accent-color)}.stat-label{font-size:.75rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}[data-theme=dark] .level-select-header{background:#2c2c2e}[data-theme=dark] .level-card{background:#2c2c2e;border-color:#3a3a3c}[data-theme=dark] .level-card.available{background:linear-gradient(135deg,#2c2c2e,#007aff1a)}[data-theme=dark] .level-card.in_progress{background:linear-gradient(135deg,#2c2c2e,#f59e0b1a)}[data-theme=dark] .level-card.completed{background:linear-gradient(135deg,#2c2c2e,#22c55e1a)}[data-theme=dark] .level-card.locked{background:#1c1c1e}[data-theme=dark] .level-select-footer{background:#2c2c2e;border-color:#3a3a3c}@media (max-width: 480px){.level-select-header{flex-direction:column;align-items:flex-start;padding:12px 16px}.header-right{width:100%;justify-content:space-between}.level-select-intro{padding:12px 16px}.level-grid-container{padding:0 16px 16px}.level-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px}.level-card{height:120px;padding:16px 12px}}.swedish-grid-container{width:100%;max-width:500px;margin:0 auto;padding:4px;flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center}.grid-loading{display:flex;align-items:center;justify-content:center;height:300px;color:var(--text-secondary)}.unified-grid{display:grid;gap:3px;align-items:stretch}.external-hint-cell{background-color:var(--hint-bg, #e8eef4);display:flex;align-items:center;justify-content:center;border-radius:4px;padding:2px;cursor:pointer;transition:background-color .15s ease;min-height:0;min-width:0;overflow:visible;position:relative;aspect-ratio:1}.external-hint-cell.empty{background-color:transparent;cursor:default}.external-hint-cell.clickable:hover{background-color:var(--hint-hover-bg, #d0dce8)}.external-hint-cell .hint-content{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;gap:0;overflow:hidden;min-height:0}.external-hint-cell .hint-text{font-size:clamp(.4rem,1.8vw,.55rem);text-align:center;line-height:1.1;word-break:break-word;color:var(--hint-text, #333333);font-weight:500;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical}.external-hint-cell .hint-text-long{font-size:clamp(.35rem,1.5vw,.48rem);-webkit-line-clamp:4;line-height:1.05}.external-hint-cell .hint-text-very-long{font-size:clamp(.3rem,1.3vw,.42rem);-webkit-line-clamp:5;line-height:1}.external-hint-cell .hint-icon{font-size:clamp(.9rem,3.5vw,1.3rem)}.cell{background-color:var(--cell-bg);display:flex;align-items:center;justify-content:center;position:relative;aspect-ratio:1;min-height:0;min-width:0;box-shadow:inset -1px 0 0 var(--grid-line-color, #c8c8c8),inset 0 -1px 0 var(--grid-line-color, #c8c8c8)}.blocked-cell{background-color:var(--blocked-bg, #e8e8e8)}.hint-cell{background-color:var(--hint-bg, #e8eef4);color:var(--hint-text, #333333);padding:2px;cursor:pointer;flex-direction:column;font-size:.6rem;transition:background-color .15s ease;position:relative;overflow:visible}.hint-cell.clickable:hover,.hint-section.clickable:hover{background-color:var(--hint-hover-bg, #d0dce8)}.hint-cell.clickable:active,.hint-section.clickable:active,.external-hint-cell.clickable:active{background-color:var(--hint-hover-bg, #d0dce8);transform:scale(.97)}.hint-section.clickable{cursor:pointer;border-radius:2px;transition:background-color .15s ease}.hint-content{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;padding:2px;overflow:hidden}.hint-text{font-size:clamp(.4rem,1.8vw,.55rem);text-align:center;line-height:1.1;word-break:break-word;-webkit-hyphens:auto;hyphens:auto;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;color:var(--hint-text, #333333);font-weight:500;padding:0 1px}.hint-text-long{font-size:clamp(.35rem,1.5vw,.48rem);-webkit-line-clamp:5;line-height:1.05}.hint-text-very-long{font-size:clamp(.3rem,1.3vw,.42rem);-webkit-line-clamp:6;line-height:1}.hint-icon{font-size:clamp(.9rem,3.5vw,1.3rem);display:flex;align-items:center;justify-content:center}.arrow-indicator{position:absolute;width:0;height:0;pointer-events:none}.arrow-indicator.arrow-right{right:-8px;top:50%;transform:translateY(-50%);border-top:5px solid transparent;border-bottom:5px solid transparent;border-left:8px solid var(--arrow-color, #4a90d9)}.arrow-indicator.arrow-down{bottom:-8px;left:50%;transform:translate(-50%);border-left:5px solid transparent;border-right:5px solid transparent;border-top:8px solid var(--arrow-color, #4a90d9)}.double-hint{padding:1px;overflow:visible}.hint-section{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:1;width:100%;padding:1px;position:relative;overflow:visible}.hint-section .hint-text{font-size:clamp(.35rem,1.4vw,.45rem);-webkit-line-clamp:2}.hint-section .hint-icon{font-size:clamp(.7rem,2.5vw,.95rem)}.hint-section .arrow-indicator.arrow-right{right:-6px;border-top:4px solid transparent;border-bottom:4px solid transparent;border-left:6px solid var(--arrow-color, #4a90d9)}.hint-section .arrow-indicator.arrow-down{bottom:-6px;border-left:4px solid transparent;border-right:4px solid transparent;border-top:6px solid var(--arrow-color, #4a90d9)}.hint-divider{width:90%;height:1px;background-color:var(--hint-divider, #b0b8c0);flex-shrink:0}.letter-cell{background-color:#fff;cursor:pointer;transition:all .15s ease;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;position:relative}.letter-cell.placed{touch-action:none}.letter-cell:hover{background-color:var(--cell-highlight, #f0f7ff)}.letter-cell:active{background-color:var(--cell-selected, #cce5ff);transform:scale(.95)}.letter-cell.selected{background-color:var(--cell-selected, #cce5ff);box-shadow:inset 0 0 0 2px var(--accent-color, #007aff),inset -1px 0 0 var(--grid-line-color, #c8c8c8),inset 0 -1px 0 var(--grid-line-color, #c8c8c8)}.letter-cell.correct{background-color:var(--cell-correct, #d1fae5);cursor:default}.letter-cell.placed{background-color:var(--cell-placed, #fff8e6);cursor:grab}.letter-cell.placed:active{cursor:grabbing}.letter-cell.drag-over{background-color:var(--cell-drag-over, #bfdbfe);box-shadow:inset 0 0 0 2px var(--accent-color, #007aff),inset -1px 0 0 var(--grid-line-color, #c8c8c8),inset 0 -1px 0 var(--grid-line-color, #c8c8c8)}.letter-cell.dragging{opacity:.5;cursor:grabbing}.letter{font-size:clamp(1rem,4vw,1.4rem);font-weight:700;color:var(--text-primary, #1d1d1f);text-transform:uppercase}.letter-cell.correct .letter{color:var(--success-color, #22c55e)}.letter-cell.placed .letter{color:var(--placed-letter-color, #b45309)}.letter-cell.show-answer{background-color:#f0f9ff}.letter-cell.show-answer .letter{color:#64748b}.letter-cell .answer-hint{position:absolute;bottom:1px;right:2px;font-size:clamp(.5rem,2vw,.7rem);font-weight:600;color:#94a3b8;opacity:.7;line-height:1}:root{--hint-bg: #e8eef4;--hint-text: #2c3e50;--hint-hover-bg: #d0dce8;--hint-divider: #b0b8c0;--arrow-color: #4a90d9;--blocked-bg: #e0e0e0;--grid-line-color: #c8c8c8;--grid-border-color: #a0a0a0}[data-theme=dark]{--hint-bg: #2a3a4a;--hint-text: #e0e6ec;--hint-hover-bg: #3a4a5a;--hint-divider: #4a5a6a;--arrow-color: #6aafef;--blocked-bg: #1a1a1a;--grid-line-color: #3a3a3a;--grid-border-color: #4a4a4a;--cell-placed: #4a3c12;--placed-letter-color: #fbbf24;--cell-drag-over: #1e3a5f}[data-theme=dark] .letter-cell{background-color:#2c2c2e}[data-theme=dark] .letter-cell:hover{background-color:#3c3c3e}[data-theme=dark] .letter-cell.drag-over{background-color:var(--cell-drag-over)}[data-theme=dark] .letter{color:#fff}[data-theme=dark] .external-hint-cell{background-color:var(--hint-bg)}[data-theme=dark] .external-hint-cell .hint-text{color:var(--hint-text)}.hint-popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .15s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.hint-popup{background-color:#fff;color:#2c3e50;padding:24px 32px;border-radius:16px;box-shadow:0 8px 32px #0003;position:relative;min-width:160px;max-width:280px;animation:popIn .2s ease}[data-theme=dark] .hint-popup{background-color:#2c2c2e;color:#e0e6ec}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.hint-popup-content{display:flex;flex-direction:column;align-items:center;gap:16px}.hint-popup-text{font-size:1.3rem;text-align:center;line-height:1.4;word-break:break-word;font-weight:500}.hint-popup-icon{font-size:3.5rem}.hint-popup .arrow-indicator{position:static;transform:none;margin-top:8px}.hint-popup .arrow-indicator.arrow-right{border-top:10px solid transparent;border-bottom:10px solid transparent;border-left:16px solid var(--arrow-color, #4a90d9)}.hint-popup .arrow-indicator.arrow-down{border-left:10px solid transparent;border-right:10px solid transparent;border-top:16px solid var(--arrow-color, #4a90d9)}.hint-popup-close{position:absolute;top:8px;right:12px;background:none;border:none;color:#888;font-size:1.4rem;cursor:pointer;opacity:.6;transition:opacity .15s ease;padding:4px 8px;line-height:1}.hint-popup-close:hover{opacity:1}@media (max-width: 400px){.swedish-grid-container{padding:4px}.hint-text{font-size:clamp(.35rem,1.5vw,.5rem)}}@media (min-width: 500px){.swedish-grid-container{max-width:520px}}.letter-rack-container{width:100%;max-width:450px;margin:0 auto;padding:8px 12px;background-color:var(--card-bg);border-radius:12px;box-shadow:var(--shadow);flex-shrink:0}.letter-rack{display:flex;justify-content:center;gap:8px;margin-bottom:6px;padding:6px;border-radius:8px;transition:background-color .2s ease,box-shadow .2s ease}.letter-rack.rack-drag-over{background-color:var(--rack-drag-bg, rgba(0, 122, 255, .1));box-shadow:inset 0 0 0 2px var(--accent-color, #007aff)}.rack-letter{width:48px;height:48px;border:none;border-radius:10px;background:linear-gradient(145deg,var(--letter-bg-light, #f8f9fa),var(--letter-bg, #e9ecef));color:var(--text-primary);font-size:1.4rem;font-weight:800;cursor:grab;transition:all .2s ease;box-shadow:0 3px 6px #0000001a,inset 0 1px #ffffff80;text-transform:uppercase;touch-action:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;min-height:44px;min-width:44px}.rack-letter:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 6px 12px #00000026,inset 0 1px #ffffff80}.rack-letter:active:not(:disabled){cursor:grabbing;transform:scale(.95);box-shadow:0 2px 4px #0000001a,inset 0 1px #ffffff80}.rack-letter.dragging{opacity:.5;transform:scale(.95);cursor:grabbing}.rack-letter.available{background:linear-gradient(145deg,var(--accent-light, #cce5ff),var(--accent-color));color:#fff;animation:pulse 1.5s ease-in-out infinite}.rack-letter.used{opacity:.3;cursor:not-allowed;transform:scale(.9);box-shadow:none}.rack-letter:disabled:not(.used){opacity:.6;cursor:not-allowed}@keyframes pulse{0%,to{box-shadow:0 3px 6px #0000001a,0 0 #007aff66}50%{box-shadow:0 3px 6px #0000001a,0 0 0 8px #007aff00}}.progress-bar{width:100%;height:4px;background-color:var(--border-color);border-radius:2px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent-color),var(--success-color));border-radius:3px;transition:width .3s ease}[data-theme=dark]{--letter-bg: #3a3a3c;--letter-bg-light: #4a4a4c;--accent-light: #0a4a8a;--rack-drag-bg: rgba(100, 160, 255, .15)}[data-theme=dark] .rack-letter{box-shadow:0 3px 6px #0000004d,inset 0 1px #ffffff1a}@media (max-width: 380px){.letter-rack-container{padding:10px 12px}.letter-rack{gap:8px}.rack-letter{width:46px;height:46px;font-size:1.3rem}}@media (min-width: 400px){.rack-letter{width:56px;height:56px;font-size:1.6rem}}.game-controls{display:flex;justify-content:center;padding:8px 12px;width:100%;max-width:450px;margin:0 auto;flex-shrink:0}.control-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border:none;border-radius:12px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;max-width:320px}.control-btn:disabled,.control-btn.not-ready{opacity:.5;cursor:not-allowed}.control-btn:not(:disabled):not(.not-ready):hover{transform:translateY(-2px);box-shadow:0 6px 16px #00000026}.control-btn:not(:disabled):not(.not-ready):active{transform:translateY(0)}.btn-icon{font-size:1.2rem}.btn-text{font-size:.95rem}.control-btn.submit{background-color:var(--border-color);color:var(--text-secondary)}.control-btn.submit.ready{background:linear-gradient(135deg,var(--accent-color),var(--accent-hover));color:#fff;animation:readyPulse 2s ease-in-out infinite}@keyframes readyPulse{0%,to{box-shadow:0 4px 12px #007aff4d}50%{box-shadow:0 4px 20px #007aff80}}.control-btn.new-game{background:linear-gradient(135deg,var(--success-color),#22c55e);color:#fff}.control-btn.new-game:hover{background:linear-gradient(135deg,#22c55e,var(--success-color))}@media (max-width: 380px){.game-controls{padding:10px 12px}.control-btn{padding:14px 20px}.btn-text{font-size:.85rem}}.game-header{display:flex;align-items:center;justify-content:space-between;width:100%;padding:8px 12px;background:var(--card-bg);border-bottom:1px solid var(--border-color);flex-shrink:0}.back-button{width:36px;height:36px;display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:600;color:var(--accent-color);background:transparent;border:none;border-radius:8px;cursor:pointer;transition:background-color .2s ease}.back-button:active{background-color:var(--border-color)}.header-center{display:flex;flex-direction:column;align-items:center;gap:2px}.game-title{font-size:1rem;font-weight:700;color:var(--text-primary)}.level-nav{display:flex;align-items:center;gap:8px}.level-nav-btn{background:transparent;border:none;color:var(--accent-color);font-size:.7rem;cursor:pointer;padding:2px 4px;border-radius:4px;line-height:1;transition:opacity .2s ease}.level-nav-btn:disabled{opacity:.2;cursor:default}.level-nav-btn:not(:disabled):active{background-color:var(--border-color)}.header-stats{display:flex;align-items:center;gap:10px}.mistake-hearts{display:flex;gap:2px}.heart{font-size:.9rem}.heart.empty{opacity:.4}.round-badge{font-size:.75rem;font-weight:600;color:var(--accent-color);background-color:var(--accent-light);padding:2px 6px;border-radius:4px}.theme-toggle{width:36px;height:36px;border:none;border-radius:50%;background-color:var(--bg-primary);font-size:1rem;cursor:pointer;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.theme-toggle:active{transform:scale(.95)}.completion-banner{margin-top:12px;padding:12px 16px;border-radius:10px;text-align:center;font-weight:600;font-size:1rem;animation:slideIn .3s ease;display:flex;flex-direction:column;gap:10px}.completion-buttons{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.next-puzzle-btn,.replay-btn{padding:8px 16px;border:none;border-radius:8px;font-weight:600;font-size:.9rem;cursor:pointer;transition:transform .2s ease,opacity .2s ease}.next-puzzle-btn{background-color:#065f46;color:#fff}.next-puzzle-btn:hover{transform:scale(1.05);opacity:.9}.replay-btn{background-color:var(--card-bg);color:var(--text-primary);border:1px solid var(--border-color, #ccc)}.replay-btn:hover{transform:scale(1.05)}.all-complete{font-size:1rem;font-weight:700}[data-theme=dark] .next-puzzle-btn{background-color:#10b981;color:#064e3b}[data-theme=dark] .replay-btn{background-color:#374151;color:#f3f4f6;border-color:#4b5563}.completion-banner.success{background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#065f46}.completion-banner.failure{background:linear-gradient(135deg,#fee2e2,#fecaca);color:#991b1b}[data-theme=dark] .completion-banner.success{background:linear-gradient(135deg,#064e3b,#065f46);color:#a7f3d0}[data-theme=dark] .completion-banner.failure{background:linear-gradient(135deg,#450a0a,#7f1d1d);color:#fecaca}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 380px){.game-header{padding:10px 12px}.game-title{font-size:1.2rem}.header-stats{padding:8px 12px}}.celebration-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#000000b3;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.confetti-container{position:absolute;top:0;right:0;bottom:0;left:0;overflow:hidden;pointer-events:none}.confetti-piece{position:absolute;top:-20px;border-radius:2px;animation:confetti-fall linear forwards}@keyframes confetti-fall{0%{transform:translateY(0) rotate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg);opacity:0}}.celebration-icon{margin-bottom:24px;opacity:0;transform:scale(.5);transition:all .5s cubic-bezier(.175,.885,.32,1.275)}.celebration-icon.show{opacity:1;transform:scale(1)}.checkmark-circle{width:100px;height:100px;position:relative}.checkmark{width:100%;height:100%;border-radius:50%;display:block;stroke-width:3;stroke:#4ade80;stroke-miterlimit:10;animation:checkmark-fill .4s ease-in-out .4s forwards,checkmark-scale .3s ease-in-out .9s both}.checkmark-circle-bg{stroke:#4ade80;stroke-dasharray:166;stroke-dashoffset:166;animation:checkmark-stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark-check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;stroke:#4ade80;stroke-width:4;stroke-linecap:round;animation:checkmark-stroke .3s cubic-bezier(.65,0,.45,1) .6s forwards}@keyframes checkmark-stroke{to{stroke-dashoffset:0}}@keyframes checkmark-fill{to{box-shadow:inset 0 0 0 100px #4ade801a}}@keyframes checkmark-scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}.celebration-content{text-align:center;opacity:0;transform:translateY(20px);transition:all .5s ease-out .3s}.celebration-content.show{opacity:1;transform:translateY(0)}.celebration-title{font-size:2.5rem;font-weight:800;color:#fff;margin:0 0 8px;text-shadow:0 2px 10px rgba(0,0,0,.3)}.celebration-subtitle{font-size:1.1rem;color:#fffc;margin:0 0 32px}.celebration-stats{display:flex;justify-content:center;gap:32px;margin-bottom:32px}.stat-item{display:flex;flex-direction:column;align-items:center;background:#ffffff1a;padding:16px 24px;border-radius:12px;min-width:80px}.stat-item .stat-value{font-size:1.8rem;font-weight:800;color:#fff}.stat-item .stat-label{font-size:.75rem;color:#ffffffb3;text-transform:uppercase;letter-spacing:.5px;margin-top:4px}.celebration-button{padding:16px 48px;font-size:1.1rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#4ade80,#22c55e);border:none;border-radius:12px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 15px #22c55e66}.celebration-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #22c55e80}.celebration-button:active{transform:translateY(0)}@media (max-width: 480px){.checkmark-circle{width:80px;height:80px}.celebration-title{font-size:2rem}.celebration-stats{gap:16px}.stat-item{padding:12px 16px;min-width:70px}.stat-item .stat-value{font-size:1.5rem}.celebration-button{padding:14px 40px;font-size:1rem}}.game-page{height:100%;display:flex;flex-direction:column;background:var(--bg-primary);overflow:hidden}.game-loading{flex:1;display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:var(--text-secondary)}.game-main{flex:1;display:flex;flex-direction:column;align-items:center;padding:8px;gap:8px;max-width:600px;width:100%;margin:0 auto;overflow:hidden;min-height:0}.game-end-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.game-end-modal{background:var(--card-bg);border-radius:20px;padding:32px;text-align:center;max-width:320px;width:100%;box-shadow:0 20px 60px #0000004d}.game-end-modal h2{margin:0 0 12px;font-size:1.5rem;color:var(--text-primary)}.game-end-modal p{margin:0 0 24px;color:var(--text-secondary)}.primary-button{padding:14px 28px;font-size:1rem;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--accent-color) 0%,#0056b3 100%);border:none;border-radius:12px;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease}.primary-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #007aff4d}[data-theme=dark] .game-top-bar{background:#2c2c2e;border-color:#3a3a3c}[data-theme=dark] .game-end-modal{background:#2c2c2e}.completed-message{display:flex;flex-direction:column;align-items:center;gap:16px;padding:20px;margin-top:auto}.completed-message p{color:var(--text-secondary);font-size:1rem;margin:0}.highscores-page{min-height:100vh;display:flex;flex-direction:column;background:var(--bg-primary)}.highscores-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:var(--card-bg);box-shadow:0 2px 8px #0000001a}.highscores-header h1{margin:0;font-size:1.5rem;font-weight:800;color:var(--accent-color)}.back-button{display:flex;align-items:center;gap:4px;padding:8px 16px;font-size:.9rem;font-weight:600;color:var(--accent-color);background:transparent;border:none;cursor:pointer;transition:opacity .2s ease}.back-button:hover{opacity:.7}.connection-status{font-size:.8rem}.status-online{color:var(--success-color, #22c55e)}.status-offline{color:var(--error-color, #ef4444)}.highscores-content{flex:1;padding:24px;max-width:800px;width:100%;margin:0 auto}.level-filter{display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap}.filter-btn{padding:8px 16px;font-size:.85rem;font-weight:600;color:var(--text-secondary);background:var(--card-bg);border:2px solid var(--border-color);border-radius:20px;cursor:pointer;transition:all .2s ease}.filter-btn:hover{border-color:var(--accent-color);color:var(--accent-color)}.filter-btn.active{background:var(--accent-color);border-color:var(--accent-color);color:#fff}.user-rank-summary{padding:12px 16px;margin-bottom:20px;background:linear-gradient(135deg,var(--card-bg) 0%,rgba(0,122,255,.1) 100%);border:2px solid var(--accent-color);border-radius:12px;font-size:.95rem;color:var(--text-primary);text-align:center}.user-rank-summary strong{color:var(--accent-color)}.highscores-table-container{overflow-x:auto;border-radius:12px;box-shadow:0 2px 8px #00000014}.highscores-table{width:100%;border-collapse:collapse;background:var(--card-bg)}.highscores-table th,.highscores-table td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--border-color)}.highscores-table th{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--text-secondary);background:var(--bg-secondary, #f5f5f5)}.highscores-table tbody tr:hover{background:var(--bg-secondary, #f9f9f9)}.highscores-table tbody tr:last-child td{border-bottom:none}.highscore-row.current-user{background:linear-gradient(135deg,#007aff0d,#007aff1a)}.highscore-row.current-user:hover{background:linear-gradient(135deg,#007aff14,#007aff26)}.rank-cell{width:50px;text-align:center}.rank-medal{font-size:1.2rem}.rank-number{font-weight:700;color:var(--text-secondary)}.username-cell{font-weight:600;color:var(--text-primary)}.you-badge{display:inline-block;margin-left:8px;padding:2px 8px;font-size:.65rem;font-weight:700;text-transform:uppercase;background:var(--accent-color);color:#fff;border-radius:10px}.score-cell{font-weight:700;color:var(--accent-color)}.levels-cell,.mistakes-cell,.time-cell{color:var(--text-secondary)}.score-header,.levels-header,.mistakes-header,.time-header,.score-cell,.levels-cell,.mistakes-cell,.time-cell{text-align:right}.highscores-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:var(--text-secondary)}.loading-spinner{width:40px;height:40px;border:3px solid var(--border-color);border-top-color:var(--accent-color);border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{to{transform:rotate(360deg)}}.highscores-error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.error-icon{font-size:3rem;margin-bottom:16px}.highscores-error p{margin:0 0 20px;color:var(--text-secondary)}.retry-button{padding:10px 24px;font-size:.9rem;font-weight:600;color:#fff;background:var(--accent-color);border:none;border-radius:8px;cursor:pointer;transition:opacity .2s ease}.retry-button:hover{opacity:.9}.highscores-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.empty-icon{font-size:4rem;margin-bottom:16px}.highscores-empty p{margin:0;font-size:1.1rem;color:var(--text-primary)}.empty-hint{margin-top:8px!important;font-size:.9rem!important;color:var(--text-secondary)!important}.highscores-footer{padding:16px 24px;background:var(--card-bg);border-top:1px solid var(--border-color);text-align:center}.score-info{margin:0;font-size:.8rem;color:var(--text-secondary)}[data-theme=dark] .highscores-header,[data-theme=dark] .highscores-table,[data-theme=dark] .highscores-footer{background:#2c2c2e}[data-theme=dark] .highscores-table th{background:#1c1c1e}[data-theme=dark] .highscores-table tbody tr:hover{background:#3a3a3c}[data-theme=dark] .highscore-row.current-user{background:linear-gradient(135deg,#007aff1a,#007aff33)}@media (max-width: 600px){.highscores-header{flex-wrap:wrap;gap:12px}.highscores-header h1{order:-1;width:100%;text-align:center}.highscores-table th,.highscores-table td{padding:10px 8px;font-size:.85rem}.mistakes-header,.mistakes-cell,.time-header,.time-cell{display:none}}.app-container{height:100%;overflow:hidden;background-color:var(--bg-primary);padding-top:env(safe-area-inset-top);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);padding-bottom:env(safe-area-inset-bottom)}.loading-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-primary)}.loading-spinner{font-size:1.2rem;color:var(--text-secondary)}.game-layout{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;max-width:600px;margin:0 auto;padding-bottom:env(safe-area-inset-bottom,16px)}.puzzle-section{flex:0 0 auto;display:flex;justify-content:center}.rack-section{flex:0 0 auto;padding:8px}.game-footer{margin-top:auto;padding:12px 16px;text-align:center}.game-footer p{font-size:.75rem;color:var(--text-secondary);margin:0}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.puzzle-section{animation:fadeIn .4s ease}.rack-section{animation:fadeIn .4s ease .1s both}@media (min-width: 768px){.game-layout{padding:16px;max-width:500px}}:root{--bg-primary: #f0f2f5;--bg-secondary: #ffffff;--card-bg: #ffffff;--text-primary: #1d1d1f;--text-secondary: #6e6e73;--accent-color: #007aff;--accent-hover: #0056b3;--accent-light: #cce5ff;--success-color: #34c759;--error-color: #ff3b30;--warning-color: #ff9500;--border-color: #d2d2d7;--grid-border: #2c3e50;--cell-bg: #ffffff;--cell-blocked: #1a1a2e;--cell-highlight: #e8f4fd;--cell-selected: #b3d7ff;--cell-correct: #d1fae5;--cell-placed: #fef3c7;--hint-bg: #2c3e50;--hint-text: #ffffff;--letter-bg: #e9ecef;--letter-bg-light: #f8f9fa;--placed-letter-color: #92400e;--shadow: 0 2px 8px rgba(0, 0, 0, .08);--shadow-lg: 0 4px 16px rgba(0, 0, 0, .12);--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif}[data-theme=dark]{--bg-primary: #000000;--bg-secondary: #1c1c1e;--card-bg: #2c2c2e;--text-primary: #ffffff;--text-secondary: #98989d;--accent-color: #0a84ff;--accent-hover: #409cff;--accent-light: #0a4a8a;--success-color: #30d158;--error-color: #ff453a;--warning-color: #ff9f0a;--border-color: #48484a;--grid-border: #48484a;--cell-bg: #3a3a3c;--cell-blocked: #000000;--cell-highlight: #1c3a5e;--cell-selected: #0a4a8a;--cell-correct: #064e3b;--cell-placed: #4a3c12;--hint-bg: #1a252f;--hint-text: #e0e0e0;--letter-bg: #3a3a3c;--letter-bg-light: #4a4a4c;--placed-letter-color: #fbbf24;--shadow: 0 2px 8px rgba(0, 0, 0, .3);--shadow-lg: 0 4px 16px rgba(0, 0, 0, .4)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-text-size-adjust:100%;touch-action:manipulation;overflow:hidden;height:100%}body{font-family:var(--font-family);background-color:var(--bg-primary);color:var(--text-primary);line-height:1.5;height:100%;overflow:hidden;position:fixed;width:100%;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}#root{height:100%;overflow:hidden}button{font-family:inherit;cursor:pointer;border:none;background:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent}input{font-family:inherit;border:none;outline:none;background:none;-webkit-user-select:text;user-select:text}::selection{background-color:var(--accent-color);color:#fff}:focus-visible{outline:2px solid var(--accent-color);outline-offset:2px}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background-color:var(--border-color);border-radius:3px}button:active,.clickable:active{transform:scale(.97);opacity:.8}.game-page,.swedish-grid-container,.letter-rack-container{-webkit-user-select:none;user-select:none;touch-action:manipulation}.back-button,.primary-button,.rack-letter{min-height:44px;min-width:44px}.touch-drag-ghost{font-family:var(--font-family)}