.board-wrapper{--cell-w:84px;--cell-h:110px;--cell-gap:6px;--arrow-size:26px;--shift-btn-accel-size:calc(var(--arrow-size) * .7);gap:var(--cell-gap);grid-template-rows:auto 1fr auto;grid-template-columns:auto 1fr auto;padding:12px;display:grid}.board-arrows-top,.board-arrows-bottom{grid-template-columns:repeat(var(--cols), 1fr);gap:var(--cell-gap);display:grid}.board-arrows-left,.board-arrows-right{grid-template-rows:repeat(var(--rows), 1fr);gap:var(--cell-gap);display:grid}.shift-line{gap:3px}.board-arrows-top .shift-line,.board-arrows-bottom .shift-line{flex-direction:row;justify-content:center;align-items:center;display:flex}.board-arrows-left .shift-line,.board-arrows-right .shift-line{grid-template-rows:auto auto;grid-template-columns:1fr;align-self:center;place-items:center;width:fit-content;height:fit-content;display:grid}.board-arrows-left .shift-btn:not(.shift-btn-accel),.board-arrows-right .shift-btn:not(.shift-btn-accel){grid-area:2/1}.board-arrows-left .shift-btn-accel,.board-arrows-right .shift-btn-accel{grid-area:1/1}.board-grid{transition:width .5s ease-in-out,height .5s ease-in-out;position:relative}.card-slot{width:var(--cell-w);height:var(--cell-h);transition:transform .55s ease-in-out;position:absolute;top:0;left:0}.card-slot.wrap-shift{z-index:5;transition:none;animation:.55s ease-in-out wrap-shift}.card-slot.edge-slide{z-index:6}@keyframes wrap-shift{0%{transform:translate(var(--old-x), var(--old-y)) scale(1);opacity:1}40%{transform:translate(var(--old-x), var(--old-y)) scale(0);opacity:0}60%{transform:translate(var(--new-x), var(--new-y)) scale(0);opacity:0}to{transform:translate(var(--new-x), var(--new-y)) scale(1);opacity:1}}.card-slot-removing{z-index:1;pointer-events:none}.card-removing-inner{transform-origin:50%;width:100%;height:100%;animation:.5s ease-in forwards compress-remove}@keyframes compress-remove{0%{opacity:1;transform:scale(1)rotate(0)}to{opacity:0;transform:scale(.1)rotate(-8deg)}}.card-restoring-inner{transform-origin:50%;width:100%;height:100%;animation:.5s ease-out compress-restore}@keyframes compress-restore{0%{opacity:0;transform:scale(.1)rotate(-8deg)}to{opacity:1;transform:scale(1)rotate(0)}}@media (prefers-reduced-motion:reduce){.board-grid{transition:none}.card-removing-inner,.card-restoring-inner{animation-duration:.01ms}}.shift-btn{cursor:pointer;width:var(--arrow-size);height:var(--arrow-size);background:0 0;border:none;flex-shrink:0;place-items:center;padding:0;transition:transform .15s;display:grid}.shift-btn-accel{height:var(--shift-btn-accel-size)}.shift-btn-accel-arrows{pointer-events:none;align-items:center;height:100%;display:flex}.shift-btn-accel-img{width:calc(var(--shift-btn-accel-size) * .8);height:calc(var(--shift-btn-accel-size) * .8);object-fit:contain;pointer-events:none;display:block}.shift-btn-accel-img+.shift-btn-accel-img{margin-left:calc(var(--shift-btn-accel-size) * -.18)}.shift-btn:hover:not(:disabled){transform:scale(1.3)}.shift-btn:active:not(:disabled){transform:scale(1.15)}.shift-btn-img{width:100%;height:100%;max-width:var(--arrow-size,26px);max-height:var(--arrow-size,26px);object-fit:contain;pointer-events:none;display:block}.shift-btn-disabled,.shift-btn:disabled{opacity:.25;cursor:not-allowed}.shift-btn-reverse .shift-btn-img{filter:drop-shadow(0 0 1px var(--danger)) drop-shadow(0 0 2px var(--danger));opacity:.55}.shift-btn-reverse:hover:not(:disabled) .shift-btn-img{opacity:.9}.shift-btn-reverse .shift-btn-accel-img{filter:drop-shadow(0 0 1px var(--danger)) drop-shadow(0 0 2px var(--danger));opacity:.55}.shift-btn-reverse:hover:not(:disabled) .shift-btn-accel-img{opacity:.9}@media (max-width:565px){body:before{background:0 0}.board-wrapper{--arrow-size:20px;--cell-gap:4px;--cell-w:clamp(44px, calc((100vw - 72px - (var(--cols) - 1) * var(--cell-gap)) / var(--cols)), 84px);--cell-h:calc(var(--cell-w) * 1.3095);padding:6px}}
.deck-stack{width:72px;height:96px;margin:6px 0 0;position:relative}.deck-stack .deck-card{border:1px solid var(--brand-shadow);background:radial-gradient(circle at 50% 30%, #ffe6aa33, transparent 60%), linear-gradient(135deg, var(--brand-primary), var(--brand-shadow) 80%);border-radius:5px;position:absolute;inset:0;box-shadow:0 2px 4px #00000073}.deck-stack .deck-card-back-1{transform:translate(-6px,-6px)rotate(-4deg)}.deck-stack .deck-card-back-2{transform:translate(-3px,-3px)rotate(-2deg)}.deck-stack .deck-card-front{z-index:1;place-items:center;display:grid}.deck-stack .deck-card-front:before{content:"";pointer-events:none;border:1px solid #f5e7c859;border-radius:3px;position:absolute;inset:4px}.deck-count-text{color:#f5e7c8;text-shadow:0 1px 2px #000000b3;font-family:Georgia,serif;font-size:30px;font-weight:700}.deck-empty .deck-card-front{opacity:.6;background:repeating-linear-gradient(45deg,#2a1d12 0 6px,#1a1208 6px 12px)}.deck-empty-text{color:#f5e7c8;opacity:.5;font-family:Georgia,serif;font-size:28px}
@media (min-width:1201px){.replay-view{align-items:stretch;height:100vh;min-height:0;max-height:100vh;overflow:hidden}.replay-view .board-area,.replay-view .replay-role-panel,.replay-view .action-log{min-height:0;max-height:100%}.replay-view .action-log{overflow-y:auto}}.replay-controls{flex-direction:column;align-items:center;gap:12px;width:100%;max-width:520px;margin-top:12px;padding:0 8px;display:flex}.replay-controls-bar{align-items:center;gap:8px;display:flex}.replay-control-btn{border:2px solid var(--panel-border);color:#3d2814;cursor:pointer;background:#e4c698e6;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:22px;line-height:1;display:inline-flex}.replay-control-btn:hover:not(:disabled){background:#f0dcc0}.replay-control-btn:disabled{opacity:.45;cursor:default}.replay-control-btn-active{background:#c8e6c9;border-color:#2e7d32}.replay-steps{flex-wrap:nowrap;gap:4px;width:100%;padding:2px;display:flex;overflow:auto hidden}.replay-step-cell{border:2px solid var(--panel-border);color:#f0dcc08c;cursor:pointer;background:#3d28148c;border-radius:6px;flex:none;justify-content:center;align-items:center;width:28px;height:28px;font-size:12px;font-weight:600;line-height:1;display:inline-flex}.replay-step-cell:hover{border-color:#2e7d32}.replay-step-cell-done{color:#3d2814;background:#e4c698f2}.replay-step-cell-current{border-color:#2e7d32;box-shadow:0 0 0 2px #2e7d3273}@media (max-width:767px){.replay-controls{max-width:none;padding:0}.replay-steps{flex-wrap:wrap;justify-content:center;overflow-x:visible}.replay-controls-bar{flex-wrap:wrap;justify-content:center}}.replay-lobby-btn{white-space:nowrap;margin-left:8px}.replay-role-panel{flex-direction:column;align-self:start;gap:12px;min-width:280px;display:flex}.replay-role-block{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);border:1px solid var(--panel-border);background:#e4c698b8;border-radius:8px;flex-direction:column;gap:8px;padding:12px;display:flex;box-shadow:1px 4px 8px #00000073}.replay-role-header-mafia{background:#6c2222;border-color:#4a1515}.fbi-replay-deck-block{padding-top:10px;padding-bottom:10px}.fbi-replay-deck-row{align-items:center;margin:0}.fbi-replay-counters-inline{color:#3d2814;flex-direction:column;gap:4px;font-size:13px;font-weight:600;display:flex}.fbi-replay-characters{flex-flow:wrap;justify-content:flex-start;gap:10px;display:flex}.fbi-replay-character-card{flex-direction:column;align-items:center;gap:6px;width:72px;display:flex}.fbi-replay-character-portrait{flex:none;justify-content:center;align-items:center;display:flex}.fbi-replay-character-meta{text-align:center;flex-direction:column;align-items:center;gap:2px;width:100%;min-width:0;display:flex}.fbi-replay-character-role{color:#3d2814;font-size:12px;font-weight:700;line-height:1.2}.fbi-replay-character-player{color:#5a4030;white-space:nowrap;text-overflow:ellipsis;max-width:100%;font-size:11px;line-height:1.2;overflow:hidden}.fbi-replay-hand{align-items:flex-start;margin-top:8px}.replay-role-row{align-items:center;gap:10px;display:flex}.replay-role-identity{flex:0 0 72px;justify-content:center;align-items:center;display:flex}.replay-role-placeholder{border:2px solid var(--panel-border);text-align:center;color:#3d2814;background:linear-gradient(#ffffffb8,#eccc8d8c);border-radius:4px;place-items:center;width:72px;height:96px;padding:8px;font-family:Georgia,serif;font-size:48px;font-weight:700;line-height:1;display:grid;box-shadow:1px 2px 3px #0000002e}.replay-role-masquerade{color:#3d2814;white-space:nowrap;font-size:14px;font-weight:600}.replay-role-row-inspector{align-items:center;gap:12px}.replay-role-hand-col{flex-direction:column;flex:1;align-items:center;gap:6px;min-width:0;display:flex}.replay-role-hand-col .section-title{width:100%;margin:0}.replay-role-hand{flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;width:100%;display:flex}.replay-role-hand .hand-mini-card{width:56px;height:74px}.replay-role-hand .card-name{padding:1px 0;font-size:10px}.replay-role-hand-empty{opacity:.45;font-size:16px}
