/* Four private playtest games with shared controls. */
:is(.frog-page,.cat-page,.bee-page,.fox-page){font-family:ui-rounded,"Hiragino Maru Gothic ProN","Noto Sans JP",system-ui,sans-serif}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .arcade-layout{grid-template-columns:minmax(0,480px) minmax(240px,1fr);gap:42px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .game-shell{width:100%;max-width:480px;margin-inline:auto;border-radius:26px;overflow:hidden;box-shadow:0 20px 56px #091f3a35,0 1px 0 #ffffff48 inset}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .arena{height:auto;min-height:0;aspect-ratio:4/5;background:#183c55}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .overlay{padding:16px;background:#173553c9;backdrop-filter:none}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .overlay>div{max-width:320px;margin:auto}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .overlay h1{font:850 clamp(23px,3vw,31px)/1.35 ui-rounded,system-ui,sans-serif;letter-spacing:.01em;margin:8px 0 9px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .mascot-badge{width:112px;height:112px;object-fit:cover;border-radius:50%;margin:0 auto 1px;border:3px solid #fff8de;box-shadow:0 7px 18px #0d274b55}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .button{border-radius:999px;min-height:48px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .scorebar{height:72px;gap:10px;padding:8px 13px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .live-score{display:grid;grid-template-columns:auto auto;column-gap:4px;flex:1}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .live-score>span:first-child{grid-column:1/-1;font-size:12px;line-height:1.15}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .live-score strong{font:800 29px/1 ui-rounded,system-ui,sans-serif}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .stage-label{min-width:54px;max-width:64px;gap:2px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .stage-label>span{font:12px/1.25 system-ui,sans-serif;letter-spacing:0;white-space:nowrap}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .stage-label strong{font-size:20px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .icon-btn{width:44px;min-width:44px;height:43px;border-radius:12px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .game-tools .icon-btn:first-child{width:50px;min-width:50px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .controlbar{min-height:52px;padding:9px 12px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .controlbar p{font-size:14px;line-height:1.45}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .direction-button{width:55px;height:45px;border-radius:14px;flex-shrink:0}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .intro>p{font-size:16px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .howto ol{font-size:15px}
:is(.frog-page,.cat-page,.bee-page,.fox-page) .result-time strong{font-size:49px}

.frog-page{--bg:#1a6f84;--panel:#2d8491;--line:#66acaa;--text:#f6fff1;--muted:#d5f1ed;--mint:#d6f49c;--yellow:#fff0a9;background:radial-gradient(ellipse at 82% 0%,#6acfd2,#1a6f84 70%)}
.frog-page .site-header,.frog-page .scorebar,.frog-page .controlbar{background:#2b808a}.frog-page .game-shell{border-color:#9ed2c2}.frog-page .overlay{background:#246a78cf}.frog-page .primary{background:#d7f49b;color:#315a44;box-shadow:0 3px 0 #7ca46f}.frog-page .icon-btn,.frog-page .direction-button{background:#3d959a;border-color:#80c5b6;color:#faffd5}
.cat-page{--bg:#765567;--panel:#8d6372;--line:#bb8d94;--text:#fff9ed;--muted:#f0d9d7;--mint:#ffe19b;--yellow:#fff0b6;background:radial-gradient(ellipse at 85% 0%,#d38f91,#765567 70%)}
.cat-page .site-header,.cat-page .scorebar,.cat-page .controlbar{background:#845d6d}.cat-page .game-shell{border-color:#f5c5b2}.cat-page .overlay{background:#704d62cf}.cat-page .primary{background:#ffe09a;color:#69474b;box-shadow:0 3px 0 #bc8c6d}.cat-page .icon-btn,.cat-page .direction-button{background:#a06b7b;border-color:#d49aa0;color:#fff3bd}
.bee-page{--bg:#866484;--panel:#9b7593;--line:#d0a7bf;--text:#fff7fb;--muted:#f0dcec;--mint:#ffeba7;--yellow:#fff0aa;background:radial-gradient(ellipse at 85% 0%,#f0afc4,#866484 72%)}
.bee-page .site-header,.bee-page .scorebar,.bee-page .controlbar{background:#906c8c}.bee-page .game-shell{border-color:#ffd2da}.bee-page .overlay{background:#785875cf}.bee-page .primary{background:#ffeca9;color:#795467;box-shadow:0 3px 0 #c59477}.bee-page .icon-btn{background:#ac7ca7;border-color:#d7a5c5;color:#fff5c9}
.fox-page{--bg:#263757;--panel:#35496b;--line:#65789c;--text:#f8f5e9;--muted:#d0d9ed;--mint:#ffd889;--yellow:#ffe9a9;background:radial-gradient(ellipse at 82% 0%,#536d9b,#263757 72%)}
.fox-page .site-header,.fox-page .scorebar,.fox-page .controlbar{background:#314566}.fox-page .game-shell{border-color:#8399bc}.fox-page .overlay{background:#20314fcf}.fox-page .primary{background:#ffda8b;color:#574150;box-shadow:0 3px 0 #b68a69}.fox-page .icon-btn{background:#465d82;border-color:#7c90b1;color:#fff0b3}

.batch-card .card-scene{height:auto;aspect-ratio:3/2;overflow:hidden}
.batch-card .batch-card-art{display:block;width:100%;height:100%;object-fit:contain}
.batch-card .card-number,.batch-card .new-label{z-index:1}
.batch-card .card-number{color:#fff8e9;background:#173c4cdb;border:1px solid #ffffff40;border-radius:7px;padding:3px 7px;line-height:20px}
.frog-card .card-scene{background:radial-gradient(circle at 76% 16%,#e8ffc5,#68c6c2 40%,#3a8b98)}
.cat-card .card-scene{background:radial-gradient(circle at 74% 16%,#fff0bf,#e5a2a9 42%,#9b6377)}
.bee-card .card-scene{background:radial-gradient(circle at 74% 16%,#fff5b5,#f0afc9 42%,#a376a2)}
.fox-card .card-scene{background:radial-gradient(circle at 74% 16%,#fff4ba,#849ec8 43%,#435a8b)}
@media(max-width:760px){
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .arcade-layout{display:block}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .game-shell{width:min(100%,calc((100svh - 220px)*.8));min-width:min(100%,280px)}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .scorebar{height:64px;padding:6px 9px;gap:6px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .live-score strong{font-size:24px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .live-score .unit{display:none}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .game-tools .icon-btn:first-child{min-width:44px;width:44px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .game-tools .pause-btn{min-width:40px;width:40px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .stage-label{min-width:42px;max-width:45px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .stage-label>span{font-size:10.5px;white-space:normal;text-align:center}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .stage-label strong{font-size:19px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .mascot-badge{width:94px;height:94px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .overlay h1{font-size:23px;margin:4px 0 7px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .start-tag{font-size:14px;margin-bottom:11px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .mini-instructions{font-size:13px;margin-bottom:13px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .controlbar p{font-size:13px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .side-panel{margin-top:24px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .intro h2{font-size:26px}
}
@media(max-height:700px) and (max-width:760px){
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .mascot-badge{width:78px;height:78px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .overlay h1{font-size:20px}
 :is(.frog-page,.cat-page,.bee-page,.fox-page) .result-time strong{font-size:36px}
}
