#tabata.page.active{display:block}
.interval-page{width:min(100%,1100px);margin:0 auto;padding:clamp(8px,2vw,24px) 0 28px;display:grid;gap:18px;min-width:0;color:var(--ink)}
.interval-heading{display:grid;gap:6px;min-width:0}
.interval-eyebrow{margin:0;color:var(--lime);font-size:11px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}
.interval-heading h1{margin:0;font-size:clamp(25px,4vw,38px);line-height:1.12;letter-spacing:-.04em}
.interval-intro{margin:0;color:var(--muted);font-size:14px;max-width:68ch}
.interval-modes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:5px;border:1px solid #ffffff20;border-radius:14px;background:#0b1513;max-width:760px}
.interval-mode{min-height:46px;padding:10px 14px;border-radius:10px;background:transparent;color:#a6bdb1;font:inherit;font-size:13px;font-weight:800;cursor:pointer;transition:background .18s,color .18s,box-shadow .18s}
.interval-mode[aria-pressed="true"]{background:linear-gradient(135deg,#c7ff62,#84edbd);color:#10201b;box-shadow:0 4px 15px #9cf66b20}
.interval-mode:focus-visible,.interval-actions button:focus-visible,.interval-sound:focus-visible,.interval-field input:focus-visible{outline:3px solid #9affd0;outline-offset:3px}
.interval-layout{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:16px;align-items:stretch;min-width:0}
.interval-clock,.interval-config{min-width:0;border:1px solid #ffffff20;border-radius:20px;background:radial-gradient(ellipse at 85% 0,#5affca0c,transparent 44%),linear-gradient(145deg,#121a18,#0d1312);box-shadow:0 18px 45px #0002}
.interval-clock{display:grid;justify-items:center;align-content:center;gap:14px;padding:clamp(20px,4vw,36px);text-align:center;overflow:hidden}
.interval-clock-top{width:100%;display:flex;justify-content:space-between;align-items:center;gap:12px;min-width:0}
.interval-phase{color:#d8ff9c;font-size:clamp(14px,2.5vw,18px);font-weight:850}
.interval-round{color:#91aaa1;font-size:12px;text-align:right;overflow-wrap:anywhere}
.interval-timer{font-size:clamp(74px,16vw,148px);line-height:.95;letter-spacing:-.065em;font-variant-numeric:tabular-nums;font-weight:900;color:#effff5;text-shadow:0 0 38px #93ffd41c;white-space:nowrap}
.roulette-reveal{width:min(100%,650px);min-height:clamp(280px,34vw,360px);display:grid;align-content:center;justify-items:center;gap:10px;padding:18px;border:1px solid #ff667566;border-radius:22px;background:radial-gradient(ellipse at center,#fa293339,transparent 74%),linear-gradient(145deg,#3a121c,#1c1217);box-shadow:0 0 55px #fa39451b,inset 0 0 30px #ff7e7410;transition:background .3s,border-color .3s,box-shadow .3s;overflow:hidden}
.roulette-reveal[hidden]{display:none}
.roulette-reveal>span{font-size:11px;font-weight:900;letter-spacing:.18em;color:#ffc0b9}
.roulette-reveal strong{max-width:100%;font-size:clamp(24px,4vw,38px);line-height:1.08;letter-spacing:-.035em;text-transform:none;color:#fff5f2;text-wrap:balance;overflow-wrap:anywhere;text-shadow:0 0 24px #ff47476e}
.roulette-reveal[data-phase="rest"],.roulette-reveal[data-phase="setRest"]{border-color:#68a9ff70;background:radial-gradient(ellipse at center,#268bff38,transparent 74%),linear-gradient(145deg,#102b49,#101d30);box-shadow:0 0 55px #398bff20,inset 0 0 30px #75b4ff12}
.roulette-reveal[data-phase="rest"]>span,.roulette-reveal[data-phase="setRest"]>span{color:#b6d6ff}
.roulette-move-label{display:inline-flex;align-items:center;justify-self:center;gap:8px;padding:7px 12px;border:1px solid #ffb0a84c;border-radius:999px;background:#fa55551a;color:#ffd2ca;font-size:10px!important;font-weight:950!important;letter-spacing:.13em!important;text-transform:uppercase}
.roulette-move-label:before{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor;content:""}
.roulette-reveal[data-phase="rest"] .roulette-move-label,.roulette-reveal[data-phase="setRest"] .roulette-move-label{border-color:#a9cdff66;background:#66a5ff1c;color:#d8e9ff}
.roulette-reveal[data-phase="rest"] .roulette-move-label:before,.roulette-reveal[data-phase="setRest"] .roulette-move-label:before{animation:roulette-next-pulse 1.5s ease-in-out infinite}
.roulette-reveal[data-phase="rest"] .roulette-move-visual,.roulette-reveal[data-phase="setRest"] .roulette-move-visual{border-color:#a9cdff79;box-shadow:0 0 28px #66a5ff35,0 8px 24px #0005}
.roulette-reveal[data-phase="rest"] strong,.roulette-reveal[data-phase="setRest"] strong{color:#f1f7ff;text-shadow:0 0 22px #70aaff62}
.roulette-reveal[data-phase="ready"]{border-color:#c7ff6245;background:radial-gradient(ellipse at center,#c7ff6218,transparent 74%),linear-gradient(145deg,#15221c,#101715);box-shadow:0 0 40px #b3ff3210}
.roulette-duration{margin:0;color:#ceff9c;font-size:13px;font-weight:800;line-height:1.5}
.interval-progress{width:min(100%,440px);height:9px;border-radius:99px;overflow:hidden;background:#ffffff14}
.interval-progress>span{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#c7ff62,#73f5c4);transition:width .2s linear}
.interval-status{min-height:1.4em;margin:0;color:#9cb5aa;font-size:13px;font-weight:700}
.interval-actions{width:min(100%,440px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.65fr);gap:9px}
.interval-actions .btn{min-height:50px;display:inline-flex;align-items:center;justify-content:center;font-size:14px}
.interval-actions .interval-primary{background:var(--lime);color:#122119}
.interval-actions button:disabled{opacity:.55;cursor:not-allowed}
.interval-sound-row{display:flex;align-items:center;justify-content:center;gap:9px;min-height:38px;color:#8fa89d;font-size:12px}
.interval-sound{min-height:40px;padding:8px 12px;border:1px solid #ffffff25;border-radius:10px;background:#ffffff0b;color:#d8ff9c;font:inherit;font-weight:750;cursor:pointer}
.interval-config{padding:clamp(18px,3vw,28px);display:grid;align-content:start;gap:14px}
.interval-config h2{margin:0;color:#effff6;font-size:18px;letter-spacing:-.02em}
.interval-config-hint,.interval-audio-note{margin:0;color:#9aafa6;font-size:12px;line-height:1.5}
.interval-fields{display:grid;gap:10px}
.interval-field{min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(112px,.65fr);align-items:center;gap:12px;padding:11px 12px;border:1px solid #ffffff18;border-radius:12px;background:#ffffff08;color:#dbece2;font-size:13px;font-weight:750}
.interval-input-wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:7px;min-width:0}
.interval-field input{width:100%;min-width:0;min-height:44px;padding:8px 9px;border:1px solid #ffffff27;border-radius:9px;background:#091110;color:#effff6;font:inherit;font-size:16px;font-variant-numeric:tabular-nums}
.interval-field input:disabled{opacity:.6}
.interval-field small{color:#8da69a;font-size:11px;white-space:nowrap}
.interval-audio-note{padding-top:11px;border-top:1px solid #ffffff17}
@media(max-width:900px){.interval-layout{grid-template-columns:minmax(0,1fr) minmax(250px,.8fr)}.interval-timer{font-size:clamp(70px,13vw,116px)}}
@media(max-width:700px){.interval-page{gap:13px;padding:5px 0 18px}.interval-layout{grid-template-columns:minmax(0,1fr)}.interval-modes{max-width:none}.interval-clock{padding:21px 16px}.interval-timer{font-size:clamp(76px,22vw,118px)}.interval-config{padding:18px}.interval-fields{grid-template-columns:1fr 1fr}.interval-field{grid-template-columns:1fr;align-items:start;gap:6px}.interval-input-wrap{grid-template-columns:minmax(0,1fr) auto}.interval-sound-row{flex-wrap:wrap}}
@media(max-width:420px){.interval-clock-top{align-items:flex-start;flex-direction:column;gap:5px}.interval-round{text-align:left}.interval-actions{grid-template-columns:1fr}.interval-actions .btn{width:100%}.interval-fields{grid-template-columns:1fr}.interval-field{grid-template-columns:minmax(0,1fr) minmax(112px,.65fr);align-items:center;gap:10px}.interval-timer{font-size:clamp(67px,21vw,88px)}}
@media(prefers-reduced-motion:reduce){.interval-mode,.interval-progress>span{transition:none!important}}
.roulette-reveal{position:relative;grid-template-rows:auto 190px auto;gap:8px;min-height:clamp(280px,34vw,360px)}
.roulette-reveal[data-phase="ready"] strong{max-width:34ch;font-size:clamp(17px,2.2vw,24px);line-height:1.2;letter-spacing:-.01em;text-transform:none;text-shadow:none}
.roulette-move-visual{display:grid;place-items:center;width:min(100%,220px);height:190px;overflow:hidden;border:1px solid #ffffff2b;border-radius:18px;background:linear-gradient(145deg,#f1f5ed,#dbe7dc);box-shadow:0 0 30px #ff726b22,0 8px 24px #0005}
.roulette-training-gif{display:block;width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.roulette-figure{width:100%;height:100%;padding:14px;overflow:visible;filter:drop-shadow(0 0 10px #b9ff6d40)}
.roulette-figure path,.roulette-figure circle{stroke:#d9f3df;stroke-width:8;stroke-linecap:round;stroke-linejoin:round;fill:none}
.roulette-figure .rf-head{fill:#d9f3df;stroke:#c7ff62;stroke-width:3}
.roulette-figure .rf-floor{stroke:#9bc88f40;stroke-width:2}
.roulette-figure .rf-body,.roulette-figure .rf-arms,.roulette-figure .rf-legs{transform-box:fill-box;transform-origin:center;}
.roulette-figure .rf-body{stroke:#c7ff62;stroke-width:11}
.roulette-figure .rf-arms,.roulette-figure .rf-legs{stroke-width:7}
.rfig-pushups .rf-body{animation:rf-push 1.15s ease-in-out infinite}
.rfig-pushups .rf-arms{animation:rf-push-arms 1.15s ease-in-out infinite}
.rfig-squats .rf-body,.rfig-squats .rf-head{animation:rf-squat 1.35s ease-in-out infinite;transform-origin:50% 70%}
.rfig-squats .rf-legs{animation:rf-squat-legs 1.35s ease-in-out infinite}
.rfig-alternating_lunges .rf-legs{animation:rf-lunge 1.45s ease-in-out infinite}
.rfig-alternating_lunges .rf-body{animation:rf-lunge-torso 1.45s ease-in-out infinite}
.rfig-plank .rf-body{animation:rf-breathe 2.2s ease-in-out infinite}
.rfig-crunches .rf-crunch-torso{transform-origin:38% 70%;animation:rf-crunch 1.15s ease-in-out infinite}
.rfig-crunches[data-variant="bicycle"] .rf-crunch-legs{animation:rf-cycle-legs 1.2s ease-in-out infinite}
.rfig-crunches[data-variant="reverse"] .rf-crunch-legs{animation:rf-reverse-legs 1.2s ease-in-out infinite}
.rfig-crunches[data-variant="crossReach"] .rf-crunch-torso{animation:rf-cross-crunch 1.25s ease-in-out infinite}
.rfig-mountain_climbers .rf-climber-legs{animation:rf-climb 1.05s ease-in-out infinite}
.rfig-jumping_jacks .rf-jack-arms,.rfig-jumping_jacks .rf-jack-legs{animation:rf-jack 1.3s ease-in-out infinite alternate}
.rfig-glute_bridge .rf-bridge-hips{animation:rf-bridge 1.25s ease-in-out infinite}
.rfig-burpees{animation:rf-burpee 1.8s cubic-bezier(.4,0,.5,1) infinite}
.rfig-high_knees .rf-knee-legs{animation:rf-highknees .8s ease-in-out infinite alternate}
@keyframes rf-push{0%,100%{transform:translateY(0)}50%{transform:translateY(6px)}}
@keyframes rf-push-arms{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.84)}}
@keyframes rf-squat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(9px) rotate(5deg)}}
@keyframes rf-squat-legs{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.8)}}
@keyframes rf-lunge{0%,100%{transform:translateX(0)}50%{transform:translateX(8px) scaleY(.9)}}
@keyframes rf-lunge-torso{0%,100%{transform:rotate(0)}50%{transform:rotate(-5deg)}}
@keyframes rf-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(1.5px)}}
@keyframes rf-crunch{0%,100%{transform:rotate(0)}50%{transform:rotate(-22deg)}}
@keyframes rf-cross-crunch{0%,100%{transform:rotate(0)}50%{transform:rotate(-27deg) translateX(3px)}}
@keyframes rf-cycle-legs{0%,100%{transform:rotate(0)}50%{transform:rotate(-17deg) translateY(-4px)}}
@keyframes rf-reverse-legs{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px) rotate(-12deg)}}
@keyframes rf-climb{0%,100%{transform:translateX(0)}50%{transform:translateX(-10px) scaleY(.94)}}
@keyframes rf-jack{from{transform:scale(.82)}to{transform:scale(1.08)}}
@keyframes rf-bridge{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes rf-highknees{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px) rotate(8deg)}}
@keyframes rf-burpee{0%,15%,100%{transform:translateY(0)}45%,65%{transform:translateY(-12px) scale(1.04)}80%{transform:translateY(3px) scale(.96)}}
@keyframes roulette-next-pulse{0%,100%{opacity:.55;transform:scale(.82)}50%{opacity:1;transform:scale(1.18)}}
@media(max-width:500px){.roulette-reveal{grid-template-rows:auto 160px auto;min-height:270px;padding:14px}.roulette-move-visual{width:min(100%,190px);height:160px}.roulette-figure{height:100%;padding:10px}.roulette-reveal strong{font-size:clamp(24px,7vw,36px)}}
@media(prefers-reduced-motion:reduce){.roulette-figure,.roulette-figure *,.roulette-move-label:before{animation:none!important;transition:none!important}}
.roulette-coach{display:grid;gap:16px;padding:clamp(18px,3vw,28px);border:1px solid #ffffff20;border-radius:20px;background:radial-gradient(ellipse at 90% 0,#5affca0c,transparent 44%),linear-gradient(145deg,#121a18,#0d1312);color:#effff6}
.roulette-coach-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.roulette-coach-head h2{margin:2px 0 6px;font-size:clamp(20px,3vw,27px)}
.roulette-count{flex:none;padding:8px 11px;border:1px solid #c7ff6238;border-radius:99px;color:#d8ff9c;font-size:12px;font-weight:850}
.roulette-exercise-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.roulette-exercise{display:flex;align-items:center;gap:10px;min-height:48px;padding:10px 12px;border:1px solid #ffffff1c;border-radius:12px;background:#ffffff07;color:#dbece2;font-size:13px;font-weight:750;cursor:pointer}
.roulette-exercise input{width:18px;height:18px;accent-color:#c7ff62}
.roulette-settings{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
@media(max-width:500px){.roulette-exercise-grid,.roulette-settings{grid-template-columns:1fr}.roulette-coach-head{flex-direction:column}.interval-modes{gap:4px;padding:4px}.interval-mode{padding:8px 6px;font-size:11px;line-height:1.15}}
