@import url('../nine-mens-morris/style.css?v=20260928-2');

.online-shell{width:min(100%,480px)}
.topbar h1{font-size:31px;letter-spacing:-1px}
.game-identity:has(.account-name:not([hidden])) .online-kicker{display:none}
.room-view{display:flex;min-height:0;flex:1;flex-direction:column}
.players{margin-top:0}
.players article{min-height:72px}
.player-heading{font-size:10px}
.mini-mark{display:grid;width:24px;height:24px;place-items:center;color:#f5f0e5;font:400 27px/.8 Georgia,serif;text-transform:none}
.mini-mark.o{color:#d9bc78;font-size:30px}
.turn-panel{padding:38px 5px 9px}
.board{--size:3;position:relative;display:grid;grid-template-columns:repeat(var(--size),1fr);grid-template-rows:repeat(var(--size),1fr);gap:clamp(6px,2vw,10px);width:min(100%,calc(100svh - 345px),430px);height:auto;aspect-ratio:1;margin:auto;padding:clamp(8px,2.4vw,13px);overflow:visible;contain:none;border:1px solid #6d5931;border-radius:24px;background:linear-gradient(145deg,#171510,#0c0c0b);box-shadow:0 22px 70px #000a,inset 0 1px #ffe5a51f;touch-action:none;user-select:none}
.cell{position:relative;display:grid;min-width:0;min-height:0;place-items:center;border:1px solid #5c4b2b;border-radius:clamp(10px,3vw,17px);background:linear-gradient(145deg,#171613,#0d0d0c);box-shadow:inset 0 1px #fff1b00c,0 5px 12px #0007;color:#f5f0e5;font:400 clamp(46px,18vw,88px)/.75 Georgia,serif;transition:transform .23s cubic-bezier(.22,1.35,.42,1),border-color .2s,background .2s,box-shadow .2s;touch-action:none}
.cell:hover:not(:disabled){border-color:#c9a95c;background:#211d14}.cell:active:not(:disabled){transform:scale(.94)}
.cell.is-x{color:#f5f0e5;text-shadow:0 5px 20px #fff2}.cell.is-o{color:#d9bc78;text-shadow:0 5px 20px #d9bc7844}
.cell.last-move{border-color:#d9bc78;box-shadow:inset 0 0 0 1px #d9bc7855,0 7px 18px #0008}
.cell.winner{border-color:#f0d99b;background:#2c2517;box-shadow:inset 0 0 22px #d9bc7830,0 0 20px #d9bc7822}
.cell:disabled{cursor:default}.cell.is-empty:disabled{opacity:.72}
.cell.mark-arrive:not(.winner){animation:mark-arrive .28s cubic-bezier(.22,1.35,.42,1)}
.result-mark{display:grid;width:70px;height:70px;place-items:center;margin:0 auto 14px;border:1px solid #6a5630;border-radius:20px;background:#11100d;color:#d9bc78;font:400 58px/.8 Georgia,serif}
.rules h3{margin:20px 0 6px;color:#f0d99b}
@keyframes mark-arrive{0%{transform:scale(.72);opacity:.35}100%{transform:scale(1);opacity:1}}
@media(max-width:375px){.topbar h1{font-size:26px}.board{width:min(100%,calc(100svh - 360px))}}
@media(min-width:700px) and (orientation:portrait){.online-shell{width:min(100%,800px);padding-inline:44px}.topbar h1{font-size:40px}.room-view{display:flex}.players{grid-template-columns:1fr 1fr}.board{width:min(80vw,calc(100svh - 365px),620px);max-width:620px}.cell{font-size:clamp(72px,14vw,116px)}}
@media(min-width:900px) and (orientation:landscape){.online-shell{width:min(100%,960px)}.room-view{display:grid;grid-template-columns:280px minmax(0,1fr);grid-template-rows:auto 1fr;gap:8px 28px}.players{grid-column:1;grid-template-columns:1fr}.turn-panel{grid-column:1}.board{grid-column:2;grid-row:1/3;width:min(68vh,560px)}.ad-reservation{max-width:none}}
@media(prefers-reduced-motion:reduce){.cell{transition-duration:.01ms}.cell.mark-arrive{animation:none}}