* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; background: #081a1d; color: #edfaff; font-family: 'Source Sans 3', sans-serif; }
#game-shell { position: fixed; inset: 0; background: radial-gradient(circle at 50% 30%, #133746, #091d23 60%, #050d12 100%); }
#gameCanvas { display: block; width: 100%; height: 100%; cursor: pointer; touch-action: none; }
.GameHud { position: fixed; z-index: 2; top: 0; left: 0; right: 0; display: flex; justify-content: space-between; align-items: flex-start; padding: 1.2rem 1.5rem; pointer-events: none; }
.GameHud h1 { margin: 0; color: #ecfbff; font-family: 'Cinzel', serif; font-size: clamp(1.9rem, 5vw, 3rem); letter-spacing: .04em; text-shadow: 0 0 16px rgba(123, 199, 255, .38); }
#game-subtitle { margin: .3rem 0 0; color: #bddfe9; font-size: .95rem; }
.GameStats { display: flex; gap: 1.2rem; color: #dff6ff; font-size: .8rem; text-transform: uppercase; }
.GameStats strong { color: #fff2c7; font-size: 1.05rem; }
.TaquinDifficulty { position: fixed; z-index: 3; top: 1rem; left: 50%; display: flex; gap: .55rem; align-items: center; margin: 0; padding: .3rem .45rem; border: 0; color: #bddfe9; font-size: .7rem; transform: translateX(-50%); pointer-events: auto; }
.TaquinDifficulty legend { margin: 0; padding: 0 .15rem; font-size: .68rem; }
.TaquinDifficulty label { display: inline-flex; align-items: center; gap: .2rem; cursor: pointer; white-space: nowrap; }
.TaquinDifficulty input { width: .8rem; height: .8rem; margin: 0; accent-color: #fff2c7; }
.TaquinDifficulty label:focus-within, .TaquinDifficulty label:has(input:checked) { color: #fff2c7; }
.GameStatus { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.SolvedOverlay { position: fixed; z-index: 4; inset: 0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.45rem; padding:2rem; background:rgba(5,13,18,.72); color:#fff2c7; cursor:pointer; text-align:center; text-shadow:0 0 16px rgba(123,199,255,.55); user-select:none; -webkit-user-select:none; }
.SolvedOverlay[hidden] { display:none; }
.SolvedOverlay strong { font-family:'Cinzel',serif; font-size:clamp(1.8rem,7vw,3.5rem); }
.SolvedOverlay span { color:#bddfe9; font-size:1rem; }
.GameLanguageToggle { position: fixed; z-index: 3; top: 1rem; right: 1.5rem; display: flex; gap: .35rem; margin-top: 3.2rem; }
.GameLanguageToggle button, .GameControls button, .GameControls a { border: 1px solid rgba(184, 220, 230, .7); border-radius: 6px; background: rgba(5, 17, 22, .8); color: #edfaff; padding: .5rem .75rem; font: 600 .72rem 'Source Sans 3', sans-serif; text-decoration: none; cursor: pointer; }
.GameLanguageToggle button.active { background: #fff2c7; color: #071a1f; }
.GameControls { position: fixed; z-index: 2; right: 1.5rem; bottom: 1.25rem; display: flex; gap: .65rem; }
.GameControls button:hover, .GameControls button:focus-visible, .GameControls a:hover, .GameControls a:focus-visible, .GameLanguageToggle button:focus-visible { outline: 2px solid #7ae1ff; outline-offset: 3px; }
.FullscreenButton { display:grid; width:36px; height:34px; place-items:center; padding:0 !important; font-size:1.35rem !important; line-height:1; }
.FullscreenButton[hidden] { display:none; }
.FullscreenButton.active .FullscreenEnterIcon { display:none; }
.FullscreenExitIcon { display:none; font-size:1.55rem; }
.FullscreenButton.active .FullscreenExitIcon { display:block; }
@media (max-width: 700px) {
	.GameHud { padding: 1rem; }
	.GameStats { position:fixed; top:4.9rem; right:1rem; left:1rem; display:grid; grid-template-columns:1fr 1fr; grid-template-areas:'moves best' 'time best-time'; gap:.2rem .75rem; margin:0; text-align:right; }
	.GameStats span:nth-child(1) { grid-area:moves; text-align:left; }
	.GameStats span:nth-child(2) { grid-area:best; }
	.GameStats span:nth-child(3) { grid-area:time; text-align:left; }
	.GameStats span:nth-child(4) { grid-area:best-time; }
	.TaquinDifficulty { top:8.6rem; bottom:auto; max-width:calc(100% - 2rem); }
	.TaquinDifficulty { gap:.35rem; padding:.2rem 0; font-size:.62rem; }
	.TaquinDifficulty legend { font-size:.6rem; }
	.TaquinDifficulty input { width:.72rem; height:.72rem; }
	.GameLanguageToggle { left:1rem; right:auto; bottom:1.25rem; top:auto; margin-top:0; }
	.GameControls { right:1rem; bottom:1rem; }
}
@media (orientation:landscape) and (max-height:600px) {
	#game-subtitle { display:none; }
	.GameHud { padding:.55rem 1rem; }
	.GameStats { top:3.1rem; }
	.TaquinDifficulty { top:3.1rem; left:1rem; transform:none; }
}