/* 神経衰弱固有の見た目（共通は ../common/base.css） */
#table { display: block; width: 100%; height: auto; user-select: none; -webkit-user-select: none; touch-action: manipulation; }
#table text { pointer-events: none; }
.stage { padding: 10px; }
@media (max-width: 480px) { .stage { padding: 6px; margin-left: -4px; margin-right: -4px; } } /* 盤だけ左右に広げる（ページの余白は共通の16px。D1） */

/* 札 */
.card .flip { transform-box: fill-box; transform-origin: center; }
.card.lift .piece { filter: var(--shadow-lift); }
.card.pickable { cursor: pointer; }
.card-hit { fill: transparent; }
.slot { fill: rgba(0, 0, 0, .1); stroke: rgba(255, 255, 255, .14); stroke-width: 1.2; stroke-dasharray: 4 3; }

/* 光る枠（CPUが選んだ札・そろった札・はずれ・キーボードの位置） */
.ring { fill: none; stroke-width: 4; }
.ring.pick { stroke: #FFE7A3; stroke-width: 5; }
.ring.ok { stroke: #7FD49A; stroke-width: 5; }
.ring.ng { stroke: #FFFFFF; stroke-width: 3; stroke-dasharray: 6 4; }
.ring.focus { stroke: #FFF8EA; stroke-width: 3; stroke-dasharray: 5 3; }
.pulse { animation: pulse 0.9s ease-in-out infinite; }
@keyframes pulse { 50% { opacity: .35; } }
@media (prefers-reduced-motion: reduce) { .pulse { animation: none; } }
.miss-mark circle { fill: #B23A3A; stroke: #FFFFFF; stroke-width: 2.5; }
.miss-mark path { stroke: #FFFFFF; stroke-width: 3.5; fill: none; stroke-linecap: round; }
.ok-mark circle { fill: #2E7D4F; stroke: #FFFFFF; stroke-width: 2.5; }
.ok-mark path { stroke: #FFFFFF; stroke-width: 3.5; fill: none; stroke-linecap: round; stroke-linejoin: round; }

/* 席 */
.seat-box { fill: #FFF8EA; stroke: rgba(0, 0, 0, .3); stroke-width: 1.5; transition: stroke var(--dur); }
.seat.on .seat-box { stroke: #1F2328; stroke-width: 4; }
.seat-name, .seat-count { fill: #1F2328; }
.seat-sub { fill: #5B616B; }
.pile-card { fill: #FFFFFF; stroke: #9C968A; stroke-width: 1.2; }
.seat.got .seat-box { animation: got .5s ease-out; }
@keyframes got { 30% { fill: #E3F4E8; } }

.rule-list .field { margin-bottom: 12px; }
.result-box { inset: 10% 6% auto; max-height: 84%; overflow: auto; }
.result-box li { font-size: 17px; }
@media (max-width: 480px) { .article th, .article td { padding: 6px; font-size: 14px; } }
@media (max-width: 480px) { #play .controls { gap: 6px; } #play .btn.icon { padding: 0 8px; font-size: 14px; } #play .spacer { display: none; } }
/* 上のバーの高さを一定に（No.93。数字は一番長い文が画面の幅（360px・375px 以上・641px 以上）で何行になるか。--tb-rt はふりがなの分。base.css・turnbar.js） */
.turnbar { --tb-msg-lines: 2; --tb-st-lines: 1; --tb-rt: 0px; --tb-st-rt: 0px; }
@media (min-width: 375px) { .turnbar { --tb-msg-lines: 2; --tb-st-lines: 1; } }
@media (min-width: 641px) { .turnbar { --tb-msg-lines: 1; --tb-st-lines: 1; } }
:root:lang(en) .turnbar { --tb-msg-lines: 2; --tb-st-lines: 2; --tb-rt: 0px; --tb-st-rt: 0px; }
@media (min-width: 375px) { :root:lang(en) .turnbar { --tb-msg-lines: 2; --tb-st-lines: 2; } }
@media (min-width: 641px) { :root:lang(en) .turnbar { --tb-msg-lines: 1; --tb-st-lines: 1; } }
/* 上のバーの高さ ここまで */
