/* Layered start menu, real DOM controls, touch targets, small-phone safe area. */
@font-face{font-family:WallRushKR;src:url('assets/fonts/WallRush313Subset.woff2') format('woff2');font-weight:400;font-display:swap}html,body,button,input{font-family:WallRushKR,system-ui,sans-serif}.titleK{font-family:WallRushKR,serif}
#grain{opacity:.04}#menu{padding:calc(14px + env(safe-area-inset-top)) 20px calc(42px + env(safe-area-inset-bottom));background:linear-gradient(#11132d33,#101c3830 45%,#111a32e8);gap:10px;overflow-y:auto;touch-action:pan-y;justify-content:space-evenly}
.menuTop{margin:0;flex:none}.eyebrow{font-size:9px;letter-spacing:.23em;color:#ffe4ac}.titleK{font-size:clamp(44px,12vw,66px);line-height:1;color:#ffe5a6;text-shadow:0 3px #a45632,0 5px #39293e}.titleE{font-size:clamp(26px,8vw,38px);letter-spacing:-.02em;color:#fff0cd;line-height:1.2}.titleE em{color:#ff9164}.slogan{font-size:10px;margin-top:6px;color:#fff0d4}
.heroWrap{width:100%;max-width:370px;flex:1;min-height:125px;max-height:220px;isolation:isolate}.heroWrap:before{width:145px;height:145px;border-color:#ffe8b36b;box-shadow:0 0 50px #ffdb6b38,0 0 0 14px #ffe8b30b}.heroWrap img{animation:none;transform:none;image-rendering:auto;filter:drop-shadow(0 7px 5px #0c163977);object-fit:contain;position:absolute;height:auto;max-height:none}.heroWrap #heroImg{width:44%;left:28%;bottom:0;z-index:3}.heroWrap .hero-side{width:37%;bottom:10%;z-index:2}.heroWrap .hero-woochi{left:0;transform:rotate(-9deg)}.heroWrap .hero-sonogong{right:0;transform:rotate(9deg)}.heroFx{display:none}
.menuActions{width:min(100%,350px);gap:8px;flex:none}.goldBtn{background:linear-gradient(#f99164,#b9393b);border:2px solid #ffe1a2;color:#fff1c9;box-shadow:0 4px #6d3540,0 7px 18px #0003;text-shadow:0 2px #7b3641;border-radius:14px;min-height:51px;font-size:18px}.glassBtn,.commandBtn{background:linear-gradient(#f9e4b9,#dba974);color:#3e2e35;border:2px solid #8b593f;box-shadow:0 2px #382c39;border-radius:11px;min-height:44px;font-size:12px}.smallActions{gap:8px}.chooseTitle{font-size:11px;margin-top:3px}.chooseTitle span{font-size:8px}.characterPick{gap:5px;grid-template-columns:repeat(4,minmax(0,1fr))}.characterCard{background:#122e44c9;border:1.5px solid #b9c6d04a;min-height:76px;padding:4px 2px;border-radius:11px;gap:0}.characterCard img{width:54px;height:49px;image-rendering:auto}.characterCard small{display:none}.characterCard strong{font-size:11px!important}.characterCard.selected{border-color:#ffe5a3;background:#516566db;box-shadow:0 0 13px #ffd38233}.characterCard.secret{min-height:46px;gap:8px}.picked,.bestline{font-size:10px}.bestline{margin:0}.minitext{font-size:9px;padding:0}.menu-characters{width:100%;display:contents}.characterPick.highlight{outline:2px solid #ffdda4;outline-offset:4px;border-radius:12px}#assetStatus{text-align:center;min-height:12px;font-size:9px;color:#e4dacb}.soundBtn{right:12px;bottom:calc(9px + env(safe-area-inset-bottom));min-height:30px;padding:5px 13px;background:#172c43ec;font-size:11px}.rankPanel{max-height:87dvh}.panel{max-height:88dvh;overflow:auto;touch-action:pan-y}.rankNameInput{user-select:text;-webkit-user-select:text}.characterFocus{font-weight:800}
.smallActions{display:grid;grid-template-columns:1.3fr 1fr 1fr 36px 30px}.smallActions .glassBtn{padding:4px 1px;font-size:11px}.smallActions .commandBtn{padding:4px 1px;font-size:17px}
@media(max-height:700px){#menu{gap:6px;padding-top:10px;padding-bottom:38px}.titleK{font-size:40px}.titleE{font-size:25px}.heroWrap{min-height:99px;max-height:145px}.heroWrap:before{width:94px;height:94px}.heroWrap #heroImg{width:38%;left:31%}.heroWrap .hero-side{width:32%}.heroWrap .hero-woochi{left:5%}.heroWrap .hero-sonogong{right:5%}.menuActions{gap:5px}.characterCard{min-height:62px}.characterCard img{height:38px;width:42px}.goldBtn{min-height:44px;font-size:16px}.glassBtn,.commandBtn{min-height:40px}.slogan{font-size:9px}.eyebrow{font-size:8px}.characterCard.secret{min-height:37px}.characterCard.secret img{height:29px}.minitext{display:none}}
@media(max-height:570px){#menu{justify-content:flex-start}.heroWrap{flex:none;height:96px}.menuTop .slogan{display:none}.titleK{font-size:32px}.titleE{font-size:22px}.menuActions{gap:4px}.characterCard{min-height:57px}.characterCard img{height:32px}.picked,.bestline{font-size:9px}.chooseTitle{margin:0}}