@font-face{font-family:Roboto;src:url(/fonts/Roboto-Variable.ttf) format("truetype");font-weight:100 900;font-style:normal;font-display:swap}:root{--color-dark: #131e29;--color-salmon: #f97362;--color-salmon-light: #fef2f0;--color-white: #ffffff;--color-gray-100: #f3f4f6;--color-gray-200: #e5e7eb;--color-gray-400: #9ca3af;--color-gray-600: #4b5563;--color-correct: #22c55e;--color-correct-bg: #dcfce7;--color-incorrect: #ef4444;--color-incorrect-bg: #fee2e2;--font-primary: "Roboto", system-ui, -apple-system, sans-serif;--transition-fast: .15s ease;--transition-normal: .3s ease;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem;--radius-sm: .25rem;--radius-md: .5rem;--radius-lg: 1rem;--radius-full: 9999px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-primary);background-color:var(--color-dark);color:var(--color-white);min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}#app{flex:1;display:flex;flex-direction:column;max-width:500px;width:100%;margin:0 auto;padding:var(--spacing-md)}button{font-family:inherit;cursor:pointer;border:none;outline:none;transition:all var(--transition-fast)}button:disabled{cursor:not-allowed;opacity:.6}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.header{display:flex;align-items:center;justify-content:space-between;padding:var(--spacing-sm) 0;margin-bottom:var(--spacing-md)}.header__logo{height:24px;width:auto}.header__title{font-size:1.25rem;font-weight:700;color:var(--color-salmon)}.header__timer{font-size:1rem;font-weight:500;font-variant-numeric:tabular-nums;color:var(--color-gray-400)}.progress{display:flex;gap:var(--spacing-sm);justify-content:center;margin-bottom:var(--spacing-lg)}.progress__dot{width:12px;height:12px;border-radius:var(--radius-full);background-color:var(--color-gray-600);transition:background-color var(--transition-fast)}.progress__dot--current{background-color:var(--color-salmon);transform:scale(1.2)}.progress__dot--correct{background-color:var(--color-correct)}.progress__dot--incorrect{background-color:var(--color-incorrect)}.splash{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:var(--spacing-xl)}.splash__logo{width:180px;height:auto}.splash__title{font-size:2.5rem;font-weight:700;color:var(--color-salmon)}.splash__subtitle{font-size:1rem;color:var(--color-gray-400);margin-top:calc(-1 * var(--spacing-md))}.how-to-play{background-color:#ffffff0d;border-radius:var(--radius-lg);padding:var(--spacing-lg);max-width:320px}.how-to-play__title{font-size:1.125rem;font-weight:600;margin-bottom:var(--spacing-md);color:var(--color-white)}.how-to-play__list{list-style:none;text-align:left;display:flex;flex-direction:column;gap:var(--spacing-sm)}.how-to-play__item{display:flex;align-items:flex-start;gap:var(--spacing-sm);font-size:.875rem;color:var(--color-gray-200);line-height:1.4}.how-to-play__number{flex-shrink:0;width:20px;height:20px;border-radius:var(--radius-full);background-color:var(--color-salmon);color:var(--color-white);font-size:.75rem;font-weight:600;display:flex;align-items:center;justify-content:center}.start-button{background-color:var(--color-salmon);color:var(--color-white);font-size:1.125rem;font-weight:600;padding:var(--spacing-md) var(--spacing-2xl);border-radius:var(--radius-full)}.start-button:hover{background-color:#e86352;transform:scale(1.02)}.start-button:active{transform:scale(.98)}.game{flex:1;display:flex;flex-direction:column;gap:var(--spacing-lg)}.round-display{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-md);text-align:center}.round-display__emoji{font-size:5rem;line-height:1}.round-display__label{font-size:1.5rem;font-weight:500;color:var(--color-white);padding:var(--spacing-sm) var(--spacing-md);background-color:#ffffff1a;border-radius:var(--radius-md)}.round-display__instruction{font-size:.875rem;color:var(--color-gray-400)}.answer-options{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-sm)}.option-button{background-color:#ffffff1a;color:var(--color-white);font-size:1rem;font-weight:500;padding:var(--spacing-md);border-radius:var(--radius-md);border:2px solid transparent}.option-button:hover:not(:disabled){background-color:#ffffff26;border-color:var(--color-salmon)}.option-button:active:not(:disabled){transform:scale(.98)}.option-button--correct{background-color:var(--color-correct);color:var(--color-white);border-color:var(--color-correct);transform:scale(1.05)}.option-button--incorrect{background-color:var(--color-incorrect);color:var(--color-white);border-color:var(--color-incorrect);animation:shake .3s ease-out}.option-button--revealed{opacity:.4;background-color:#ffffff0d}.feedback-banner{padding:var(--spacing-md) var(--spacing-lg);border-radius:var(--radius-md);font-size:1.25rem;font-weight:700;text-align:center;animation:pop .3s ease-out;margin-top:var(--spacing-md)}.feedback-banner--correct{background-color:var(--color-correct);color:var(--color-white)}.feedback-banner--incorrect{background-color:var(--color-incorrect);color:var(--color-white)}.game__bottom{min-height:120px;display:flex;flex-direction:column;gap:var(--spacing-sm)}.game__bottom-placeholder{height:120px}.next-button{background-color:var(--color-salmon);color:var(--color-white);font-size:1rem;font-weight:600;padding:var(--spacing-md);border-radius:var(--radius-md)}.next-button:hover{background-color:#e86352}.result{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:var(--spacing-lg)}.result__title{font-size:2rem;font-weight:700;color:var(--color-white)}.result__score{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs)}.result__score-value{font-size:3rem;font-weight:700;color:var(--color-salmon)}.result__score-label{font-size:.875rem;color:var(--color-gray-400)}.result__time{font-size:1.25rem;color:var(--color-gray-200)}.result__grid{font-size:2rem;letter-spacing:.25rem}.share-button{background-color:var(--color-salmon);color:var(--color-white);font-size:1rem;font-weight:600;padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-full);display:flex;align-items:center;gap:var(--spacing-sm)}.share-button:hover{background-color:#e86352;transform:scale(1.02)}.result__branding{font-size:.875rem;color:var(--color-gray-400)}.result__branding a{color:var(--color-salmon);text-decoration:none;font-weight:500}.result__branding a:hover{text-decoration:underline}.result__countdown{display:flex;flex-direction:column;align-items:center;gap:var(--spacing-xs)}.result__countdown-label{font-size:.875rem;color:var(--color-gray-400)}.result__countdown-time{font-size:1.5rem;font-weight:700;font-variant-numeric:tabular-nums;color:var(--color-salmon)}.review{width:100%;max-width:400px;margin-top:var(--spacing-lg)}.review__title{font-size:1rem;font-weight:600;color:var(--color-gray-400);margin-bottom:var(--spacing-md);text-align:center}.review__list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.review-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);background-color:#ffffff0d}.review-item--correct{border-left:3px solid var(--color-correct)}.review-item--incorrect{border-left:3px solid var(--color-incorrect)}.review-item__emoji{font-size:1.5rem}.review-item__details{flex:1;min-width:0}.review-item__label{font-size:.875rem;color:var(--color-white);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.review-item__answer{font-size:.75rem;color:var(--color-gray-400);margin-top:2px}.review-item--correct .review-item__answer{color:var(--color-correct)}.review-item--incorrect .review-item__answer{color:var(--color-incorrect)}.toast{position:fixed;bottom:var(--spacing-xl);left:50%;transform:translate(-50%);background-color:var(--color-white);color:var(--color-dark);padding:var(--spacing-sm) var(--spacing-md);border-radius:var(--radius-md);font-size:.875rem;font-weight:500;opacity:0;transition:opacity var(--transition-normal);pointer-events:none}.toast--visible{opacity:1}@keyframes pop{0%{transform:scale(.8);opacity:0}50%{transform:scale(1.05)}to{transform:scale(1);opacity:1}}.animate-pop{animation:pop .3s ease-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}.animate-shake{animation:shake .3s ease-out}