#board[data-kishin="true"]{height:auto!important;grid-template-rows:repeat(9,1fr)!important}
#board[data-kishin="true"] .square{aspect-ratio:1!important;min-height:0!important;position:relative;display:grid;place-items:center;border:1px solid #68889d!important;background:#0d2243!important}
#board[data-kishin="true"][data-surface="wood"] .square{background:repeating-linear-gradient(90deg,#edc279 0 3px,#e7b969 4px 5px)!important}
#board[data-kishin="true"][data-surface="ground"] .square{background:linear-gradient(130deg,#837043,#bfa775)!important}
:is(#board,#viewerMotionBoard)[data-kishin="true"] .square.selected{box-shadow:inset 0 0 0 4px #ffb329!important}
:is(#board,#viewerMotionBoard)[data-kishin="true"] .square.vote-target{box-shadow:inset 0 0 0 4px #7ee8ff!important}
.kishin-token{display:grid;place-items:center;position:relative;width:80%;height:80%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#a1f1ff,#125b86 65%,#051527);border:2px solid #85ebff;color:white;font-size:clamp(16px,3vw,34px);font-family:serif;font-weight:bold;line-height:1}
.kishin-token.kishin-away{transform:rotate(180deg);background:radial-gradient(circle at 35% 30%,#ffd8a1,#864b12 65%,#271505);border-color:#ffc071}
:is(#board,#viewerMotionBoard)[data-skin="wood"] .kishin-token{clip-path:polygon(50% 0,84% 18%,100% 100%,0 100%,16% 18%);border:0;border-radius:0;background:repeating-linear-gradient(90deg,#eac278 0 3px,#e4b76b 4px 5px);color:#241406}
:is(#board,#viewerMotionBoard)[data-skin="character"] .kishin-token{border-radius:40% 40% 24% 24%;padding-top:26%}
:is(#board,#viewerMotionBoard)[data-skin="character"] .kishin-token:before{content:'● ●';position:absolute;top:5%;left:0;right:0;text-align:center;font: bold .55em system-ui;color:white}
.kishin-token.kishin-promoted .kishin-glyph{color:#cf1127!important;text-shadow:0 0 2px white,0 0 4px white}

:is(#board,#viewerMotionBoard)[data-skin="disc"] .kishin-token{color:#111!important;background:radial-gradient(circle at 35% 30%,#e0faff,#7bc5dd 70%,#4299b5)!important;text-shadow:none!important}
:is(#board,#viewerMotionBoard)[data-skin="disc"] .kishin-away{background:radial-gradient(circle at 35% 30%,#fff2d1,#e4b976 70%,#b68c51)!important}
:is(#board,#viewerMotionBoard) .kishin-promoted .kishin-glyph{color:#bd1010!important;text-shadow:none!important}
#opponentHand,#myHand{position:static!important;min-height:40px;padding:8px;box-sizing:border-box;clear:both}
#miraiPersonalSkin[hidden],#miraiAssignedMatches[hidden]{display:none!important}

:is(#board,#viewerMotionBoard)[data-skin="disc"] .kishin-glyph{color:#111!important;-webkit-text-fill-color:#111!important;text-shadow:none!important}
:is(#board,#viewerMotionBoard) .kishin-promoted .kishin-glyph{color:#bd1010!important;-webkit-text-fill-color:#bd1010!important}
/* Explicit surfaces prevent legacy wood backgrounds from showing through. */
.board-frame[data-surface="space"]{background:linear-gradient(135deg,#0d173b,#21335a)!important;border-color:#6f91bb!important}
#board[data-kishin="true"][data-surface="space"]{background:radial-gradient(ellipse at 25% 30%,#554782,transparent 55%),linear-gradient(140deg,#07112e,#142a52)!important}
#board[data-kishin="true"][data-surface="space"] .square{background:radial-gradient(circle at 18% 25%,#fff9 0 1px,transparent 1.6px),radial-gradient(circle at 75% 70%,#badfff8c 0 .8px,transparent 1.5px),linear-gradient(145deg,#152d5099,#080d2299)!important;border-color:#7792b5!important}
:is(#board,#viewerMotionBoard)[data-kishin="true"] .square .kishin-token{display:grid!important;position:relative!important;inset:auto!important;width:80%!important;height:80%!important;min-width:0!important;min-height:0!important;opacity:1}
:is(#board,#viewerMotionBoard)[data-kishin="true"][data-skin="wood"] .kishin-token{background:#754213!important;isolation:isolate;color:#211005!important;box-shadow:none!important}
:is(#board,#viewerMotionBoard)[data-kishin="true"][data-skin="wood"] .kishin-token::before{content:'';position:absolute;inset:3px;clip-path:polygon(50% 0,84% 18%,100% 100%,0 100%,16% 18%);background:repeating-linear-gradient(90deg,#ffdf9b 0 4px,#f4cf86 5px 6px);z-index:-1}
:is(#board,#viewerMotionBoard)[data-kishin="true"] .square .kishin-token.replay-hidden{opacity:.32!important}
#opponentHand,#myHand{display:flex!important;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0!important}
#viewerEndDialog{position:fixed;left:50%;right:auto;bottom:auto;transform:translate(-50%,-50%);margin:0;width:min(420px,calc(100vw - 32px));max-height:80dvh;overflow:auto;box-sizing:border-box;padding:24px;border:2px solid #edbc3e;border-radius:14px;background:#122333;color:#fff;text-align:center;z-index:2147483647}
#viewerEndDialog::backdrop{background:#0008}
#viewerEndDialog p{font-size:1.5rem;font-weight:700;color:#ffd568}
#viewerEndDialog button,#viewerEndDialog a,.viewer-end-actions button,.viewer-end-actions a{display:inline-block;padding:10px 16px;margin:6px;border:1px solid #7794af;border-radius:8px;background:#1c3449;color:#fff;font:inherit;text-decoration:none;cursor:pointer}
#viewerEndDialog .primary{background:#edbc3e;color:#102333;font-weight:bold}
#viewerEndDialog [hidden],.viewer-end-actions [hidden]{display:none!important}
.viewer-end-actions{display:flex;gap:6px;flex-wrap:wrap}
/* Override legacy flex ordering, not only DOM ordering. */
.board-column #miraiTotalClocks{order:7!important;padding:4px 0!important;width:100%}
.board-column #opponentHand{order:9!important}
.board-column .board-frame{order:10!important}
.board-column #myHand{order:11!important}
.board-column .viewer-end-actions{order:12!important}
.board-column #viewerOpponentVoteClock,.board-column #miraiVoteProgress,.board-column #viewerTopMove{display:none!important}
.player-clocks{display:flex!important;justify-content:space-between;align-items:center;gap:12px}
.player-clocks[hidden]{display:none!important}
.player-clocks small{display:block;font-size:11px;font-weight:400;color:#bbcedb}
.player-clocks strong{font-variant-numeric:tabular-nums;line-height:1.1}
.own-clock strong{font-size:38px;color:#ffd05a}.enemy-clock{text-align:right}.enemy-clock strong{font-size:19px;color:#d6e3ed}
.viewer-rematch{flex-basis:100%;padding:8px 0;border-top:1px solid #526578}.viewer-rematch h3,.viewer-rematch p{margin:5px 0;font-size:14px}
#rematchNotice{position:fixed;inset:0;margin:auto;width:min(430px,90vw);max-height:70dvh;background:#122333;color:white;border:2px solid #edbc3e;border-radius:12px;padding:22px}
#rematchNotice::backdrop{background:#0008}
@media(max-width:760px){
 body{overflow-x:hidden}body header{height:auto!important;min-height:52px;padding:8px 10px!important;gap:6px;flex-wrap:wrap}
 header .brand{font-size:24px!important;margin:0!important}header .brand-ver{font-size:9px!important}
 #commonAccountEntry{font-size:13px!important;margin-right:64px;white-space:normal!important}
 main,#game{padding:4px!important;margin:0!important}.game-grid{display:flex!important;flex-direction:column!important;gap:8px!important}
 .board-column{width:100%!important;max-width:100%!important;min-width:0!important;padding:0!important;gap:0!important}
 .sidepanel{width:100%!important;min-width:0!important;max-width:100%!important;padding:8px!important}
 .viewer-selected-game-heading{padding:4px 2px!important;margin:0!important}.viewer-selected-game-heading h1,.viewer-selected-game-heading h2{font-size:19px!important;margin:4px 0!important}
 .board-frame{margin:0!important;padding:14px 15px!important;max-width:100%!important;box-sizing:border-box!important}
 #opponentHand,#myHand{min-height:32px!important;padding:3px!important;margin:2px 0!important;font-size:12px!important;gap:4px!important}
 .hand-piece{min-width:36px!important;min-height:36px!important}.viewer-end-actions button,.viewer-end-actions a{min-height:44px;margin:3px;padding:8px 12px;font-size:14px}
 #miraiPersonalSkin{padding:8px!important}#miraiPersonalSkin h3{font-size:15px;margin:4px 0}#miraiPersonalSkin label{display:inline-flex;align-items:center;gap:5px;width:49%}
 #miraiPersonalSkin select{min-height:44px;max-width:75%}.viewer-rematch button,.viewer-rematch a{min-height:44px}
}

/* The stored ground skin now depicts a grass field. */
.board-frame[data-surface="ground"]{background:linear-gradient(135deg,#23492b,#53763a)!important;border-color:#789057!important}
#board[data-kishin="true"][data-surface="ground"] .square{background:repeating-linear-gradient(108deg,#548641 0 3px,#5e9348 4px 6px,#66994d 7px 9px)!important;border-color:#c2d5a0!important}
.viewer-dark-mode{font-size:14px;color:#ffd56b;margin:4px 0 7px;font-weight:700;line-height:1.4}
#viewerReturnLink{display:inline-block;color:#ffda6c;padding:8px 12px;font-size:15px;white-space:nowrap}
#viewerDisplaySettingsOpen{position:static!important;min-height:44px;cursor:pointer}
header{position:sticky;top:0;z-index:90;flex-wrap:wrap;gap:6px;height:auto!important;min-height:54px}
#viewerDisplaySettings,#viewerReturnConfirm{position:fixed;inset:0;margin:auto;width:min(500px,calc(100vw - 24px));max-height:85dvh;overflow:auto;box-sizing:border-box;background:#122333;color:#fff;border:2px solid #edbc3e;border-radius:12px;padding:20px}
#viewerDisplaySettings::backdrop,#viewerReturnConfirm::backdrop{background:#0009}
#viewerDisplaySettings label{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0;width:100%}
#viewerDisplaySettings select,#viewerDisplaySettings button,#viewerReturnConfirm button,#viewerReturnConfirm a{min-height:44px;padding:8px 12px;font:inherit;border-radius:8px;cursor:pointer}
#viewerReturnConfirm a{display:inline-block;color:#ffd56b}
#viewerDisplaySettings #miraiPersonalSkin{padding:0!important;margin:0!important}#viewerDisplaySettings #miraiPersonalSkin label{width:100%}
/* Settings contain only viewer presentation controls. Playback remains at the board. */
.viewer-main-controls>.viewer-presentation-settings,.viewer-main-controls>.viewer-source-buttons,.viewer-main-controls>.viewer-settings-panel,.viewer-main-controls>.mobile-settings-close,#viewerEntryCard:empty{display:none!important}
#viewerAccountWrap,#viewerMobileAccountBelowClose,#viewerAccountMenu,#viewerSettingsLivePosition,#dxEventButton,#dxEventButtonMobile{display:none!important}

/* Clock lives above the board; keep move actions below. */
#viewerVoteClock{display:none!important}
/* A moving piece is one square, never a nine-row board. */
#viewerMotionBoard.viewer-motion-layer{position:fixed;pointer-events:none;z-index:1200;margin:0;padding:0;display:grid;grid-template:1fr / 1fr;place-items:center;min-width:0;min-height:0;box-sizing:border-box;background:none!important;border:0!important;overflow:hidden}
#viewerMotionBoard.viewer-motion-layer > .square{position:relative;display:grid;place-items:center;box-sizing:border-box;width:100%!important;height:100%!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;box-shadow:none!important;opacity:1!important}

/* Keep rematch inputs usable in the narrow board column. */
.viewer-rematch{min-width:0;max-width:100%;box-sizing:border-box}
.viewer-rematch p{overflow-wrap:anywhere}
.viewer-rematch-form{display:grid;gap:12px;padding:12px;border:1px solid #526578;border-radius:10px;background:#122333}
.viewer-rematch-form label{display:grid;grid-template-columns:minmax(0,1fr);gap:5px;font-size:14px;text-align:left}
.viewer-rematch-form select,.viewer-rematch-form input,.viewer-rematch select{box-sizing:border-box;min-width:0;width:100%;max-width:100%;min-height:44px;padding:8px;border:1px solid #7794af;border-radius:6px;background:#0e1d2a;color:#fff;font:inherit}
.viewer-rematch-form [hidden]{display:none!important}
.viewer-rematch-form button{margin:0;white-space:normal}

.viewer-rematch-result{margin:8px 0 12px;padding:12px;border:2px solid #edbc3e;border-radius:8px;background:#1b2a3c;color:#fff}
.viewer-rematch-result>strong{display:block;color:#ffd568;font-size:16px;line-height:1.5}

.kishin-glyph{display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;writing-mode:horizontal-tb!important;line-height:1!important;gap:0!important}
.kishin-glyph>span{display:block!important;writing-mode:horizontal-tb!important;line-height:1!important}
.kishin-two-glyphs{font-size:.62em!important}
.board-frame{position:relative}
#viewerYourTurn,#viewerLiveCheckResponse{position:absolute!important;left:50%!important;top:43%!important;transform:translate(-50%,-50%)!important;z-index:85;pointer-events:none;max-width:90%;width:max-content;padding:9px 16px!important;border:2px solid #ffdc69;border-radius:9px;background:#102333dc;color:#ffe181;font-size:clamp(16px,3vw,25px);font-weight:bold;text-align:center;white-space:normal}
#viewerLiveCheckResponse{top:56%!important;border-color:#ff7970;color:#fff;background:#991b1be8}
#viewerYourTurn[hidden],#viewerLiveCheckResponse[hidden]{display:none!important}

.ninja-tool-mark{position:absolute;bottom:0;left:0;right:0;z-index:7;pointer-events:none;text-align:center;font:700 clamp(7px,1.2vw,12px) sans-serif;color:#fff;background:#541778cf}
#ninjaMoveChoice{position:fixed;inset:0;margin:auto;width:min(430px,90vw);max-height:80dvh;overflow:auto;box-sizing:border-box;background:#122333;color:white;border:2px solid #edbc3e;border-radius:12px;padding:18px}
#ninjaMoveChoice::backdrop{background:#0009}#ninjaMoveChoice button{display:block;width:100%;min-height:44px;margin:8px 0;padding:8px;font:inherit}

/* Turn notice belongs to the top edge, leaving the playing area clear. */
#viewerYourTurn{top:0!important;transform:translateX(-50%)!important;padding:2px 12px!important;font-size:clamp(14px,2.5vw,20px);line-height:1.2}