*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#10183e;color:#fff;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}#stage{position:relative;width:100vw;height:100dvh;min-height:320px;overflow:hidden;isolation:isolate;background:#10183e}.art{position:absolute;z-index:-2;inset:0 43% 0 0;background:url('assets/arcade-bg.png') left center/cover no-repeat;filter:saturate(1.07)}.art:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#07143830 0%,transparent 50%,#07143899 100%)}#fx{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}.topbar{position:absolute;z-index:5;inset:1.2% 1.3% auto;display:flex;align-items:center;justify-content:space-between;height:8%;gap:1vw}.brand{display:flex;align-items:center;gap:.5vw;padding:.35vh 1vw;border:2px solid #ffe88f;border-radius:16px;background:linear-gradient(110deg,#171e59ed,#283c8cdb);box-shadow:0 4px 16px #080e388c;text-shadow:0 2px #27194e}.brand-star{color:#fff09a;font-size:clamp(22px,3vw,42px)}.brand b{display:block;font-size:clamp(14px,1.8vw,27px);line-height:1.05}.brand small{font-size:clamp(6px,.65vw,10px);letter-spacing:.2em;color:#d6ebff}.status{display:flex;align-items:center;gap:.55vw}.counter{min-width:6.2vw;padding:.3vh .7vw;border:1.5px solid #dff6ff;border-radius:12px;background:#101943e8;text-align:center;font-size:clamp(8px,.9vw,13px);box-shadow:0 3px 12px #10112c75}.counter strong{display:block;color:#ffe676;font-size:clamp(14px,1.65vw,24px);line-height:1.1;text-shadow:0 2px #8b432c}.round-button{height:clamp(27px,4vw,48px);min-width:clamp(27px,4vw,48px);padding:0 .5vw;border:2px solid #fff1a6;border-radius:50%;background:linear-gradient(#438fda,#29358e);box-shadow:0 3px #152060;font-size:clamp(9px,.9vw,14px);font-weight:900}.left-side{position:absolute;z-index:1;left:0;top:10%;bottom:0;width:57%;padding:1.2vh 1.5vw 1.3vh;display:flex;flex-direction:column;gap:1vh}.arena-head{height:7%;min-height:25px;display:flex;align-items:center;gap:.75vw;color:#fff6c4;font-size:clamp(11px,1.4vw,20px);font-weight:900;text-shadow:0 2px #24235d}.round-pill{padding:.3em .75em;background:#172757db;border:1px solid #d7f3ff;border-radius:16px;white-space:nowrap}.round-pill b{color:#ffdf67}.ball-stage{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2.5vh 1.2vw 1.2vh;border-radius:26px;border:2px solid #d4f5ff8c;background:radial-gradient(ellipse at 50% 45%,#293f93b0,#10255baa 60%,#091338b8);box-shadow:inset 0 0 35px #5bcaff2b,0 8px 22px #07133877;overflow:hidden}.ball-stage:before{content:"";position:absolute;inset:5% 7%;border:1px solid #dbf8ff4c;border-radius:50%;box-shadow:0 0 30px #8deaff55,inset 0 0 24px #8deaff22}.orb-glow{position:absolute;width:38%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#fffbd680 0 8%,#ffdb6d30 30%,transparent 70%);filter:blur(5px);animation:glow 2s ease-in-out infinite alternate}@keyframes glow{to{transform:scale(1.25);opacity:.7}}.draw-slots{position:relative;z-index:1;width:100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.7vw;align-items:center}.draw-card{height:clamp(74px,14vh,132px);min-width:0;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.3vh;border:2px solid #eefcff;border-radius:17px;padding:4px;background:linear-gradient(145deg,#24499a,#161d56);box-shadow:0 4px 0 #091438,0 0 16px #a2f1ff55;overflow:hidden;transition:.2s}.draw-card:before{content:"";position:absolute;inset:4px;border:1px solid #fbe9a45c;border-radius:12px;pointer-events:none}.draw-card .question-ball{font-size:clamp(30px,5vw,68px);color:#ffe88b;text-shadow:0 3px 10px #8c4cdb}.draw-card small{position:absolute;bottom:4px;color:#d8efff;font-size:clamp(7px,.75vw,11px);font-weight:800}.draw-card.revealed{animation:card-pop .42s cubic-bezier(.12,1.8,.38,1)}@keyframes card-pop{0%{transform:scale(.48) rotateY(100deg);filter:brightness(2)}100%{transform:scale(1) rotateY(0);filter:brightness(1)}}.draw-card .result-icon{width:100%;height:78%;display:grid;place-items:center}.draw-card img{width:100%;height:100%;object-fit:cover;border-radius:10px}.draw-card .emoji-icon{font-size:clamp(35px,5.2vw,70px);filter:drop-shadow(0 3px 4px #28164d)}.draw-card.match{border-color:#fff276;box-shadow:0 0 25px #fff178,0 4px 0 #9b521c}.draw-card.match:after{content:"HIT!";position:absolute;top:2px;right:3px;padding:1px 4px;border-radius:7px;background:#edb637;color:#572342;font-size:clamp(7px,.7vw,10px);font-weight:1000}.draw-card.miss{filter:brightness(.72)}.machine-caption{position:relative;z-index:1;margin-top:1.6vh;padding:.4em 1em;border-radius:20px;background:#10204fc9;border:1px solid #d5f5ff88;color:#f9ebad;font-size:clamp(11px,1.25vw,18px);font-weight:1000;text-shadow:0 2px #3f286b}.machine-caption span{margin-left:.65em;color:#bceeff;font-size:.74em}.result-bar{min-height:6%;display:flex;align-items:center;justify-content:space-between;gap:.5vw;padding:0 .8vw;border:1px solid #d7efff88;border-radius:14px;background:#111d50e8;box-shadow:0 4px 14px #0b113b80;font-size:clamp(9px,1vw,15px);font-weight:900}.result-bar span{color:#c8edff}.result-bar strong{color:#ffe88a;text-align:right}.bottom-controls{height:15%;min-height:60px;display:flex;align-items:stretch;justify-content:space-between;gap:.7vw;padding:.7vh .75vw;border:2px solid #e8eeff;border-radius:21px;background:linear-gradient(145deg,#1d3471ef,#101748f4);box-shadow:0 6px 20px #080e3288}.bet-control{display:grid;grid-template-columns:auto auto auto;grid-template-rows:1fr 1.25fr;align-items:center;justify-items:center;column-gap:.3vw;padding:.3vh .3vw;color:#fff0a0;font-weight:900}.bet-control>span{grid-column:1/4;font-size:clamp(8px,.9vw,13px)}.bet-control b{font-size:clamp(16px,1.8vw,25px);color:#fff}.bet-control small{font-size:8px}.bet-control button{width:clamp(22px,2.8vw,34px);height:clamp(22px,2.8vw,34px);border:1px solid white;border-radius:50%;background:#2977c4;font-size:clamp(15px,1.5vw,22px);font-weight:1000}.play-button{position:relative;flex:1;border:3px solid #fff5ba;border-radius:19px;background:radial-gradient(circle at 32% 20%,#fffab9,#ffd748 42%,#ff8c22 78%,#dc4b26);box-shadow:0 5px 0 #92392b,0 0 17px #ffdd758a;color:#59243a;text-shadow:0 1px white;display:flex;flex-direction:column;align-items:center;justify-content:center}.play-button:active{transform:translateY(3px);box-shadow:0 2px 0 #92392b}.play-button b{font-size:clamp(15px,1.8vw,27px);font-weight:1000}.play-button small{font-size:clamp(7px,.8vw,11px);font-weight:800}.play-button>span{position:absolute;right:7%;top:3%;color:#fff;font-size:20px;animation:twinkle .8s infinite alternate}@keyframes twinkle{to{transform:rotate(45deg) scale(.65);opacity:.5}}.play-button:disabled{filter:grayscale(.55);opacity:.65}.quick-button{min-width:15%;border:2px solid #e4faff;border-radius:15px;background:linear-gradient(#78ecf5,#348ed9 58%,#294ba6);box-shadow:0 4px #19346e;text-shadow:0 2px #2b5197;font-size:clamp(9px,1vw,14px);font-weight:1000}.quick-button small{font-size:clamp(7px,.72vw,10px)}.right-side{position:absolute;z-index:1;right:0;top:0;bottom:0;width:43%;padding:10.2vh 1.5vw 1.2vh;display:flex;flex-direction:column;gap:.75vh;border-left:3px solid #fce497;background:linear-gradient(145deg,#20276dea,#151d53f5 45%,#102a61f7);box-shadow:-12px 0 30px #06153a99}.selection-title{height:8%;min-height:32px;display:flex;align-items:center;justify-content:space-between}.eyebrow{color:#9fdbff;font-size:clamp(6px,.65vw,10px);letter-spacing:.15em;font-weight:900}.selection-title h1{font-size:clamp(16px,2vw,28px);margin:0;text-shadow:0 2px #704178}.picked-badge{display:flex;align-items:center;gap:.4vw;padding:.25vh .65vw;border:1px solid #fff1a2;border-radius:12px;background:#341c68;color:#ffed9d}.picked-badge b{font-size:clamp(14px,1.6vw,22px)}.picked-badge small{font-size:clamp(7px,.68vw,10px)}.bet-types{height:9%;min-height:35px;display:grid;grid-template-columns:repeat(3,1fr);gap:.5vw}.bet-types button{border:1.5px solid #c7edff;border-radius:12px;background:linear-gradient(#315eaa,#28377e);box-shadow:0 3px #142153;font-size:clamp(13px,1.5vw,21px);font-weight:1000;text-shadow:0 2px #263678;line-height:1}.bet-types button.active{border:2px solid #fff08a;background:linear-gradient(#ffdb67,#f28d32);box-shadow:0 3px #9a4c33;color:#51264c;text-shadow:0 1px #fff3b6}.bet-types button small{display:block;margin-top:.23em;font-size:clamp(6px,.68vw,10px);font-weight:900}.select-help{display:flex;justify-content:space-between;align-items:center;color:#c9eaff;font-size:clamp(8px,.85vw,12px)}.select-help b{color:#ffed9d}.character-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:.65vw}.character-card{position:relative;min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.15vh;padding:.4vh .2vw;border:1.5px solid #a8ddffb0;border-radius:15px;background:linear-gradient(160deg,#2a478ce8,#192559f2);box-shadow:0 3px 0 #0d1642, inset 0 0 10px #7dc7ff1a;transition:transform .13s,filter .13s,border .13s;overflow:hidden}.character-card:active{transform:scale(.95)}.character-card.selected{border:2px solid #fff177;background:linear-gradient(160deg,#574295,#263b82);box-shadow:0 0 14px #fff06a88,0 3px #865b2e}.character-card.selected:after{content:"";position:absolute;inset:3px;border:1px solid #ffe7797a;border-radius:11px;pointer-events:none}.character-card:disabled{cursor:default}.char-art{position:relative;width:clamp(39px,6.1vw,76px);height:clamp(39px,6.1vw,76px);max-height:46%;aspect-ratio:1;border:2px solid #fff1a5;border-radius:50%;padding:2px;background:linear-gradient(135deg,#fef5be,#f497d7 52%,#77ddff);box-shadow:0 2px 8px #071033aa;display:grid;place-items:center;overflow:hidden}.char-art img{width:100%;height:100%;object-fit:cover;border-radius:50%}.emoji-icon{font-size:clamp(23px,3.5vw,47px);filter:drop-shadow(0 2px 3px #312151)}.char-art i{position:absolute;right:-2px;top:-2px;width:22px;height:22px;border:1px solid white;border-radius:50%;background:#f7cf4d;color:#573050;font-size:14px;font-style:normal;font-weight:1000;line-height:20px}.character-card>b{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(7px,.88vw,13px);text-shadow:0 1px #121944}.chance,.multiplier{font-size:clamp(6px,.72vw,10px);color:#c8e9ff;line-height:1.05;white-space:nowrap}.chance strong{color:#ffe577}.multiplier{color:#ffb9f0}.multiplier strong{color:#fff19b;font-size:1.07em}.free-mode .character-card.free-candidate{animation:freebeat .7s ease-in-out infinite alternate;border-color:#fff477;box-shadow:0 0 18px #fff47c}@keyframes freebeat{to{transform:scale(1.045);filter:brightness(1.25)}}.free-mode .character-card:not(.free-candidate){opacity:.45;filter:grayscale(.45)}.free-note{min-height:9%;padding:.55vh .75vw;border:1px solid #ffed8c;border-radius:13px;background:linear-gradient(100deg,#432c7be8,#272e6de8);box-shadow:inset 0 0 10px #ffe38017}.free-note>span{color:#fff095;font-size:clamp(8px,.95vw,14px);font-weight:1000}.free-note p{margin:.15vh 0 0;color:#e1edff;font-size:clamp(7px,.76vw,11px);line-height:1.2}.selection-footer{display:flex;justify-content:space-between;gap:.3vw;color:#a8d9ff;font-size:clamp(6px,.67vw,10px)}.win-banner{position:absolute;z-index:6;left:7%;top:34%;width:47%;text-align:center;font-weight:1000;font-size:clamp(28px,5vw,72px);color:#fff59a;text-shadow:0 4px #cf462c,0 7px #6c2455,0 0 20px #fff;transform:scale(.5);opacity:0;pointer-events:none}.win-banner.show{animation:winpop 1.6s ease-out}@keyframes winpop{0%{opacity:0;transform:scale(.3) rotate(-6deg)}18%{opacity:1;transform:scale(1.12) rotate(3deg)}35%{transform:scale(1) rotate(0)}80%{opacity:1}100%{opacity:0;transform:scale(1.3) translateY(-18px)}}.modal{position:absolute;z-index:9;inset:0;display:grid;place-items:center;background:#080c2be0;backdrop-filter:blur(6px)}.modal.hidden{display:none}.modal-card{width:min(600px,72vw);padding:2vh 3vw;text-align:center;border:3px solid #fff0a5;border-radius:28px;background:linear-gradient(145deg,#243581,#5b318b 52%,#c04a87);box-shadow:0 20px 70px #02061fbb}.modal-logo{font-size:clamp(30px,4vw,56px);filter:drop-shadow(0 4px #341b60)}.modal-card h2{margin:.1em 0 .3em;line-height:1.15;font-size:clamp(23px,3.2vw,43px);text-shadow:0 3px #49246f}.modal-card h2 em{font-style:normal;color:#fff29a}.modal-card p{font-size:clamp(11px,1.25vw,17px);line-height:1.45}.modal-rules{display:flex;justify-content:center;flex-wrap:wrap;gap:.4vw;margin:1.2vh 0;color:#fff4ab;font-size:clamp(8px,.85vw,12px);font-weight:800}.modal-rules span{background:#18235788;border:1px solid #c6f1ff;border-radius:12px;padding:.5em}.modal-card>button{width:78%;height:6vh;min-height:38px;border:2px solid #fff3a9;border-radius:25px;background:linear-gradient(#fff08a,#ffb327);color:#66292b;font-size:clamp(16px,1.8vw,25px);font-weight:1000;box-shadow:0 4px #923d34}.modal-card>small{display:block;margin-top:1vh;color:#d6eaff;font-size:clamp(7px,.7vw,10px)}#portrait{display:none;position:absolute;z-index:20;inset:0;background:#111b50;align-items:center;justify-content:center;flex-direction:column;font-size:70px}#portrait b{font-size:22px}@media(orientation:portrait){#portrait{display:flex}#stage>*:not(#portrait){display:none}}@media(max-height:430px){.right-side{padding-top:10vh;gap:.45vh}.left-side{gap:.6vh;padding-top:.8vh}.draw-card{height:12vh}.bottom-controls{min-height:52px}.character-card{gap:0}.char-art{width:clamp(34px,5.5vw,56px);height:clamp(34px,5.5vw,56px)}.free-note{min-height:8%}}

/* Keep the full game board and its start button inside short landscape viewports. */
html,body,#stage{min-height:0;height:100%;}
#stage{height:100svh;max-height:100dvh;}
.left-side{gap:.55vh;padding:.55vh 1.2vw .7vh;}
.arena-head{flex:0 0 7%;min-height:22px;}
.ball-stage{flex:1 1 0;padding:1.2vh 1vw .8vh;}
.result-bar{flex:0 0 6%;min-height:22px;}
.bottom-controls{flex:0 0 18%;min-height:56px;padding:.45vh .6vw;}
.right-side{gap:.45vh;padding:10vh 1.2vw .7vh;}
.selection-title{flex:0 0 8%;min-height:28px;}
.bet-types{flex:0 0 8%;height:auto;min-height:32px;grid-template-columns:repeat(2,minmax(0,1fr));}
.select-help{flex:0 0 auto;min-height:16px;gap:.4vw;}
.select-help b{white-space:nowrap;}
.character-grid{flex:1 1 0;min-height:0;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:.55vw;}
.character-tile{position:relative;min-width:0;min-height:0;}
.character-card{width:100%;height:100%;}
.pick-minus{position:absolute;z-index:2;top:2px;left:2px;width:clamp(18px,2vw,25px);height:clamp(18px,2vw,25px);padding:0;border:1px solid #fff5b5;border-radius:50%;background:#9a3974;color:#fff;font-size:15px;font-weight:1000;line-height:1;box-shadow:0 1px 4px #080d35;}
.pick-minus:disabled{display:none;}
.char-art i{width:clamp(18px,2vw,25px);height:clamp(18px,2vw,25px);right:-3px;top:-3px;font-size:clamp(9px,.8vw,12px);line-height:clamp(16px,1.8vw,23px);}
.free-note{flex:0 0 auto;min-height:0;padding:.35vh .65vw;}
.free-note p{margin:.1vh 0 0;}
.selection-footer{flex:0 0 auto;}
.modal{padding:8px;overflow:auto;}
.modal-card{max-height:calc(100svh - 16px);overflow-y:auto;}
@media(max-height:560px){
  .right-side{padding-top:9.4vh;}
  .selection-title{flex-basis:7%;}
  .bet-types{flex-basis:7%;}
  .character-grid{gap:.35vw;}
  .free-note p{font-size:0;}
  .free-note p:after{content:"3種は1/3、5種は4/5でフリーチョイス";font-size:clamp(7px,.76vw,10px);}
  .selection-footer{font-size:clamp(6px,.62vw,9px);}
}
@media(max-height:430px){
  .left-side{padding-top:.45vh;gap:.4vh;}
  .arena-head{flex-basis:6%;}
  .bottom-controls{flex-basis:20%;min-height:50px;}
  .right-side{padding-top:8.5vh;gap:.35vh;}
  .selection-title{min-height:25px;}
  .bet-types{min-height:29px;}
  .free-note{display:none;}
  .char-art{width:clamp(30px,5vw,48px);height:clamp(30px,5vw,48px);}
}

/* Keep the two choice buttons and all eight character tiles inside the right panel. */
.left-side{width:55%;min-width:0;}
.right-side{width:45%;min-width:0;overflow:hidden;}
.bet-types{width:100%;max-width:100%;min-width:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(4px,.4vw,8px);overflow:hidden;}
.bet-types button{width:100%;min-width:0;max-width:100%;padding:2px clamp(3px,.45vw,8px);white-space:normal;overflow:hidden;font-size:clamp(11px,1.15vw,18px);}
.bet-types button small{font-size:clamp(6px,.62vw,10px);}
.character-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));grid-auto-flow:row;gap:clamp(3px,.4vw,7px);}
.character-tile{overflow:hidden;}
.character-card{padding:.3vh 2px;gap:0;}
.char-art{width:clamp(30px,4.7vw,58px);height:clamp(30px,4.7vw,58px);max-height:43%;margin-bottom:1px;}
.selected-count{position:absolute;z-index:2;top:3px;right:3px;max-width:calc(100% - 34px);padding:2px 6px;border:1px solid #fff9ce;border-radius:9px;background:linear-gradient(#fff29b,#ffc63b);color:#542b4d;font-size:clamp(7px,.72vw,11px);font-weight:900;line-height:1.15;white-space:nowrap;text-shadow:none;box-shadow:0 2px 4px #081032aa;pointer-events:none;}
.selected-count b{font-size:1.2em;font-weight:1000;}
.char-art i{display:none;}
.character-card>b{font-size:clamp(7px,.8vw,12px);}
.chance,.multiplier{font-size:clamp(6px,.67vw,10px);}
.pick-minus{width:clamp(18px,1.8vw,24px);height:clamp(18px,1.8vw,24px);}
.draw-card .result-icon{position:absolute;inset:7px 7px 22px;width:auto;height:auto;display:grid;place-items:center;overflow:hidden;}
.draw-card .result-icon img{display:block;width:100%;height:100%;object-fit:contain;object-position:center center;border-radius:10px;}
.draw-card .result-icon .emoji-icon{line-height:1;}
.draw-card.spinning{border-color:#fff08b;box-shadow:0 0 28px #fff084,0 4px 0 #a64d35;animation:slot-pulse .24s ease-in-out infinite alternate;}
.spin-face{display:grid;place-items:center;width:100%;height:78%;font-size:clamp(34px,5vw,68px);filter:drop-shadow(0 0 10px #fff29a);animation:slot-flash .12s linear infinite alternate;}
@keyframes slot-pulse{to{filter:brightness(1.45);transform:scale(1.025)}}
@keyframes slot-flash{to{transform:scale(.88) rotate(-8deg);opacity:.72}}
.draw-card small{z-index:1;min-width:max-content;padding:1px 5px;border-radius:8px;background:#111d50df;}
@media(max-height:560px){
  .right-side{width:45%;padding-left:1vw;padding-right:1vw;}
  .character-grid{gap:clamp(2px,.3vw,5px);}
  .char-art{width:clamp(28px,4vw,48px);height:clamp(28px,4vw,48px);}
  .selected-count{top:2px;right:2px;padding:1px 4px;font-size:clamp(6px,.58vw,9px);}
  .bet-types button{font-size:clamp(10px,1vw,15px);}
}

/* Recover a little vertical room on TV-mirrored landscape phones. */
.left-side{top:9%;padding-top:.35vh;}
.right-side{padding-top:8.8vh;}
@media(max-height:560px){
  .right-side{padding-top:8.2vh;}
}
@media(max-height:430px){
  .right-side{padding-top:7.5vh;}
  .selection-title{flex-basis:7%;}
}

/* Size the game to its actual embed box; viewport units can exceed Site previews. */
#stage{width:100%;max-width:100%;container-type:size;}
.right-side{padding-top:8.8cqh;}
.character-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(4,minmax(0,1fr));}
@media(max-height:560px){
  .right-side{padding-top:8.2cqh;}
}
@media(max-height:430px){
  .right-side{padding-top:7.5cqh;}
}

/* Restore round portraits and place two compact text columns to their right. */
.character-card{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:clamp(6px,.8vw,12px);padding:5px 7px 5px clamp(12px,1.2vw,18px);}
.char-art{flex:0 0 clamp(42px,4.4vw,60px);width:clamp(42px,4.4vw,60px);height:clamp(42px,4.4vw,60px);max-height:none;aspect-ratio:1;margin:0;border-radius:50%;overflow:hidden;}
.char-art img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:50%;}
.character-details{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;gap:4px;padding-top:8px;}
.character-card>.character-details>b{display:block;max-width:100%;padding-right:44px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:clamp(8px,.88vw,13px);line-height:1.15;}
.character-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:center;gap:3px;min-width:0;}
.character-stats .chance,.character-stats .multiplier{min-width:0;overflow:hidden;text-overflow:ellipsis;text-align:left;font-size:clamp(7px,.72vw,10px);line-height:1.1;white-space:nowrap;}
.character-stats .multiplier small{display:none;}
.selected-count{top:3px;right:4px;padding:2px 5px;}
@media(max-height:560px){
  .char-art{flex-basis:clamp(38px,4vw,52px);width:clamp(38px,4vw,52px);height:clamp(38px,4vw,52px);max-height:none;}
}

.free-lottery{position:absolute;z-index:8;inset:0;display:grid;place-items:center;background:#07133fd9;backdrop-filter:blur(5px);}
.free-lottery.hidden{display:none;}
.free-lottery-card{width:min(430px,74vw);padding:clamp(16px,3vh,30px) 20px;text-align:center;border:3px solid #fff092;border-radius:26px;background:radial-gradient(circle at 50% 0,#704bb5,#1a337b 65%,#11275c);box-shadow:0 0 40px #ffdf5c77,0 12px 35px #030a29aa;animation:lottery-pop .45s cubic-bezier(.15,1.5,.35,1);}
.free-lottery-kicker{color:#b8eaff;font-size:clamp(9px,1vw,13px);letter-spacing:.18em;font-weight:900;}
.free-lottery-star{margin:5px 0;font-size:clamp(42px,7vh,76px);filter:drop-shadow(0 0 18px #fff08c);animation:lottery-spin .9s ease-in-out infinite alternate;}
.free-lottery-card>strong{display:block;color:#fff194;font-size:clamp(22px,3vw,38px);text-shadow:0 3px #853c77;}
.free-lottery-card>p{margin:7px 0 0;color:#eef5ff;font-size:clamp(11px,1.2vw,16px);font-weight:800;}
.free-lottery.hit .free-lottery-card{border-color:#fff477;box-shadow:0 0 55px #ffef77b3,0 12px 35px #030a29aa;}
.free-lottery.hit .free-lottery-star{animation:lottery-spin .5s ease-in-out infinite alternate;}
.free-lottery.miss .free-lottery-star{filter:grayscale(.75);opacity:.7;}
@keyframes lottery-pop{from{opacity:0;transform:scale(.72)}to{opacity:1;transform:scale(1)}}
@keyframes lottery-spin{to{transform:rotate(18deg) scale(1.13)}}

/* Big, readable payout reveal for landscape play and TV mirroring. */
.payout-lottery{position:absolute;z-index:8;inset:0;display:grid;place-items:center;background:radial-gradient(ellipse at center,#172663dc,#080f2bf2 78%);backdrop-filter:blur(6px);}
.payout-lottery.hidden{display:none;}
.payout-card{width:min(500px,78vw);max-height:96%;overflow:hidden;padding:clamp(10px,2vh,22px) 18px;text-align:center;border:3px solid #fff09a;border-radius:28px;background:radial-gradient(circle at 50% 0,#7b3eae,#203783 54%,#101b4a);box-shadow:0 0 35px #ffe77488,0 12px 40px #050a25;animation:lottery-pop .4s cubic-bezier(.15,1.5,.35,1);}
.payout-kicker{color:#c4edff;font-size:clamp(8px,.85vw,12px);letter-spacing:.2em;font-weight:1000;}
.payout-card h2{margin:.12em 0;color:#fff39a;font-size:clamp(18px,2.4vw,34px);text-shadow:0 3px #8a3274;}
.payout-card p{margin:.1em 0 .4em;color:#eef5ff;font-size:clamp(10px,1vw,14px);font-weight:800;}
.wheel-wrap{position:relative;width:min(38vh,34vw,300px);aspect-ratio:1;margin:0 auto;filter:drop-shadow(0 7px 12px #080b2d);}
.payout-wheel{width:100%;height:100%;overflow:visible;transform:rotate(0deg);transition:transform 5.2s cubic-bezier(.08,.72,.08,1);}
.wheel-pointer{position:absolute;z-index:2;top:-7px;left:50%;transform:translateX(-50%);color:#fff18a;font-size:clamp(22px,3.2vw,42px);line-height:1;text-shadow:0 3px #8d3427;filter:drop-shadow(0 2px 3px #10133e);}
.wheel-center{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:25%;aspect-ratio:1;transform:translate(-50%,-50%);border:3px solid #fff6c4;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff9c0,#ffc641 55%,#e95b33);color:#672740;font-size:clamp(9px,1.2vw,16px);font-weight:1000;box-shadow:0 0 0 5px #723e94,0 0 20px #fff38f;}
.payout-card>strong{display:block;min-height:1.1em;margin-top:.15em;color:#fff28a;font-size:clamp(22px,3vw,42px);text-shadow:0 3px #8f3b48,0 0 15px #ffef7d;}
.payout-lottery.done .payout-card{animation:payout-done .5s ease-out;}
@keyframes payout-done{50%{transform:scale(1.04);filter:brightness(1.45)}}
@media(max-height:430px){.payout-card{padding:7px 14px}.wheel-wrap{width:min(34vh,30vw,230px)}.payout-card p{margin-bottom:.1em}}

/* A brighter, more polished arcade finish and clearer result portraits. */
#stage{font-family:"Hiragino Maru Gothic ProN","Yu Gothic UI","Arial Rounded MT Bold",system-ui,sans-serif;}
.brand{gap:clamp(5px,.8vw,12px);border-color:#fff0a0;background:linear-gradient(110deg,#302060f5,#29479cf2 58%,#8b397fcf);box-shadow:0 0 0 2px #ffffff22,0 0 22px #ffe58d55,0 5px 18px #080e388c;}
.brand b{font-family:"Hiragino Maru Gothic ProN","Yu Gothic UI","Arial Rounded MT Bold",system-ui,sans-serif;color:#fff5ba;letter-spacing:.02em;text-shadow:0 2px #743d7b,0 0 12px #ffe58d88;}
.brand .round-pill{margin-left:clamp(4px,.65vw,10px);padding:.26em .62em;border-color:#ffeaa1;background:linear-gradient(120deg,#402a78ed,#1f3471ed);box-shadow:0 0 12px #ffe88c55;font-size:clamp(9px,.95vw,14px);}
.arena-head{padding-left:.2vw;color:#fff4bf;text-shadow:0 2px #753969,0 0 12px #ffe79955;}
.ball-stage{border-color:#ffe69c;background:radial-gradient(ellipse at 50% 42%,#7252a6a8,#1c367fc2 56%,#0d194acc);box-shadow:inset 0 0 42px #ffe88925,0 0 0 2px #ffffff24,0 0 24px #f9d8703b,0 8px 22px #07133877;}
.draw-card{border-color:#fff1b2;background:linear-gradient(145deg,#355aae,#20205e);box-shadow:0 4px 0 #091438,0 0 17px #ffd96459,inset 0 0 12px #fff3a21f;}
.draw-card{overflow:visible;}
.draw-card:before{z-index:1;}
.draw-card .result-icon{position:absolute;inset:2px;width:auto;height:auto;display:grid;place-items:center;overflow:hidden;border-radius:12px;}
.draw-card .result-icon img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;border-radius:10px;transform:scale(1.08);}
.draw-card .result-icon .emoji-icon{font-size:clamp(42px,7vw,94px);line-height:1;}
.draw-card .spin-face{position:absolute;inset:2px;width:auto;height:auto;display:grid;place-items:center;overflow:hidden;border-radius:12px;}
.draw-card .spin-face img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:9px;}
.draw-card .spin-face .emoji-icon{font-size:clamp(42px,7vw,94px);line-height:1;}
.draw-card small{z-index:3;top:-7px;bottom:auto;left:50%;transform:translate(-50%,-50%);padding:2px 7px;border:1px solid #fff0aa99;background:#111d50f2;box-shadow:0 2px 6px #080c2d88;}
.draw-card .spin-out{display:grid;place-items:center;width:100%;height:78%;color:#ffefaa;font-size:clamp(16px,2vw,28px);font-weight:1000;text-shadow:0 2px #873957,0 0 12px #fff1a0;}
.draw-card .spin-out.stopped{animation:card-pop .35s cubic-bezier(.12,1.8,.38,1);}
.draw-card.match{border-color:#fff276;box-shadow:0 0 30px #fff178,0 0 0 2px #ffdc6b88,0 4px 0 #9b521c;}
.selection-title{flex:0 0 6%;min-height:24px;justify-content:flex-end;}
.picked-badge{border-color:#fff3a3;background:linear-gradient(110deg,#4a2c82,#263c89);box-shadow:0 0 14px #ffe88745;}
.right-side{border-left-color:#ffe794;background:linear-gradient(145deg,#292857f2,#191f5af5 45%,#152f6ef7);box-shadow:-12px 0 30px #06153a99,inset 5px 0 20px #ffe89313;}
.character-card.selected{box-shadow:0 0 18px #fff06a9c,0 3px #865b2e,inset 0 0 16px #ffe98322;}
.character-card.landed{border-color:#fff3a1;background:linear-gradient(145deg,#72532f,#52406f 55%,#273c82);box-shadow:0 0 20px #ffe776bd,0 0 0 2px #fff2a35c,0 3px #9c5b31,inset 0 0 18px #ffe98335;animation:landed-glow .62s ease-in-out infinite alternate;}
.character-card.landed:after{border-color:#fff3a1d9;}
.character-details{gap:2px;}
.hit-count{align-self:flex-start;padding:1px 5px;border-radius:8px;background:linear-gradient(#fff3a4,#ffc849);color:#683250;font-size:clamp(7px,.68vw,10px);line-height:1.1;font-weight:1000;box-shadow:0 0 8px #fff0a977;}
@keyframes landed-glow{to{filter:brightness(1.28);box-shadow:0 0 29px #ffef8ddd,0 0 0 3px #fff2a388,0 3px #9c5b31,inset 0 0 22px #ffe98355;}}
.free-lottery-card,.payout-card{border-color:#fff4ad;box-shadow:0 0 0 2px #ffffff20,0 0 45px #ffdf5c88,0 12px 35px #030a29aa;}
@media(max-height:430px){.selection-title{flex-basis:5%;min-height:20px;}}

/* Jackpot development, richer prize wheel, and vertically centered result art. */
.draw-card .result-icon{inset:0;align-items:center;justify-items:center;}
.draw-card .result-icon img{object-position:50% 38%;transform:translateY(-5%) scale(1.12);}
.draw-card .result-icon .emoji-icon{transform:translateY(-5%);}
.draw-card small{z-index:4;top:-9px;}
.payout-card{width:min(560px,82vw);padding:clamp(12px,2.3vh,26px) clamp(18px,3vw,38px);border:4px solid #fff1a0;background:radial-gradient(ellipse at 50% -10%,#d377bc 0,#523a9f 38%,#162b67 75%);box-shadow:0 0 0 3px #7d4d9c,0 0 48px #fff08c99,0 16px 55px #02051ebf,inset 0 0 35px #fff3b52a;}
.payout-card h2{font-size:clamp(20px,2.8vw,38px);text-shadow:0 2px #c54e80,0 5px #4a236d,0 0 16px #fff2a4a6;}
.wheel-wrap{width:min(42vh,40vw,350px);filter:drop-shadow(0 0 10px #fff5ad88) drop-shadow(0 9px 12px #080b2d);}
.wheel-wrap:before{content:"";position:absolute;z-index:-1;inset:-10px;border:8px ridge #ffd960;border-radius:50%;background:radial-gradient(circle,#fef6ba,#ac652b 72%);box-shadow:0 0 0 3px #fff5cf,0 0 23px #fff183;}
.wheel-wrap:after{content:"✦　✧　✦　✧　✦　✧　✦";position:absolute;inset:-24px;display:grid;place-items:start center;color:#fff8b5;font-size:clamp(10px,1.5vw,18px);letter-spacing:.38em;text-shadow:0 0 9px #fff;animation:wheel-sparkle 1.2s linear infinite;pointer-events:none;}
@keyframes wheel-sparkle{50%{filter:brightness(1.8);transform:rotate(2deg)}}
.wheel-center{width:28%;border:4px double #fff9cf;background:radial-gradient(circle at 35% 25%,#fff,#ffdc5c 42%,#d04c73 82%);color:#7d204b;font-size:clamp(9px,1.35vw,18px);box-shadow:0 0 0 5px #a0539a,0 0 24px #fff5a8;}
.roulette-event{width:max-content;max-width:100%;margin:.5vh auto;padding:.35em 1em;border:2px solid #fff7ba;border-radius:999px;background:linear-gradient(90deg,#e451aa,#7541ca,#2d8fdb);color:#fff9b6;font-size:clamp(11px,1.35vw,18px);font-weight:1000;text-shadow:0 2px #603074;box-shadow:0 0 20px #ffed91;animation:event-pop .6s ease-in-out infinite alternate;}
.roulette-event.hidden{display:none;}
@keyframes event-pop{to{transform:scale(1.04);filter:brightness(1.25)}}
.payout-lottery.done .payout-card{animation:payout-done .5s ease-out, jackpot-glow 1s ease-in-out infinite alternate;}
@keyframes jackpot-glow{to{box-shadow:0 0 0 3px #fff4a8,0 0 80px #ff5cdd,0 16px 55px #02051ebf,inset 0 0 45px #fff3b55a}}
.jp-challenge{position:absolute;z-index:11;inset:0;display:grid;place-items:center;padding:2vh 2vw;background:radial-gradient(ellipse at center,#332877ee,#080d2bf7 78%);backdrop-filter:blur(8px);}
.jp-challenge.hidden{display:none;}
.jp-card{position:relative;width:min(720px,92vw);max-height:96%;overflow:auto;padding:clamp(12px,2vh,22px) clamp(14px,2.2vw,30px);text-align:center;border:4px solid #ffe98a;border-radius:28px;background:radial-gradient(ellipse at 50% 0,#8054bc,#263e8f 50%,#131d50 100%);box-shadow:0 0 0 3px #f7b54e,0 0 50px #ffe78099,0 18px 60px #03071ecc;}
.jp-kicker{color:#c6f4ff;font-size:clamp(8px,.85vw,12px);font-weight:1000;letter-spacing:.18em;}
.jp-card h2{margin:.18em 0;color:#fff4aa;font-size:clamp(20px,2.7vw,36px);text-shadow:0 3px #a43c72,0 0 15px #ffe88b;}
.jp-card>p{margin:.2em 0 .7em;color:#e9f4ff;font-size:clamp(10px,1.1vw,15px);font-weight:800;}
.jp-stamp-meter{display:inline-flex;align-items:center;gap:12px;padding:.25em 1em;border:1px solid #fff3a1;border-radius:999px;background:#11275bd9;color:#dff6ff;font-size:clamp(10px,1vw,14px);}
.jp-stamp-meter b{color:#fff085;font-size:1.3em;text-shadow:0 0 8px #ffd94d;}
.jp-target-title{margin:.65vh 0 .4vh;color:#fff5bc;font-size:clamp(10px,1.1vw,15px);font-weight:900;}
.jp-targets{display:flex;justify-content:center;gap:clamp(4px,.6vw,10px);flex-wrap:wrap;}
.jp-target{display:flex;align-items:center;gap:5px;min-width:76px;padding:4px 7px;border:2px solid #c7ecff;border-radius:13px;background:linear-gradient(#31529c,#192657);color:white;font-size:clamp(8px,.8vw,11px);font-weight:900;transition:.15s;}
.jp-target img{width:clamp(26px,4vh,42px);height:clamp(26px,4vh,42px);object-fit:cover;border-radius:50%;}
.jp-target.active{border-color:#fff176;background:linear-gradient(#9366a7,#3b3f8b);box-shadow:0 0 18px #fff079;transform:translateY(-2px);}
.jp-targets.locked .jp-target:not(.active){opacity:.48;}
.jp-machine{position:relative;width:min(460px,76vw);height:clamp(100px,19vh,175px);margin:1vh auto .7vh;border:5px ridge #ffe585;border-radius:24px;background:linear-gradient(180deg,#1d2d6c,#3859a4 55%,#152550 56%,#0f1a43);box-shadow:inset 0 0 30px #8beaff55,0 0 28px #5eeaff55;overflow:hidden;}
.jp-machine:before{content:"UFO CATCHER";position:absolute;top:5px;left:0;right:0;color:#d9f7ff;font-size:clamp(8px,.85vw,12px);font-weight:1000;letter-spacing:.2em;text-shadow:0 0 8px #5ceeff;}
.jp-machine:after{content:"";position:absolute;left:5%;right:5%;bottom:11px;height:9px;border-radius:50%;background:linear-gradient(90deg,#fff09a,#f29b53,#fff19e);box-shadow:0 0 16px #ffdb63;}
.jp-claw{position:absolute;z-index:2;top:16%;left:50%;font-size:clamp(27px,4.7vh,48px);filter:drop-shadow(0 3px 4px #071132);transform:translateX(-50%);transition:left .11s linear,transform .35s ease;}
.jp-claw.claw-drop{transform:translateX(-50%) translateY(42px) rotate(16deg);}
.jp-prize-window{position:absolute;left:50%;bottom:18px;width:clamp(58px,10vh,100px);height:clamp(58px,10vh,100px);transform:translateX(-50%);display:grid;place-items:center;border:3px solid #fff1a2;border-radius:20px;background:radial-gradient(circle,#fff,#ffd66a 45%,#ff7bb8);box-shadow:0 0 22px #fff3a8;overflow:hidden;}
.jp-prize img{width:100%;height:100%;object-fit:cover;animation:prize-bob .35s ease-in-out infinite alternate;}
.jp-prize{font-size:clamp(35px,6vh,64px);line-height:1;}
@keyframes prize-bob{to{transform:scale(.87) rotate(-6deg)}}
.jp-machine-lights{position:absolute;left:0;right:0;bottom:0;height:10px;color:#fff29a;font-size:10px;letter-spacing:.8em;white-space:nowrap;text-shadow:0 0 8px #fff;animation:lights 1s linear infinite;}
@keyframes lights{to{filter:hue-rotate(110deg);transform:translateX(10px)}}
.jp-outcome{min-height:2em;margin:.3vh auto;color:#e9f6ff;font-size:clamp(12px,1.45vw,20px);font-weight:900;text-shadow:0 2px #142554;}
.jp-outcome b{color:#fff185;font-size:1.22em;text-shadow:0 0 12px #ffe650;}
.jp-catch,.jp-continue{min-width:min(340px,72vw);min-height:clamp(42px,6vh,62px);padding:.45em 1em;border:3px solid #fff4a7;border-radius:999px;background:linear-gradient(#fff58a,#ffb82e 55%,#ed6b29);color:#61274e;font-size:clamp(15px,1.7vw,23px);font-weight:1000;box-shadow:0 5px 0 #a1433f,0 0 22px #ffdc6a;}
.jp-continue{background:linear-gradient(#e8faff,#8dd9ff 55%,#477bd6);color:#162f70;}
.jp-catch:disabled{filter:grayscale(.3);}
.jp-catch.hidden,.jp-continue.hidden{display:none;}
.jp-challenge.won .jp-prize-window{animation:prize-win .6s ease-in-out 3;}
@keyframes prize-win{50%{transform:translateX(-50%) scale(1.16);box-shadow:0 0 50px #fff79c;filter:brightness(1.5)}}
.jp-challenge.jp-win .jp-card{animation:jackpot-glow .6s ease-in-out infinite alternate;}
#stage.reach-mode:after{content:"";position:absolute;z-index:3;inset:0;pointer-events:none;background:radial-gradient(ellipse at 32% 51%,transparent 5%,#080a28a6 72%);animation:reach-beat .5s ease-in-out infinite alternate;}
@keyframes reach-beat{to{opacity:.62;filter:hue-rotate(18deg)}}
#stage.rainbow-win:after{content:"";position:absolute;z-index:7;inset:0;pointer-events:none;background:linear-gradient(115deg,#ff315b33,#ffb90055,#4dffbd44,#39c6ff55,#ad51ff55);background-size:300% 300%;animation:rainbow-flare 1s linear 2;mix-blend-mode:screen;}
#stage.rainbow-win .draw-card.match{animation:rainbow-card .8s ease-in-out infinite alternate;}
@keyframes rainbow-flare{to{background-position:100% 100%;filter:brightness(1.7) saturate(1.6)}}
@keyframes rainbow-card{to{border-color:#ff91ff;box-shadow:0 0 35px #80f8ff,0 0 0 4px #fff1a2,0 4px #9b521c;filter:hue-rotate(80deg) brightness(1.3)}}
@media(max-height:430px){.jp-card{padding:8px 14px}.jp-machine{height:clamp(78px,17vh,112px);margin:.5vh auto}.jp-target-title{margin:.2vh 0}.jp-target{padding:2px 5px}.jp-prize-window{width:54px;height:54px;bottom:13px}.jp-card h2{font-size:clamp(16px,2.4vw,26px)}}
/* JP stamp progress */
.counter #jp-progress{display:block;margin-top:1px;color:#d9edff;font-size:clamp(6px,.58vw,9px);line-height:1.1;white-space:nowrap}
/* Result cards use square frames with round portraits centered to match the selection icons. */
.draw-slots{align-items:center;}
.draw-card{height:auto;aspect-ratio:1;width:100%;max-height:20vh;border-radius:20%;padding:0;overflow:visible;}
.draw-card:before{inset:4px;border-radius:17%;}
.draw-card .result-icon,.draw-card .spin-face{inset:0;display:grid;place-items:center;border-radius:20%;}
.draw-card .result-icon img,.draw-card .spin-face img{width:88%;height:88%;object-fit:contain;object-position:center;transform:none;border-radius:50%;background:#fff8e9;box-shadow:0 0 0 3px #fff0a0,0 3px 12px #08113e99;}
.draw-card .result-icon .emoji-icon,.draw-card .spin-face .emoji-icon{transform:none;}
.draw-card small{z-index:5;top:-8px;bottom:auto;left:50%;transform:translate(-50%,-50%);white-space:nowrap;}
.draw-card.match .result-icon img{box-shadow:0 0 0 4px #fff27b,0 0 25px #fff08a;}
@media(max-height:560px){.draw-card{max-height:16vh;}}

/* 2D skill crane: move horizontally, line up a prize, and drop the claw. */
.jp-card{width:min(900px,96vw);max-height:calc(100% - 10px);padding:clamp(8px,1.2vh,16px) clamp(12px,2vw,24px);overflow:auto;}
.jp-card h2{margin:.08em 0;font-size:clamp(18px,2.2vw,32px);}
.jp-card>p{margin:.08em 0 .25em;font-size:clamp(9px,.95vw,13px);}
.jp-target-title{margin:.2vh 0 .2vh;}
.jp-targets{gap:4px;}
.jp-target{min-width:0;padding:2px 6px;font-size:clamp(8px,.75vw,11px);}
.jp-target img{width:clamp(24px,3.2vh,34px);height:clamp(24px,3.2vh,34px);object-fit:cover;border-radius:50%;}
.jp-machine{width:min(780px,90vw);height:clamp(122px,24vh,190px);margin:.6vh auto .35vh;border:5px ridge #ffe585;border-radius:20px;background:linear-gradient(180deg,#122b63 0%,#3470a0 49%,#163778 50%,#0d1d4b 100%);box-shadow:inset 0 0 34px #8beaff66,0 0 28px #5eeaff66;}
.jp-machine:before{display:none;}
.jp-machine-header{position:absolute;top:5px;left:0;right:0;text-align:center;color:#c9f8ff;font-size:clamp(7px,.78vw,11px);font-weight:1000;letter-spacing:.14em;text-shadow:0 0 9px #5ceeff;}
.jp-machine-header span{margin-left:.7em;color:#fff3a5;letter-spacing:0;}
.jp-lane{position:absolute;z-index:2;left:1%;right:1%;bottom:13px;height:58%;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));align-items:stretch;gap:clamp(2px,.4vw,6px);}
.jp-item{position:relative;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:2px;border:1px solid #d8f4ff99;border-radius:12px;background:linear-gradient(150deg,#304d91,#152654 72%);color:#fff;box-shadow:inset 0 0 12px #a7eaff22,0 3px 5px #07143888;transition:transform .12s,border-color .12s,filter .12s;}
.jp-item-art{width:clamp(28px,5vh,55px);height:clamp(28px,5vh,55px);flex:0 0 auto;display:grid;place-items:center;border:2px solid #fff0aa;border-radius:50%;background:radial-gradient(circle at 35% 25%,#fff,#ffd66a 48%,#ff80b4);box-shadow:0 0 12px #ffe78366;font-size:clamp(18px,3vh,34px);line-height:1;}
.jp-item-art img{width:100%;height:100%;object-fit:cover;border-radius:50%;}
.jp-item small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:clamp(6px,.62vw,9px);font-weight:900;}
.jp-item.aimed{z-index:3;transform:translateY(-5px);border-color:#fff183;filter:brightness(1.35);box-shadow:0 0 0 2px #fff183,0 0 18px #fff07e,inset 0 0 12px #fff5a255;}
.jp-item.caught{transform:translateY(-15px) scale(1.12);border-color:#fff;filter:brightness(1.7);box-shadow:0 0 25px #fff5a6;}
.jp-aim-line{position:absolute;z-index:1;top:29px;bottom:11px;width:2px;background:linear-gradient(#fff6a6,#7ceaff88);box-shadow:0 0 9px #fff0a6;pointer-events:none;transition:left .12s ease;}
.jp-claw{z-index:4;top:17%;left:43.8%;font-size:clamp(24px,4.5vh,45px);transition:left .12s ease,transform .35s ease;}
.jp-claw.claw-drop{transform:translateX(-50%) translateY(65px) rotate(10deg);}
.jp-machine-floor{position:absolute;z-index:4;left:0;right:0;bottom:0;height:10px;text-align:center;color:#fff29a;font-size:9px;letter-spacing:.5em;text-shadow:0 0 8px #fff;animation:lights 1s linear infinite;pointer-events:none;}
.jp-machine:after{left:3%;right:3%;bottom:8px;height:7px;opacity:.8;}
.jp-aim-controls{display:grid;grid-template-columns:clamp(32px,4vh,42px) minmax(100px,460px) clamp(32px,4vh,42px);align-items:center;justify-content:center;gap:clamp(8px,1.2vw,18px);width:min(540px,85vw);margin:.15vh auto 0;}
.jp-nudge{height:clamp(30px,4.4vh,42px);border:2px solid #fff2a6;border-radius:12px;background:linear-gradient(#4a8fd6,#344091);font-size:clamp(13px,1.5vw,20px);font-weight:1000;box-shadow:0 3px #17245c;}
.jp-nudge:disabled{opacity:.5;}
#jp-aim{width:100%;height:clamp(24px,3.5vh,34px);margin:0;accent-color:#ffd64e;touch-action:pan-x;}
.jp-aim-hint{display:block;margin:.12vh auto;color:#cdeaff;font-size:clamp(7px,.68vw,10px);font-weight:800;}
.jp-outcome{margin:.15vh auto;min-height:1.5em;font-size:clamp(10px,1.05vw,15px);}
.jp-catch,.jp-continue{min-height:clamp(38px,5vh,52px);}
@media(max-height:560px){
  .jp-card{padding:5px 12px;gap:0;}
  .jp-card h2{font-size:clamp(15px,2vw,23px);}
  .jp-card>p{font-size:clamp(8px,.8vw,10px);margin:0;}
  .jp-machine{height:clamp(94px,23vh,132px);margin:.3vh auto;}
  .jp-lane{height:57%;}
  .jp-item-art{width:clamp(23px,5vh,39px);height:clamp(23px,5vh,39px);}
  .jp-aim-controls{grid-template-columns:30px minmax(100px,360px) 30px;}
  .jp-aim-hint{margin:0;}
}

/* Respect iPhone safe areas when opened from the Home Screen as a standalone app. */
.topbar{top:max(1.2%,env(safe-area-inset-top));left:max(1.3%,env(safe-area-inset-left));right:max(1.3%,env(safe-area-inset-right));}
.left-side{left:env(safe-area-inset-left);width:calc(57% - env(safe-area-inset-left));}
.right-side{right:env(safe-area-inset-right);width:calc(43% - env(safe-area-inset-right));}