:root{--color-primary: #0A84FF;--color-danger: #FF453A;--color-success: #30D158;--color-warning: #FFD60A;--color-background: #000000;--color-surface: #1C1C1E;--color-surface-elevated: #2C2C2E;--color-text: #FFFFFF;--color-text-secondary: #8E8E93;--color-border: #38383A;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 12px;--spacing-lg: 16px;--spacing-xl: 24px;--tap-zone-size: 80px;--button-height: 44px;--button-min-width: 100px;--font-size-xs: 10px;--font-size-sm: 12px;--font-size-md: 14px;--font-size-lg: 18px;--font-size-xl: 24px;--font-size-xxl: 32px;--transition-fast: .15s ease;--transition-normal: .25s ease}@media (max-width: 394px){:root{--tap-zone-size: 70px;--font-size-md: 12px;--spacing-md: 10px}}@media (min-width: 416px){:root{--tap-zone-size: 90px}}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden}body{font-family:-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,sans-serif;font-size:var(--font-size-md);background:var(--color-background);color:var(--color-text);line-height:1.4;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}h1{font-size:var(--font-size-xxl);font-weight:700;letter-spacing:-.5px}h2{font-size:var(--font-size-xl);font-weight:600}h3{font-size:var(--font-size-lg);font-weight:600}button{font-family:inherit;font-size:var(--font-size-md);font-weight:600;min-height:var(--button-height);min-width:var(--button-min-width);padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:22px;background:var(--color-primary);color:var(--color-text);cursor:pointer;transition:all var(--transition-fast);-webkit-appearance:none;appearance:none}button:active{transform:scale(.95);opacity:.8}button:disabled{opacity:.5;cursor:not-allowed}button.secondary{background:var(--color-surface-elevated)}button.danger{background:var(--color-danger)}button.success{background:var(--color-success)}input{font-family:inherit;font-size:var(--font-size-md);width:100%;min-height:var(--button-height);padding:var(--spacing-sm) var(--spacing-md);border:1px solid var(--color-border);border-radius:10px;background:var(--color-surface);color:var(--color-text);-webkit-appearance:none;appearance:none}input:focus{outline:none;border-color:var(--color-primary)}input::placeholder{color:var(--color-text-secondary)}.container{width:100%;height:100%;padding:var(--spacing-md);overflow-y:auto;overflow-x:hidden}.card{background:var(--color-surface);border-radius:16px;padding:var(--spacing-lg);margin-bottom:var(--spacing-md)}.flex{display:flex}.flex-col{display:flex;flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}.text-center{text-align:center}.text-secondary{color:var(--color-text-secondary)}.text-sm{font-size:var(--font-size-sm)}.text-lg{font-size:var(--font-size-lg)}.text-xl{font-size:var(--font-size-xl)}.loading-spinner{display:inline-block;width:30px;height:30px;border:3px solid var(--color-surface-elevated);border-top-color:var(--color-primary);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.error-message{padding:var(--spacing-md);background:var(--color-danger);color:var(--color-text);border-radius:10px;text-align:center;margin-bottom:var(--spacing-md)}.success-message{padding:var(--spacing-md);background:var(--color-success);color:var(--color-text);border-radius:10px;text-align:center;margin-bottom:var(--spacing-md)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.fade-in{animation:fadeIn var(--transition-normal)}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.slide-up{animation:slideUp var(--transition-normal)}@keyframes tapSplash{0%{transform:scale(.5);opacity:1}to{transform:scale(2);opacity:0}}.tap-splash{position:absolute;width:100px;height:100px;border-radius:50%;background:radial-gradient(circle,#0a84ff99,#0a84ff00 70%);pointer-events:none;animation:tapSplash .6s ease-out}@keyframes scorePop{0%{transform:translateY(0) scale(1);opacity:1}50%{transform:translateY(-20px) scale(1.2)}to{transform:translateY(-40px) scale(.8);opacity:0}}.score-pop{position:absolute;font-size:var(--font-size-xl);font-weight:700;color:var(--color-success);pointer-events:none;animation:scorePop 1s ease-out;text-shadow:0 2px 4px rgba(0,0,0,.5)}@keyframes pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.05);opacity:.8}}.pulse{animation:pulse 2s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.bounce{animation:bounce .5s ease-in-out}@keyframes shake{0%,to{transform:translate(0)}25%{transform:translate(-10px)}75%{transform:translate(10px)}}.shake{animation:shake .3s ease-in-out}@keyframes celebrate{0%{transform:scale(.5) rotate(-10deg);opacity:0}50%{transform:scale(1.2) rotate(5deg)}to{transform:scale(1) rotate(0);opacity:1}}.celebrate{animation:celebrate .6s cubic-bezier(.68,-.55,.265,1.55)}button{transition:transform var(--transition-fast),box-shadow var(--transition-fast)}button:active:not(:disabled){transform:scale(.95)}@keyframes slideInRight{0%{opacity:0;transform:translate(20px)}to{opacity:1;transform:translate(0)}}.page-enter{animation:slideInRight .3s ease-out}@keyframes pulse-tooltip{0%,to{transform:translate(-50%) scale(1)}50%{transform:translate(-50%) scale(1.03)}}