.title-screen { transition: opacity .65s ease, filter .65s ease; }
.title-screen.leaving { opacity: 0 !important; filter: brightness(.2) blur(5px); }
.press-start.accepted { animation: accepted-flash .18s steps(2,end) infinite !important; color:#17101a; background:#fff0a8; pointer-events:none; }
@keyframes accepted-flash { 50% { opacity:.12; transform:translateX(-50%) scale(1.045); } }

#startScreen { background:radial-gradient(circle at 50% 25%,#4d286f 0,#19102d 48%,#080612 100%); }
#startScreen .select-panel { border:4px solid #120a1b; background:linear-gradient(135deg,#28113d,#15102a 55%,#34142e); box-shadow:10px 10px 0 #07040b,0 0 35px #d64c9144; }
#startScreen h2 { color:#fff2b0; text-shadow:4px 4px 0 #b53650,7px 7px 0 #17101a; }
#startScreen .fighter-card { border:4px solid #130a1a; box-shadow:5px 6px 0 #07040b; }
#startScreen .fighter-card[data-hero="boki"] { background:radial-gradient(circle at 50% 80%,#b9ef5c,#19854d 58%,#12352b); }
#startScreen .fighter-card[data-hero="rista"] { background:radial-gradient(circle at 50% 80%,#8ed9ff,#2770d0 58%,#172c65); }
#startScreen .fighter-card[data-hero="heroine"] { background:radial-gradient(circle at 50% 80%,#ffbd80,#d83f55 58%,#691c43); }
#startScreen .fighter-card::after { content:""; position:absolute; inset:0; pointer-events:none; background:repeating-linear-gradient(-35deg,#fff0 0 15px,#ffffff12 15px 17px); }
#startScreen .fighter-card.selected { border-color:#fff4a5; transform:translateY(-5px) rotate(-1deg); box-shadow:0 0 0 3px #17101a,7px 9px 0 #ffbd3d,0 0 24px #fff59b99; }
#startScreen .fighter-card strong { color:#fff6c8; background:#17101adf; border-block-color:#ffe075; text-shadow:3px 3px 0 #b52e4b; }
#startScreen .fighter-card strong,
#startScreen .fighter-card[data-hero="heroine"] strong { font-family:RumaPixel,monospace!important; font-style:normal!important; font-weight:900!important; }
#startScreen .fighter-stats { color:#fff8da; text-shadow:1px 2px 0 #160b1b; }
#startScreen .stars b { color:#ffe767; }
#startScreen .stars i { color:#35162f99; }
#startScreen .skin-chip { border-color:#ffcb60; background:#321844; }
#startScreen .skin-chip.active { color:#1c1120; background:#7dff82; border-color:#fff3a1; }
#startScreen .primary-button { color:#1b1020; background:linear-gradient(#fff078,#ff9f36); border-color:#fff4ae; box-shadow:5px 5px 0 #b52e4b; }

.street-card-v21 { position:absolute; z-index:7; left:50%; top:62px; transform:translate(-50%,-30px) rotate(-2deg); opacity:0; padding:10px 22px; border:5px solid #17101a; color:#17101a; background:#ffe16f; box-shadow:8px 8px 0 #d34250; font:900 21px RumaPixel; letter-spacing:.04em; pointer-events:none; }
.street-card-v21.show { animation:street-card 2.8s ease both; }
@keyframes street-card { 0%{opacity:0;transform:translate(-50%,-35px) rotate(-5deg) scale(.7)} 15%,78%{opacity:1;transform:translate(-50%,0) rotate(-2deg) scale(1)} 100%{opacity:0;transform:translate(-50%,8px) rotate(1deg) scale(1.05)} }

@media (pointer:coarse) and (orientation:landscape) {
  #startScreen .fighter-card { border-width:2px; }
  #startScreen .fighter-card.selected { transform:translateY(-2px); box-shadow:0 0 0 2px #17101a,4px 4px 0 #ffbd3d; }
  .street-card-v21 { top:40px; padding:7px 14px; font-size:14px; }
}