:root{color:#fff;background:#090b18;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at top,#27337a,#090b18 55%);min-height:100svh;margin:0;transition:all .3s}.app{align-content:center;gap:22px;width:min(980px,100%);min-height:100svh;margin:auto;padding:clamp(18px,4vw,44px);display:grid}.top,.phase-meta,.controls,.timeline,menu{justify-content:space-between;align-items:center;gap:14px;display:flex}.eyebrow{color:#91a7ff;text-transform:uppercase;letter-spacing:.18em;margin:0 0 4px;font-weight:800}h1,h2,p{margin:0}h1{font-size:clamp(30px,7vw,64px);line-height:.95}.phase-card{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffff12;border:1px solid #ffffff24;border-radius:34px;padding:clamp(22px,5vw,46px);position:relative;overflow:hidden;box-shadow:0 24px 80px #0008}.phase-card:before{content:"";opacity:.35;pointer-events:none;background:#ffffff0d;position:absolute;inset:-40%;transform:rotate(8deg)}.phase-meta{text-transform:uppercase;letter-spacing:.08em;color:#dfe5ff;font-weight:900;position:relative}.timer{text-align:center;letter-spacing:-.08em;text-shadow:0 12px 50px #0009;margin:24px 0;font-size:clamp(74px,22vw,210px);font-weight:950;line-height:.9;position:relative}.bar{background:#ffffff1c;border-radius:99px;height:18px;overflow:hidden}.bar div{border-radius:inherit;background:#8ea2ff;width:0;height:100%;transition:all .25s}button{font:inherit;color:#111936;cursor:pointer;background:#e8ecff;border:0;border-radius:999px;padding:16px 22px;font-weight:900;box-shadow:0 12px 30px #0005}button:active{transform:translateY(1px)}.primary{background:#7cf7b2}.danger{color:#fff;background:#ff6b7c}.ghost{color:#fff;background:#ffffff17;border:1px solid #ffffff2b}.controls button{flex:1;font-size:clamp(16px,3vw,24px)}#hint{color:#d5dcff;margin-top:16px;font-size:clamp(16px,2vw,20px)}.timeline{align-items:stretch}.pill{color:#cbd4ff;background:#ffffff10;border:1px solid #ffffff18;border-radius:22px;flex:1;padding:16px}.pill b,.pill span{display:block}.pill span{color:#ffffffb8;margin-top:6px}.pill.active{outline:3px solid #91a7ff}.pill.done{background:#2af08b22}dialog{color:#fff;background:#111936;border:0;border-radius:28px;max-width:min(520px,92vw);padding:0}dialog::backdrop{background:#0009}.sheet{gap:18px;padding:24px;display:grid}.sheet label{gap:8px;margin:12px 0;font-weight:900;display:grid}.sheet input{width:100%;font:inherit;color:#fff;background:#ffffff12;border:1px solid #ffffff24;border-radius:16px;padding:14px}menu{margin:0;padding:0}body[data-state=ok]{background:radial-gradient(circle at top,#1fd77a,#07170f 60%)}body[data-state=ok] .phase-card{animation:1.5s infinite softPulse}body[data-state=ok] .bar div{background:#7cf7b2}body[data-state=danger]{background:radial-gradient(circle at top,#ff3b4f,#1a0710 62%)}body[data-state=danger] .phase-card{animation:.55s infinite hardPulse}body[data-state=danger] .bar div{background:#ff6b7c}@keyframes softPulse{50%{transform:scale(1.01);box-shadow:0 0 80px #7cf7b280}}@keyframes hardPulse{50%{transform:scale(1.025);box-shadow:0 0 120px #ff405d}}@media (width<=680px){.top,.controls,.timeline{flex-direction:column}.top>*,.controls button,.pill{width:100%}.phase-meta{font-size:14px}.timer{margin:32px 0}.app{align-content:start}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}