:root{--primary: #6C63FF;--primary-dark: #5A52D5;--secondary: #FF6B6B;--success: #4CAF50;--warning: #FFB74D;--danger: #EF5350;--bg-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--card-bg: #ffffff;--text-primary: #1a1a2e;--text-secondary: #666;--text-light: #999;--shadow: 0 4px 20px rgba(0, 0, 0, .1);--shadow-lg: 0 8px 40px rgba(0, 0, 0, .15);--radius: 16px;--radius-sm: 10px}*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{height:100%;overflow:hidden}body{font-family:Fredoka,system-ui,-apple-system,sans-serif;background:var(--bg-gradient);color:var(--text-primary);min-height:100vh;min-height:100dvh}#root{max-width:100%;margin:0;padding:0;text-align:left;height:100vh;height:100dvh;overflow:hidden}.app{height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column}.btn{font-family:Fredoka,system-ui,sans-serif;border:none;border-radius:var(--radius-sm);cursor:pointer;font-weight:600;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 20px;font-size:1rem}.btn:active{transform:scale(.96)}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-dark)}.btn-primary:disabled{background:#aaa;cursor:default}.btn-secondary{background:#e8e8f0;color:var(--text-primary)}.btn-secondary:hover{background:#d8d8e0}.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#d32f2f}.btn-warning{background:var(--warning);color:var(--text-primary)}.btn-large{padding:16px 32px;font-size:1.2rem;border-radius:var(--radius)}.btn-small{padding:6px 14px;font-size:.85rem;border-radius:8px}.form-group{margin-bottom:16px;text-align:left}.form-group label{display:block;font-weight:600;margin-bottom:6px;color:var(--text-primary);font-size:.95rem}.input-field{width:100%;padding:12px 16px;border:2px solid #e0e0e0;border-radius:var(--radius-sm);font-family:Fredoka,system-ui,sans-serif;font-size:1rem;transition:border-color .2s;outline:none}.input-field:focus{border-color:var(--primary)}.inline-form{display:flex;gap:8px}.inline-form .input-field{flex:1}.setup-container{height:100vh;height:100dvh;display:flex;align-items:center;justify-content:center;background:var(--bg-gradient);padding:20px}.setup-card{background:var(--card-bg);border-radius:var(--radius);padding:40px 30px;max-width:600px;width:100%;box-shadow:var(--shadow-lg);text-align:center}.setup-icon{font-size:3rem;margin-bottom:12px}.setup-card h1{font-size:1.8rem;color:var(--primary);margin-bottom:4px}.setup-subtitle{color:var(--text-secondary);margin-bottom:24px}.home-container{height:100vh;height:100dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;align-items:center;padding:30px 20px 100px;gap:20px}.home-summary-row{width:100%;max-width:600px;display:grid;grid-template-columns:1fr;gap:12px;align-items:stretch}.home-summary-row.has-stats{grid-template-columns:minmax(170px,220px) 1fr}.home-header{text-align:center;color:#fff}.app-title{font-size:3rem;font-weight:700;text-shadow:0 2px 10px rgba(0,0,0,.2);letter-spacing:2px}.app-subtitle{font-size:1.1rem;opacity:.9;margin-top:2px}.streak-card{background:var(--card-bg);border-radius:var(--radius);padding:24px 32px;text-align:center;box-shadow:var(--shadow);width:100%;max-width:600px}.streak-card.compact{padding:14px 16px;display:flex;flex-direction:column;justify-content:center}.streak-flames{font-size:1.8rem;margin-bottom:4px;min-height:2rem}.streak-card.compact .streak-flames{font-size:1.3rem;min-height:1.4rem;margin-bottom:2px}.streak-number{font-size:3rem;font-weight:700;color:var(--secondary);line-height:1}.streak-card.compact .streak-number{font-size:2rem}.streak-label{color:var(--text-secondary);font-weight:500;font-size:1rem}.streak-card.compact .streak-label{font-size:.9rem}.stats-card{background:var(--card-bg);border-radius:var(--radius);padding:20px;display:flex;align-items:center;justify-content:center;gap:20px;box-shadow:var(--shadow);width:100%;max-width:600px}.home-summary-row .stats-card{max-width:none;padding:14px 16px;gap:14px}.stat-item{text-align:center}.stat-value{font-size:1.6rem;font-weight:700;color:var(--primary)}.stat-label{font-size:.8rem;color:var(--text-secondary);font-weight:500}.stat-divider{width:1px;height:40px;background:#e0e0e0}.categories-card{background:var(--card-bg);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow);width:100%;max-width:600px}.categories-card h3{margin-bottom:12px;color:var(--text-primary);font-size:1rem}.category-list{display:flex;flex-direction:column;gap:10px}.category-item{display:flex;align-items:center;gap:10px}.category-name{font-size:.8rem;font-weight:500;width:140px;flex-shrink:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.category-bar-container{flex:1;height:8px;background:#eee;border-radius:4px;overflow:hidden}.category-bar{height:100%;border-radius:4px;transition:width .5s ease}.bar-great{background:var(--success)}.bar-ok{background:var(--warning)}.bar-weak{background:var(--danger)}.category-pct{font-size:.8rem;font-weight:600;color:var(--text-secondary);width:36px;text-align:right}.start-btn{width:100%;max-width:600px;margin-top:0}.home-footer{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:16px;padding:12px 20px;background:#0003;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.footer-btn{font-family:Fredoka,system-ui,sans-serif;background:none;border:none;color:#ffffffb3;font-size:.8rem;cursor:pointer;padding:6px 12px;border-radius:8px;transition:all .2s}.footer-btn:hover{color:#fff;background:#ffffff1a}.footer-btn.update-available{color:gold;font-weight:600;animation:pulse 2s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:center;justify-content:center;padding:20px;z-index:1000;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.modal-card{background:var(--card-bg);border-radius:var(--radius);padding:30px;max-width:600px;width:100%;box-shadow:var(--shadow-lg)}.modal-card h2,.modal-card h3{margin-bottom:16px;text-align:center}.modal-buttons{display:flex;gap:10px;margin-top:20px;justify-content:flex-end}.admin-card .btn-danger{width:100%;margin-top:12px}.admin-message{text-align:center;margin-top:12px;padding:8px;border-radius:8px;background:#e8f5e9;color:var(--success);font-weight:500}.quiz-container{height:100vh;height:100dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;padding:16px;gap:16px}.quiz-header{display:flex;align-items:center;gap:12px;color:#fff}.quiz-progress{flex:1}.quiz-progress-text{font-size:.85rem;font-weight:600;opacity:.9}.quiz-progress-bar{height:6px;background:#ffffff4d;border-radius:3px;margin-top:4px;overflow:hidden}.quiz-progress-fill{height:100%;background:#fff;border-radius:3px;transition:width .3s ease}.quiz-score{font-size:.9rem;font-weight:600;color:#ffffffe6;white-space:nowrap}.question-card{background:var(--card-bg);border-radius:var(--radius);padding:24px 20px;box-shadow:var(--shadow);flex:1;display:flex;flex-direction:column;overflow-y:auto}.question-category{display:inline-block;background:#f0f0ff;color:var(--primary);padding:4px 12px;border-radius:20px;font-size:.8rem;font-weight:600;margin-bottom:16px;align-self:flex-start}.question-text{font-size:1.15rem;font-weight:500;line-height:1.5;margin-bottom:24px;color:var(--text-primary)}.options-grid{display:flex;flex-direction:column;gap:10px;margin-bottom:16px}.option-btn{position:relative;display:flex;align-items:center;gap:14px;padding:14px 16px;border:2px solid #e0e0e0;border-radius:var(--radius-sm);background:#fff;cursor:pointer;font-family:Fredoka,system-ui,sans-serif;font-size:1rem;text-align:left;transition:all .2s ease;width:100%}.option-btn:hover:not(:disabled){border-color:var(--primary);background:#f8f7ff}.option-btn:active:not(:disabled){transform:scale(.98)}.option-letter{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:#f0f0f0;font-weight:700;font-size:1rem;flex-shrink:0;color:var(--text-primary)}.option-text{flex:1;font-weight:500}.option-selected{border-color:var(--primary);background:#f0f0ff}.option-selected .option-letter{background:var(--primary);color:#fff}.option-correct{border-color:var(--success);background:#e8f5e9}.option-correct .option-letter{background:var(--success);color:#fff}.option-wrong{border-color:var(--danger);background:#ffebee}.option-wrong .option-letter{background:var(--danger);color:#fff}.option-disabled{opacity:.5}.option-eliminate{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:#f0f0f0;color:#999;font-size:.85rem;font-weight:700;flex-shrink:0;transition:all .15s ease;cursor:pointer}.option-eliminate:hover{background:#e0e0e0;color:#666}.option-eliminate-active{background:var(--danger);color:#fff}.option-eliminate-active:hover{background:#d32f2f;color:#fff}.option-eliminated{opacity:.4;border-color:#ddd;background:#f5f5f5;text-decoration:line-through;text-decoration-color:var(--danger)}.option-eliminated .option-letter{background:#ddd;color:#999}.option-eliminated .option-text{color:#999}.feedback-card{border-radius:var(--radius-sm);padding:16px;margin-top:auto}.feedback-correct{background:#e8f5e9;border:2px solid var(--success)}.feedback-wrong{background:#ffebee;border:2px solid var(--danger)}.feedback-header{font-weight:600;font-size:1.1rem;margin-bottom:8px}.feedback-explanation{color:var(--text-secondary);font-size:.95rem;line-height:1.5;margin-bottom:16px}.scratch-fab{position:fixed;bottom:24px;right:24px;width:60px;height:60px;border-radius:50%;background:var(--primary);border:none;box-shadow:0 4px 16px #6c63ff66;font-size:1.5rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;z-index:100}.scratch-fab:active{transform:scale(.9)}.loading-card,.error-card{background:var(--card-bg);border-radius:var(--radius);padding:48px 32px;text-align:center;box-shadow:var(--shadow);max-width:600px;margin:auto}.loading-emoji,.error-emoji{font-size:4rem;margin-bottom:16px}.loading-card h2,.error-card h2{margin-bottom:8px}.loading-card p,.error-card p{color:var(--text-secondary);margin-bottom:24px}.loading-bar{height:6px;background:#eee;border-radius:3px;overflow:hidden}.loading-bar-fill{height:100%;width:40%;background:var(--primary);border-radius:3px;animation:loading-slide 1.5s infinite ease-in-out}@keyframes loading-slide{0%{transform:translate(-100%)}to{transform:translate(350%)}}.error-actions{display:flex;gap:10px;justify-content:center}.scratchpad-overlay{position:fixed;inset:0;background:#fff;z-index:2000;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.scratchpad-container{display:flex;flex-direction:column;height:100%}.scratchpad-toolbar{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:#f8f8f8;border-bottom:1px solid #e0e0e0;gap:8px;flex-wrap:wrap}.scratchpad-colors{display:flex;gap:6px}.color-btn{width:32px;height:32px;border-radius:50%;border:3px solid transparent;cursor:pointer;transition:all .2s}.color-btn.color-active{border-color:var(--primary);box-shadow:0 0 0 2px #fff,0 0 0 4px var(--primary)}.scratchpad-actions{display:flex;gap:6px}.scratchpad-question{padding:12px 16px;background:#fffde7;border-bottom:1px solid #e0e0e0;font-size:.95rem;font-weight:500;color:var(--text-primary);line-height:1.4}.scratchpad-options{display:grid;grid-template-columns:1fr 1fr;gap:6px 16px;margin-top:8px;font-weight:400;font-size:.9rem}.scratchpad-option{padding:2px 0}.scratchpad-canvas-wrapper{flex:1;overflow:hidden;background:#fff}.scratchpad-canvas{display:block;width:100%;height:100%;touch-action:none;cursor:crosshair}.results-container{height:100vh;height:100dvh;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;align-items:center;padding:30px 20px 40px;gap:20px}.results-header{text-align:center;color:#fff}.results-header h1{font-size:2rem;text-shadow:0 2px 10px rgba(0,0,0,.2)}.results-subtitle{opacity:.9;font-size:1.1rem}.results-emoji{font-size:4rem;margin-bottom:8px}.score-circle{background:var(--card-bg);border-radius:50%;width:160px;height:160px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:var(--shadow-lg)}.score-number{font-size:3rem;font-weight:700;color:var(--primary);line-height:1}.score-divider{color:var(--text-light);font-size:1.2rem;margin:-2px 0}.score-total{font-size:1.5rem;font-weight:600;color:var(--text-secondary)}.score-pct{font-size:.85rem;color:var(--text-light);font-weight:600;margin-top:2px}.results-breakdown,.results-overall{background:var(--card-bg);border-radius:var(--radius);padding:20px;width:100%;max-width:600px;box-shadow:var(--shadow)}.results-breakdown h3,.results-overall h3{margin-bottom:12px;font-size:1rem}.result-category{margin-bottom:12px}.result-cat-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.result-cat-name{font-size:.85rem;font-weight:500}.result-cat-score{font-size:.85rem;font-weight:600;color:var(--text-secondary)}.results-overall p{color:var(--text-secondary);margin-bottom:6px;font-size:.95rem}.results-actions{display:flex;flex-direction:column;gap:10px;width:100%;max-width:600px}.results-actions .btn{width:100%}.results-layout{display:flex;flex-direction:column;width:100%;max-width:600px;gap:20px}.results-left,.results-right{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%}.results-left .results-overall,.results-left .results-actions,.results-right .results-breakdown{max-width:100%}@media(max-width:480px){.app-title{font-size:2.4rem}.question-text{font-size:1.05rem}.score-circle{width:130px;height:130px}.score-number{font-size:2.4rem}.home-container{gap:14px;padding-top:18px}.home-summary-row{grid-template-columns:1fr;gap:10px}.streak-card.compact,.home-summary-row .stats-card{padding:12px}.home-summary-row .stat-value{font-size:1.35rem}}@media(min-width:768px){.home-container,.quiz-container,.results-container{width:80%;margin:0 auto}.streak-card,.stats-card,.categories-card,.start-btn,.results-breakdown,.results-overall,.results-actions,.loading-card,.error-card,.setup-card{max-width:80%}}@media(min-width:768px)and (orientation:landscape){.results-layout{flex-direction:row;max-width:1000px;align-items:flex-start}.results-left{flex:1;max-width:400px}.results-right{flex:1;min-width:400px}.results-container{padding-top:20px;padding-bottom:20px;gap:15px}.results-emoji{font-size:3rem;margin-bottom:4px}.results-header h1{font-size:1.6rem;margin-bottom:4px}.results-subtitle{font-size:1rem;margin-bottom:0}.score-circle{width:130px;height:130px}.score-number{font-size:2.2rem}.results-breakdown h3,.results-overall h3{margin-bottom:8px;font-size:.95rem}.results-breakdown,.results-overall{padding:15px}.result-category{margin-bottom:8px}.result-cat-header{margin-bottom:2px}}