@font-face{font-family:Pretendard;src:url(/font/variable/PretendardVariable.ttf) format("truetype");font-weight:100 900;font-display:swap}:root{--primary-50: #f3e5ff;--primary-100: #e1bee7;--primary-500: #7c4dff;--primary-600: #6a3de8;--primary-900: #4527a0;--gray-950: #0a0a0a;--gray-900: #121212;--gray-800: #1e1e1e;--gray-700: #2a2a2a;--gray-600: #666666;--gray-500: #888888;--gray-400: #999999;--gray-300: #aaaaaa;--gray-200: #dddddd;--gray-100: #f5f5f5;--success: #22c55e;--error: #ef4444;--warning: #f59e0b;--color-bg-primary: var(--gray-900);--color-bg-secondary: var(--gray-800);--color-bg-card: var(--gray-800);--color-text-primary: var(--gray-100);--color-text-secondary: var(--gray-400);--color-accent: var(--primary-500);--color-accent-light: var(--primary-100);--color-accent-dark: var(--primary-900);--color-danger: var(--error);--color-success: var(--success);--color-warning: var(--warning);--theme-primary: var(--primary-500);--theme-timer: var(--primary-500);--theme-badge: var(--primary-500);--theme-xp-bar: var(--primary-500);--theme-accent: var(--primary-500);--theme-transition: .3s ease}body.hard-mode{--theme-primary: #ef4444;--theme-timer: #ef4444;--theme-badge: #ef4444;--theme-xp-bar: #ef4444;--theme-accent: #ef4444}:root{--font-primary: "Pretendard", -apple-system, BlinkMacSystemFont, system-ui, sans-serif;--text-xs: .75rem;--text-sm: .875rem;--text-base: 1rem;--text-lg: 1.125rem;--text-xl: 1.5rem;--text-2xl: 2rem;--font-normal: 400;--font-medium: 500;--font-bold: 700;--font-family: var(--font-primary);--font-size-sm: var(--text-sm);--font-size-md: var(--text-base);--font-size-lg: var(--text-lg);--font-size-xl: var(--text-xl);--font-size-xxl: var(--text-2xl)}:root{--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-6: 24px;--space-8: 32px;--space-12: 48px;--spacing-xs: var(--space-1);--spacing-sm: var(--space-2);--spacing-md: var(--space-4);--spacing-lg: var(--space-6);--spacing-xl: var(--space-8)}:root{--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-full: 9999px}:root{--shadow-sm: 0 1px 2px rgba(0, 0, 0, .1);--shadow-md: 0 4px 6px rgba(0, 0, 0, .15);--shadow-lg: 0 10px 20px rgba(0, 0, 0, .25)}:root{--transition-fast: .15s ease;--transition-base: .25s ease;--transition-slow: .35s ease;--transition-normal: var(--transition-base)}.icon{width:20px;height:20px;color:var(--gray-100);flex-shrink:0}.icon-sm{width:16px;height:16px}.icon-md{width:20px;height:20px}.icon-lg{width:24px;height:24px}.icon-primary{color:var(--primary-500)}.icon-success{color:var(--success)}.icon-warning{color:var(--warning)}.icon-error{color:var(--error)}body{font-family:var(--font-primary)}@keyframes skeleton-pulse{0%,to{opacity:1}50%{opacity:.5}}.skeleton{background:var(--gray-700);border-radius:var(--radius-sm);animation:skeleton-pulse 1.5s ease-in-out infinite}.btn{font-family:var(--font-primary);font-size:var(--text-base);font-weight:var(--font-medium);border:none;cursor:pointer;transition:var(--transition-fast)}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{cursor:not-allowed;opacity:.5}.main-container{display:flex;flex-direction:column;height:100vh;height:100dvh;overflow:hidden;padding:0}.main-header{display:flex;justify-content:space-between;align-items:center;padding:var(--spacing-md);background:var(--color-bg-card);border-radius:var(--radius-lg);margin-bottom:var(--spacing-lg)}.main-header-fixed{flex-shrink:0;position:sticky;top:0;z-index:10;background:var(--gray-900);margin-bottom:0}.main-content-scroll{flex:1;overflow-y:auto;overflow-x:hidden;padding:0 var(--space-4);padding-bottom:200px;-webkit-overflow-scrolling:touch}.user-info{display:flex;align-items:center;gap:var(--spacing-sm)}.level-badge{background:var(--theme-badge);padding:2px 8px;border-radius:var(--radius-sm);font-size:var(--font-size-sm);font-weight:700;transition:background-color var(--theme-transition)}.currency{display:flex;align-items:center;gap:4px;color:var(--color-warning);font-weight:700}.action-area{margin-top:auto;display:flex;justify-content:center;padding-bottom:var(--spacing-xl)}.action-area-fixed{display:flex;flex-direction:column;align-items:center;width:100%;max-width:100vw;flex-shrink:0;padding:var(--space-4);padding-bottom:calc(var(--space-4) + env(safe-area-inset-bottom,0px));background:var(--gray-900);border-top:1px solid var(--gray-800);position:fixed;bottom:env(safe-area-inset-bottom,0px);left:0;right:0;z-index:10;box-sizing:border-box}.result-card{background:var(--color-bg-card);padding:20px;border-radius:12px;width:100%;max-width:300px;margin-top:20px}.result-row{display:flex;justify-content:space-between;margin-bottom:10px;font-size:1.2rem}.result-row .value{font-weight:700}.link-color{color:var(--color-success)}.toggle-switch{width:52px;height:28px;position:relative;display:inline-block}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;inset:0;background-color:var(--gray-600);transition:var(--transition-base);border-radius:var(--radius-full)}.toggle-slider:before{position:absolute;content:"";height:20px;width:20px;left:4px;bottom:4px;background-color:#fff;transition:var(--transition-base);border-radius:50%}input:checked+.toggle-slider{background-color:var(--error)}input:checked+.toggle-slider:before{transform:translate(24px)}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-10px)}20%,40%,60%,80%{transform:translate(10px)}}.game-area{flex:1;display:flex;flex-direction:column;padding:20px}.game-header{margin-bottom:20px}.timer-container{display:flex;align-items:center;gap:16px}.timer-bar{flex:1;height:8px;background:#333;border-radius:4px;overflow:hidden}.timer-fill{height:100%;background:var(--theme-accent);transition:width .1s linear,background-color var(--theme-transition)}.timer-fill.critical{animation:timerPulse .8s ease-in-out infinite}@keyframes timerPulse{0%,to{opacity:1;box-shadow:0 0 #ef444400}50%{opacity:.7;box-shadow:0 0 20px #ef4444cc}}.round-label{font-size:1rem;font-weight:600;letter-spacing:1px;color:#ffffffb3;white-space:nowrap;min-width:80px;text-align:right}.game-instruction{text-align:center;font-size:2rem;margin-bottom:20px;background:#222;padding:10px;border-radius:8px}.game-grid{display:grid;gap:10px;aspect-ratio:1}.grid-item{background:#2c2c2c;display:flex;align-items:center;justify-content:center;font-size:2.5rem;border-radius:8px;cursor:pointer;transition:transform .1s}.grid-item:active{transform:scale(.95)}.color-tile{aspect-ratio:1;border-radius:12px;border:2px solid rgba(255,255,255,.1);font-size:0;-webkit-user-select:none;user-select:none}.shake{animation:shake .4s cubic-bezier(.36,.07,.19,.97) both}@keyframes shake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}body{margin:0;padding:0;font-family:var(--font-family);background-color:#000;color:var(--color-text-primary);-webkit-font-smoothing:antialiased;overflow:hidden;-webkit-user-select:none;user-select:none;touch-action:manipulation}#app{width:100%;max-width:480px;height:100vh;margin:0 auto;display:flex;flex-direction:column;position:relative;overflow:hidden;background-color:var(--color-bg-primary);box-shadow:0 0 20px #00000080}button{font-family:inherit;border:none;cursor:pointer;background:none}.hidden{display:none!important}.fade-in{animation:fadeIn var(--transition-normal) forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes pulse{0%,to{box-shadow:0 4px 12px #ffc10733;transform:scale(1)}50%{box-shadow:0 4px 20px #ffc10766;transform:scale(1.02)}}@keyframes correctPulse{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}50%{transform:translate(-50%,-50%) scale(1.2);opacity:1}to{transform:translate(-50%,-50%) scale(1);opacity:.8}}.btn-primary{background-color:var(--theme-accent);color:#fff;padding:var(--spacing-md) var(--spacing-xl);border-radius:var(--radius-lg);font-weight:600;font-size:var(--font-size-lg);box-shadow:0 4px 6px #0003;transition:transform var(--transition-fast),background-color var(--theme-transition)}.btn-primary:active:not(:disabled){transform:scale(.95)}.btn-primary:disabled{background-color:var(--color-bg-card);color:var(--color-text-secondary);cursor:not-allowed}.card{background-color:var(--color-bg-card);border-radius:var(--radius-md);padding:var(--spacing-md);box-shadow:0 2px 4px #0003}