:root{
  --sky:#bfe9ff; --sky2:#e9f8ff; --ink:#22314f; --muted:#5b6b8a;
  --sun:#ffc93c; --coral:#ff6b6b; --mint:#2ec4b6; --grape:#7b61ff; --lime:#8ac926;
  --kid:#3a86ff; --kid-soft:#dbe8ff; --kid-dark:#1f5fcc;
  --r:28px;
  font-family: ui-rounded, "SF Pro Rounded", "Arial Rounded MT Bold", "Nunito", "Varela Round", system-ui, -apple-system, "Segoe UI", sans-serif;
}
body.kid-hayley{ --kid:#ff4f9a; --kid-soft:#ffe0ef; --kid-dark:#d62f7a; }
*{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
html,body{margin:0;height:100%;overflow:hidden;color:var(--ink);background:linear-gradient(180deg,var(--sky) 0%,var(--sky2) 70%,#fff 100%);
  user-select:none;-webkit-user-select:none;touch-action:manipulation;}
button{font:inherit;color:inherit;border:0;cursor:pointer;touch-action:manipulation;}
button:focus-visible{outline:5px solid var(--grape);outline-offset:3px;}
.screen{position:absolute;inset:0;display:none;padding:max(18px,env(safe-area-inset-top)) 24px max(36px,env(safe-area-inset-bottom));}
.screen.active{display:flex;flex-direction:column;}
.press{transition:transform .08s ease, box-shadow .08s ease;}
.press:active{transform:translateY(4px) scale(.98);}

/* decorative clouds */
.cloud{position:absolute;background:#fff;border-radius:999px;opacity:.85;z-index:0}
.cloud::before,.cloud::after{content:"";position:absolute;background:#fff;border-radius:50%}
.cloud.c1{width:150px;height:44px;top:6%;left:5%}.cloud.c1::before{width:70px;height:70px;top:-34px;left:22px}.cloud.c1::after{width:52px;height:52px;top:-22px;left:78px}
.cloud.c2{width:120px;height:36px;top:10%;right:9%}.cloud.c2::before{width:56px;height:56px;top:-28px;left:18px}.cloud.c2::after{width:40px;height:40px;top:-16px;left:62px}
.screen>*{position:relative;z-index:1}

/* ---------- HOME ---------- */
#home{align-items:center;justify-content:space-between;gap:14px}
.home-title{font-size:clamp(34px,4.6vw,52px);font-weight:900;margin:6px 0 0;text-align:center;letter-spacing:.5px}
.home-title span{color:var(--coral)}
.kids{display:flex;gap:28px;justify-content:center;width:100%;max-width:960px}
.kid-card{flex:1;max-width:420px;background:#fff;border-radius:36px;padding:18px 20px 20px;display:flex;flex-direction:column;align-items:center;gap:8px;
  box-shadow:0 8px 0 #c9d6ea;border:6px solid transparent;position:relative;}
.kid-card.sel{border-color:var(--c);box-shadow:0 8px 0 var(--cd);}
.kid-card .check{position:absolute;top:12px;right:14px;width:48px;height:48px;border-radius:50%;background:var(--c);color:#fff;display:none;align-items:center;justify-content:center}
.kid-card.sel .check{display:flex}
.kid-card svg.avatar{width:clamp(120px,15vw,170px);height:auto}
.kid-name{font-size:38px;font-weight:900;line-height:1}
.kid-age{font-size:20px;color:var(--muted);font-weight:700}
.bank{display:block;width:100%;margin-top:6px}
.bank-top{display:flex;align-items:center;gap:10px;font-weight:900;font-size:24px;justify-content:center}
.bank-top small{font-size:18px;color:var(--muted);font-weight:800}
.bar{display:block;height:30px;border-radius:999px;background:#eef2f8;margin-top:8px;overflow:hidden;box-shadow:inset 0 3px 0 rgba(0,0,0,.06)}
.bar i{display:block;height:100%;border-radius:999px;background:repeating-linear-gradient(45deg,var(--c) 0 16px,var(--cl) 16px 32px);transition:width .9s cubic-bezier(.3,1.4,.5,1)}
.bank{position:relative}
.gain{position:absolute;right:-6px;bottom:-5px;display:inline-flex;align-items:center;background:var(--lime);color:#fff;font-size:22px;font-weight:900;border-radius:999px;padding:4px 14px;margin-left:6px;box-shadow:0 3px 0 #5f8f17;animation:gainPop .5s cubic-bezier(.3,1.6,.5,1) both;white-space:nowrap}
@keyframes gainPop{from{transform:scale(.2);opacity:0}to{transform:scale(1);opacity:1}}
.gain.out{transition:opacity .4s;opacity:0}
.chips{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}
.chip{background:#fff;border-radius:999px;padding:10px 20px;font-size:22px;font-weight:800;display:flex;gap:10px;align-items:center;box-shadow:0 4px 0 #d3deee}
.chip b{color:var(--kid)}
.start-btn{background:var(--kid);color:#fff;font-size:clamp(34px,4.4vw,48px);font-weight:900;border-radius:999px;padding:22px 60px;min-height:100px;
  box-shadow:0 10px 0 var(--kid-dark);display:flex;align-items:center;gap:18px;margin-bottom:6px}
.start-btn:active{box-shadow:0 4px 0 var(--kid-dark)}
.moves-strip{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.moves-strip .mini{width:96px;height:66px;background:#fff;border-radius:18px;box-shadow:0 4px 0 #d3deee;padding:2px}
.moves-strip svg{width:100%;height:100%}

/* ---------- WORKOUT ---------- */
#work{gap:12px}
.topbar{display:flex;align-items:center;gap:12px;justify-content:space-between}
.icon-btn{width:72px;height:72px;min-width:72px;border-radius:24px;background:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 0 #c9d6ea}
.icon-btn:active{box-shadow:0 2px 0 #c9d6ea}
.icon-btn svg{width:38px;height:38px}
.icon-btn.on{background:var(--kid-soft)}
.progress{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px}
.pill-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap;justify-content:center}
.pill{background:#fff;border-radius:999px;padding:8px 18px;font-size:22px;font-weight:900;box-shadow:0 4px 0 #d3deee;white-space:nowrap}
.pill.round{background:var(--kid);color:#fff;box-shadow:0 4px 0 var(--kid-dark)}
.dots{display:flex;gap:8px}
.dots i{width:22px;height:22px;border-radius:50%;background:#fff;border:4px solid #c9d6ea}
.dots i.done{background:var(--lime);border-color:var(--lime)}
.dots i.now{background:var(--kid);border-color:var(--kid);transform:scale(1.25)}
.stage{flex:1;min-height:0;display:grid;grid-template-columns:1.25fr 1fr;gap:20px}
.pic{background:linear-gradient(180deg,#fff 0%,#f3fbff 100%);border-radius:36px;box-shadow:0 8px 0 #c9d6ea;display:flex;align-items:center;justify-content:center;min-height:0;position:relative;overflow:hidden;padding:10px}
.pic svg{width:100%;height:100%;max-height:100%}
.pic .phase-tag{position:absolute;top:16px;left:16px;background:var(--lime);color:#fff;font-weight:900;font-size:24px;padding:8px 18px;border-radius:999px;box-shadow:0 4px 0 #5f8f17}
.side{display:flex;flex-direction:column;gap:12px;min-height:0}
.ex-name{font-size:clamp(34px,4.2vw,50px);font-weight:900;line-height:1.05;margin:0}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.steps li{display:flex;gap:12px;align-items:center;font-size:clamp(22px,2.5vw,27px);font-weight:800;line-height:1.15;background:#fff;border-radius:20px;padding:8px 14px 8px 8px;box-shadow:0 3px 0 #dbe4f1}
.steps li b{flex:none;width:42px;height:42px;border-radius:50%;background:var(--kid);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px}
.tip{background:#fff6cf;border:4px dashed #ffbf1f;border-radius:20px;padding:8px 14px;font-size:24px;font-weight:900;display:none;align-items:center;gap:10px}
.tip.show{display:flex}
.timer-wrap{flex:1;min-height:150px;display:flex;align-items:center;justify-content:center;gap:16px}
.timer{position:relative;height:100%;max-height:260px;aspect-ratio:1;min-height:150px}
.timer svg{width:100%;height:100%;transform:rotate(-90deg)}
.timer .num{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:clamp(70px,9vw,120px);font-weight:900;font-variant-numeric:tabular-nums;color:var(--ink)}
.timer.last .num{color:var(--coral);animation:pulse .5s ease-in-out infinite alternate}
@keyframes pulse{to{transform:scale(1.12)}}
.ctrls{display:flex;gap:14px}
.big-btn{min-height:84px;border-radius:28px;font-size:28px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:12px;padding:0 26px;flex:1}
.big-btn svg{width:36px;height:36px}
.btn-pause{background:var(--sun);box-shadow:0 8px 0 #d99e00}
.btn-skip{background:#fff;box-shadow:0 8px 0 #c9d6ea}
.btn-pause:active,.btn-skip:active{box-shadow:0 3px 0 #c9d6ea}

/* rest mode */
#work.rest .pic{background:linear-gradient(180deg,#e7fff6,#c9f3e6)}
#work.rest .phase-tag{background:var(--mint);box-shadow:0 4px 0 #1c8c82}
.rest-view{display:none;flex-direction:column;align-items:center;justify-content:center;gap:6px;width:100%;height:100%}
.pose-view{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
#work.rest .rest-view{display:flex}
#work.rest .pose-view{display:none}
.rest-title{font-size:clamp(56px,7vw,86px);font-weight:900;color:#138a7f;line-height:1}
.breathe{width:110px;height:110px;border-radius:50%;background:radial-gradient(circle,#fff 0 30%,#7ee2d6 31% 100%);animation:breathe 4s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:scale(.75)}50%{transform:scale(1.05)}}
.breathe-txt{font-size:24px;font-weight:800;color:#138a7f}
.next-card{display:flex;align-items:center;gap:14px;background:#fff;border-radius:26px;padding:10px 18px 10px 10px;box-shadow:0 5px 0 #a8dfd4;max-width:94%}
.next-card .mini{width:150px;height:98px;flex:none;background:#f3fbff;border-radius:18px}
.next-card .mini svg{width:100%;height:100%}
.next-card .lbl{font-size:20px;font-weight:800;color:var(--muted)}
.next-card .nm{font-size:30px;font-weight:900;line-height:1.05}
.paused-veil{position:absolute;inset:0;background:rgba(34,49,79,.55);display:none;align-items:center;justify-content:center;z-index:5}
.paused .paused-veil{display:flex}
.paused-veil button{background:var(--sun);font-size:44px;font-weight:900;border-radius:999px;padding:24px 56px;box-shadow:0 10px 0 #d99e00;display:flex;gap:14px;align-items:center}

/* portrait */
@media (orientation:portrait){
  .stage{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
  .side{display:grid;grid-template-columns:1fr auto;grid-template-areas:"name name" "steps timer" "tip timer";column-gap:16px;row-gap:10px}
  .ex-name{grid-area:name;text-align:center}
  .steps{grid-area:steps}
  .tip{grid-area:tip;align-self:start}
  .timer-wrap{grid-area:timer;flex:none}
  .timer{height:270px;max-height:none}
  .ex-name{font-size:46px}
  .steps li{font-size:28px;padding:10px 16px 10px 10px}
  .steps li b{width:46px;height:46px}
  .tip{font-size:26px}
  .timer .num{font-size:110px}
  #home{justify-content:space-evenly}
  .home-title{font-size:52px}
  .kid-card svg.avatar{width:170px}
  .kid-name{font-size:46px}.kid-age{font-size:24px}
  .bank-top{font-size:30px}.bank-top small{font-size:22px}
  .bar{height:34px}
  .chip{font-size:26px;padding:12px 22px}
  .next-card .mini{width:230px;height:150px}
  .next-card .nm{font-size:36px}
  .breathe{width:140px;height:140px}
  .rest-view{gap:14px}
  .kids{flex-direction:column;align-items:center;gap:18px}
  .kid-card{width:100%;max-width:640px;flex-direction:row;gap:20px;padding:16px 22px;align-items:center}
  .kid-card .who{display:flex;flex-direction:column;align-items:flex-start;gap:4px;flex:1;text-align:left}
  .kid-card .bank-top{justify-content:flex-start}
  .moves-strip .mini{width:108px;height:74px}
}
@media (orientation:landscape){ .kid-card .who{display:contents} .kid-card .who>.bank{order:5} }

/* ---------- DONE ---------- */
#done{align-items:center;justify-content:center}
#confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3}
.done-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;width:100%;max-width:1080px}
.done-left{display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.trophy{width:clamp(130px,16vw,190px);animation:bob 1.6s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(-10px) rotate(-3deg)}}
.done-title{font-size:clamp(46px,5.5vw,66px);font-weight:900;margin:0;line-height:1}
.earned{white-space:nowrap;background:var(--lime);color:#fff;font-size:clamp(34px,4vw,46px);font-weight:900;border-radius:30px;padding:14px 28px;box-shadow:0 8px 0 #5f8f17;display:flex;align-items:center;gap:14px}
.earned svg{width:48px;height:48px}
.done-sub{font-size:22px;font-weight:800;color:var(--muted)}
.pin-card{background:#fff;border-radius:36px;padding:20px 24px 18px;box-shadow:0 8px 0 #c9d6ea;display:flex;flex-direction:column;align-items:center;gap:12px}
.pin-card h2{margin:0;font-size:28px;font-weight:900;display:flex;align-items:center;gap:10px}
.pin-dots{display:flex;gap:16px}
.pin-dots i{width:28px;height:28px;border-radius:50%;border:4px solid #b7c4da}
.pin-dots i.f{background:var(--ink);border-color:var(--ink)}
.pin-dots.ok i{background:var(--lime);border-color:var(--lime)}
.pin-dots.bad i{border-color:var(--coral)}
.shake{animation:shake .45s}
@keyframes shake{20%{transform:translateX(-16px)}40%{transform:translateX(14px)}60%{transform:translateX(-10px)}80%{transform:translateX(6px)}}
.pad{display:grid;grid-template-columns:repeat(3,84px);gap:12px}
.pad button{height:76px;border-radius:24px;background:#eef3fb;font-size:34px;font-weight:900;box-shadow:0 5px 0 #cdd8ea;display:flex;align-items:center;justify-content:center}
.pad button:active{box-shadow:0 1px 0 #cdd8ea;transform:translateY(4px)}
.pad .k-ok{background:var(--lime);color:#fff;box-shadow:0 5px 0 #5f8f17}
.pad .k-del svg{width:34px;height:34px}
.pin-hint{font-size:16px;color:var(--muted);font-weight:700}
.later{background:transparent;font-size:22px;font-weight:800;color:var(--muted);min-height:64px;padding:0 20px;text-decoration:underline}
@media (orientation:portrait){ .done-grid{grid-template-columns:1fr;gap:22px} }

/* modal + misc */
.modal{position:fixed;inset:0;background:rgba(34,49,79,.5);display:none;align-items:center;justify-content:center;z-index:20}
.modal.show{display:flex}
.modal .box{background:#fff;border-radius:36px;padding:30px 34px;text-align:center;max-width:520px;width:88%}
.modal h3{font-size:36px;margin:0 0 20px;font-weight:900}
.modal .row{display:flex;gap:16px}
.modal .row button{flex:1;min-height:84px;border-radius:26px;font-size:28px;font-weight:900}
.m-yes{background:var(--coral);color:#fff;box-shadow:0 6px 0 #c94444}
.m-no{background:var(--lime);color:#fff;box-shadow:0 6px 0 #5f8f17}
#demo{position:fixed;right:6px;bottom:6px;z-index:30;width:46px;height:34px;border-radius:12px;font-size:14px;font-weight:900;background:rgba(255,255,255,.55);color:#8a97ad;box-shadow:none}
#demo.on{background:var(--coral);color:#fff}
#toast{position:fixed;left:50%;top:max(14px,env(safe-area-inset-top));transform:translateX(-50%) translateY(-160px);background:var(--ink);color:#fff;font-size:22px;font-weight:800;padding:14px 26px;border-radius:999px;transition:transform .3s;z-index:40;max-width:90%;text-align:center}
#toast.show{transform:translateX(-50%) translateY(0)}
/* SVG figure parts */
.skin{fill:#f6c7a1}.skin-s{stroke:#f6c7a1}.skin-b{stroke:#e2a77d}
.shirt-s{stroke:var(--kid)}.shirt-f{fill:var(--kid)}.shirt-b{stroke:var(--kid-dark)}
.short-s{stroke:#2c3e66}.shoe{fill:#f6c7a1}
.hair-henry{fill:#7a4a24}.hair-hayley{fill:#f2b33d}
.mat{fill:#7ad6c8}.mat2{fill:#5bc0b2}
line,path.limb{stroke-linecap:round;stroke-linejoin:round;fill:none}
@media (prefers-reduced-motion:reduce){
  .breathe,.trophy,.timer.last .num{animation:none}
  .bar i{transition:none}
}

/* ===== v2 additions ===== */
.dots{gap:6px;flex-wrap:wrap;justify-content:center}
.dots i{width:18px;height:18px;border-width:3px}
.home-actions{display:flex;gap:24px;justify-content:center;width:100%;max-width:960px}
.big-choice{flex:1;max-width:460px;min-height:124px;border-radius:36px;color:#fff;display:flex;align-items:center;gap:18px;padding:16px 26px;text-align:left}
.big-choice svg{flex:none;width:68px;height:68px}
.big-choice .t1{display:block;font-size:clamp(30px,3.4vw,40px);font-weight:900;line-height:1.05}
.big-choice .t2{display:block;font-size:22px;font-weight:800;opacity:.95;margin-top:4px}
.choice-circuit{background:var(--kid);box-shadow:0 10px 0 var(--kid-dark)}
.choice-kick{background:#14b8a6;box-shadow:0 10px 0 #0d8c7e}
.subhead{display:flex;align-items:center;gap:16px}
.subhead h1{flex:1;margin:0;font-size:clamp(32px,4vw,46px);font-weight:900;line-height:1.05}
.pill.big{font-size:26px;padding:10px 22px}
.pill.mint{background:#14b8a6;color:#fff;box-shadow:0 4px 0 #0d8c7e}
#circuit,#levels,#warn{gap:12px}
.path{flex:1;min-height:0;display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(0,1fr);gap:14px}
.stone{background:#fff;border-radius:26px;box-shadow:0 6px 0 #c9d6ea;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:8px 10px 10px;position:relative;min-height:0}
.stone .no{position:absolute;top:8px;left:8px;width:38px;height:38px;border-radius:50%;background:var(--kid);color:#fff;font-weight:900;font-size:20px;display:flex;align-items:center;justify-content:center;z-index:1}
.stone .th{width:100%;flex:1;min-height:0;display:flex}
.stone .th svg{width:100%;height:100%}
.stone .nm{font-size:20px;font-weight:900;text-align:center;line-height:1.1}
.stone .amt{font-size:21px;font-weight:900;color:var(--kid-dark);background:var(--kid-soft);border-radius:999px;padding:2px 14px;margin-top:5px;white-space:nowrap}
.stone .tag{position:absolute;top:12px;left:52px;font-size:15px;font-weight:900;background:#e0f7f4;color:#138a7f;border-radius:999px;padding:3px 10px}
.stone.pair::after{content:"+";position:absolute;right:-15px;top:42%;width:24px;height:24px;border-radius:50%;background:var(--sun);color:var(--ink);font-weight:900;font-size:20px;line-height:23px;text-align:center;z-index:2}
.circuit-foot{display:flex;justify-content:center}
.tech{background:#fff6cf;border:4px dashed #ffbf1f;border-radius:22px;padding:10px 18px;font-size:clamp(20px,2.3vw,25px);font-weight:900;display:flex;gap:12px;align-items:center}
.tech svg{flex:none}
.lv-grid{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:18px}

.lv{background:#fff;border-radius:30px;box-shadow:0 8px 0 #c9d6ea;display:flex;flex-direction:column;align-items:center;padding:14px 12px;gap:6px;position:relative;text-align:center;min-height:0;border:5px solid transparent}
.lv:active{box-shadow:0 3px 0 #c9d6ea}
.lv .lvno{font-size:20px;font-weight:900;color:#fff;background:#14b8a6;border-radius:999px;padding:4px 16px}
.lv .th{width:100%;flex:1;min-height:0;display:flex}
.lv .th svg{width:100%;height:100%}
.lv .nm{font-size:26px;font-weight:900;line-height:1.05}
.lv .stars{display:flex;gap:4px}
.lv .meta{font-size:20px;font-weight:800;color:var(--muted)}
.lv .adult{background:#ff8c42;color:#fff;font-size:17px;font-weight:900;border-radius:999px;padding:4px 12px}
.lv.next{border-color:#14b8a6}
.lv.locked .th,.lv.locked .nm,.lv.locked .lvno,.lv.locked .meta{opacity:.35;filter:grayscale(1)}
.lv .lock{position:absolute;top:30%;left:50%;transform:translateX(-50%);width:84px;height:84px;border-radius:50%;background:#fff;box-shadow:0 4px 12px rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center}
.warn-grid{flex:1;display:grid;grid-template-columns:1.15fr 1fr;gap:22px;min-height:0}
.warn-pic{background:#fff;border-radius:36px;box-shadow:0 8px 0 #c9d6ea;display:flex;padding:10px;min-height:0}
.warn-pic svg{width:100%;height:100%}
.warn-side{display:flex;flex-direction:column;gap:20px;justify-content:center}
.warn-box{background:#ffe3e3;border:6px solid var(--coral);border-radius:30px;padding:18px 20px;display:flex;gap:16px;align-items:center}
.warn-box svg{flex:none;width:76px;height:76px}
.warn-box b{font-size:clamp(30px,3.4vw,38px);font-weight:900;color:#c92a2a;line-height:1.05;display:block}
.warn-box span{font-size:21px;font-weight:800;display:block;margin-top:6px}
.confirm{min-height:100px;border-radius:28px;background:#fff;box-shadow:0 6px 0 #c9d6ea;font-size:28px;font-weight:900;display:flex;align-items:center;gap:16px;padding:0 22px;border:5px solid #c9d6ea;text-align:left}
.confirm .box{width:56px;height:56px;border-radius:16px;border:5px solid #9fb0c9;flex:none;display:flex;align-items:center;justify-content:center}
.confirm .box svg{display:none}
.confirm.on{border-color:var(--lime);background:#f0fbe0}
.confirm.on .box{background:var(--lime);border-color:var(--lime)}
.confirm.on .box svg{display:block}
.start-btn[disabled]{opacity:.4;filter:grayscale(.7);box-shadow:none}
.start-btn.mint{background:#14b8a6;box-shadow:0 10px 0 #0d8c7e}
/* workout extras */
.countdown{position:absolute;inset:0;display:none;align-items:center;justify-content:center;background:rgba(255,255,255,.6);z-index:3}
#work.is-count .countdown{display:flex}
.countdown span{font-size:clamp(150px,19vw,230px);font-weight:900;color:var(--kid);line-height:1;animation:cdpop .9s ease-out}
.countdown span.go{color:#5f9e10}
@keyframes cdpop{from{transform:scale(1.7);opacity:.2}to{transform:scale(1);opacity:1}}
.stopbar{position:absolute;top:14px;right:16px;background:var(--coral);color:#fff;font-size:28px;font-weight:900;padding:8px 22px;border-radius:999px;display:none;z-index:2;box-shadow:0 4px 0 #c94444}
.stopbar.show{display:block}
.stamp{position:absolute;inset:0;display:none;align-items:center;justify-content:center;z-index:6;pointer-events:none}
.stamp.show{display:flex}
.stamp span{background:var(--coral);color:#fff;font-size:96px;font-weight:900;padding:10px 54px;border-radius:40px;transform:rotate(-6deg);box-shadow:0 10px 0 #c94444;animation:stamp .7s ease-out both}
@keyframes stamp{0%{transform:rotate(-6deg) scale(2);opacity:0}30%{transform:rotate(-6deg) scale(1);opacity:1}80%{opacity:1}100%{opacity:0}}
.adult-banner{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);background:#ff8c42;color:#fff;font-weight:900;font-size:24px;padding:8px 20px;border-radius:999px;display:none;z-index:2;white-space:nowrap;box-shadow:0 4px 0 #c46524;align-items:center;gap:8px}
.adult-banner.show{display:flex}
.notes{display:flex;flex-direction:column;gap:8px}
.tech-line{display:none;background:#e0f7f4;border-radius:18px;padding:8px 14px;font-size:21px;font-weight:800;color:#0f6f66;line-height:1.2}
.tech-line.show{display:block}
.reps-wrap{display:none;flex:1;align-items:center;justify-content:center;gap:16px;flex-direction:column;min-height:0}
#work.is-reps .reps-wrap{display:flex}
#work.is-reps .timer-wrap{display:none}
.rep-badge{width:210px;height:210px;border-radius:50%;background:var(--kid);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 10px 0 var(--kid-dark);flex:none}
.rep-badge span{font-size:88px;font-weight:900;line-height:1;white-space:nowrap}
.rep-badge small{font-size:24px;font-weight:900}
.side-switch{display:none;background:#fff;border-radius:999px;padding:6px;box-shadow:0 4px 0 #d3deee;gap:6px}
.side-switch.show{display:flex}
.side-switch button{min-width:124px;min-height:64px;border-radius:999px;font-size:26px;font-weight:900;background:transparent}
.side-switch button.on{background:var(--kid);color:#fff}
.btn-done{background:var(--lime);color:#fff;box-shadow:0 8px 0 #5f8f17;display:none}
#work.is-reps .btn-done{display:flex}
#work.is-reps .btn-pause{display:none}
.move-video{width:100%;height:100%;object-fit:contain;border-radius:24px;background:#0b1220}
#work.rest .countdown,#work.rest .stopbar{display:none}
/* level done variant */
.lv-done{display:none;flex-direction:column;gap:18px;align-items:center}
#done.level-done .lv-done{display:flex}
#done.level-done .earned,#done.level-done .pin-card,#done.level-done .later,#done.level-done .done-sub{display:none}
#done.level-done .done-grid{grid-template-columns:1fr}
.stars-big{display:flex;gap:10px}
.stars-big svg{width:72px;height:72px}
@media (orientation:portrait){
  .home-actions{flex-direction:column;align-items:center;gap:22px}
  .big-choice{width:100%;max-width:640px}
  .path{grid-template-columns:repeat(3,1fr)}
  .stone .nm{font-size:22px}
  .lv-grid{grid-template-columns:1fr 1fr}
  .warn-grid{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto}
  .side{grid-template-areas:"name name" "steps timer" "notes timer"}
  .notes{grid-area:notes}
  .reps-wrap{grid-area:timer;flex:none}
  .rep-badge{width:230px;height:230px}
}
@media (orientation:landscape){
  .lv{display:grid;grid-template-columns:1.5fr 1fr;grid-template-rows:1fr auto auto auto auto 1fr;grid-template-areas:"th ." "th no" "th nm" "th st" "th meta" "th ad";column-gap:12px;text-align:left;justify-items:start;align-items:center;padding:12px 18px}
  .lv .th{grid-area:th;height:100%}
  .lv .lvno{grid-area:no}.lv .nm{grid-area:nm;font-size:30px}.lv .stars{grid-area:st}.lv .meta{grid-area:meta}.lv .adult{grid-area:ad;align-self:start}
  .lv .lock{top:50%;left:30%;transform:translate(-50%,-50%)}
}
.rep-badge{width:clamp(150px,20vh,210px);height:clamp(150px,20vh,210px)}
@media (orientation:portrait){.rep-badge{width:230px;height:230px}}

/* ===== production additions ===== */
/* Short holds (Hayley's 3 s Superman Hold): calm "Hold… 3 2 1" instead of the coral STOP warning */
.stopbar.hold{background:var(--mint);box-shadow:0 4px 0 #1c8c82}
.stamp.hold span{background:var(--mint);box-shadow:0 10px 0 #1c8c82}
/* dev toggle: x10 demo speed + PIN hint only show in dev mode (long-press the home title, or ?dev=1) */
#demo{display:none}
body.dev #demo{display:block}
.pin-hint{display:none}
body.dev .pin-hint{display:block}
.move-video{max-height:100%}
.pic video{display:block}
/* keep the "next" level highlight readable in both orientations */
.lv.next{box-shadow:0 8px 0 #0d8c7e}
@media (prefers-reduced-motion:reduce){
  .countdown span,.stamp span,.gain,.shake{animation:none!important}
  .press{transition:none}
}