:root{--color-primary: #6366f1;--color-primary-dark: #4f46e5;--color-secondary: #10b981;--color-secondary-dark: #059669;--color-accent: #f59e0b;--color-accent-dark: #d97706;--color-success: #10b981;--color-error: #ef4444;--color-warning: #f59e0b;--color-info: #3b82f6;--color-bg-primary: #ffffff;--color-bg-secondary: #f8fafc;--color-bg-tertiary: #f1f5f9;--color-text-primary: #1e293b;--color-text-secondary: #64748b;--color-text-muted: #94a3b8;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--border-radius-sm: .25rem;--border-radius-md: .5rem;--border-radius-lg: .75rem;--border-radius-xl: 1rem;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--transition-fast: .15s ease-in-out;--transition-normal: .25s ease-in-out;--transition-slow: .35s ease-in-out}@media (prefers-color-scheme: dark){:root{--color-bg-primary: #0f172a;--color-bg-secondary: #1e293b;--color-bg-tertiary: #334155;--color-text-primary: #f8fafc;--color-text-secondary: #cbd5e1;--color-text-muted: #64748b}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}*{box-sizing:border-box}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:16px;line-height:1.6;color:var(--color-text-primary);background-color:var(--color-bg-primary);transition:background-color var(--transition-normal),color var(--transition-normal)}#app{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--spacing-md)}.loading-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-lg);text-align:center}.loading-screen__spinner{width:40px;height:40px;border:4px solid var(--color-bg-tertiary);border-top:4px solid var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}.loading-screen__text{color:var(--color-text-secondary);font-size:1.1rem}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.home-screen{max-width:600px;width:100%;text-align:center;background:var(--color-bg-secondary);padding:var(--spacing-2xl);border-radius:var(--border-radius-xl);box-shadow:var(--shadow-lg)}.home-screen__title{font-size:2.5rem;font-weight:700;margin:0 0 var(--spacing-lg) 0;color:var(--color-primary)}.home-screen__description{font-size:1.1rem;color:var(--color-text-secondary);margin-bottom:var(--spacing-xl)}.home-screen__form{display:flex;flex-direction:column;gap:var(--spacing-lg);margin-bottom:var(--spacing-xl)}.home-screen__start-button{background:var(--color-primary);color:#fff;border:none;padding:var(--spacing-md) var(--spacing-xl);font-size:1.1rem;font-weight:600;border-radius:var(--border-radius-lg);cursor:pointer;transition:all var(--transition-normal);box-shadow:var(--shadow-md)}.home-screen__start-button:hover{background:var(--color-primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-lg)}.home-screen__start-button:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}.home-screen__info{text-align:left;background:var(--color-bg-tertiary);padding:var(--spacing-lg);border-radius:var(--border-radius-lg);margin-top:var(--spacing-lg)}.home-screen__info-list{margin:0;padding-left:var(--spacing-lg);color:var(--color-text-secondary)}.home-screen__info-list li{margin-bottom:var(--spacing-sm)}.home-screen__stats{margin-top:var(--spacing-lg);padding-top:var(--spacing-lg);border-top:1px solid var(--color-bg-tertiary)}.home-screen__stats h3{margin:0 0 var(--spacing-md) 0;color:var(--color-primary)}.home-screen__stats-list{margin:0;padding-left:var(--spacing-lg);color:var(--color-text-secondary)}.form-group{display:flex;flex-direction:column;gap:var(--spacing-sm)}.form-group__label{font-weight:600;color:var(--color-text-primary)}.form-group__select{padding:var(--spacing-md);border:2px solid var(--color-bg-tertiary);border-radius:var(--border-radius-md);background:var(--color-bg-primary);color:var(--color-text-primary);font-size:1rem;transition:border-color var(--transition-normal)}.form-group__select:focus{outline:none;border-color:var(--color-primary)}.quiz-screen{max-width:800px;width:100%;background:var(--color-bg-secondary);border-radius:var(--border-radius-xl);box-shadow:var(--shadow-lg);overflow:hidden}.quiz-screen__header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-lg);background:var(--color-bg-tertiary);border-bottom:1px solid var(--color-bg-tertiary)}.quiz-screen__question-container{padding:var(--spacing-xl)}.quiz-screen__question-area{margin-bottom:var(--spacing-xl)}.quiz-screen__question-text{font-size:1.5rem;font-weight:600;margin:0 0 var(--spacing-lg) 0;color:var(--color-text-primary);line-height:1.4}.quiz-screen__options{display:flex;flex-direction:column;gap:var(--spacing-md)}.quiz-screen__option{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-lg);background:var(--color-bg-primary);border:2px solid var(--color-bg-tertiary);border-radius:var(--border-radius-lg);cursor:pointer;transition:all var(--transition-normal)}.quiz-screen__option:hover{border-color:var(--color-primary);background:var(--color-bg-secondary)}.quiz-screen__option input[type=radio]{width:20px;height:20px;accent-color:var(--color-primary)}.quiz-screen__option-label{flex:1;font-size:1.1rem;cursor:pointer;user-select:none}.quiz-screen__option--correct{border-color:var(--color-success);background:#10b9811a}.quiz-screen__option--incorrect{border-color:var(--color-error);background:#ef44441a}.quiz-screen__feedback{background:var(--color-bg-tertiary);padding:var(--spacing-lg);border-radius:var(--border-radius-lg);margin-top:var(--spacing-lg)}.quiz-screen__feedback-text{font-size:1.1rem;font-weight:600;margin:0 0 var(--spacing-md) 0}.quiz-screen__feedback-text--correct{color:var(--color-success)}.quiz-screen__feedback-text--incorrect{color:var(--color-error)}.quiz-screen__next-button{background:var(--color-primary);color:#fff;border:none;padding:var(--spacing-md) var(--spacing-xl);font-size:1rem;font-weight:600;border-radius:var(--border-radius-md);cursor:pointer;transition:all var(--transition-normal)}.quiz-screen__next-button:hover{background:var(--color-primary-dark)}.progress{display:flex;flex-direction:column;gap:var(--spacing-sm);min-width:200px}.progress__question-info{font-size:.9rem;color:var(--color-text-secondary);text-align:center}.progress__bar{width:100%;height:8px;background:var(--color-bg-tertiary);border-radius:var(--border-radius-sm);overflow:hidden}.progress__fill{height:100%;background:var(--color-primary);transition:width var(--transition-normal)}.progress__score-info{display:flex;justify-content:space-between;font-size:.9rem;color:var(--color-text-secondary)}.progress__streak--active{color:var(--color-accent);font-weight:600}.timer{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-sm);min-width:120px}.timer__display{font-size:1.5rem;font-weight:700;color:var(--color-text-primary);font-family:Courier New,monospace}.timer__bar{width:100%;height:6px;background:var(--color-bg-tertiary);border-radius:var(--border-radius-sm);overflow:hidden}.timer__progress{height:100%;background:var(--color-primary);transition:width var(--transition-normal),background-color var(--transition-normal)}.timer__progress--caution{background:var(--color-warning)}.timer__progress--warning{background:var(--color-error);animation:pulse 1s infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.7}}.results-screen{max-width:700px;width:100%;background:var(--color-bg-secondary);padding:var(--spacing-2xl);border-radius:var(--border-radius-xl);box-shadow:var(--shadow-lg)}.results-screen__title{font-size:2rem;font-weight:700;text-align:center;margin:0 0 var(--spacing-xl) 0;color:var(--color-primary)}.results-screen__summary{display:flex;justify-content:space-around;margin-bottom:var(--spacing-xl);padding:var(--spacing-lg);background:var(--color-bg-tertiary);border-radius:var(--border-radius-lg)}.results-screen__score,.results-screen__accuracy{text-align:center}.results-screen__score-label,.results-screen__accuracy-label{display:block;font-size:.9rem;color:var(--color-text-secondary);margin-bottom:var(--spacing-xs)}.results-screen__score-value{display:block;font-size:2rem;font-weight:700;color:var(--color-primary)}.results-screen__accuracy-value{display:block;font-size:1.2rem;font-weight:600;color:var(--color-text-primary)}.results-screen__details,.results-screen__comparison,.results-screen__motivational{margin-bottom:var(--spacing-lg);padding:var(--spacing-lg);background:var(--color-bg-tertiary);border-radius:var(--border-radius-lg)}.results-screen__details h3,.results-screen__comparison h3,.results-screen__motivational h3{margin:0 0 var(--spacing-md) 0;color:var(--color-primary)}.results-screen__details-list{margin:0;padding-left:var(--spacing-lg);color:var(--color-text-secondary)}.results-screen__details-list li{margin-bottom:var(--spacing-sm)}.results-screen__new-record{color:var(--color-success);text-align:center}.results-screen__previous-record{color:var(--color-text-secondary);text-align:center}.results-screen__first-game{color:var(--color-info);text-align:center}.results-screen__actions{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}.results-screen__button{padding:var(--spacing-md) var(--spacing-xl);font-size:1rem;font-weight:600;border:none;border-radius:var(--border-radius-lg);cursor:pointer;transition:all var(--transition-normal);min-width:150px}.results-screen__button--primary{background:var(--color-primary);color:#fff}.results-screen__button--primary:hover{background:var(--color-primary-dark);transform:translateY(-2px)}.results-screen__button--secondary{background:var(--color-bg-tertiary);color:var(--color-text-primary);border:2px solid var(--color-bg-tertiary)}.results-screen__button--secondary:hover{background:var(--color-bg-primary);border-color:var(--color-primary)}@media (max-width: 768px){.home-screen,.quiz-screen,.results-screen{margin:var(--spacing-sm);padding:var(--spacing-lg)}.home-screen__title{font-size:2rem}.quiz-screen__header{flex-direction:column;gap:var(--spacing-md)}.quiz-screen__question-text{font-size:1.3rem}.results-screen__summary{flex-direction:column;gap:var(--spacing-md)}.results-screen__actions{flex-direction:column}.results-screen__button{width:100%}}@media (max-width: 480px){#app{padding:var(--spacing-sm)}.home-screen__title{font-size:1.8rem}.quiz-screen__question-text,.timer__display{font-size:1.2rem}}@media (prefers-reduced-motion: reduce){.timer__progress--warning{animation:none}}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--color-primary);outline-offset:2px}@media (prefers-contrast: high){:root{--color-primary: #0000ff;--color-success: #008000;--color-error: #ff0000;--color-warning: #ff8c00}}