@font-face{font-family:FanRound;src:url(assets/ui-font.woff2?v=0811482ec4a2) format("woff2");font-weight:800;font-display:block}
600;800;900&display=swap');
:root{color-scheme:dark;--pink:#ff69bc;--own:#b388ff}*{box-sizing:border-box}body{margin:0;background:#100d20;color:#fff4fc;font-family:'Noto Sans JP',sans-serif;background-image:radial-gradient(ellipse at 20% 10%,#43234e66,transparent 50%),radial-gradient(ellipse at 90% 80%,#273d6b55,transparent 50%)}main{max-width:520px;margin:auto;padding:20px 18px 24px}header{display:flex;justify-content:space-between;align-items:center}.tag{font-size:10px;font-weight:800;letter-spacing:2px;color:#f5abd3}button{font:inherit;cursor:pointer;touch-action:manipulation;color:inherit;border:1px solid #ffffff25;background:#ffffff08;border-radius:12px}button:focus-visible{outline:3px solid #fff;outline-offset:3px}#sound{font-size:10px;padding:7px 12px}h1{font-weight:900;font-size:35px;letter-spacing:-2px;line-height:1.12;margin:16px 0 20px;text-align:center}h1 span{color:#ff8acb}h1 i{display:block;font-size:11px;font-style:normal;letter-spacing:3px;margin-top:10px;color:#ebd6eb}.hud{display:flex;align-items:center;justify-content:space-between;padding:0 4px}.hud small{display:block;font-size:9px;letter-spacing:2px;color:#b4a3c6}.hud strong{font-size:35px;letter-spacing:1px}.clock{text-align:right}.clock strong{font-size:28px}.identity{display:flex;justify-content:space-between;padding:12px 10px;margin:12px 0 0;background:#282039;border:1px solid #ffffff18;border-radius:12px 12px 0 0;font-size:12px;font-weight:800}#identity{color:var(--own)}#combo{color:#ffd98c}.arena{position:relative;height:420px;overflow:hidden;border:1px solid #ffffff18;border-radius:0 0 16px 16px;background:#0a0b20}canvas{display:block;width:100%;height:100%;touch-action:none}#overlay{position:absolute;inset:0;background:linear-gradient(#141029ed,#1f1436f5);display:flex;align-items:center;flex-direction:column;justify-content:center;text-align:center;padding:20px}h2{font-size:24px;line-height:1.6;letter-spacing:1px;margin:12px 0}#intro{font-size:15px;font-weight:800;margin:0 0 14px;color:var(--own)}.instructions{font-size:12px;line-height:1.9;display:grid;gap:4px}.instructions span{color:#c2b2cb;font-size:11px;margin-top:5px}.primary{background:#ff83c6;color:#29152e;border:0;box-shadow:0 4px 0 #a6447d;font-weight:900;padding:14px 24px;margin:19px 0 12px;width:100%}#overlay>small{color:#a998b7;font-size:10px}.status{text-align:center;height:34px;padding:9px 0;font-size:11px;color:#e8bfdb}nav{display:flex;gap:8px}nav button{width:33.333%;padding:10px 4px 7px;font-size:13px;font-weight:800;transition:background .15s,border .15s}nav button span{display:block;font-size:28px;line-height:1.3}nav small{display:block;font-size:8px;letter-spacing:1px;color:#a594b6;margin-top:4px}nav .selected{background:#58324e;border:2px solid #ff8acb;box-shadow:0 0 20px #f76cb322}footer{text-align:center;font-size:9px;line-height:1.9;color:#a494b1;margin:14px 0 0}dialog{width:min(420px,90vw);background:#241931;border:1px solid #d98abc88;color:#fff4fc;border-radius:22px;text-align:center;padding:28px}dialog::backdrop{background:#0a071bd9;backdrop-filter:blur(5px)}dialog h2{color:#ff99d1;font-size:26px}dialog p{font-size:12px;color:#bba9c8}#finalScore{display:block;font-size:54px}#stats{font-size:13px;line-height:2;margin-top:12px}#share{padding:12px;width:100%}@media(max-height:800px){main{padding-top:12px}h1{font-size:29px;margin:10px 0 12px}.arena{height:365px}.hud strong{font-size:29px}h2{font-size:21px}#overlay{padding:14px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Guided backstage, compact controls, and collectible live report. */
[hidden]{display:none!important}.tools{display:flex;gap:6px}.tools button{font-size:10px;padding:7px 9px}button:disabled{opacity:.35;cursor:default}.arena{height:430px}#overlay{padding:16px;background:linear-gradient(145deg,#18132cf8,#261935f7)}#guide,#ready{width:100%}#guide h2{font-size:17px;letter-spacing:0;margin:8px 0 12px}.guide-cards{display:grid;gap:7px}.guide-card{display:flex;align-items:center;gap:12px;text-align:left;border:1px solid #ffffff15;border-radius:13px;padding:8px 12px;background:#ffffff06;min-height:66px}.guide-card b{font-size:12px;color:#f8bfde}.guide-card p{font-size:11px;line-height:1.6;margin:3px 0 0;color:#d1bfd9}.prop{width:52px;height:52px;position:relative;flex-shrink:0;--prop:#56b6ff}.pen i{position:absolute;left:23px;top:3px;width:11px;height:36px;background:var(--prop);box-shadow:0 0 17px var(--prop);border:2px solid #ffffff70;border-radius:5px;transform:rotate(-18deg)}.pen i:after{content:'';position:absolute;left:1px;top:33px;width:6px;height:13px;background:#ede8f7;border-radius:0 0 3px 3px}.fan:before{content:'';position:absolute;left:24px;top:31px;width:6px;height:21px;background:#e7dceb}.fan i{display:flex;justify-content:center;align-items:center;position:absolute;inset:0 1px 9px;background:#fff1fb;color:#3b2443;border:3px solid var(--prop);border-radius:50%;font-size:10px;font-style:normal;font-weight:900;text-align:center;line-height:1.2}.tap-icon{width:52px;flex-shrink:0;font-size:30px;text-align:center;position:relative}.tap-icon span{position:absolute;right:0;top:-4px;color:#ff8acb;font-size:22px}.rule-note{font-size:10px;line-height:1.7;color:#bda7c8;margin:10px 0 0}.primary{margin:13px 0 8px;padding:12px 16px}.status{font-size:10px}nav button{display:flex;justify-content:center;align-items:center;gap:7px;padding:9px 4px;min-height:48px;font-size:12px}nav button span{display:inline;font-size:23px}footer{font-size:9px;margin-top:9px}#ready{text-align:center}#ready>p{font-size:13px;color:#d5c3df;margin:12px 0}#readyName{font-size:46px;letter-spacing:6px;margin:0;color:var(--own)}#readyColor{display:inline-block;background:#ffffff0b;border:1px solid var(--own);border-radius:30px;padding:7px 22px;color:var(--own);font-size:18px;font-weight:900}.ready-props{display:flex;justify-content:center;gap:20px;margin:22px 0}.ready-props .prop{transform:scale(1.4);--prop:var(--own)}#ready>small{font-size:11px;color:#bfa8cd}dialog{max-height:90dvh;overflow:auto;padding:22px;background:linear-gradient(145deg,#30203c,#1a172d)}.secondary{width:100%;padding:12px}.text-button{border:0;background:transparent;padding:12px;font-size:11px;color:#d1b9df}.result-ticket{position:relative;padding:6px 0 12px;border-bottom:2px dashed #b59bc548;background:radial-gradient(ellipse at 50% 22%,#bf79ae22,transparent 60%)}.medal{font-size:45px;color:#ffe2a1;text-shadow:0 0 30px #ffd78177;line-height:1.4}#rankLetter{font-size:11px;letter-spacing:4px;color:#ffe2a1;font-weight:900}#result h2{font-size:24px;margin:7px 0;letter-spacing:0}#resultIdentity{margin:5px}.score-ticket{margin:15px 0;border-top:1px solid #ffffff15;border-bottom:1px solid #ffffff15;padding:12px}.score-ticket small{font-size:11px;color:#c9b3d8}.score-ticket span{font-size:8px;letter-spacing:4px;color:#bb9fc9}#finalScore{font-size:49px;line-height:1.3}.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px!important}.stat-grid>div{padding:8px;background:#ffffff06;border:1px solid #ffffff0b;border-radius:9px}.stat-grid small{display:block;color:#c9b1d7;font-size:10px}.stat-grid strong{font-size:20px;display:block}#best{font-size:10px!important;letter-spacing:1px;color:#ffe0a1!important}#rankMessage{line-height:1.7;font-size:11px!important}details{text-align:left;margin-top:12px;color:#cdb7d9;font-size:10px;line-height:1.8}summary{cursor:pointer;font-size:11px;color:#f5bcdb}details ul{list-style:none;padding:0}details small{font-size:9px}#shareStatus:empty{display:none}@media(max-height:800px){main{padding:10px 14px 16px}h1{font-size:27px;margin:9px 0 12px}.arena{height:393px}.guide-card{min-height:58px;padding:5px 9px}.guide-cards{gap:6px}#overlay{padding:12px}#guide h2{font-size:15px;margin:7px 0 9px}.rule-note{margin-top:7px}.hud strong{font-size:27px}.identity{margin-top:8px;padding:10px}.status{height:29px;padding:7px 0}header .tag{font-size:8px;letter-spacing:1px}}
#result{padding:18px}#result .medal{font-size:30px;line-height:1.15}#result .score-ticket{margin:10px 0;padding:8px}#result .stat-grid{margin-top:8px}#result .stat-grid>div{padding:5px}#result #rankMessage{margin:8px 0}#result .result-ticket{padding-bottom:8px}#rank:focus{outline:none}
/* One viewport: the playfield takes the space left by the controls. */
html,body{height:100%;overflow:hidden}main{height:100dvh;max-width:520px;display:flex;flex-direction:column;padding:max(8px,env(safe-area-inset-top)) 12px max(8px,env(safe-area-inset-bottom));gap:0}header{flex:none;min-height:30px}h1{flex:none;font-size:clamp(23px,4dvh,30px);margin:8px 0 12px}h1 i{font-size:10px;margin-top:6px;letter-spacing:2px}.hud{flex:none;height:48px}.hud strong,.clock strong{font-size:25px}.hud small{font-size:8px;letter-spacing:1px}.identity{flex:none;margin-top:6px;padding:8px 10px;font-size:11px}.arena{height:auto;min-height:0;flex:1;border-radius:0 0 14px 14px}.status{flex:none;height:26px;padding:6px 0;font-size:10px}nav{flex:none}nav button{min-height:46px;padding:7px 3px}footer{flex:none;font-size:9px;margin:7px 0 0;line-height:1.5}html[data-view=guide] .hud,html[data-view=guide] .identity,html[data-view=ready] .hud,html[data-view=ready] .identity,html[data-view=guide] nav,html[data-view=guide] .status,html[data-view=ready] .status,html[data-view=guide] footer,html[data-view=ready] footer{display:none}html[data-view=guide] .arena,html[data-view=ready] .arena{border-radius:16px}html[data-view=guide] #pause,html[data-view=ready] #pause{display:none}#overlay{padding:clamp(10px,2dvh,20px)}#guide{max-width:420px}#guide h2{font-size:clamp(14px,2.4dvh,19px);margin:9px 0 15px}.guide-cards{gap:clamp(6px,1.4dvh,12px)}.guide-card{min-height:60px;padding:clamp(6px,1.3dvh,12px) 10px}.guide-card p{font-size:11px}.rule-note{margin:12px 0 0}.primary{min-height:44px}#guide .primary{margin:16px 0 5px}#readyName{font-size:clamp(32px,6dvh,46px)}.ready-props{margin:clamp(16px,3dvh,25px) 0}dialog{max-height:calc(100dvh - 24px);max-width:calc(100vw - 24px)}@media(max-height:650px){header .tag{font-size:7px}h1{margin:4px 0 8px;font-size:23px}h1 i{margin-top:4px;font-size:9px}.guide-card{min-height:54px;padding:4px 9px}.guide-cards{gap:5px}#guide h2{margin:5px 0 8px}.rule-note{margin-top:7px;font-size:9px}#guide .primary{margin-top:10px}.hud{height:39px}.hud strong,.clock strong{font-size:21px}.identity{padding:6px 8px;margin-top:3px}.status{height:23px;font-size:9px}footer{font-size:8px;margin-top:4px}#ready>p{margin:8px 0}#ready .primary{margin-top:12px}#readyColor{font-size:15px}.ready-props{margin:15px 0}}
html[data-view=ready] nav{margin-top:10px}

/* Keep gesture choices beside the audience at the top of the playfield. */
nav{margin:6px 0 8px}html[data-view=ready] nav{margin:0 0 10px}.identity{margin-top:0}#result h2{margin-top:15px}

nav button span{position:relative}.bang{font-size:11px;font-style:normal;position:absolute;right:-5px;top:-3px;color:#ffb6dc}.fan i{font-family:Arial,sans-serif}.guide-card .fan i{font-size:23px}

#result .special-title{display:inline-block;margin:4px 0 9px;padding:6px 12px;font-size:11px;font-weight:800;line-height:1.6;color:#ffe1a2;background:#e7b56b13;border:1px solid #e7b56b44;border-radius:20px}#result h2{font-size:clamp(19px,5vw,24px);overflow-wrap:anywhere}

.save-image{margin-bottom:7px;background:#ab629c24;border-color:#edacd180;font-weight:800}.image-preview{margin:5px 0 12px}.image-preview img{display:block;width:100%;height:auto;border-radius:9px;margin-top:8px}#imageStatus{font-size:10px;line-height:1.8}#imageStatus:empty{display:none}

nav button span canvas{width:28px;height:28px;display:block;background:#fff6ed;border-radius:50%}#artStatus{font-size:10px;color:#d0b6dc}#artStatus:empty{display:none}html[data-view=live] h1{font-size:20px;margin:3px 0 5px}html[data-view=live] h1 i{display:none}html[data-view=live] .hud{height:39px}html[data-view=live] .hud strong{font-size:23px}html[data-view=live] .arena{border-radius:0 0 14px 14px}
html[data-view=live] main{max-width:420px}html[data-view=live] h1{display:none}html[data-view=live] header{min-height:27px}html[data-view=live] .hud{height:36px}html[data-view=live] nav{margin:5px 0 6px}html[data-view=live] nav button{min-height:42px;padding:5px 3px}html[data-view=live] .identity{padding:6px 8px}html[data-view=live] footer{display:none}html[data-view=live] .status{height:22px;padding:4px 0}

nav button span canvas{background:transparent;border-radius:0;width:32px;height:32px}

.guide-card .fan i{display:flex;align-items:center;justify-content:center;font-size:0}.guide-card .fan i canvas{width:42px;height:42px;flex:none}.ready-props .fan i{font-family:FanRound,sans-serif;font-weight:800}

.rule-fans{width:64px;flex:none;display:flex;align-items:center;justify-content:center;gap:0}.rule-fans canvas{width:23px;height:27px;flex:none}.tap-icon{position:relative}.tap-icon canvas{position:absolute;width:25px;height:25px;right:-4px;top:0}.ready-props .fan i{color:#131312;-webkit-text-stroke:1px var(--own);paint-order:stroke fill}

.guide-pen,.tap-hand{width:48px;height:58px;flex:none;object-fit:contain}.requests-card{display:block!important;text-align:left}.requests-card .rule-fans{width:100%;display:flex;justify-content:space-evenly;margin-top:5px;gap:10px}.rule-fans>div{display:flex;align-items:center;gap:4px}.requests-card .rule-fans canvas{width:38px;height:38px}.rule-fans small{font-size:10px;font-weight:800;white-space:nowrap}.ready-props #readyPropArt{display:block;width:180px;height:100px;margin:auto}.guide-card{gap:9px}@media(max-width:360px){.rule-fans>div{flex-direction:column;gap:0}.requests-card .rule-fans canvas{width:36px;height:36px}.rule-fans small{font-size:9px}}@media(max-height:650px){.guide-pen,.tap-hand{height:44px;width:40px}.requests-card .rule-fans canvas{width:32px;height:32px}.requests-card .rule-fans{margin-top:2px}.guide-card p{font-size:10px}}

.ready-props #readyPropArt{width:220px;height:164px;max-width:100%;object-fit:contain}.ready-props{margin:12px 0}@media(max-height:650px){.ready-props #readyPropArt{width:174px;height:130px}.ready-props{margin:7px 0}}

/* Approved extra-bold round Gothic across every game screen. */
body,button,dialog{font-family:FanRound,sans-serif}body{font-weight:800}

#countdown{position:absolute;inset:0;z-index:3;display:flex;align-items:center;justify-content:center;pointer-events:none;background:#1d15214d}#countdownNumber{display:flex;align-items:center;justify-content:center;width:112px;height:112px;border-radius:50%;background:#fff8ef;color:#b94e7b;border:3px solid #e9a7c0;font-family:FanRound,sans-serif;font-size:70px;line-height:1;box-shadow:0 4px 0 #9b537a66}

/* Persistent, compact legal links; dialog copies remain clickable in modals. */
.legal-links{flex:none;text-align:center;font-family:FanRound,sans-serif;font-size:8px;font-weight:800;line-height:16px;letter-spacing:0;color:#b9aabd;white-space:nowrap;margin-top:4px}
.legal-links a{display:inline-block;color:inherit;text-decoration:none;padding:2px 1px}
.legal-links a:hover{text-decoration:underline}.legal-links a:focus-visible{outline:2px solid #ba82a8;outline-offset:2px;border-radius:3px}
#legalFooter{min-height:20px;margin-bottom:0}

/* Labels exist only during the frozen 3-2-1 introduction. */
.hud,nav{position:relative}
.coach-note{display:none;position:absolute;z-index:6;pointer-events:none;background:#fff8ef;color:#73475d;border:1.5px solid #e1a8c0;border-radius:8px;font-family:FanRound,sans-serif;font-size:9px;font-weight:800;line-height:1.5;padding:4px 7px;white-space:nowrap}
html[data-countdown="true"] .coach-note{display:block}
.coach-score{left:67px;top:9px}.coach-score:before{content:'←';position:absolute;right:calc(100% + 4px);top:1px;color:#ffd4e8;font-size:17px}
.coach-time{right:83px;top:9px}.coach-time:after{content:'→';position:absolute;left:calc(100% + 4px);top:1px;color:#ffd4e8;font-size:17px}
.coach-shots{left:50%;top:calc(100% + 9px);transform:translateX(-50%);font-size:10px;padding:5px 10px}
.coach-shots:before{content:'↑';position:absolute;left:50%;bottom:calc(100% - 2px);transform:translateX(-50%);color:#ffd4e8;font-size:19px}
html[data-countdown="true"] nav{z-index:5}
html[data-countdown="true"] nav button{outline:1.5px solid #f7c6db;outline-offset:1px}
@media(max-width:350px){.coach-score{left:55px;font-size:8px;padding:3px 5px}.coach-time{right:70px;font-size:8px;padding:3px 5px}}