/* Prevent iOS text selection, callouts, image dragging, and hold-to-highlight. */
html,body,body *{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent}
html,body{touch-action:manipulation}button,canvas,#joystick{touch-action:none}img{-webkit-user-drag:none;pointer-events:none}
.festival-logo{display:block;width:min(100%,460px);height:auto;margin:0 auto 22px;mix-blend-mode:screen}
.screen{background:linear-gradient(180deg,#080b10ef,#080b10df);padding:24px 6vw max(24px,env(safe-area-inset-bottom))}
#menu{max-width:none}.menu-summary{display:flex;justify-content:space-between;color:#c5c1b7;max-width:460px;margin:0 auto 18px;font-size:11px;letter-spacing:1px}.menu-summary b{color:#e9c98e}
#characters{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:460px;margin:auto}
.character-card{padding:0;border:1px solid #ffffff22;background:#12171f;overflow:hidden;text-align:left;border-radius:3px}
.character-card[aria-pressed=true]{border-color:#efc785;box-shadow:0 0 0 1px #efc785}
.character-card img{display:block;width:100%;height:clamp(72px,15vh,115px);object-fit:cover;object-position:50% 5%;opacity:.72}
.character-card[aria-pressed=true] img{opacity:1}.character-card span{display:block;font-size:9px;letter-spacing:.6px;padding:9px 5px;color:#f2eee7}
#characterStatus{font-size:10px;min-height:14px;line-height:1.4;text-align:center;color:#b7bfc8;max-width:460px;margin:10px auto}
.view-picker{display:flex;max-width:460px;gap:8px;margin:12px auto}.view-picker button{width:50%;padding:12px 8px;background:#111720;border:1px solid #ffffff22;font-size:10px;letter-spacing:1px}.view-picker button[aria-pressed=true]{background:#26313a;border-color:#8b9aab}.view-picker button:disabled{opacity:.35}
#menu>.primary,#menu>.secondary{max-width:460px;margin:10px auto;padding:16px;text-align:center}
#menu>.field{max-width:460px;margin:14px auto 8px}.settings{max-width:460px;margin:18px auto;color:#bfc3c9;font-size:11px}.settings summary{cursor:pointer;list-style:none;padding:12px 0;border-bottom:1px solid #ffffff20;letter-spacing:1px}.settings summary:after{content:"+";float:right}.settings[open] summary:after{content:"−"}.settings small{line-height:1.6;font-size:10px}
.instructions,footer{margin:16px auto;text-align:center;max-width:460px}footer{font-size:9px;color:#79838e}
#pause{font-size:9px;padding:13px 9px;letter-spacing:1px}#reloadButton{font-size:8px;letter-spacing:.5px;width:48px;height:48px}
#damageArrow{width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-top:16px solid #e76349}
#lookHint{display:none}#buyHud{width:auto;left:50%;transform:translateX(-50%);min-width:200px;max-width:88%;background:#1b1c20dd;border-color:#8e7952;font-size:9px}
#scoreForm{width:min(100%,440px);margin:16px 0 0;text-align:left}#scoreForm>label{font-size:10px;letter-spacing:1.4px}.handle-entry{display:flex;align-items:center;gap:8px;margin:8px 0;border:1px solid #ffffff35;background:#111923;padding:8px}.handle-entry>span{color:#acb7c3}.handle-entry input{width:100%;min-width:0;background:transparent;border:0;color:#fff;font-size:16px;padding:6px 0;outline:none}.handle-entry button{font-size:10px;background:#e0be7e;color:#101319;border:0;padding:13px 10px}.handle-entry:focus-within{border-color:#e0be7e}#scoreForm small{font-size:10px;line-height:1.5;color:#9ba8b5}#submitStatus{font-size:12px;min-height:18px;max-width:440px}
#leaderboard{z-index:7}#leaderboard h2,#leaderboard p,#leaderboard small,#closeBoard{max-width:460px;margin:15px auto;display:block}#leaderboard h2{font-size:28px}#leaderboard p,#leaderboard small{font-size:11px;color:#aeb6bf}#boardList{max-width:460px;margin:20px auto;padding:0;list-style:none}#boardList li{display:grid;grid-template-columns:28px 1fr auto;gap:10px;padding:16px 0;border-bottom:1px solid #ffffff20;font-size:12px}#boardList strong{color:#edc98d}#boardList span{overflow-wrap:anywhere}#boardList small{font-size:9px!important;display:inline;margin:0!important;color:#8894a2}
#boxCanvas{width:min(100%,520px);height:240px;touch-action:none}.centered .festival-logo{max-width:260px}.centered .career{margin:10px 0;padding:12px}.centered .primary,.centered .secondary{padding:14px;margin:7px 0}
@media(max-height:740px){.screen{padding-top:18px}.festival-logo{max-width:320px;margin-bottom:14px}.character-card img{height:75px}.character-card span{font-size:8px;padding:7px 5px}.menu-summary{margin-bottom:12px}.view-picker button{padding:10px}.centered h2{font-size:30px}.centered #resultStats{margin:14px 0}.centered #scoreForm{margin-top:10px}#boxCanvas{height:200px}}
@media(min-width:800px){#menu{display:block;padding:28px 7vw;background:linear-gradient(90deg,#080b10fa,#080b10a0)}#menu>*{margin-left:0!important;margin-right:0!important}#characters{max-width:460px}.screen.centered{padding:30px}.character-card img{height:95px}}
.perspective-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;width:min(100%,540px);margin:16px 0}.perspective-options button{padding:0 0 18px;overflow:hidden;border:1px solid #ffffff36;background:#121b23;text-align:center;border-radius:5px}.perspective-options button:hover,.perspective-options button:focus-visible{border-color:#e9bd78;background:#27303a}.perspective-options canvas{display:block;width:100%;aspect-ratio:260/340;height:auto;background:#11161d;pointer-events:none}.perspective-options strong{display:block;font-size:11px;letter-spacing:1px;padding:16px 4px 8px}.perspective-options small{display:block;font-size:10px;color:#abb6c1;padding:0 8px;line-height:1.5}#perspective h2{font-size:24px;letter-spacing:2px}#perspectiveStatus{font-size:11px;color:#b7b4aa;max-width:440px}#perspective .festival-logo{max-width:240px}#toggleView{position:absolute;right:20px;top:68px;padding:10px;border:1px solid #ffffff33;background:#111923cc;font-size:9px;color:#f1eee5}#swapWeapon{display:block;margin:6px 0 6px auto;padding:8px 12px;font-size:9px;letter-spacing:1px;border:1px solid #ffffff44;background:#15212acc;pointer-events:auto}.weaponInfo{pointer-events:none}#swapWeapon:disabled{display:none}#pauseView,#pauseWeapon{font-size:10px}.character-card .portrait-sprite{display:block;width:100%;height:clamp(90px,16vh,145px);background-repeat:no-repeat;background-size:200% 100%;background-position:0 0;transform-origin:50% 90%;transition:filter .2s;filter:saturate(.8)}.character-card:hover .portrait-sprite,.character-card.emoting .portrait-sprite{background-position:100% 0;filter:saturate(1.1);animation:djGreeting .7s ease-out}.character-card[aria-pressed=true] .portrait-sprite{filter:saturate(1.05)}@keyframes djGreeting{0%{transform:translateY(0)}35%{transform:translateY(-4px) rotate(-1deg)}70%{transform:translateY(0) rotate(1deg)}100%{transform:none}}@media(prefers-reduced-motion:reduce){.character-card .portrait-sprite{animation:none!important;transition:none!important}}@media(max-height:740px){.character-card .portrait-sprite{height:88px}.perspective-options canvas{max-height:220px;object-fit:cover}#perspective .festival-logo{max-width:160px;margin-bottom:8px}#perspective h2{font-size:20px}}
.character-card .portrait-sprite{padding:0;margin:0} .view-picker{display:none} .centered{justify-content:safe center}
.character-card .portrait-sprite{height:auto;aspect-ratio:1;background-size:200% auto;background-position-y:top}