/* Full-screen title menu; artwork and outbound URL belong to the game package. */
.start-screen {
 position:fixed;inset:0;display:grid;grid-template-columns:minmax(0,1fr);place-items:center;
 z-index:100;isolation:isolate;padding:clamp(20px,5vw,72px);overflow:hidden;
 background:#101b17;backdrop-filter:none;color:#fff2d4;
}
.start-background {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
#end-screen {overflow:auto}
#end-card {margin:auto}
#end-title:focus {outline:none}
#end-screen .end-actions {width:min(700px,100%);grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#end-screen .end-actions > * {padding:0 22px;font-size:clamp(18px,2vw,23px)}
@media(max-width:600px) {
 #end-screen {padding:14px}
 #end-screen .end-actions {grid-template-columns:1fr;gap:4px;width:min(300px,100%)}
 #end-screen #end-text {font-size:15px;line-height:1.5;margin-bottom:14px}
}
.start-screen::before {content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#071612d9,#07161277 65%,#07161233),linear-gradient(0deg,#06110bd9,transparent 50%,#06110b44)}
.start-home {width:min(100%,1050px);text-align:center;text-shadow:0 3px 18px #000b}
.start-home .start-pretitle {font:italic clamp(15px,2vw,23px)/1.4 var(--serif);letter-spacing:.07em;color:#e6c989;margin:0 0 18px}
.start-home h1 {max-width:900px;margin:0 auto 40px;font:400 clamp(36px,5.8vw,78px)/1.06 var(--serif);text-wrap:balance;color:#fff2d4}
.start-actions {display:grid;gap:14px;width:min(360px,100%);margin:auto}
.start-credits-link {min-height:44px;margin:12px auto 0;padding:8px 18px;border:0;background:transparent;color:#ecd8aa;font:16px/1.3 var(--serif);text-shadow:0 2px 5px #000;cursor:pointer}
.start-credits-link:hover {color:#fff4d8;text-shadow:0 0 8px #edc477}
.start-credits-link:focus-visible {outline:2px solid #f4d08a;outline-offset:2px;border-radius:4px}
.start-actions button,.start-actions a {
 display:flex;align-items:center;justify-content:center;min-height:64px;padding:16px 28px;
 border:1px solid #ceaa69;border-radius:8px;background:linear-gradient(135deg,#293e2ef2,#13251bf5);
 color:#f9e7c1;font:600 19px/1.25 var(--serif);text-decoration:none;text-shadow:0 1px 2px #0008;
 box-shadow:inset 0 0 0 3px #cfa96820,0 5px 18px #0006;cursor:pointer;
}
.start-actions #new-game-button {background:linear-gradient(135deg,#eed193,#bb914e);color:#292014;text-shadow:none}
.start-actions button:hover:not(:disabled),.start-actions a[href]:hover {filter:brightness(1.12)}
.start-actions a[aria-disabled=true] {opacity:.4;cursor:default}
.start-actions a:focus-visible {outline:3px solid #ffe6a5;outline-offset:4px}
.start-intro {width:min(720px,100%);padding:clamp(24px,4vw,52px);text-align:center;border:1px solid #caa86b66;border-radius:12px;background:#10251deF;box-shadow:0 20px 80px #0008}
.start-intro .eyebrow {color:#dcc18b}
.start-intro h2 {color:#fff0d0;font:400 clamp(25px,3vw,40px)/1.15 var(--serif);text-wrap:balance;margin:0 0 24px}
.start-intro .start-detail {font:clamp(16px,1.6vw,19px)/1.65 var(--serif);color:#f1e8d3;margin:0 0 28px}
.intro-actions {display:flex;justify-content:center;align-items:center;gap:18px}
.start-screen[data-starting] > :is(.start-home,#start-intro) {display:none}
.start-progress .start-detail {margin:0}
.intro-actions .primary-button {min-width:190px;min-height:52px;background:#d7b574;color:#251c10;border:1px solid #edce93}
body:has(.start-screen:not([hidden])) .game-shell .site-header {visibility:hidden;pointer-events:none}
/* Optional painted button artwork, with live translated labels over the blank face. */
.start-screen[data-button-art] .start-actions {width:min(410px,100%);gap:8px}
.start-screen[data-button-art] .start-actions button,
.start-screen[data-button-art] .start-actions #new-game-button,
.start-screen[data-button-art] .start-actions a,
.start-screen[data-button-art] .intro-actions .primary-button {
 min-height:56px;aspect-ratio:4.5 / 1;padding:0 11%;border:0;border-radius:0;
 background:transparent var(--start-button-image) center calc(50% + 5px) / 100% auto no-repeat;
 box-shadow:none;color:#3a2919;font:600 clamp(22px,2.4vw,28px)/1.15 var(--serif);
 text-shadow:0 1px 0 #fff4d1;filter:drop-shadow(0 3px 4px #0006);
 transition:filter .16s ease,transform .16s ease;
}
.start-screen[data-button-art] .start-actions button:hover:not(:disabled),
.start-screen[data-button-art] .start-actions #new-game-button:hover:not(:disabled),
.start-screen[data-button-art] .start-actions a[href]:hover,
.start-screen[data-button-art] .intro-actions .primary-button:hover:not(:disabled) {filter:brightness(1.1) drop-shadow(0 4px 9px #e2ba6050)}
.start-screen[data-button-art] .start-actions button:disabled,
.start-screen[data-button-art] .start-actions a[aria-disabled=true] {opacity:.65;filter:saturate(.3) brightness(.7)}
.start-screen[data-button-art] .start-actions :focus-visible,
.start-screen[data-button-art] .start-actions #new-game-button:focus-visible,
.start-screen[data-button-art] .intro-actions .primary-button:focus-visible {outline:2px solid #f4d08a;outline-offset:-6px;border-radius:14px}
.start-screen[data-button-art] .intro-actions .primary-button {width:290px;max-width:100%;min-width:0;padding:0 28px;font-size:23px;flex-shrink:0}
@media(prefers-reduced-motion:reduce){.start-screen[data-button-art] .start-actions button,.start-screen[data-button-art] .start-actions a{transition:none}}
@media(max-width:600px) {
 .start-screen {padding:22px}
 .start-home h1 {font-size:clamp(33px,10vw,52px);margin-bottom:30px}
 .start-actions button,.start-actions a {min-height:60px}
 .start-intro {padding:24px 20px}
 .start-intro .start-detail {font-size:16px;line-height:1.5;margin-bottom:18px}
 .start-intro h2 {font-size:26px;margin-bottom:18px}
 .intro-actions {flex-direction:column;gap:5px}
 .intro-actions .primary-button {width:100%}
}
@media(max-height:540px) and (orientation:landscape) {
 .start-screen {padding:18px 34px}
 .start-home {display:grid;grid-template-columns:1fr minmax(220px,310px);column-gap:40px;align-items:center}
 .start-home .start-pretitle {grid-column:1;align-self:end;margin:0 0 12px;font-size:16px}
 .start-home h1 {grid-column:1;align-self:start;font-size:clamp(28px,4.7vw,48px);margin:0}
 .start-actions {grid-column:2;grid-row:1 / span 2;gap:10px}
 .start-credits-link {grid-column:2;grid-row:3;margin-top:0}
 .start-actions button,.start-actions a {min-height:52px;padding:12px;font-size:18px}
 .start-intro {width:min(900px,100%);padding:18px 28px}
 .start-intro .eyebrow {margin-bottom:6px}
 .start-intro h2 {font-size:25px;margin-bottom:10px}
 .start-intro .start-detail {font-size:15px;line-height:1.4;margin-bottom:12px}
 .intro-actions {flex-direction:row}
 .intro-actions .primary-button {min-height:44px;padding:10px 22px}
 .start-screen[data-button-art] .start-actions {gap:8px}
 .start-screen[data-button-art] .start-actions button,.start-screen[data-button-art] .start-actions #new-game-button,.start-screen[data-button-art] .start-actions a {min-height:56px;padding:0 11%;font-size:22px}
 .start-screen[data-button-art] .intro-actions .primary-button {width:250px;min-height:56px;padding:0 25px;font-size:20px}
}
