:root{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:#f5f8ff;background:#0e1629}
*{box-sizing:border-box} body{margin:0;min-height:100vh;background:radial-gradient(circle at 50% -10%,#304a78 0,#17233d 42%,#0c1324 100%);display:grid;place-items:center;padding:18px}
button,select,input{font:inherit}.app{width:min(100%,980px);min-height:min(760px,calc(100vh - 36px));background:rgba(14,23,42,.88);border:1px solid rgba(255,255,255,.15);border-radius:28px;padding:clamp(18px,3vw,34px);box-shadow:0 24px 80px #050914aa;display:flex;flex-direction:column;gap:20px}
header{display:flex;align-items:center;justify-content:space-between}h1{font-size:clamp(1.35rem,3vw,2.2rem);margin:0}.eyebrow{margin:0 0 3px;color:#74e8c3;font-weight:900;letter-spacing:.2em;font-size:.75rem}.icon-btn{border:1px solid #ffffff36;background:#ffffff12;color:white;border-radius:50%;width:48px;height:48px;cursor:pointer}
.settings{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.settings label{font-size:.78rem;color:#b9c6dc;font-weight:700}.settings select{display:block;margin-top:6px;width:100%;border:1px solid #ffffff26;border-radius:12px;background:#202e4b;color:white;padding:11px 10px;outline:none}
.stage{flex:1;min-height:310px;border-radius:24px;background:linear-gradient(145deg,#f8fbff,#dbe9f5);color:#17233d;box-shadow:inset 0 0 0 5px #ffffff75,0 12px 35px #05091466;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:30px}.progress{position:absolute;top:0;left:0;right:0;height:8px;background:#c8d5e2}.progress span{display:block;width:0;height:100%;background:#18ae86;transition:width .2s}.counter{position:absolute;top:18px;margin:0;color:#64738a;font-weight:800}.display{font-size:clamp(5.5rem,20vw,13rem);line-height:1;font-weight:900;letter-spacing:-.06em;font-variant-numeric:tabular-nums;text-shadow:0 4px 0 #fff;transition:opacity .1s,transform .1s}.display.dots{font-size:clamp(2.8rem,10vw,6rem);letter-spacing:.12em;color:#18a77f;white-space:nowrap;text-shadow:none}.display.flash{opacity:0;transform:scale(.92)}.hint{position:absolute;bottom:18px;margin:0;color:#64738a;text-align:center}
.answer-panel,.result{text-align:center}.answer-panel>label{display:block;font-weight:800;margin-bottom:10px}.answer-row{display:flex;justify-content:center;gap:10px}.answer-row input{width:min(100%,290px);background:#fff;color:#132039;border:3px solid #5ad2ad;border-radius:14px;padding:12px 16px;text-align:center;font-size:1.5rem;font-weight:900;outline:none}
button.primary,button.secondary{border:0;border-radius:14px;padding:13px 28px;font-weight:900;cursor:pointer}.primary{color:#09271f;background:linear-gradient(135deg,#72f0ca,#36c99d);box-shadow:0 7px 18px #19b88c44}.secondary{color:white;background:#ffffff18;border:1px solid #ffffff30!important}.repeat{color:#17233d;background:#d9e5f0;border-color:#afc1d2!important}.actions{display:flex;justify-content:center;gap:12px}.start{font-size:1.2rem;min-width:190px}.result{padding:5px}.result-icon{font-size:3rem}.result h2{margin:4px 0}.result p{margin:0;color:#c5d0e2}.countdown{color:#e4516f!important;animation:pulse .55s ease both}@keyframes pulse{50%{transform:scale(1.17)}}button:disabled,select:disabled{opacity:.48;cursor:not-allowed}
@media(max-width:720px){body{padding:0}.app{min-height:100vh;border-radius:0;padding:16px}.settings{grid-template-columns:1fr 1fr}.stage{min-height:280px}.answer-row{flex-direction:column;align-items:center}.answer-row input,.answer-row button{width:100%}}
@media(max-height:720px) and (orientation:landscape){.app{min-height:100vh;gap:10px;padding:12px 20px}.settings{grid-template-columns:repeat(4,1fr)}.stage{min-height:210px}.display{font-size:clamp(5rem,24vh,9rem)}.hint{display:none}}