*,*:before,*:after{box-sizing:border-box}:root{color-scheme:light;--bg-page: linear-gradient(180deg, #eff6ff 0%, #f8fafc 48%, #ffffff 100%);--text-primary: #111827;--text-secondary: #4b5563}@media (prefers-color-scheme: dark){:root{color-scheme:dark;--bg-page: linear-gradient(180deg, #0b1220 0%, #0f172a 48%, #111827 100%);--text-primary: #f3f4f6;--text-secondary: #cbd5e1}}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;background:var(--bg-page);color:var(--text-primary)}.quiz-page{--card-bg: #ffffff;--card-border: #d7ddea;--card-shadow: 0 10px 34px rgba(17, 24, 39, .08);--heading: #111827;--text-main: #374151;--text-muted: #4b5563;--kicker: #1d4ed8;--progress-track: #e5e7eb;--progress-gradient: linear-gradient(90deg, #2563eb, #7c3aed);--option-border: #cbd5e1;--option-bg: #ffffff;--option-bg-selected: #eff6ff;--option-marker-border: #93a4bf;--option-marker-selected: #1d4ed8;--primary-btn-bg: #2563eb;--primary-btn-bg-hover: #1d4ed8;--primary-btn-text: #ffffff;--secondary-btn-bg: #e5e7eb;--secondary-btn-bg-hover: #d1d5db;--secondary-btn-text: #111827;--fallback-bg: #f8fafc;--fallback-border: #e2e8f0;--fallback-divider: #e5e7eb;--success-bg: #dcfce7;--success-text: #166534;min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px}@media (prefers-color-scheme: dark){.quiz-page{--card-bg: #0f172a;--card-border: #1f2937;--card-shadow: 0 12px 38px rgba(2, 6, 23, .48);--heading: #f3f4f6;--text-main: #d1d5db;--text-muted: #94a3b8;--kicker: #93c5fd;--progress-track: #1f2937;--progress-gradient: linear-gradient(90deg, #3b82f6, #8b5cf6);--option-border: #334155;--option-bg: #0b1220;--option-bg-selected: #172554;--option-marker-border: #64748b;--option-marker-selected: #93c5fd;--primary-btn-bg: #3b82f6;--primary-btn-bg-hover: #2563eb;--primary-btn-text: #eff6ff;--secondary-btn-bg: #1f2937;--secondary-btn-bg-hover: #334155;--secondary-btn-text: #e5e7eb;--fallback-bg: #111827;--fallback-border: #1f2937;--fallback-divider: #273449;--success-bg: #14532d;--success-text: #dcfce7}}.quiz-card{width:min(760px,100%);background:var(--card-bg);border:1px solid var(--card-border);border-radius:20px;box-shadow:var(--card-shadow);padding:32px}.quiz-header h1{margin:8px 0;font-size:clamp(1.45rem,3vw,2rem);line-height:1.2;color:var(--heading)}.quiz-kicker{margin:0;font-weight:600;color:var(--kicker)}.quiz-subtitle{margin:0;color:var(--text-muted);max-width:62ch}.progress-wrap{margin-top:18px;display:flex;align-items:center;gap:10px}.progress-track{flex:1;height:10px;background:var(--progress-track);border-radius:999px;overflow:hidden}.progress-bar{height:100%;background:var(--progress-gradient);transition:width .25s ease}.progress-wrap span{font-size:.9rem;color:var(--text-muted);min-width:42px;text-align:right}.step-label{margin:10px 0 0;font-size:.9rem;font-weight:600;color:var(--kicker)}.screen{margin-top:26px}.screen-animate{animation:screenFade .22s ease-out}@keyframes screenFade{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.intro-screen h2,.question-screen h2,.result-screen h2{margin:0 0 16px;color:var(--heading);line-height:1.3;max-width:42ch}.intro-screen ul{margin:0 0 24px;padding-left:20px;color:var(--text-main);display:grid;gap:10px}.question-meta{margin-bottom:12px;color:var(--text-muted);font-size:.95rem;font-weight:600}.options-grid{display:grid;gap:10px}.option-btn{border:1px solid var(--option-border);background:var(--option-bg);border-radius:12px;padding:12px 14px;text-align:left;cursor:pointer;color:var(--heading);transition:all .2s ease;display:flex;align-items:flex-start;gap:10px}.option-btn:hover{border-color:var(--primary-btn-bg);transform:translateY(-1px)}.option-btn.selected{border-color:var(--primary-btn-bg);background:var(--option-bg-selected)}.option-marker{width:20px;height:20px;border:1.6px solid var(--option-marker-border);flex:0 0 20px;display:inline-flex;align-items:center;justify-content:center;font-size:.85rem;line-height:1;color:var(--option-marker-selected);margin-top:1px}.option-marker.single{border-radius:999px}.option-marker.multi{border-radius:6px}.option-btn.selected .option-marker{border-color:var(--option-marker-selected);background:var(--option-bg)}.option-text{line-height:1.35}.actions{margin-top:20px;display:flex;justify-content:space-between;gap:12px}.primary-btn,.secondary-btn,.text-btn{border-radius:10px;border:none;font-size:.95rem;font-weight:600;cursor:pointer}.primary-btn{background:var(--primary-btn-bg);color:var(--primary-btn-text);padding:11px 16px}.primary-btn:hover{background:var(--primary-btn-bg-hover)}.secondary-btn{background:var(--secondary-btn-bg);color:var(--secondary-btn-text);padding:11px 16px}.secondary-btn:hover{background:var(--secondary-btn-bg-hover)}.primary-btn:disabled,.secondary-btn:disabled{opacity:.55;cursor:not-allowed}.result-screen p{margin:0 0 12px;color:var(--text-main);max-width:62ch}.result-actions{margin-top:20px;display:flex}.link-btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}.proxy-fallback{margin-top:22px;border-top:1px solid var(--fallback-divider);background:var(--fallback-bg);border-radius:12px;border:1px solid var(--fallback-border);padding:16px}.proxy-fallback h3{margin:0 0 10px;font-size:1rem;color:var(--heading)}.success-badge{width:36px;height:36px;border-radius:999px;background:var(--success-bg);color:var(--success-text);display:inline-flex;align-items:center;justify-content:center;font-weight:700;margin-bottom:10px}.text-btn{margin-top:18px;background:transparent;color:var(--text-muted);padding:0}.text-btn:hover{color:var(--heading)}@media (max-width: 720px){.quiz-page{padding:10px}.quiz-card{padding:18px;border-radius:14px;min-height:calc(100dvh - 20px);display:flex;flex-direction:column}.screen{display:flex;flex-direction:column;flex:1}.question-screen .options-grid{gap:8px}.option-btn{min-height:52px;padding:11px 12px}.option-text{font-size:.95rem}.actions{flex-direction:column;position:sticky;bottom:calc(env(safe-area-inset-bottom,0px) + 8px);background:color-mix(in srgb,var(--card-bg) 88%,transparent);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding-top:10px;margin-top:auto}.primary-btn,.secondary-btn{width:100%;min-height:46px}}
