*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}
html,body{margin:0;height:100%;background:#1c2a14;overflow:hidden;touch-action:none;overscroll-behavior:none;font-family:Nunito,system-ui,sans-serif}
#stage{position:fixed;inset:0;overflow:hidden;touch-action:none}
#gl{position:absolute;left:0;top:0;display:block;touch-action:none}
#hud{position:absolute;inset:0;pointer-events:none;transition:opacity .25s}#hud.off{opacity:0}
#chip{position:absolute;left:max(2.2vmin,env(safe-area-inset-left));top:2.2vmin;display:flex;align-items:center;gap:.9vmin;padding:.9vmin 1.8vmin;border-radius:3vmin;background:rgba(59,42,26,.88);border:.45vmin solid rgba(255,210,58,.7);color:#FFF3DC;font:700 3.2vmin Fredoka,sans-serif;box-shadow:0 .5vmin 0 rgba(0,0,0,.25)}
#chip svg{width:3.6vmin;height:3.6vmin}
#hearts{position:absolute;left:50%;top:2vmin;transform:translateX(-50%);display:flex;flex-wrap:wrap;justify-content:center;gap:1.2vmin;width:24vmin}
#hearts i{width:5.4vmin;height:5.4vmin;display:block;transition:transform .2s,filter .2s,opacity .2s}
#hearts i svg{width:100%;height:100%;filter:drop-shadow(0 .4vmin 0 rgba(0,0,0,.28))}
#hearts i.lost{opacity:.35;filter:grayscale(1);transform:scale(.8)}
.hprog{flex-basis:100%;display:flex;justify-content:center;gap:.8vmin;order:5;margin-top:.2vmin}
.hprog i{display:block;width:5vmin;height:1.1vmin;border-radius:1vmin;background:rgba(59,42,26,.6);border:.3vmin solid rgba(255,243,220,.6)}
.hprog i.on{background:#FFD23A;border-color:#fff3dc}.hprog i.cur{background:rgba(255,210,58,.45)}
#mute{position:absolute;right:max(2.2vmin,env(safe-area-inset-right));top:2.2vmin;width:6vmin;height:6vmin;border-radius:50%;border:.45vmin solid rgba(255,210,58,.7);background:rgba(59,42,26,.88);color:#FFF3DC;font:700 3.2vmin Fredoka;pointer-events:auto;padding:0}
#mute.m{opacity:.55;text-decoration:line-through}
#popups{position:absolute;left:0;top:0;pointer-events:none}
.pop{position:absolute;white-space:nowrap;transform:translate(-50%,-100%);padding:.5vmin 1.8vmin;border-radius:3vmin;background:#FFF3DC;color:#3A2A1A;font:700 3.4vmin Fredoka,sans-serif;border:.4vmin solid #3A2A1A;box-shadow:0 .5vmin 0 rgba(0,0,0,.25);will-change:transform,opacity}
#tag{position:absolute;pointer-events:none;transform:translate(-50%,-100%);font:700 1.9vmin Nunito;color:#FFF3DC;background:rgba(59,42,26,.7);padding:.2vmin 1vmin;border-radius:2vmin;opacity:0;transition:opacity .2s;white-space:nowrap}
#flash{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none}
#banner{position:absolute;left:50%;top:38%;transform:translate(-50%,-50%);padding:2.4vmin 5vmin;border-radius:3.2vmin;background:rgba(59,42,26,.9);border:.6vmin solid #FFD23A;color:#FFF3DC;text-align:center;box-shadow:0 1vmin 0 rgba(0,0,0,.3);transition:opacity .25s,transform .25s;pointer-events:none}
#banner.hide{opacity:0;transform:translate(-50%,-44%) scale(.94)}
#bt{font:800 5.4vmin Fredoka,sans-serif;color:#FFD23A;letter-spacing:.2vmin}#bs{font:700 3.2vmin Nunito;margin-top:.8vmin;color:#FFF3DC}#bh{font:700 2.6vmin Nunito;margin-top:1.2vmin;color:#D2B98C}
#dive{position:absolute;right:max(3.2vmin,env(safe-area-inset-right));bottom:max(3.2vmin,env(safe-area-inset-bottom));width:18vmin;height:18vmin;border-radius:50%;background:#FFD23A;border:.7vmin solid #3A2A1A;color:#3A2A1A;font:800 3.4vmin Fredoka;display:flex;align-items:center;justify-content:center;box-shadow:0 .8vmin 0 #C48F2C;transition:transform .09s;}
#dive.hide{opacity:0;pointer-events:none}#dive.press{transform:translateY(.6vmin)}
#stick{position:absolute;width:14vmin;height:14vmin;margin:-7vmin 0 0 -7vmin;border-radius:50%;border:.5vmin solid rgba(255,243,220,.55);background:rgba(255,243,220,.12);pointer-events:none}
#stick.hide{display:none}#stick i{position:absolute;left:50%;top:50%;width:6vmin;height:6vmin;margin:-3vmin 0 0 -3vmin;border-radius:50%;background:rgba(255,243,220,.7)}
#hint{position:absolute;left:50%;bottom:3.5vmin;transform:translateX(-50%);display:flex;gap:1.4vmin;align-items:center;padding:1vmin 2vmin;border-radius:3vmin;background:rgba(59,42,26,.78);color:#FFF3DC;font:700 2.6vmin Fredoka;pointer-events:none;transition:opacity .5s}
#hint .k{padding:.3vmin 1.2vmin;border:.35vmin solid #FFF3DC;border-radius:1vmin;font-size:2.2vmin}#hint.gone{opacity:0}
#loading{position:absolute;inset:0;background:#6CC4F0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.4vmin;color:#FFF3DC;font:800 6vmin Fredoka;text-shadow:0 .5vmin 0 #3A2A1A;transition:opacity .4s}
#loading span{font:700 2.6vmin Nunito;text-shadow:none;color:#3A2A1A}#loading.gone{opacity:0;pointer-events:none}
#dbg{position:absolute;left:0;top:0;bottom:0;width:260px;overflow:auto;background:rgba(0,0,0,.72);color:#fff;font:11px monospace;padding:6px;pointer-events:auto}#dbg.hide{display:none}
#dbg label{display:flex;justify-content:space-between;gap:4px}#dbg input{width:120px}
#hint .tc{display:none;align-items:center;gap:1vmin;font-size:2.7vmin}#hint .tc i{opacity:.6;font-style:normal}#hint .tc b{color:#FFD23A}#hint .kb{display:flex;gap:1.4vmin;align-items:center}
body.touch #hint .kb{display:none}body.touch #hint .tc{display:flex}
#shield{position:absolute;left:50%;top:15vmin;transform:translateX(-50%);padding:.6vmin 2vmin;border-radius:3vmin;background:rgba(255,210,58,.92);color:#3A2A1A;font:800 2.6vmin Fredoka;border:.4vmin solid #3A2A1A;pointer-events:none;transition:opacity .3s}#shield.hide{opacity:0}
/* ---- team fix 1: title card, menu, shop, banner buttons */
#title{position:absolute;left:50%;top:15%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:.4vmin;pointer-events:none;opacity:0;transition:opacity .45s;text-align:center;color:#FFF3DC;z-index:5}
#title.on{opacity:1}#title svg{width:15vmin;height:15vmin}
#title b{font:800 6.4vmin/1 Fredoka,sans-serif;color:#FFD23A;text-shadow:0 .7vmin 0 #3A2A1A;letter-spacing:.2vmin}#title span{font:800 2.6vmin Nunito;text-shadow:0 .3vmin 0 #3A2A1A}
#loading svg{width:22vmin;height:22vmin;filter:drop-shadow(0 .6vmin 0 rgba(0,0,0,.25))}#loading b{font-weight:800;text-align:center}
#menuBtn{position:absolute;right:calc(max(2.2vmin,env(safe-area-inset-right)) + 7.4vmin);top:2.2vmin;width:6vmin;height:6vmin;border-radius:50%;border:.45vmin solid rgba(255,210,58,.7);background:rgba(59,42,26,.88);color:#FFF3DC;font:700 3vmin Fredoka;pointer-events:auto;padding:0}
#bx{font:700 2.7vmin Nunito;margin-top:.8vmin;color:#FFD23A;min-height:1px}
#bb{display:flex;gap:1.6vmin;justify-content:center;margin-top:1.8vmin;pointer-events:auto}
#bb button,#menu button.mb{font:800 3vmin Fredoka,sans-serif;padding:1vmin 2.6vmin;border-radius:2.4vmin;border:.45vmin solid #3A2A1A;background:#FFD23A;color:#3A2A1A;box-shadow:0 .6vmin 0 #3A2A1A}
#bb button:active,#menu button.mb:active{transform:translateY(.4vmin);box-shadow:0 .2vmin 0 #3A2A1A}
#bb button[data-a=again]{background:#8FD36A}#banner.hide #bb{pointer-events:none}
#menu{position:absolute;inset:0;z-index:9;background:rgba(30,22,14,.72);display:flex;align-items:center;justify-content:center;transition:opacity .2s;pointer-events:auto}
#menu.hide{opacity:0;pointer-events:none}
#menu .card{width:min(92vw,120vmin);max-height:92vh;overflow:auto;border-radius:3.2vmin;background:#FFF3DC;border:.7vmin solid #3A2A1A;padding:2.2vmin 3vmin;color:#3A2A1A;box-shadow:0 1.2vmin 0 rgba(0,0,0,.35)}
#menu .top{display:flex;align-items:center;justify-content:space-between;gap:2vmin;margin-bottom:1.4vmin}
#menu .tabs{display:flex;gap:1vmin}#menu .tabs button{font:800 3vmin Fredoka;padding:.6vmin 2.2vmin;border-radius:2vmin;border:.4vmin solid #3A2A1A;background:#E8D3A6;color:#3A2A1A}#menu .tabs button.on{background:#FFD23A}
#menu .coins{font:800 3.2vmin Fredoka;color:#B07A00}
#menu .grid{display:grid;gap:1.4vmin}#menu .grid.lv{grid-template-columns:repeat(auto-fit,minmax(30vmin,1fr))}#menu .grid.ht{grid-template-columns:repeat(auto-fit,minmax(22vmin,1fr))}
#menu .it{border-radius:2.2vmin;border:.45vmin solid #3A2A1A;background:#fff;padding:1.4vmin;display:flex;flex-direction:column;gap:.6vmin;align-items:center;text-align:center}
#menu .it.lock{opacity:.55;filter:grayscale(.7)}#menu .it.eq{background:#E7F7C8;border-color:#4F9A33}
#menu .it h4{margin:0;font:800 3.2vmin Fredoka}#menu .it p{margin:0;font:700 2.2vmin Nunito;color:#6B5436}#menu .it svg{width:11vmin;height:9vmin}
#menu .it .st{font:800 3vmin Fredoka;color:#E5A100;letter-spacing:.3vmin}
#menu .foot{display:flex;justify-content:flex-end;margin-top:1.6vmin}
body.touch #dive{transition:transform .09s}#dive.calm{opacity:.5}
#dive.calm{opacity:.58}
@media (orientation:landscape) and (max-height:520px){#banner{top:29%;padding:1.6vmin 4vmin}#bt{font-size:4.6vmin}#bs{font-size:2.8vmin;margin-top:.4vmin}#bx{font-size:2.3vmin;margin-top:.4vmin}#bh{font-size:2.2vmin;margin-top:.5vmin}#bb{margin-top:1vmin}#bb button{font-size:2.6vmin;padding:.6vmin 2vmin}}
@media (orientation:landscape) and (max-height:520px){#title{top:36%;left:3vmin;transform:none;flex-direction:column;align-items:flex-start;gap:.6vmin}#title svg{width:11vmin;height:11vmin}#title b{font-size:5vmin;text-align:left}#title span{display:none}}
body.kbd #dive{display:none}
/* team fix 3: banner lines, goal pill, HUD backing */
#bs{margin-top:.8vmin}.bl{font:700 3.2vmin/1.25 Nunito;color:#FFF3DC;white-space:nowrap}.bl:first-child{color:#FFD23A;font-size:4vmin}
#goal{position:absolute;left:max(2.2vmin,env(safe-area-inset-left));top:10.4vmin;padding:.5vmin 1.6vmin;border-radius:2.4vmin;background:rgba(59,42,26,.86);border:.35vmin solid rgba(255,210,58,.7);color:#FFF3DC;font:800 2.3vmin Fredoka;white-space:nowrap}#goal.hide{display:none}
@media (orientation:landscape) and (max-height:520px){.bl{font-size:2.5vmin}.bl:first-child{font-size:3.1vmin}}
/* team fix 4: event pill, HUD plate */
#evt{position:absolute;left:50%;top:21vmin;transform:translateX(-50%);padding:.8vmin 3vmin;border-radius:3vmin;background:#E0463A;color:#FFF3DC;border:.5vmin solid #3A2A1A;font:800 4vmin Fredoka;box-shadow:0 .7vmin 0 #3A2A1A;letter-spacing:.2vmin}#evt.hide{display:none}
/* team fix 5: image logo, icon HUD, >= 12 px text on phones */
.logo{display:block;width:min(70vmin,78vw);height:auto;filter:drop-shadow(0 .6vmin 0 rgba(0,0,0,.2))}
#title .logo{width:min(62vmin,70vw)}#loading .logo{margin-top:1vmin}
#goal{display:flex;align-items:center;gap:1vmin;font-size:max(13px,2.3vmin)}#goal .gi{flex:none}
#dive{display:flex;align-items:center;justify-content:center}
#shield{padding:.5vmin 1.4vmin;display:flex;align-items:center}
#mute.m .w{display:none}#mute.m{text-decoration:none}
#hint{font-size:max(13px,2.6vmin);white-space:nowrap}#hint .tc{font-size:max(13px,2.7vmin);white-space:nowrap}#hint .kb .t{font-size:max(13px,2.4vmin)}#hint .k{font-size:max(13px,2.2vmin)}
#bb button{font-size:max(13px,3vmin)}#bh{font-size:max(13px,2.6vmin)}.bl{font-size:max(13px,3.2vmin)}.bl:first-child{font-size:max(14px,4vmin)}#tag{font-size:max(13px,1.9vmin)}#evt{font-size:max(13px,4vmin)}
#menu .tabs button{font-size:max(13px,3vmin)}#menu button.mb{font-size:max(13px,3vmin)}#menu .it p{font-size:max(13px,2.2vmin)}#menu .it h4{font-size:max(13px,3.2vmin)}#menu .it .st{font-size:max(13px,3vmin)}#menu .coins{font-size:max(13px,3.2vmin)}
#chip{font-size:max(13px,2.8vmin)}#runners{font-size:max(13px,2.8vmin)}.pop{font-size:max(13px,3.4vmin)}
@media (orientation:landscape) and (max-height:520px){.bl{font-size:max(13px,2.5vmin)}.bl:first-child{font-size:max(13px,3.1vmin)}}

#hint .hk,#hint .ht{display:block}#hint .drag{animation:hdrag 1.6s ease-in-out infinite}#hint .flick{animation:hflick 1.6s ease-in-out infinite}@keyframes hdrag{0%,100%{transform:translateX(0)}50%{transform:translateX(10px)}}@keyframes hflick{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
#title.on{transition:none}#loading.gone .logo,#loading.gone svg{visibility:hidden}
#menu .it .st{display:flex;gap:.4vmin;align-items:center;min-height:3.4vmin}#menu .gs{width:max(18px,3vmin);height:max(18px,3vmin)}
#loading.gone .logo{display:none}
#hint{bottom:auto;top:38%;transform:translate(-50%,-50%);background:rgba(34,22,12,.95);border:.45vmin solid #FFF3DC;padding:1.4vmin 2.6vmin;box-shadow:0 0 0 max(5px,.9vmin) #FFF3DC,0 .8vmin 2.4vmin rgba(0,0,0,.4)}#hint .hk,#hint .ht{width:max(150px,26vmin);height:auto}
@media (min-aspect-ratio:1/1){#hint{left:73%;top:50%}}
@media (max-aspect-ratio:1/1){#title{top:5%}#title svg{width:11vmin;height:11vmin}#title .logo{width:min(54vmin,66vw)}}
@media (min-aspect-ratio:1/1) and (min-height:521px){#title{top:3%}#title svg{width:9vmin;height:9vmin}#title .logo{width:min(40vmin,42vw)}}
#hearts{background:rgba(59,42,26,.9);border:.45vmin solid rgba(255,210,58,.7);border-radius:3vmin;padding:.8vmin 1.6vmin;width:auto;box-sizing:content-box}body.menuopen #banner{visibility:hidden!important}
#hud::before{content:"";position:absolute;left:0;right:0;top:0;height:11.6vmin;background:#3B2A1A;border-bottom:.5vmin solid rgba(255,210,58,.75);border-radius:0 0 3.2vmin 3.2vmin;box-shadow:0 .6vmin 0 rgba(0,0,0,.18);pointer-events:none}   /* R11 option 2: opaque band (no world objects show through); the R3/R4 plate rows need it */
.hprog::before{content:"";width:3vmin;height:3vmin;background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cpath%20d%3D%22M5%2021%20V10%20L12%204%20L19%2010%20V21%20Z%22%20fill%3D%22%23E5483A%22%20stroke%3D%22%232A1A3A%22%20stroke-width%3D%222%22%20stroke-linejoin%3D%22round%22/%3E%3Crect%20x%3D%2210%22%20y%3D%2214%22%20width%3D%224%22%20height%3D%227%22%20fill%3D%22%23FFF3DC%22/%3E%3C/svg%3E") center/contain no-repeat;flex:none;margin-right:.4vmin;align-self:center}#hearts{flex-wrap:wrap}
#hearts{width:29vmin!important;box-sizing:border-box}
@media (min-aspect-ratio:1/1) and (min-height:521px){#title{left:2.5%;top:30%;transform:none;align-items:flex-start}#title .logo{width:min(30vmin,32vw)}}
#hearts{width:24vmin!important}
/* fix 18 (R18 P3-1): short landscape phones - the end card puts its three buttons in a column beside the text (card <= 36 % of the height) (the HUD slab is NOT shrunk: a 5 % slab leaves the field under the HUD strip and fails the team3/team4 strip-luminance gate at 844x390) */
@media (orientation:landscape) and (max-height:430px){
  /* fix 19 (R19 P2-2): one-row HUD slab (<= 7.5 % of the height): chip + goal side by side, hearts and hat slots in one row */
  #hud::before{height:7.2vmin;border-bottom-width:.4vmin;border-radius:0 0 2.4vmin 2.4vmin}
  #chip{top:.8vmin;padding:.25vmin 1.2vmin}
  #goal{top:.8vmin;left:calc(max(2.2vmin,env(safe-area-inset-left)) + 20vmin);padding:.25vmin 1.2vmin}
  #hearts{top:.7vmin;width:auto!important;flex-wrap:nowrap;align-items:center;gap:.9vmin;padding:.2vmin 1.2vmin}#hearts i{flex:none;width:4.6vmin;height:4.6vmin}
  .hprog{flex-basis:auto;order:0;margin:0 0 0 .6vmin}
  #mute,#menuBtn{top:.7vmin;width:5.6vmin;height:5.6vmin}#menuBtn{right:calc(max(2.2vmin,env(safe-area-inset-right)) + 6.8vmin)}
  #shield{top:8.4vmin}
  #banner{display:grid;grid-template-columns:1fr auto;column-gap:2.4vmin;align-items:center;text-align:left;padding:1.2vmin 3vmin;max-width:64vw;top:34%}
  #banner>#bt{grid-column:1;grid-row:1;text-align:left}#banner>#bs{grid-column:1;grid-row:2;text-align:left}#banner>#bh{grid-column:1;grid-row:3;text-align:left}
  #banner>#bb{grid-column:2;grid-row:1/4;flex-direction:column;margin-top:0;gap:1vmin}
}
#menu .it p.rule{font:700 max(12px,1.9vmin) Nunito;color:#8A5B34}
.bl.nx{border-radius:1vmin;padding:0 1.4vmin;font-size:max(13px,2.4vmin);color:#FFF3DC}@media (orientation:landscape) and (max-height:520px){.bl.nx{font-size:max(13px,2.1vmin)}}