/* PyC Fútbol: separate artwork and usable, translated controls. */
#start-screen.pyc-start{display:grid;place-items:center;position:relative;isolation:isolate;min-height:100vh;min-height:100svh;padding:max(24px,env(safe-area-inset-top)) max(4vw,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(4vw,env(safe-area-inset-left));background:#07101c url('assets/pyc-stadium.webp') center bottom/cover no-repeat;color:#fff2cc;overflow:hidden}
#start-screen.pyc-start::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#030b1822,#03091530 55%,#02080b11);pointer-events:none}
.pyc-start-layout{width:min(1480px,100%);min-height:calc(100svh - 48px);display:grid;grid-template-columns:minmax(0,1.35fr) minmax(270px,1fr);grid-template-rows:1fr auto;align-items:center;gap:24px clamp(24px,5vw,90px)}
.pyc-start-logo{margin:0;line-height:0;align-self:center;min-width:0}
.pyc-start-logo img{display:block;width:100%;height:auto;max-height:65svh;object-fit:contain;filter:drop-shadow(0 6px 10px #0008)}
.pyc-start-menu{width:100%;max-width:540px;justify-self:center}
#start-screen .pyc-menu-actions{display:grid;gap:clamp(12px,2.2vh,23px);width:100%}
#start-screen .pyc-menu-button{position:relative;display:flex;align-items:center;justify-content:center;min-width:0;max-width:none;width:100%;min-height:64px;padding:15px 16px 15px 40px;border:2px solid #e5c87f;border-radius:0;background:linear-gradient(#080d12f5,#03070cf5);box-shadow:inset 0 0 0 2px #5f4a26,0 4px 12px #0008;color:#fff5d9;font-family:'Courier New',monospace;font-size:clamp(15px,1.7vw,25px);font-weight:700;line-height:1.2;letter-spacing:.06em;text-align:center;text-transform:uppercase;text-shadow:1px 2px #000;transition:background .15s,box-shadow .15s}
#start-screen .pyc-menu-button::before{content:'';position:absolute;left:18px;width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:11px solid #f32d32}
#start-screen .pyc-menu-primary{background:linear-gradient(#91090e,#580005)}
#start-screen .pyc-menu-primary::before{border-left-color:#fff5d9}
#start-screen .pyc-menu-button:hover,#start-screen .pyc-menu-button:focus-visible{background:linear-gradient(#9d1016,#65050b);filter:none;transform:none;box-shadow:inset 0 0 0 2px #6f5328,0 0 18px #e4b65b66}
#start-screen .pyc-menu-button:focus-visible{outline:3px solid #fff4c4;outline-offset:5px}
#start-screen .pyc-language{display:flex;margin:18px 0 0;gap:10px;color:#ffedbe;text-shadow:1px 2px #000;font-size:12px}
#start-screen .pyc-language select{max-width:none;width:auto;min-width:120px;border:1px solid #cbb277;border-radius:2px;background:#080e18e8;color:#fff2d0;padding:7px 12px;min-height:36px}
.pyc-start-publisher{grid-column:1/-1;justify-self:end;display:flex;align-items:center;gap:14px;font-size:14px;font-weight:bold;text-shadow:1px 2px 3px #000}
.pyc-start-publisher a{display:block;border-radius:50%;line-height:0;flex-shrink:0}
.pyc-start-publisher img{display:block;width:clamp(72px,11svh,125px);height:auto;aspect-ratio:1;object-fit:contain;border-radius:50%;filter:drop-shadow(0 3px 5px #000b)}
.game-header .wordmark{width:160px;height:88px;max-width:100%;overflow:visible}
.game-header .wordmark img{width:100%;height:100%;object-fit:contain;object-position:left center}
@media(orientation:portrait),(max-width:640px) and (min-height:600px){
 #start-screen.pyc-start{padding:max(20px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left));background-position:center bottom}
 .pyc-start-layout{grid-template-columns:1fr;grid-template-rows:auto auto 1fr;align-content:start;width:min(520px,100%);min-height:calc(100svh - 40px);gap:clamp(22px,4svh,48px)}
 .pyc-start-logo{width:100%;margin:clamp(8px,3svh,32px) auto 0}
 .pyc-start-logo img{max-height:34svh;width:100%;object-fit:contain}
 .pyc-start-menu{width:100%;max-width:420px}
 #start-screen .pyc-menu-actions{gap:14px}
 #start-screen .pyc-menu-button{min-height:58px;font-size:clamp(14px,4.2vw,22px);padding:15px 12px 15px 32px;letter-spacing:.03em}
 #start-screen .pyc-menu-button::before{left:12px;border-top-width:7px;border-bottom-width:7px;border-left-width:9px}
 #start-screen .pyc-language{margin-top:14px}
 .pyc-start-publisher{grid-column:1;justify-self:center;align-self:end;flex-direction:column;gap:8px;font-size:12px;padding-top:10px}
 .pyc-start-publisher img{width:clamp(74px,12svh,115px)}
}
@media(max-width:760px){.game-header .wordmark{width:115px;height:64px}.game-header .publisher{max-width:150px}}
@media(max-height:500px) and (orientation:landscape){
 #start-screen.pyc-start{padding:14px 4vw}
 .pyc-start-layout{min-height:calc(100svh - 28px);grid-template-columns:minmax(0,1.15fr) minmax(250px,1fr);grid-template-rows:1fr auto;gap:8px 5vw}
 .pyc-start-logo img{max-height:66svh}
 #start-screen .pyc-menu-actions{gap:10px}
 #start-screen .pyc-menu-button{min-height:46px;padding-top:10px;padding-bottom:10px;font-size:15px}
 #start-screen .pyc-language{margin-top:9px;font-size:11px}
 #start-screen .pyc-language select{min-height:30px;padding:4px 8px}
 .pyc-start-publisher{gap:8px;font-size:10px}
 .pyc-start-publisher img{width:48px}
}
@media(prefers-reduced-motion:reduce){#start-screen *,#start-screen *::before{animation:none!important;transition:none!important}}
/* Full-width menu tracks; compact portrait keeps controls above the fold. */
#start-screen .pyc-menu-actions{grid-template-columns:minmax(0,1fr);justify-content:stretch}
@media(orientation:portrait) and (max-height:650px){
 #start-screen.pyc-start{padding-top:max(12px,env(safe-area-inset-top));padding-bottom:max(12px,env(safe-area-inset-bottom))}
 .pyc-start-layout{min-height:calc(100svh - 24px);gap:12px}
 .pyc-start-logo{margin-top:0}
 .pyc-start-logo img{max-height:28svh}
 #start-screen .pyc-menu-actions{gap:10px}
 #start-screen .pyc-menu-button{min-height:48px;padding-top:10px;padding-bottom:10px}
 #start-screen .pyc-language{margin-top:10px}
 .pyc-start-publisher{padding-top:0;gap:5px;font-size:10px}
 .pyc-start-publisher img{width:64px}
}

/* Collapsible main menu options, matching the original menu controls. */
#start-screen .pyc-options{margin-top:14px;width:100%;min-width:0}
#start-screen .pyc-options>summary{cursor:pointer;list-style:none;box-sizing:border-box}
#start-screen .pyc-options>summary::-webkit-details-marker{display:none}
#start-screen .pyc-options[open]>summary::before{transform:rotate(90deg)}
#start-screen .pyc-options-body{padding:12px;border:2px solid #cbb277;border-top:0;background:#050b14eb;color:#fff2d0}
#start-screen .pyc-language{margin:0 0 12px;align-items:center;flex-wrap:wrap;justify-content:center}
#start-screen .pyc-language-flags{display:flex;gap:6px;flex-wrap:wrap}
#start-screen .pyc-language-flags button,#start-screen .pyc-audio-controls button{border:2px solid #cbb277;border-radius:0;background:linear-gradient(#172437,#060b13);box-shadow:inset 0 0 0 1px #5f4a26;color:#fff2d0;font-family:'Courier New',monospace;font-weight:bold;min-height:42px;padding:6px 10px}
#start-screen .pyc-language-flags button{font-size:23px;min-width:42px}
#start-screen .pyc-language-flags button[aria-pressed=true],#start-screen .pyc-audio-controls button[aria-pressed=true]{background:linear-gradient(#9d1016,#65050b);border-color:#ffdf8b}
#start-screen .pyc-audio-controls{color:#fff2d0;border:0;border-radius:0;padding:0}
#start-screen .intro-audio-settings{margin:0}
#start-screen .pyc-options button:focus-visible{outline:3px solid #fff4c4;outline-offset:2px}

/* Sound controls centered inside Options, without an offset inner background. */
#start-screen .pyc-options .intro-audio-settings{width:100%;max-width:360px;margin:0 auto;box-sizing:border-box}
#start-screen .pyc-options .pyc-audio-controls{width:100%;box-sizing:border-box;background:transparent;margin:0 auto;padding:0;border:0;text-align:center}
#start-screen .pyc-options .pyc-audio-controls legend{float:none;width:100%;box-sizing:border-box;text-align:center;padding:0;margin-bottom:6px}
#start-screen .pyc-options .pyc-audio-controls>div{justify-content:center}
#start-screen .pyc-options .pyc-audio-controls label{justify-content:center}

/* Multiplayer stays visible while its public launch is pending. */
#start-screen .pyc-friends-coming{display:flex;flex-direction:column;gap:5px;width:100%;min-width:0}
#start-screen .pyc-coming-label{text-align:center;color:#ffdf8b;font:700 13px 'Courier New',monospace;letter-spacing:2px;text-transform:uppercase}
#start-screen #friends-open:disabled{opacity:.5;cursor:not-allowed;filter:grayscale(.65);transform:none;pointer-events:none}
