:root{--bg-color:#1a1a2e;--card-bg:#16213e;--accent:#e94560;--accent-light:#ff6b81;--text:#eee;--text-muted:#aaa;--number-bg:#0f3460;--number-active:#e94560;--op-bg:#533483;--success:#4ecca3;--warning:#fc5185}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-color);color:var(--text);min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,sans-serif;overflow-x:hidden}#app{max-width:500px;min-height:100vh;margin:0 auto;padding:16px}.top-bar{justify-content:flex-end;display:flex}.lang-btn{border:1px solid var(--text-muted);color:var(--text-muted);cursor:pointer;background:0 0;border-radius:6px;padding:4px 12px;font-size:.85rem}.lang-btn:active{background:#ffffff1a}.game-title{text-align:center;color:var(--accent-light);padding:12px 0;font-size:2rem;font-weight:700}.stats-bar{justify-content:space-between;padding:8px 0;font-size:1rem;display:flex}.stats-bar .stat-item{color:var(--text-muted)}.stats-bar .stat-item span{color:var(--accent-light);font-weight:700}.guide-bar{text-align:center;color:var(--text-muted);padding:6px 0;font-size:.8rem}.intro-card{background:var(--card-bg);color:var(--text-muted);border-radius:12px;margin:12px 0;padding:16px;font-size:.9rem;line-height:1.6}.intro-card ol{margin-top:8px;padding-left:20px}.formula-board{background:var(--card-bg);border-radius:16px;margin:16px 0;padding:20px 16px;overflow:hidden}.formula-row{flex-wrap:nowrap;justify-content:center;align-items:center;gap:4px;display:flex}.number-card{background:var(--number-bg);border:2px solid var(--accent);cursor:grab;-webkit-user-select:none;user-select:none;touch-action:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:11vw;max-width:56px;height:11vw;max-height:56px;font-size:clamp(1rem,3.5vw,1.5rem);font-weight:700;transition:transform .2s,background .2s;display:flex}.number-card:active{background:var(--number-active);transform:scale(1.1)}.number-card.dragging{opacity:.5;transform:scale(.9)}.number-card.drag-over{border-color:var(--success);background:#4ecca333}.operator-select{background:var(--op-bg);color:#fff;text-align:center;cursor:pointer;appearance:none;border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:8vw;max-width:40px;height:8vw;max-height:40px;font-size:clamp(.9rem,3vw,1.3rem);display:flex}.operator-select:focus{outline:2px solid var(--accent)}.bracket{color:var(--accent-light);flex-shrink:0;font-size:clamp(1.2rem,4vw,2rem);font-weight:700;line-height:1}.equal-sign{color:var(--text-muted);flex-shrink:0;margin:0 2px;font-size:clamp(1rem,3vw,1.5rem)}.result-display{color:var(--accent-light);text-align:center;flex-shrink:0;min-width:30px;font-size:clamp(1rem,3.5vw,1.5rem);font-weight:700}.result-display.is-24{color:var(--success);text-shadow:0 0 10px var(--success)}.bracket-picker{margin:16px 0}.bracket-picker .bracket-label{color:var(--text-muted);margin-bottom:8px;font-size:.85rem}.bracket-picker .bracket-options{flex-wrap:wrap;gap:8px;padding:4px 0;display:flex}.bracket-picker .bracket-btn{background:var(--card-bg);color:var(--text-muted);white-space:nowrap;cursor:pointer;border:1px solid #444;border-radius:20px;padding:8px 12px;font-size:.8rem;transition:all .2s}.bracket-picker .bracket-btn.active{background:var(--accent);border-color:var(--accent);color:#fff}.timer-section{flex-direction:column;align-items:center;margin:16px 0;display:flex}.timer-section .timer-circle{width:80px;height:80px;position:relative}.timer-section .timer-circle svg{width:80px;height:80px;transform:rotate(-90deg)}.timer-section .timer-circle .timer-bg{fill:none;stroke:#333;stroke-width:4px}.timer-section .timer-circle .timer-progress{fill:none;stroke:var(--accent);stroke-width:4px;stroke-linecap:round;transition:stroke-dashoffset 1s linear}.timer-section .timer-circle .timer-text{font-size:1.3rem;font-weight:700;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.timer-section .timer-circle .timer-text.urgent{color:var(--warning)}.timer-section .estimated-score{color:var(--text-muted);margin-top:8px;font-size:.9rem}.timer-section .estimated-score span{color:var(--accent-light);font-size:1.1rem;font-weight:700}.scoring-rules{background:var(--card-bg);color:var(--text-muted);border-radius:12px;margin:16px 0;padding:14px 16px;font-size:.85rem}.scoring-rules .scoring-title{color:var(--text);margin-bottom:8px;font-size:.9rem}.scoring-rules ul{padding:0;list-style:none}.scoring-rules ul li{padding:3px 0}.scoring-rules ul li:before{content:"·";color:var(--accent);margin-right:6px}.scoring-rules ul li span{color:var(--accent-light)}.start-section{text-align:center;padding:40px 0}.start-section .start-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:30px;padding:14px 48px;font-size:1.2rem;transition:transform .2s,box-shadow .2s}.start-section .start-btn:active{transform:scale(.95)}.start-section .start-btn:hover{box-shadow:0 4px 20px #e9456066}.start-section .leaderboard-btn{color:var(--accent-light);border:1px solid var(--accent);cursor:pointer;background:0 0;border-radius:25px;margin:16px auto 0;padding:10px 32px;font-size:1rem;transition:all .2s;display:block}.start-section .leaderboard-btn:active{transform:scale(.95)}.start-section .leaderboard-btn:hover{background:#e945601a}.result-overlay{z-index:100;background:#000000b3;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.result-card{background:var(--card-bg);text-align:center;border-radius:20px;width:100%;max-width:340px;padding:32px 24px;animation:.3s ease-out slideUp}.result-card .result-icon{margin-bottom:12px;font-size:3rem}.result-card .result-title{margin-bottom:16px;font-size:1.5rem;font-weight:700}.result-card .result-detail{color:var(--text-muted);margin:8px 0;font-size:.95rem}.result-card .result-detail span{color:var(--accent-light);font-weight:700}.result-card .answer-text{color:var(--accent-light);word-break:break-all;margin:12px 0;font-size:1.1rem}.result-card .result-btn{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:25px;margin-top:20px;padding:12px 40px;font-size:1rem}.result-card .result-btn:active{transform:scale(.95)}.result-card .countdown-hint{color:var(--text-muted);margin-top:12px;font-size:.8rem}.result-card .countdown-hint em{color:var(--accent-light);font-style:normal}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.leaderboard-overlay{z-index:100;background:#000000b3;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.leaderboard-panel{background:var(--card-bg);border-radius:20px;width:100%;max-width:400px;max-height:80vh;padding:24px;animation:.3s ease-out slideUp;overflow-y:auto}.leaderboard-panel .leaderboard-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.leaderboard-panel .leaderboard-title{color:var(--accent-light);font-size:1.3rem;font-weight:700}.leaderboard-panel .leaderboard-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:1.2rem}.leaderboard-panel .leaderboard-close:hover{color:var(--text);background:#ffffff1a}.leaderboard-tabs{gap:8px;margin-bottom:16px;display:flex}.leaderboard-tabs .leaderboard-tab{color:var(--text-muted);cursor:pointer;background:0 0;border:1px solid #444;border-radius:20px;flex:1;padding:8px 4px;font-size:.8rem;transition:all .2s}.leaderboard-tabs .leaderboard-tab.active{background:var(--accent);border-color:var(--accent);color:#fff}.leaderboard-list .leaderboard-list-header{color:var(--text-muted);border-bottom:1px solid #333;padding:8px 0;font-size:.75rem;display:flex}.leaderboard-list .leaderboard-row{color:var(--text);border-bottom:1px solid #222;padding:10px 0;font-size:.85rem;display:flex}.leaderboard-list .leaderboard-row.top-three .lb-col-rank{color:var(--accent-light);font-weight:700}.leaderboard-list .lb-col-rank{text-align:center;flex-shrink:0;width:40px}.leaderboard-list .lb-col-value{text-align:center;color:var(--accent-light);flex:1;font-weight:700}.leaderboard-list .lb-col-date{text-align:right;width:90px;color:var(--text-muted);flex-shrink:0;font-size:.8rem}.leaderboard-list .leaderboard-empty{text-align:center;color:var(--text-muted);padding:32px 0;font-size:.9rem}.new-record-badge{color:var(--accent-light);margin-bottom:12px;font-size:1.1rem;font-weight:700;animation:1s ease-in-out infinite alternate pulse}@keyframes pulse{0%{opacity:.7;transform:scale(1)}to{opacity:1;transform:scale(1.05)}}
