:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#0b1422;color:#e6eefb}*{box-sizing:border-box}body{margin:0}header{display:flex;align-items:center;gap:14px;padding:14px max(16px,calc((100vw - 1120px)/2));background:#09111c;border-bottom:1px solid #293a50}header a{color:#6fbaff;font-size:24px;font-weight:800;text-decoration:none}header select{margin-left:auto}main{max-width:1120px;margin:auto;padding:16px}h1{margin:8px 0;font-size:28px}h2{font-size:20px;margin-top:0}h3{font-size:16px}.muted{color:#a3b5cc;font-size:14px;line-height:1.5}section,aside{min-width:0}.layout{display:grid;grid-template-columns:minmax(0,620px) minmax(260px,1fr);gap:22px;align-items:start}aside,main>section{background:#131f2e;border:1px solid #2d4058;border-radius:12px;padding:16px;margin:12px 0}#setup{display:flex;gap:12px;flex-wrap:wrap;align-items:end}label{display:grid;gap:6px}button,select{font:inherit;border:1px solid #405670;border-radius:8px;min-height:44px;padding:9px 12px;background:#1b2d43;color:#f0f5fc}button{cursor:pointer}button:hover{border-color:#85baff}button:focus-visible,select:focus-visible{outline:3px solid #88bcff;outline-offset:2px}button:disabled{opacity:.45;cursor:default}#start,#hint{background:#2362cb}.actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}#status{min-height:24px;color:#b6d9ff}#status.error{color:#ffb1b1}.boardwrap{position:relative;width:100%;max-width:620px;aspect-ratio:1;border:4px solid #060c14;border-radius:5px;overflow:hidden}#board{display:grid;grid-template-columns:repeat(8,1fr);width:100%;height:100%;container-type:inline-size}#board button{position:relative;aspect-ratio:1;padding:0;min-height:0;border:0;border-radius:0;font-size:clamp(20px,9cqw,68px);line-height:1;font-family:'Segoe UI Symbol','DejaVu Sans',serif;display:grid;place-items:center}.light{background:#f0d9b5!important}.dark{background:#b58863!important}.whitePiece{color:white;text-shadow:1px 1px #111,-1px -1px #111,1px -1px #111,-1px 1px #111}.blackPiece{color:#111;text-shadow:1px 1px #eee}.square.selected{box-shadow:inset 0 0 0 4px #2681ef}.square.recommended{box-shadow:inset 0 0 0 4px #269bd7}.square.legal:after{content:'';width:20%;height:20%;background:#15462b80;border-radius:50%;position:absolute}.square small{position:absolute;bottom:1px;left:3px;font:10px system-ui;color:#31291f;pointer-events:none}#arrow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;display:none}#moves{max-height:160px;overflow:auto;line-height:1.8;word-break:break-word}#advice{min-height:58px;line-height:1.5}#promotion{padding:10px;display:flex;gap:8px;flex-wrap:wrap}#promotion[hidden]{display:none}#review{display:flex;gap:8px;flex-wrap:wrap}#review button{text-align:left;max-width:100%}@media(max-width:760px){.layout{grid-template-columns:1fr;gap:0}main{padding:12px}aside{margin:12px 0}#advice{min-height:0}#setup{gap:8px}#setup label{flex:1}#setup button{width:100%}h1{font-size:24px}header{padding:12px}header a{font-size:21px}.boardwrap{margin:auto}#board button{font-size:10cqw}}

#setup[hidden]{display:none}#board button:disabled{opacity:1;-webkit-text-fill-color:currentColor}

header #home{display:flex;align-items:center;gap:8px}#play{font-size:14px;font-weight:500}#recommendation{font-weight:700;color:#9dceff;border-left:3px solid #509deb;padding:10px;background:#0c192b}#advice{font-size:17px;line-height:1.65;min-height:0}.square.analyzed{box-shadow:inset 0 0 0 4px #e9b84e}#reviewMode{background:#283b55;padding:10px;border-radius:8px}#continue[hidden]{display:none}.square small{line-height:1;text-shadow:none;-webkit-text-stroke:0}header{flex-wrap:wrap}#board button{font-weight:normal}#board button.whitePiece{text-shadow:1px 1px #111,-1px -1px #111}#board button.blackPiece{text-shadow:none}@media(max-width:760px){header{gap:8px}header #home{font-size:18px}header #home img{width:32px;height:32px}#play{order:4;width:100%}.boardwrap{max-width:min(100%,calc(100svh - 180px))}#advice{font-size:16px}}

#review{max-height:300px;overflow:auto;display:grid;grid-template-columns:1fr;gap:8px}#return{margin-bottom:8px}#activeLevel:empty{display:none}
@media(min-width:761px){.boardwrap{max-width:min(100%,max(320px,calc(100svh - 380px)));margin:0 auto}}

/* v325: use available width; viewport height must not shrink the desktop board. */
@media(min-width:901px){.layout{grid-template-columns:minmax(0,580px) minmax(260px,1fr);gap:24px}.boardwrap{max-width:min(100%,580px);margin:0}aside{margin-top:0}}
@media(max-width:900px){.layout{grid-template-columns:minmax(0,1fr);gap:0}.boardwrap{max-width:100%;margin:0}aside{margin:12px 0}}

#advice.automatic.moderate{font-size:14px;color:#c5b98a;border-left:2px solid #8d814d;padding-left:10px}#advice.automatic.major{border-left:3px solid #e99b67;padding-left:12px}

#recommendationReason{font-size:15px;line-height:1.6;color:#c8d8e9;overflow-wrap:anywhere}

#advice{white-space:pre-line}#recommendationDetails{margin:10px 0}#recommendationDetails summary{cursor:pointer;color:#9dceff;min-height:32px}#learningTip{border-left:2px solid #527590;padding-left:10px}

/* v331 mobile Coach: compact guidance stays with the board, full panel on demand. */
#mobileCoach331{display:none}#coachDetails331{width:min(600px,calc(100vw - 20px));max-height:calc(100dvh - 24px);overflow:auto;padding:12px;border:1px solid #405670;border-radius:12px;background:#0b1422;color:#e6eefb}#coachDetails331::backdrop{background:#000a}.detailsHeader331{display:flex;justify-content:space-between;align-items:center;gap:8px;position:sticky;top:-12px;background:#0b1422;z-index:2;padding:6px 0}#coachDetails331 aside{margin:8px 0}#coachDetails331:not([open]){display:none}
@media(max-width:900px){
 .coachTraining331 main>h1,.coachTraining331 main>[data-copy=subtitle],.coachTraining331 main>[data-copy=scope],.coachTraining331 #activeLevel{display:none}
 .coachTraining331 header{padding:8px 12px;gap:6px}.coachTraining331 #status{margin:6px 0;min-height:20px;font-size:14px}
 main{padding:8px}.layout>aside{display:none}#coachDetails331 aside{display:block}
 #mobileCoach331:not([hidden]){display:block;margin:0 0 8px;padding:10px;border:1px solid #405670;border-radius:10px;background:#131f2e}
 #mobileAdvice331{margin:0 0 5px;line-height:1.35;font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
 #mobileAdvice331.major{color:#ffbc91}#mobileAdvice331.moderate{color:#dfd29e}
 #mobileRecommendation331{margin:0 0 7px;color:#9dceff;font-size:13px;line-height:1.3}
 .mobileActions331{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px}.mobileActions331 button{font-size:13px;padding:6px 4px;min-height:44px}
 .boardwrap{max-width:min(100%,max(240px,calc(100svh - 300px)));margin-inline:auto}
}
