stock-board,gacha-progress{display:block;text-align:left;font-family:var(--font-body);color:var(--sulu-ink);background:var(--sulu-paper);border:3px solid var(--sulu-ink);border-radius:var(--r-md);padding:14px;line-height:1.35;margin:12px 0}
stock-board[compact]{padding:9px 12px;font-size:12px;overflow-wrap:anywhere}
.stock-head{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:13px}.stock-head span{font-size:10px;max-width:64px;text-align:right}
.stock-row{display:grid;grid-template-columns:26px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px dashed var(--sulu-mint-deep);font-weight:700;font-size:13px}.stock-row strong{font:25px var(--font-display);white-space:nowrap}.stock-row strong.sold-out{font:22px var(--font-shout);color:var(--lantern-red);transform:rotate(-8deg);border:2px solid currentColor;padding:1px 4px}.stock-row strong:only-child{font-size:14px}
.capsule-icon{display:block;width:23px;height:28px;background:linear-gradient(var(--sulu-magenta) 48%,var(--sulu-ink) 48% 55%,var(--sulu-paper) 55%);border:2px solid var(--sulu-ink);border-radius:50%;transform:rotate(-25deg)}.ew25 .capsule-icon{background:linear-gradient(var(--sulu-mint) 48%,var(--sulu-ink) 48% 55%,var(--sulu-paper) 55%)}.merch .capsule-icon{background:linear-gradient(var(--lantern-blue) 48%,var(--sulu-ink) 48% 55%,var(--sulu-paper) 55%)}
stock-board small{display:block;margin-top:10px;font-size:11px}.stock-budget{opacity:.7}.stock-note{font-weight:700;font-size:13px}
gacha-progress p{margin:7px 0;font-size:14px}gacha-progress small{display:block;margin-top:8px;font-size:12px}.play-pips{display:flex;gap:7px;margin-top:9px}.play-pips i{width:30px;height:9px;border:2px solid var(--sulu-ink);border-radius:9px;background:var(--sulu-paper-dim)}.play-pips .filled{background:var(--sulu-magenta)}
gacha-progress.is-eligible{background:linear-gradient(115deg,var(--sulu-magenta),var(--sulu-magenta-deep),var(--lantern-blue));color:var(--sulu-paper);box-shadow:4px 4px 0 var(--sulu-mint)}
.reward-card.is-eligible{background:linear-gradient(115deg,var(--sulu-magenta),var(--sulu-magenta-deep),var(--lantern-blue));color:var(--sulu-paper)}
.capsule-stage .machine-capsules{left:29%;top:31%;width:43%;height:25%}.capsule-stage .machine-handle{left:58%;top:69%;width:52px;height:52px;font-size:30px}
.stock-row{grid-template-columns:26px minmax(0,1fr) auto}.stock-row strong.stock-pending{font:700 12px var(--font-body);max-width:75px;white-space:normal}
.gacha-nav .btn{width:auto}
stock-board[compact]{white-space:nowrap;overflow-x:auto;overflow-wrap:normal;font-size:11px}stock-board[compact] span{display:inline-block}
.stock-change{animation:stock-tick .35s var(--ease-pop)}@keyframes stock-tick{50%{transform:scale(1.05) rotate(-2deg)}}
.gacha-page{margin:0;background:var(--sulu-ink);color:var(--sulu-paper);font-family:var(--font-body)}.gacha-main{max-width:520px;margin:auto;min-height:100dvh;padding:calc(16px + env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom));background:radial-gradient(ellipse at top right,var(--sulu-magenta-deep),transparent 65%),var(--sulu-ink);box-sizing:border-box}.gacha-main h1{font:42px/.95 var(--font-display);margin:22px 0 12px}.gacha-main h2{font:28px var(--font-shout);margin:12px 0}.gacha-nav{display:flex;justify-content:space-between;gap:12px}.gacha-nav a{color:var(--sulu-paper);min-height:44px;display:inline-flex;align-items:center;font-weight:700}.gacha-main .btn{width:100%;margin:7px 0;min-height:48px;box-sizing:border-box}.gacha-main label{display:block;font-weight:700;margin:12px 0 8px}.gacha-main input{box-sizing:border-box;width:100%;min-height:48px;border:3px solid var(--sulu-ink);border-radius:8px;padding:10px 12px;font:17px var(--font-body);background:var(--sulu-paper);color:var(--sulu-ink)}.gacha-main small{line-height:1.4}.gacha-status{font-size:14px;min-height:20px;color:var(--sulu-mint);overflow-wrap:anywhere}.gacha-main [hidden]{display:none!important}
.capsule-stage{position:relative;height:300px;max-width:340px;margin:8px auto;isolation:isolate}.machine-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.machine-capsules{position:absolute;left:24%;top:11%;width:46%;height:37%}.machine-nox{position:absolute;right:-4%;bottom:5%;width:38%;max-height:180px;object-fit:contain}.machine-handle{position:absolute;left:57%;top:55%;width:64px;height:64px;border:3px solid var(--sulu-ink);border-radius:50%;background:var(--sulu-mint);color:var(--sulu-ink);font:38px var(--font-shout);touch-action:none;box-shadow:2px 3px 0 var(--sulu-ink)}.machine-handle[disabled]{opacity:.5}.machine-handle.turning{animation:crank-turn 1s linear 2}@keyframes crank-turn{to{transform:rotate(360deg)}}
.crack-button{display:block;border:4px solid var(--sulu-ink);width:110px;height:130px;margin:18px auto;background:linear-gradient(var(--sulu-magenta) 48%,var(--sulu-ink) 48% 52%,var(--sulu-paper) 52%);border-radius:50%;font:22px var(--font-shout);color:var(--sulu-ink);box-shadow:var(--shadow-mag);animation:capsule-drop .55s var(--ease-pop)}@keyframes capsule-drop{from{transform:translateY(-70px) rotate(-40deg);opacity:0}to{transform:translateY(0) rotate(0);opacity:1}}
.prize-card{position:relative;overflow:hidden;padding:22px 18px;color:var(--sulu-ink);background:var(--sulu-paper);border:4px solid var(--sulu-ink);box-shadow:6px 6px 0 var(--sulu-magenta);animation:stamp-in .35s var(--ease-pop);margin:18px 0;text-align:center}.prize-card.ew50{background:linear-gradient(125deg,var(--sulu-mint),var(--sulu-magenta-soft),var(--sulu-paper),var(--sulu-magenta-soft))}.prize-card.ew25{background:var(--sulu-mint)}.prize-card.merch{background:var(--lantern-blue);color:var(--sulu-paper)}.prize-card code{display:block;font:26px var(--font-mono);padding:12px 0;letter-spacing:.06em}.voucher-qr{display:block;width:150px;height:150px;image-rendering:pixelated;margin:8px auto;background:var(--sulu-white)}.prize-card .do-log{font-size:12px;text-align:left}.confetti{position:absolute;inset:0;pointer-events:none}.confetti i{position:absolute;left:50%;top:20%;width:8px;height:13px;background:var(--sulu-magenta);animation:confetti-fall 1.2s ease-out both}.confetti i:nth-child(3n){background:var(--sulu-mint)}.confetti i:nth-child(3n + 1){background:var(--lantern-blue)}@keyframes confetti-fall{to{transform:translate(var(--dx),180px) rotate(var(--rot));opacity:0}}
.gacha-info{background:var(--sulu-paper);color:var(--sulu-ink);padding:18px;border:3px solid var(--sulu-ink);border-radius:12px;margin:18px 0}.gacha-info li{margin:12px 0}.gacha-info ul{padding-left:20px}.gacha-odds{display:grid;gap:8px}.staff-video{width:100%;max-height:250px}.staff-metrics{font:20px/1.5 var(--font-mono)}.game-reward-panel{position:fixed;bottom:calc(102px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:calc(100% - 36px);max-width:430px;z-index:25;max-height:46dvh;overflow:auto;background:var(--sulu-ink);padding:8px 12px;border:3px solid var(--sulu-paper);box-sizing:border-box;color:var(--sulu-paper)}.game-reward-panel a{color:var(--sulu-paper);display:inline-flex;align-items:center;min-height:44px}.game-reward-panel[hidden]{display:none}.game-reward-panel gacha-progress{margin:0}.game-reward-panel stock-board{margin:8px 0 0}
@media(prefers-reduced-motion:reduce){.stock-change,.machine-handle.turning,.crack-button,.prize-card,.confetti i{animation:none}}

/* Claude fix 2026-11-08: stamp-in scale (1.6x) pushed the prize card past the viewport and caused horizontal scroll on phones. */
html:has(.prize-card),body:has(.prize-card){overflow-x:clip}
/* Claude fix: prize card had the small-stamp keyframes (ends tilted -12deg, overlapped buttons). Own keyframes that settle flat. */
.prize-card{animation:prize-in .45s var(--ease-pop) both}
@keyframes prize-in{0%{transform:scale(1.25) rotate(-8deg);opacity:0}70%{transform:scale(.98) rotate(1deg);opacity:1}100%{transform:none;opacity:1}}
@media(prefers-reduced-motion:reduce){.prize-card{animation:none}}

/* One-screen tabbed layout (gacha.html, gacha-info.html; owner 2026-11-09: no page scroll on phones, split into tabs instead).
   Scoped to .gt so staff.html, stock.html and the tour's stock/progress panels keep their layout. */
.gacha-main.gt{height:100dvh;min-height:0;display:flex;flex-direction:column;padding:calc(4px + env(safe-area-inset-top)) 16px calc(12px + env(safe-area-inset-bottom))}
.gt-head{flex:none}.gt .gacha-nav a{min-height:44px}
.gacha-main.gt h1{font:28px/1 var(--font-display);margin:0}
.gt-sub{margin:2px 0 0;font:700 11px var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--sulu-paper);opacity:.7}
.gt-tabs{flex:none;display:flex;gap:6px;margin:10px 0 10px;padding:4px;border:3px solid var(--sulu-paper);border-radius:var(--r-pill);background:rgba(255,252,230,.06)}
.gt-tabs [role=tab]{flex:1 1 0;min-height:44px;padding:4px 8px;border:0;border-radius:var(--r-pill);background:transparent;color:var(--sulu-paper);font:900 13px/1.1 var(--font-body);letter-spacing:.03em;text-transform:uppercase;cursor:pointer}
.gt-tabs [role=tab][aria-selected=true]{background:var(--sulu-magenta);color:var(--sulu-white);box-shadow:inset 0 0 0 2px var(--sulu-ink)}
.gt-tabs [role=tab]:focus-visible{outline:3px solid var(--neon-cyan);outline-offset:2px}
.gt-panel{flex:1 1 0;min-height:0;display:flex;flex-direction:column}
.gt-panel[hidden]{display:none}
@media (max-height:760px){.gt-sub{display:none}.gt-tabs{margin:8px 0}}
.gt-head .nav-row{padding-top:8px}
