:root{--bg: #061428;--panel: #0d2040;--panel-rgb: 13,32,64;--border: #1a3a60;--border-hi: #2a5282;--accent: #ffd43b;--accent-rgb: 255,212,59;--accent-dim: #d1ab20;--red: #ff3c3c;--text: rgba(255,255,255,.92);--text-mid: rgba(255,255,255,.7);--text-dim: rgba(255,255,255,.42);--dim: #3a608a;--input-rgb: 4,14,32;--tr: .22s cubic-bezier(.4, 0, .2, 1);--bar-h: clamp(52px, 9vh, 88px);--gap: clamp(5px, .7vw, 11px);--cell-px: clamp(10px, 1.8vw, 24px)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%;touch-action:manipulation}body{background:var(--bg);color:var(--text);font-family:Barlow Condensed,sans-serif;height:100dvh;overflow:hidden}.app{position:relative;z-index:2;width:100%;height:100dvh;display:flex;flex-direction:column;opacity:0;transition:opacity .15s ease}.app.ready{opacity:1}.stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:var(--gap)}.min-layout{width:min(92vw,1000px);display:flex;flex-direction:column;gap:var(--gap)}.min-timer-cell{display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:clamp(10px,1.2vw,18px);background:rgba(var(--panel-rgb),.6);border:1px solid var(--border);border-top-color:var(--border-hi);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);box-shadow:0 0 0 1px #ffffff08 inset;padding:clamp(16px,3vw,32px) var(--cell-px) clamp(12px,2vw,24px);gap:clamp(6px,1vh,12px);overflow:hidden}.min-timer-wrap{width:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}#time{font-family:Teko,sans-serif;font-variant-numeric:tabular-nums;font-size:22vw;font-weight:600;line-height:1;letter-spacing:.04em;color:#ffffffeb;-webkit-user-select:none;user-select:none;white-space:nowrap;display:block;text-align:center;text-shadow:0 3px 0 rgba(0,0,0,.7);transition:color .25s}#time .timer-digit{display:inline-block;width:var(--digit-w, 1ch);text-align:center}#time .timer-sep{display:inline-block;width:var(--sep-w, 1ch);text-align:center}#time.warning{color:var(--accent);text-shadow:0 3px 0 rgba(0,0,0,.65)}#time.danger{color:var(--red);text-shadow:0 3px 0 rgba(0,0,0,.65);animation:pulseFast .45s infinite alternate}#time.done{color:var(--dim);text-shadow:0 3px 0 rgba(0,0,0,.5);animation:none}.progress-track{width:100%;height:5px;flex-shrink:0;background:#ffffff0f;border-radius:4px;overflow:visible;position:relative}.progress-fill{height:100%;background:var(--accent);border-radius:4px;transition:width .12s linear,background .3s;position:relative;box-shadow:0 0 10px rgba(var(--accent-rgb),.5)}.progress-fill:after{content:"";position:absolute;right:-4px;top:50%;transform:translateY(-50%);width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent),0 0 22px rgba(var(--accent-rgb),.4)}.progress-fill.warning{background:var(--accent)}.progress-fill.danger{background:var(--red);box-shadow:0 0 8px #ff3c3c99}.progress-fill.danger:after{background:var(--red);box-shadow:0 0 12px var(--red)}.min-status-row{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:100%}.status-bar{display:flex;align-items:center;gap:8px;font-size:clamp(11px,1.3vw,14px);font-weight:600;letter-spacing:.36em;text-transform:uppercase;color:var(--text-dim)}.status-dot{width:clamp(8px,.8vw,10px);height:clamp(8px,.8vw,10px);border-radius:50%;background:var(--border);flex-shrink:0;transition:background .3s,box-shadow .3s;margin-right:5px}.status-dot.running{background:var(--accent);box-shadow:0 0 8px var(--accent),0 0 16px rgba(var(--accent-rgb),.35);animation:blink 1.1s infinite}.status-dot.done{background:var(--red);box-shadow:0 0 8px var(--red)}.min-bottom-row{display:flex;align-items:stretch;gap:var(--gap);height:var(--bar-h);flex-shrink:0}.min-spin{position:relative;flex:1}.min-spin input{font-family:Teko,sans-serif;font-size:clamp(22px,3.8vw,52px);line-height:1;width:100%;height:100%;text-align:center;background:rgba(var(--input-rgb),.88);border:1px solid var(--border);border-radius:10px;color:#fff;padding:clamp(4px,1vh,10px) clamp(26px,3.2vw,44px) clamp(4px,1vh,10px) 4px;outline:none;transition:border-color .2s,box-shadow .2s;-moz-appearance:textfield;appearance:textfield}.min-spin input::-webkit-outer-spin-button,.min-spin input::-webkit-inner-spin-button{-webkit-appearance:none}.min-spin input:focus{border-color:rgba(var(--accent-rgb),.5);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.07)}.spin-btns{position:absolute;top:0;right:0;bottom:0;width:clamp(24px,2.6vw,38px);display:flex;flex-direction:column;border-left:1px solid var(--border);overflow:hidden;border-radius:0 9px 9px 0}.spin-btn{flex:1;background:none;border:none;border-bottom:1px solid var(--border);cursor:pointer;color:var(--text);font-size:clamp(9px,1.1vw,14px);padding:0;display:flex;align-items:center;justify-content:center;transition:color .14s,background .14s}.spin-btn:last-child{border-bottom:none}.spin-btn:hover{color:var(--accent);background:rgba(var(--accent-rgb),.1)}.spin-btn:active{color:var(--accent);background:rgba(var(--accent-rgb),.2)}.min-sep{font-family:Teko,sans-serif;font-size:clamp(16px,2.8vw,44px);color:var(--text);flex-shrink:0;display:flex;align-items:center}.btn{flex:1;font-size:clamp(13px,1.7vw,22px);border-radius:clamp(7px,.8vw,12px);padding:0;height:100%;cursor:pointer;transition:var(--tr);border:1px solid transparent;display:flex;align-items:center;justify-content:center}.btn:active{transform:scale(.97) translateY(1px)!important}.btn-set{background:transparent;color:var(--text);border-color:var(--border-hi)}.btn-set:hover{border-color:rgba(var(--accent-rgb),.55);color:var(--accent);background:rgba(var(--accent-rgb),.06)}.btn-main{background:var(--accent);color:#000;box-shadow:0 3px 18px rgba(var(--accent-rgb),.35),0 1px #ffffff4d inset}.btn-main:hover{filter:brightness(1.08);transform:translateY(-2px)}.btn-main.is-running{background:#122242f2;color:#ffffffc7;border-color:#ffffff1f;box-shadow:none}.btn-main.is-running:hover{background:#1c325af2;color:#fff;border-color:#ffffff38;filter:none;transform:translateY(-2px)}.btn-main.is-paused{background:transparent;color:var(--accent);border-color:rgba(var(--accent-rgb),.48)}.btn-main.is-paused:hover{background:rgba(var(--accent-rgb),.07);border-color:rgba(var(--accent-rgb),.7);transform:translateY(-2px)}.btn-reset{background:transparent;color:var(--text-dim);border-color:var(--border)}.btn-reset:hover{background:#ff3c3c14;color:var(--red);border-color:#ff3c3c59;transform:translateY(-2px)}@media(orientation:portrait),(max-aspect-ratio:1/1){.min-layout{width:min(96vw,560px)}:root{--bar-h: clamp(50px, 8.5vh, 76px)}.min-bottom-row{display:grid;grid-template-columns:1fr 1fr 1fr 1fr 1fr;align-items:stretch;gap:var(--gap)}.min-sep{display:none}.min-spin input{font-size:clamp(18px,5.5vw,40px);padding:clamp(4px,1.2vh,10px) clamp(20px,6.5vw,34px) clamp(4px,1.2vh,10px) 4px}.spin-btns{width:clamp(20px,6vw,32px)}.btn{font-size:clamp(14px,4vw,24px)}}@media(max-width:380px){.min-layout{width:98vw}:root{--gap: 4px}}@media(max-height:440px)and (orientation:landscape){:root{--bar-h: clamp(40px, 8vh, 54px);--gap: 4px}.min-layout{gap:4px}}#introOverlay{position:fixed;inset:0;z-index:900;background:#061428f5;display:none;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}#introOverlay.visible{display:flex;animation:fadeIn .08s ease both}#introRing{position:absolute;width:clamp(180px,30vw,440px);height:clamp(180px,30vw,440px);border-radius:50%;border:2px solid rgba(255,255,255,.1)}#introRing.spin{animation:ringExpandFade .85s ease-out both}#introNumber{font-family:Teko,sans-serif;font-weight:700;font-size:clamp(160px,28vw,400px);color:var(--accent);line-height:1;position:relative;z-index:1;opacity:0}#introNumber.pop{animation:numPop .32s cubic-bezier(.34,1.56,.64,1) both}#introNumber.go{color:#fff;animation:numGo .38s cubic-bezier(.34,1.3,.64,1) both}.setup-select{background:#ffffff0a;border:1px solid rgba(255,255,255,.07);border-radius:8px;color:var(--text);padding:6px 12px;font-family:Barlow Condensed,sans-serif;font-size:14px;outline:none;cursor:pointer;transition:border-color .2s}.setup-select:focus{border-color:#ffd43b}.setup-select option{background:#101d31;color:var(--text)}@keyframes pulseFast{0%{opacity:1}to{opacity:.55}}@keyframes blink{0%,to{opacity:1}50%{opacity:.1}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes numPop{0%{transform:scale(.38) rotate(-6deg);filter:blur(14px);opacity:0}to{transform:scale(1) rotate(0);filter:none;opacity:1}}@keyframes numGo{0%{transform:scale(.72);filter:blur(8px);opacity:0}to{transform:scale(1);filter:none;opacity:1}}@keyframes ringExpandFade{0%{transform:scale(.6);opacity:.8}to{transform:scale(1.6);opacity:0}}@keyframes modalIn{0%{opacity:0;transform:scale(.95) translateY(8px)}to{opacity:1;transform:scale(1) translateY(0)}}
