html:has(.ss-stage) {scroll-behavior:auto;overflow-anchor:none;}
.match-shell--sternschnapp > .match-header { display:none; }
.play-main:has(.ss-stage) { min-height:0; padding:6px 0 68px; }
.ss-stage,.ss-dialog,.ss-preview { box-sizing:border-box; color:#eef4ff; font-family:inherit; }
.ss-stage *,.ss-dialog *,.ss-preview * { box-sizing:border-box; }
.ss-stage { --ss-height:min(780px,calc(100dvh - 150px)); height:var(--ss-height); min-height:360px; padding:12px; background:#121c30; border:1px solid #405371; border-radius:18px; display:grid; grid-template-rows:44px minmax(176px,1fr) auto; gap:10px; overflow:hidden; }
.ss-stage p,.ss-stage h2 {margin:0;}
.ss-header {display:flex;align-items:center;gap:8px;font-size:14px;min-width:0;}
.ss-header>strong {margin-right:auto;}
.ss-stage button,.ss-dialog button,.ss-preview button,.ss-lobby button {font:inherit;cursor:pointer;touch-action:manipulation;}
.ss-stage button:disabled,.ss-preview button:disabled {cursor:default;}
.ss-stage button:focus-visible,.ss-dialog button:focus-visible,.ss-preview button:focus-visible {outline:3px solid #fff;outline-offset:2px;}
.ss-button,.ss-score,.ss-help {min-height:44px;border:1px solid #647b9b;border-radius:9px;background:#20314b;color:#f3f7ff;padding:7px 12px;}
.ss-help {min-width:44px; padding:6px;}
.ss-clock {font-variant-numeric:tabular-nums;white-space:nowrap;min-width:32px;text-align:right;color:#ffdf89;}
.ss-board-wrap {display:flex;align-items:center;justify-content:center;min-height:0;container-type:size;}
.ss-board {display:grid;grid-template-columns:repeat(4,minmax(44px,1fr));grid-template-rows:repeat(4,minmax(44px,1fr));gap:4px;width:min(100%,460px);aspect-ratio:1;}
@supports (width:1cqh) {.ss-board-wrap .ss-board {width:min(100cqw,100cqh,460px);height:min(100cqw,100cqh,460px);}}
.ss-cell {position:relative;min-width:44px;min-height:44px;border:1px solid #4d6284;border-radius:8px;background:#202e46;color:#eef4ff;display:flex;align-items:center;justify-content:center;padding:3px;isolation:isolate;}
.ss-cell:disabled {opacity:1;}
.ss-cell--possible {border:2px solid #92b9e6;background:#2e4463;}
.ss-cell--possible:not(:disabled):hover {background:#3b567c;}
.ss-cell--selected {outline:3px solid #f6dc86;outline-offset:-3px;background:#514a31;}
.ss-cell--own {box-shadow:inset 0 0 0 2px #fff;}
.ss-coordinate {position:absolute;left:4px;top:2px;font-size:9px;color:#bbcae0;}
.ss-star {font-size:clamp(19px,4vw,35px);color:#ffda6a;position:absolute;right:4px;top:1px;z-index:0;}
.ss-cell {isolation:auto;}
.ss-tokens {display:flex;flex-wrap:wrap;gap:2px;align-items:center;justify-content:center;max-width:100%;margin-top:9px;}
.ss-token {font-size:11px;line-height:15px;min-width:15px;padding:0 2px;border-radius:4px;font-weight:800;background:var(--ss-player,#c8dafa);color:#111e34;}
.ss-token--me {outline:1px solid #fff;}
.ss-tokens--crowded {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:2px;width:100%;}
.ss-tokens--crowded .ss-token {font-size:9px;line-height:11px;min-width:0;padding:0;text-align:center;}
.ss-cell:has(.ss-own-label) .ss-coordinate {visibility:hidden;}
.ss-cell:has(.ss-own-label) .ss-tokens--crowded {margin-top:15px;}
.ss-own-label {position:absolute;left:3px;top:1px;font-size:9px;font-weight:bold;color:white;background:#1a2942;}
.ss-controls {display:grid;gap:6px;align-content:center;min-width:0;}
.ss-controls h2 {font-size:clamp(18px,3vw,25px);line-height:1.15;}
.ss-note {font-size:13px;line-height:1.35;color:#d0dcef;}
.ss-action {min-height:46px;border:0;border-radius:10px;padding:8px;color:#172235;background:#ffda79;font-weight:800!important;}
.ss-action:disabled {background:#35435a;color:#c5d1e5;}
.ss-progress {font-size:12px;line-height:16px;color:#c3d2e9;text-align:center;}
.ss-error {font-size:12px;color:#ffb7bc;}
.ss-error:empty {display:none;}
.ss-stage[data-phase="finished"] {grid-template-rows:44px minmax(0,1fr);}
.ss-stage[data-phase="finished"] .ss-board-wrap {display:none;}
.ss-stage[data-phase="finished"] .ss-controls {grid-column:1/-1;grid-row:2;max-width:440px;width:100%;justify-self:center;}
.ss-dialog {width:min(460px,calc(100% - 24px));max-height:85dvh;overflow:auto;background:#142039;border:1px solid #7590b5;border-radius:16px;padding:20px;}
.ss-dialog::backdrop {background:#030a17cb;}
.ss-dialog h2 {font-size:22px;margin:0 0 14px;}
.ss-rules p,.ss-results p {margin:0 0 14px;font-size:15px;line-height:1.5;}
.ss-results span {display:block;color:#cbd8eb;font-size:13px;}
.ss-time-label {display:block;margin-top:16px;}
.ss-time-label select {min-height:44px;background:#18263d;color:white;padding:8px;border:1px solid #6c7e9a;border-radius:7px;}
.ss-landing {max-width:900px;margin:0 auto;padding:24px 16px 50px;}
.ss-landing h1 {font-size:clamp(32px,7vw,56px);margin:6px 0;}
.ss-landing p {line-height:1.55;}
.ss-prototype {color:#ffda79;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;}
.ss-landing .ss-action {display:inline-flex;align-items:center;justify-content:center;text-decoration:none;}
.ss-preview {margin:25px 0;padding:18px;background:#142039;border:1px solid #435b7c;border-radius:14px;}
.ss-preview h2 {margin-top:0;}
.ss-preview-layout {display:grid;grid-template-columns:minmax(180px,1fr) minmax(190px,1fr);gap:22px;align-items:center;}
.ss-preview .ss-board {max-width:320px;}
.ss-preview-status {min-height:72px;}
.ss-preview-actions {display:flex;flex-wrap:wrap;gap:8px;}
.ss-preview-actions button {flex:1;}
@media(max-width:600px) {.play-main:has(.ss-stage) {width:calc(100% - 16px);}.ss-stage {padding:8px;gap:7px;}.ss-preview-layout {grid-template-columns:1fr;}.ss-preview .ss-board {margin:auto;}.ss-preview {padding:12px;}}
@media(max-width:600px) and (min-height:500px) {.ss-stage {max-height:650px;}.ss-controls h2 {font-size:19px;}}
@media(max-height:499px) and (min-width:480px) {
 .play-page:has(.ss-stage)>.site-header--compact {display:none;}
 .ss-stage {min-height:220px;grid-template-columns:minmax(180px,1fr) minmax(230px,1fr);grid-template-rows:44px minmax(176px,1fr);gap:4px 12px;padding:6px 10px;}
 .ss-header {grid-column:1/-1;}.ss-board-wrap {grid-column:1;grid-row:2;}.ss-controls {grid-column:2;grid-row:2;gap:4px;}.ss-controls h2 {font-size:18px;}.ss-note {font-size:12px;}.ss-action {min-height:44px;}.ss-button {padding:5px 8px;}
 .ss-stage[data-phase="finished"] .ss-controls {max-width:none;grid-template-columns:1fr 1fr;gap:5px 10px;}
 .ss-stage[data-phase="finished"] .ss-controls h2,.ss-stage[data-phase="finished"] .ss-note {grid-column:1/-1;}
}
@media(prefers-reduced-motion:reduce) {.ss-stage *,.ss-preview * {animation:none!important;transition:none!important;}}
.ss-preview-dialog {width:100vw;max-width:none;height:100dvh;max-height:100dvh;margin:0;padding:8px;border:0;background:#101a2c;color:#eef4ff;overflow:auto;}
.ss-preview-dialog .ss-preview {position:relative;margin:0;height:100%;padding:10px;display:grid;grid-template-rows:36px auto minmax(0,1fr);gap:6px;}
.ss-preview-dialog .ss-preview h2 {font-size:19px;line-height:1.25;margin:0 44px 0 0;align-self:center;}
.ss-preview-dialog p {margin:0;font-size:13px;line-height:1.35;}
.ss-example-close {position:absolute;right:5px;top:5px;width:44px;font-size:24px!important;}
.ss-preview-dialog .ss-preview-layout {min-height:0;gap:10px;}
.ss-preview-dialog .ss-preview-layout>div:last-child {display:grid;gap:7px;}
.ss-preview-dialog .ss-preview-status {min-height:62px;}
.ss-preview-dialog .ss-board {max-width:350px;width:min(100%,350px);justify-self:center;}
.ss-preview-dialog .ss-action {font-size:15px;}
@media(max-width:600px) and (min-height:500px) {
 .ss-preview-dialog .ss-preview-layout {grid-template-columns:1fr;grid-template-rows:minmax(176px,1fr) auto;}
 .ss-preview-dialog .ss-board {height:100%;width:auto;max-height:300px;aspect-ratio:1;margin:0;}
}
@media(max-height:499px) and (min-width:480px) {
 .ss-preview-dialog .ss-preview {grid-template-rows:32px 18px minmax(176px,1fr);padding:4px 8px;gap:4px;}
 .ss-preview-dialog .ss-preview-layout {grid-template-columns:minmax(176px,1fr) minmax(240px,1fr);gap:10px;}
 .ss-preview-dialog .ss-board {height:100%;width:auto;max-height:260px;}
 .ss-preview-dialog .ss-preview-layout>div:last-child {gap:4px;}
 .ss-preview-dialog .ss-example-hint {display:none;}
 .ss-preview-dialog .ss-preview-status {min-height:48px;font-size:12px;}
}