.game-panel{border:2px solid var(--ink);border-radius:var(--radius);background:var(--paper);box-shadow:3px 3px 0 var(--ink);padding:16px}.game-panel h2{font-size:1.45rem}.game-panel--score p{color:var(--ink-soft);margin:4px 0 12px;font-size:.92rem}.game-field{border:0;min-width:0;margin:12px 0 0;padding:0}.game-field[hidden]{display:none}.game-field legend{margin-bottom:4px;padding:0;font-size:.9rem;font-weight:700}.game-segmented{border:2px solid var(--ink);border-radius:8px;display:flex;overflow:hidden}.game-segmented label{cursor:pointer;flex:1 1 0;min-width:0;position:relative}.game-segmented label+label{border-inline-start:2px solid var(--ink)}.game-segmented input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.game-segmented span{text-align:center;justify-content:center;align-items:center;min-height:42px;padding:4px 6px;font-size:.95rem;line-height:1.15;display:flex}.game-segmented input:checked+span{background:var(--ink);color:var(--paper);font-weight:700}.game-segmented input:not(:checked):hover+span{background:var(--paper-shade)}.game-segmented input:focus-visible+span{outline:3px solid var(--focus);outline-offset:-3px}.game-segmented input:checked:focus-visible+span{outline-color:var(--marker)}.game-toggle{cursor:pointer;gap:10px;display:flex}.game-toggle[hidden]{display:none}.game-toggle input{width:22px;height:22px;accent-color:var(--ink);cursor:pointer;flex:none;margin:1px 0 0}.game-toggle strong{line-height:1.3;display:block}.game-toggle small{color:var(--ink-soft);margin-top:1px;font-size:.85rem;line-height:1.35;display:block}.game-confirm{border:2px solid var(--ink);border-radius:var(--radius);background:var(--paper);width:min(420px,100vw - 32px);color:var(--ink);box-shadow:6px 6px 0 var(--ink);padding:20px}.game-confirm::backdrop{background:#1b234080}.game-confirm h2{font-size:1.6rem}.game-confirm p{margin:8px 0 18px}.game-confirm__actions{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}
.shell{--shell-play-h:calc(100svh - var(--site-header-h) - var(--site-offer-h,0px) - var(--shell-title-h));--dock-row:52px;--dock-pad:6px;--dock-rows:1;--dock-h:calc(var(--dock-row) * var(--dock-rows) + var(--dock-pad) * (var(--dock-rows) + 1) + env(safe-area-inset-bottom));--board-ratio:1;--lift:0px;width:100%;max-width:var(--container);margin:0 auto}.shell__play{height:calc(100vh - var(--site-header-h) - var(--site-offer-h,0px) - var(--shell-title-h));height:var(--shell-play-h);min-height:400px;padding:0 8px calc(var(--dock-h) + 6px);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation;flex-direction:column;gap:6px;display:flex}.shell__stage{z-index:1;transform:translateY(calc(var(--lift) * -1));transition:transform .2s ease-out}.shell__strip,.shell__status{flex:none}.shell-status{overflow-wrap:anywhere;text-align:center;height:50px;font-family:var(--font-hand);justify-content:center;align-items:center;margin:0;padding:0 4px;font-size:1.1rem;line-height:1.1;display:flex}.shell-status.shell-status[data-fit=small]{font-size:.9375rem}.shell-status.shell-status[data-fit=smaller]{font-size:.8125rem;line-height:1.05}.shell-status.shell-status[data-fit=smallest]{font-size:.75rem;line-height:1}.shell-status.shell-status[data-fit=grow]{height:auto;padding-block:4px;font-size:.75rem;line-height:1.25}.shell-status.is-thinking:after{content:"";background:radial-gradient(circle closest-side, var(--ink) 90%, transparent) 0 50% / 33% 100% repeat-x;clip-path:inset(0 100% 0 0);width:1.1em;height:.3em;margin-inline-start:6px;animation:1s steps(4,end) infinite shell-thinking;display:inline-block}@keyframes shell-thinking{to{clip-path:inset(0 -5% 0 0)}}.shell-status.is-result{font-size:1.25rem}.shell-status.is-result span{background:var(--highlight-win);padding:0 8px;display:inline-block}.shell-status.is-note{color:var(--o)}.shell__stage{flex:1 1 0;place-items:center;min-height:0;display:grid;container-type:size}.shell__board{width:min(100cqw, calc(100cqh * var(--board-ratio)));max-width:100%}.shell:not([data-ready]) .shell__stage{cursor:progress}.shell:not([data-ready]) .shell__stage:before{content:"";z-index:4;background:var(--x);opacity:0;border-radius:2px;width:56px;height:3px;animation:1.1s ease-in-out .45s infinite alternate shell-pending;position:absolute}.shell__stage{position:relative}@keyframes shell-pending{0%{opacity:.25;transform:translate(-44px)}to{opacity:.7;transform:translate(44px)}}:root:has(.shell__dock){scroll-padding-bottom:80px}:root:has(.shell__dock--main-row){scroll-padding-bottom:180px}body:has(.shell__dock){padding-bottom:72px}body:has(.shell__dock--main-row){padding-bottom:180px}.shell__dock{inset-inline:0;z-index:20;gap:var(--dock-pad);padding:var(--dock-pad) 8px calc(var(--dock-pad) + env(safe-area-inset-bottom));border-top:1px solid var(--rule);background:var(--paper);flex-wrap:wrap;display:flex;position:fixed;bottom:0;box-shadow:0 -4px 14px #1b234014}.shell__main{gap:var(--dock-pad);flex:2 1 0;min-width:0;display:flex}.shell__dock--main-row .shell__main{flex:1 0 100%}.shell-btn{appearance:none;min-width:0;min-height:var(--dock-row);border:1.5px solid var(--ink);background:var(--paper);color:var(--ink);font:700 .8125rem/1.1 var(--font-body);text-align:center;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;border-radius:8px;flex-direction:column;flex:1 1 0;justify-content:center;align-items:center;gap:1px;padding:4px 2px;display:inline-flex}.shell-btn:hover:not(:disabled){background:var(--paper-shade)}.shell-btn:active:not(:disabled){transform:translateY(1px)}.shell-btn:disabled{border-color:var(--rule);color:#70748a;cursor:not-allowed}.shell-btn--primary{background:var(--ink);color:var(--paper)}.shell-btn--primary:hover:not(:disabled){background:#2d3968}.shell-btn--primary:disabled{border-color:var(--rule);background:var(--paper-shade);color:#70748a}.shell-btn--text{font-size:1rem}.shell-btn__label{white-space:nowrap;max-width:100%;overflow:hidden}.shell-btn--text .shell-btn__label{overflow-wrap:anywhere;white-space:normal;overflow:visible}.shell-btn[data-icon-only] .shell-btn__label{clip-path:inset(50%);width:1px;height:1px;position:absolute}@media (max-width:899px),(max-height:500px){.shell-btn--compact{flex:0 0 var(--dock-row)}.shell-btn--compact .shell-btn__label{clip-path:inset(50%);width:1px;height:1px;position:absolute}}.shell-more__tool .shell-btn{flex-direction:row;justify-content:flex-start;gap:8px;width:100%;padding-inline:10px}.shell-icon{fill:none;stroke:currentColor;stroke-width:1.9px;stroke-linecap:round;stroke-linejoin:round;flex:none;width:22px;height:22px}.shell-btn.is-ready{animation:.9s ease-in-out .5s 2 shell-nudge}@keyframes shell-nudge{50%{transform:translateY(-3px)}}.shell-more{flex:1 1 0;min-width:0;display:flex;position:relative}.shell-more__menu{inset-inline-end:0;z-index:30;border:1.5px solid var(--ink);border-radius:var(--radius);background:var(--paper);min-width:190px;box-shadow:var(--shadow);gap:4px;padding:6px;display:grid;position:absolute;bottom:calc(100% + 8px)}.shell-more__menu[hidden]{display:none}.shell-more__item{min-height:48px;color:var(--ink);font:700 1rem var(--font-body);text-align:start;cursor:pointer;background:0 0;border:0;border-radius:8px;padding:0 12px}.shell-more__item:hover:not(:disabled){background:var(--paper-shade)}.shell-more__item:disabled{color:#70748a;cursor:not-allowed}.shell-strip{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:stretch;gap:6px;width:100%;max-width:720px;margin:0 auto;display:grid}.shell-chip{border:1.5px solid var(--rule);border-radius:var(--radius);background:var(--paper);align-items:center;gap:6px;min-width:0;min-height:44px;padding:3px 10px 3px 6px;transition:border-color .12s;display:flex;position:relative}.shell-chip--end{text-align:end;flex-direction:row-reverse;padding:3px 6px 3px 10px}.shell-chip.is-active{border-color:var(--ink)}.shell-chip__mark{flex:none;width:26px;height:26px}.shell-chip__mark svg{width:100%;height:100%;display:block}.shell-chip__who{flex-direction:column;flex:1 1 0;min-width:0;line-height:1.15;display:flex}.shell-chip__name{overflow-wrap:anywhere;align-self:flex-start;max-width:100%;font-size:.9375rem;font-weight:700}.shell-chip--end .shell-chip__name{align-self:flex-end}.shell-chip.is-active .shell-chip__name{background:var(--highlight)}.shell-chip__detail{overflow-wrap:anywhere;color:var(--ink-soft);font-size:.75rem}.shell-chip__score{font-family:var(--font-hand);font-variant-numeric:tabular-nums;flex:none;padding-top:3px;font-size:1.4rem;line-height:1}.shell-strip__tally{min-width:44px;font-family:var(--font-hand);flex-direction:column;justify-content:center;align-items:center;font-size:1.2rem;line-height:1;display:flex}.shell-strip__label{font-family:var(--font-body);color:var(--ink-soft);margin-top:2px;font-size:.75rem}@media (max-width:360px),(orientation:landscape) and (max-height:500px){.shell-strip{gap:4px}.shell-chip,.shell-chip--end{gap:3px;padding-inline:4px}.shell-chip__mark{width:20px;height:20px}.shell-chip__name{font-size:.8125rem}.shell-chip__score{font-size:1.2rem}.shell-strip__tally{min-width:36px}}.shell-setup{overscroll-behavior:contain;border:0;border-top:1.5px solid var(--ink);background:var(--paper);width:100%;max-width:560px;max-height:88svh;color:var(--ink);border-radius:16px 16px 0 0;margin:0 auto;padding:0;scroll-padding-top:72px;position:fixed;inset:auto 0 0;overflow:auto}.shell-setup[open]{animation:.2s ease-out both shell-sheet}.shell-setup::backdrop{background:#1b234066}@keyframes shell-sheet{0%{transform:translateY(100%)}}.shell-setup__head{z-index:2;background:var(--paper);border-bottom:1px solid var(--rule-soft);justify-content:space-between;align-items:center;gap:8px;padding:8px 8px 8px 16px;display:flex;position:sticky;top:0}.shell-setup__head h2{font-size:1.4rem}.shell-setup__close{appearance:none;width:48px;height:48px;color:var(--ink);cursor:pointer;background:0 0;border:0;border-radius:8px;justify-content:center;align-items:center;padding:0;display:inline-flex}.shell-setup__close:hover{background:var(--paper-shade)}.shell-setup__body{padding:0 16px calc(20px + env(safe-area-inset-bottom));flex-direction:column;gap:16px;display:flex}.shell-setup__body .game-panel{box-shadow:none;background:0 0;border:0;border-radius:0;padding:0}.shell-setup__body .game-panel h2{font-size:1.25rem}.shell-setup__fullscreen{flex-direction:row;flex:none;gap:8px;width:100%;min-height:48px}.shell-opponent{gap:6px;display:grid}.shell-opponent__option{cursor:pointer;position:relative}.shell-opponent__option input{opacity:0;cursor:pointer;width:100%;height:100%;margin:0;position:absolute;inset:0}.shell-opponent__option span{border:1.5px solid var(--ink);border-radius:8px;align-items:center;gap:10px;min-height:48px;padding:4px 12px;font-weight:700;line-height:1.15;display:flex}.shell-opponent__option input:checked+span{background:var(--ink);color:var(--paper)}.shell-opponent__option input:not(:checked):hover+span{background:var(--paper-shade)}.shell-opponent__option input:focus-visible+span{outline:3px solid var(--focus);outline-offset:2px}.shell-opponent__elsewhere{color:inherit;text-decoration:none}.shell-opponent__elsewhere:hover span{background:var(--paper-shade)}@media (orientation:landscape) and (max-height:500px){:is(:root:has(.shell__dock),:root:has(.shell__dock--main-row)){scroll-padding-bottom:0}:is(body:has(.shell__dock),body:has(.shell__dock--main-row)){padding-bottom:0}.shell{--shell-title-h:0px;--shell-play-h:calc(100svh - var(--site-header-h) - var(--site-offer-h,0px));--shell-foot:max(4px, env(safe-area-inset-bottom));--shell-board-h:calc(var(--shell-play-h) - 4px - var(--shell-foot));--shell-gap:12px;--shell-side-min:240px;--shell-side-max:360px;--shell-columns:min(calc(var(--shell-board-h) * var(--board-ratio)), calc(100% - var(--shell-gap) - var(--shell-side-min))) minmax(var(--shell-side-min), var(--shell-side-max))}.shell__play{grid-template-columns:var(--shell-columns);justify-content:center;gap:4px var(--shell-gap);min-height:0;padding:4px 8px var(--shell-foot);grid-template-rows:auto auto minmax(0,1fr);grid-template-areas:"stage strip""stage status""stage dock";display:grid}.shell__strip{grid-area:strip}.shell__status{grid-area:status}.shell__stage{grid-area:stage}.shell__dock{box-shadow:none;background:0 0;border:0;grid-area:dock;align-content:end;padding:0;position:static}.shell-setup{max-height:94svh}}@media (min-width:900px) and (min-height:501px){:is(:root:has(.shell__dock),:root:has(.shell__dock--main-row)){scroll-padding-bottom:0}:is(body:has(.shell__dock),body:has(.shell__dock--main-row)){padding-bottom:0}.shell{--shell-title-h:52px;padding:0 var(--gutter);grid-template-columns:minmax(0,1fr) 340px;align-items:start;gap:24px;display:grid}.shell__play{gap:8px;min-height:460px;padding:4px 0 8px}.shell__board{max-width:720px}.shell__dock{width:100%;max-width:560px;box-shadow:none;background:0 0;border:0;align-self:center;padding:0;position:static}#setup-open{display:none}.shell-more:not(:has(.shell-more__item:not(#setup-open),.shell-more__tool)){display:none}.shell-status{height:52px;font-size:1.35rem}.shell-status.is-result{font-size:1.35rem}.shell-setup,.shell-setup:not([open]){border:1.5px solid var(--ink);border-radius:var(--radius);width:auto;max-width:none;max-height:none;display:block;position:static;overflow:visible}.shell-setup__head{border:0;padding:12px 16px 8px;position:static}.shell-setup__close{display:none}}@media (prefers-reduced-motion:reduce){.shell__stage{transition:none}.shell-setup[open]{animation:none}}
