@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,sans-serif;background-color:#fff5ee;color:#3d2b1f;line-height:1.7;font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:24px 16px}.container{width:100%;max-width:600px}.start-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:80vh;text-align:center;gap:28px}.start-screen h1{font-size:36px;font-weight:700;letter-spacing:-.5px;color:#3d2b1f}.start-screen p{font-size:18px;color:#8b5a2b;max-width:400px}.start-screen .subtitle{font-size:15px;color:sienna}.btn-primary{background:linear-gradient(135deg,#d2691e,#c50);color:#fff;border:none;border-radius:16px;padding:18px 44px;font-size:18px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;font-family:Inter,sans-serif;box-shadow:0 4px 16px #d2691e4d}.btn-primary:hover{box-shadow:0 6px 20px #ff7f5066;transform:translateY(-1px)}.btn-primary:active{transform:scale(.97)}.progress-bar-container{width:100%;margin-bottom:28px}.progress-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:15px;font-weight:600;color:#8b5a2b}.progress-track{width:100%;height:12px;background-color:#ffe4e1;border-radius:10px;overflow:hidden;box-shadow:inset 0 1px 3px #0000000d}.progress-fill{height:100%;border-radius:10px;transition:width .4s ease;background:linear-gradient(90deg,coral,#ffb347)}.score-badge{display:flex;gap:16px;font-size:14px;font-weight:600}.score-correct{color:#2e7d32}.score-wrong{color:#bf360c}.question-card{background-color:#fff;border-radius:24px;padding:32px;box-shadow:0 10px 40px #cd853f1a,0 2px 10px #cd853f0d;border:1px solid #FFF0E6}.category-badge{display:inline-block;padding:6px 14px;border-radius:20px;font-size:14px;font-weight:600;margin-bottom:20px}.category-vagmarken{background-color:#f3e5f5;color:#4a148c}.category-hastighet{background-color:#ffefed;color:sienna}.category-avstand_och_bromsstracka{background-color:#ede9fe;color:#4527a0}.category-alkohol_och_droger{background-color:#ffe4e6;color:#8b0000}.category-trafikregler{background-color:#e8f5e9;color:#1b5e20}.category-korsningar{background-color:#fff3e0;color:#bf360c}.category-korfalt_och_omkorning{background-color:#e3f2fd;color:#0d47a1}.category-miljo_och_fordon{background-color:#f1f8e9;color:#1b5e20}.category-belysning{background-color:#fff8e1;color:#e65100}.category-sakerhet{background-color:#ffefed;color:sienna}.question-text{font-size:22px;font-weight:600;line-height:1.6;margin-bottom:32px;color:#3d2b1f}.options-list{display:flex;flex-direction:column;gap:16px}.option-btn{width:100%;text-align:left;padding:18px 24px;border:2px solid #FFE4C4;border-radius:16px;background-color:#fffcf9;font-size:18px;font-weight:500;line-height:1.5;cursor:pointer;transition:all .2s ease;font-family:Inter,sans-serif;color:#4a3728}.option-btn:hover:not(:disabled){border-color:#ffb347;background-color:#fff9f2;box-shadow:0 4px 12px #ffb34726;transform:translateY(-2px)}.option-btn:active:not(:disabled){transform:scale(.98)}.option-btn:disabled{cursor:default;transform:none}.option-correct{border-color:#2e7d32;background-color:#e8f5e9;color:#1b5e20}.option-wrong{border-color:#d84315;background-color:#fbe9e7;color:#bf360c}.option-dimmed{opacity:.55}.explanation-box{margin-top:24px;padding:20px 24px;background-color:#fff8e1;border-left:4px solid #FFB347;border-radius:0 16px 16px 0;font-size:16px;line-height:1.7;color:#5d4037}.card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:28px;gap:12px}.btn-next{background:linear-gradient(135deg,#d2691e,#c50);color:#fff;border:none;border-radius:16px;padding:14px 28px;font-size:17px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;font-family:Inter,sans-serif;margin-left:auto;box-shadow:0 4px 12px #d2691e40}.btn-next:hover{box-shadow:0 6px 16px #ff7f5059;transform:translateY(-1px)}.btn-next:active{transform:scale(.97)}.btn-report{background:none;border:1px solid #FFDAB9;border-radius:12px;padding:10px 16px;font-size:14px;font-weight:500;color:sienna;cursor:pointer;transition:all .2s ease;font-family:Inter,sans-serif;white-space:nowrap}.btn-report:hover{background-color:#fff0e6;border-color:#deb887}.btn-report.reported{color:#2e7d32;border-color:#2e7d32;background-color:#e8f5e9;cursor:default}.result-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:70vh;text-align:center;gap:20px}.result-emoji{font-size:64px}.result-screen h2{font-size:28px;font-weight:700;color:#3d2b1f}.result-score{font-size:48px;font-weight:700;color:#c04000}.result-details{font-size:18px;color:#8b5a2b;line-height:1.8}.result-message{font-size:18px;font-weight:500;padding:12px 24px;border-radius:16px;margin-top:8px}.result-pass{background-color:#e8f5e9;color:#2e7d32}.result-fail{background-color:#fff3e0;color:#bf360c}.btn-restart{background:linear-gradient(135deg,#d2691e,#c50);color:#fff;border:none;border-radius:16px;padding:18px 44px;font-size:18px;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;font-family:Inter,sans-serif;margin-top:12px;box-shadow:0 4px 16px #d2691e4d}.btn-restart:hover{box-shadow:0 6px 20px #ff7f5066;transform:translateY(-1px)}.btn-restart:active{transform:scale(.97)}.difficulty-badge{font-size:13px;font-weight:600;padding:6px 12px;border-radius:20px;margin-left:12px;vertical-align:middle}.difficulty-enkel{background-color:#f1f8e9;color:#388e3c}.difficulty-medel{background-color:#fff3e0;color:#bf360c}.difficulty-svar{background-color:#fbe9e7;color:#bf360c}@media(max-width:480px){.question-text{font-size:19px}.option-btn{font-size:17px;padding:16px 18px}.start-screen h1{font-size:28px}.question-card{padding:24px}}.question-header{display:flex;align-items:flex-start;gap:12px}.question-header .question-text{flex:1;margin-bottom:32px}.btn-speak{width:40px;height:40px;min-width:40px;border-radius:12px;border:2px solid #FFE4C4;background-color:#fff;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease;margin-top:2px;padding:0}.btn-speak:hover:not(:disabled){border-color:#ffb347;background-color:#fff9f2}.btn-speak.speaking{border-color:#d2691e;background-color:#fff0e6}.btn-speak:disabled{opacity:.35;cursor:default}.btn-explain{background:none;border:2px solid #C9963B;border-radius:12px;padding:10px 18px;font-size:15px;font-weight:600;color:#c9963b;cursor:pointer;transition:all .2s ease;font-family:Inter,sans-serif;margin-top:16px;display:inline-block}.btn-explain:hover{background-color:#fff8e7;border-color:#b8860b;color:#b8860b}.btn-explain:disabled{opacity:.5;cursor:default}.ai-explanation{background-color:#fff8e7;border-radius:16px;padding:16px;margin-top:16px;font-size:16px;line-height:1.7;color:#5d4037;animation:fadeIn .3s ease}.ai-loading{color:#c9963b;font-weight:600;font-size:15px;margin-top:16px;animation:dots 1.5s steps(3,end) infinite}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes dots{0%{content:""}33%{content:"·"}66%{content:"··"}to{content:"···"}}.app-footer{text-align:center;padding:16px;margin-top:auto}.app-footer a{font-size:12px;color:#c9963b;text-decoration:none}.app-footer a:hover{text-decoration:underline}