/* A self-contained comic selection layout. Gameplay sizing stays unchanged. */
.title-screen{background-image:url('../assets/60b8e09544a7c953a650.webp');background-position:center; padding-bottom:5%}
.title-screen:after{background:linear-gradient(transparent 72%,#100916bd),repeating-linear-gradient(0deg,#ffffff04 0 1px,transparent 1px 4px)}
.press-start{border:3px solid #170d19;background:#ffe39f;color:#241326;font-size:22px;box-shadow:6px 6px 0 #ed5a32;animation:none;letter-spacing:.14em}
.press-start:hover{background:#fff2d4;transform:translateY(-2px)}
#startScreen{padding:12px;background:radial-gradient(circle at 20% 10%,#593558bf,transparent 55%),#110d1bf5;backdrop-filter:none}
#startScreen .select-panel{width:min(850px,99%);padding:12px 24px 10px;border:3px solid #0b0811;background:radial-gradient(#4c3459 1px,transparent 1.5px) 0 0/7px 7px,#201528;box-shadow:9px 9px 0 #07050a;clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px)}
#startScreen .kicker{display:block;margin:0 0 4px;color:#ccb6c9;font:700 9px sans-serif;letter-spacing:.2em}
#startScreen h2{font-size:29px;line-height:1.1;letter-spacing:.02em;margin:0 0 10px}
#startScreen h2 span{color:#ffcf61}
#startScreen .fighter-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 12px}
#startScreen .fighter-card{display:block;height:285px;padding:0;border:3px solid #130c17;background:#e5d5b2;color:#24172a;clip-path:none;border-radius:3px;box-shadow:4px 5px 0 #09060e;transform:rotate(-1deg);transition:transform .15s,box-shadow .15s,border-color .15s;overflow:hidden}
#startScreen .fighter-card:nth-child(2){transform:rotate(1deg)}
#startScreen .fighter-card.selected{border-color:#ffb932;transform:translateY(-3px);box-shadow:0 0 0 2px #17101c,6px 8px 0 #d94836;background:#ffe3a1}
#startScreen .fighter-card:hover{transform:translateY(-3px)}
#startScreen .fighter-art{inset:0 0 auto;height:152px;background-repeat:no-repeat;background-size:auto 112%;background-position:calc(50% + 22px) bottom;filter:drop-shadow(5px 2px 0 #6e426130)}
#startScreen .fighter-card:before{content:"";position:absolute;left:0;right:0;top:0;height:150px;background:radial-gradient(#b5916238 1px,transparent 1.5px) 0 0/5px 5px,conic-gradient(from 10deg at 50% 100%,#f9edce 0deg 18deg,#dec199 18deg 36deg,#f9edce 36deg 54deg,#dec199 54deg 72deg,#f9edce 72deg 90deg,#dec199 90deg 108deg,#f9edce 108deg 126deg,#dec199 126deg 144deg,#f9edce 144deg 360deg)}
#startScreen .fighter-card strong,#startScreen .fighter-card[data-hero="heroine"] strong{display:block;position:absolute;top:145px;bottom:auto;left:0;right:0;padding:3px 0;text-align:center;font:900 italic 26px/1.1 'Barlow Condensed',sans-serif;letter-spacing:.07em;color:#fff0bd;background:#2c1834;border-block:2px solid #130c17;text-shadow:2px 2px 0 #0c0913}
.fighter-stats{position:absolute;left:12px;right:12px;top:184px;display:grid;gap:3px}
.stat-row{display:flex;align-items:center;justify-content:space-between;gap:4px;font:800 9px/1.35 sans-serif;letter-spacing:.025em}
.stars{display:flex;white-space:nowrap;font:16px/1 sans-serif;letter-spacing:1px}
.stars b{font-weight:400;color:#a23d26;text-shadow:0 1px #ffedb2}.stars i{font-style:normal;color:#a99a81}
.skin-row{display:flex;align-items:center;justify-content:center;gap:12px;color:#ebd7be;font:800 10px sans-serif;letter-spacing:.12em}
#skinChoices{display:flex;justify-content:center;gap:7px;flex-wrap:wrap}
.skin-chip{border:2px solid #736071;background:#21192c;color:#d9c7d7;padding:6px 14px;border-radius:3px;font:800 10px sans-serif;cursor:pointer}
.skin-chip.active{background:#ffe2a0;color:#25182c;border-color:#ffe2a0;box-shadow:3px 3px 0 #b24732}
#startScreen .intro{font:10px/1.2 sans-serif;color:#baa9bf;margin:7px auto 8px;max-width:none}
#startScreen .primary-button{padding:9px 35px;min-width:245px;font-size:15px;border:2px solid #291528;background:#ffcb65;box-shadow:4px 4px 0 #bd4535}
#startScreen .controls-copy{display:block;margin:7px 0 0;font:8px sans-serif;color:#b4a0b6;letter-spacing:.14em}
#startScreen button:focus-visible{outline:3px solid #fff7d5;outline-offset:3px}
@media(max-width:720px){
  .screen-wrap.choosing{min-height:550px}
  #startScreen{padding:8px 4px;align-items:start}
  #startScreen .select-panel{width:100%;padding:14px 7px}
  #startScreen h2{font-size:22px;margin-bottom:14px}
  #startScreen .fighter-grid{gap:7px;margin-bottom:17px}
  #startScreen .fighter-card{height:285px}
  #startScreen .fighter-art{height:130px;background-size:auto 110%;background-position:calc(50% + 18px) bottom}
  #startScreen .fighter-card:before{height:130px}
  #startScreen .fighter-card strong,#startScreen .fighter-card[data-hero="heroine"] strong{top:126px;font-size:20px}
  .fighter-stats{top:163px;left:3px;right:3px;gap:4px}
  .stat-row{display:grid;justify-content:center;justify-items:center;gap:1px;font-size:7px;line-height:1}
  .stars{font-size:11px;letter-spacing:1px}
  .skin-row{gap:7px;font-size:8px}
  .skin-chip{padding:6px 9px;font-size:9px}
  #startScreen .intro{font-size:9px;margin:9px auto}
  #startScreen .primary-button{min-width:220px;padding:9px 20px}
  .press-start{font-size:12px;padding:7px 15px;box-shadow:3px 3px 0 #ed5a32}
}

.mini-boki.rista{background-size:contain;background-position:center;background-repeat:no-repeat}
@media(min-width:721px) and (max-width:950px){.screen-wrap.choosing{min-height:500px}}