/* Connection feedback lives outside the board and never replaces a running game. */
.connection-banner{position:fixed;z-index:130;left:50%;top:max(8px,env(safe-area-inset-top));transform:translateX(-50%);display:flex;align-items:center;gap:12px;max-width:min(620px,calc(100vw - 24px));padding:10px 14px;border:1px solid #d6b875;border-radius:12px;background:#263a2f;color:#fff2d4;box-shadow:0 4px 18px #0006;font-size:.88rem}
.connection-banner[hidden]{display:none}
.connection-banner button{white-space:nowrap}
body[data-connection="offline"] [data-game],body[data-connection="unavailable"] [data-game]{opacity:.5;pointer-events:none}
.game-next-step{margin:6px 0 10px;padding:8px 12px;border-left:3px solid #9bbe88;background:#173d2b66;border-radius:7px;font-size:.9rem}
.game-next-step strong{display:block}
.reversi-cell.last-move{box-shadow:inset 0 0 0 3px #e3be70}
.reversi-cell:focus-visible{outline:3px solid #ffe5a6;outline-offset:-4px}
.reversi-hint-count{font-size:clamp(9px,1.2vw,14px);color:#d9e9cc}
.editor-history{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:10px 0}
.editor-unsaved{color:#eac27b;font-size:.85rem}
.storage-status{font-size:.9rem}
.storage-status.error{border-color:#d4967f}
@media(max-width:760px){
 .connection-banner{font-size:.78rem;padding:7px 10px;gap:7px}
 .connection-banner button{font-size:.75rem;padding:6px 8px}
 .game-next-step{font-size:.78rem;margin:3px 0 6px;padding:5px 8px}
 .game-next-step strong{display:inline}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
body[data-busy="true"] [data-game]{pointer-events:none} body[data-motion="off"] *,body[data-motion="off"] *::before,body[data-motion="off"] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important} .ui-preferences{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:8px}.ui-preferences button{font-size:11px}