.case-rules-panel p { margin: 8px 0 0; color: var(--muted); font-size: 13px; line-height: 1.7; white-space: pre-line; }
#caseMysteryRules { border-top: 1px solid var(--line); padding-top: 10px; }
#mysteryCardList { display: grid; gap: 12px; margin-top: 12px; }
.mystery-card { display: grid; grid-template-columns: 66px minmax(0, 1fr); align-items: start; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 6px; background: #1e211c; }
.mystery-card-preview { width: 66px; height: 104px; padding: 0; overflow: hidden; border-radius: 4px; }
.mystery-card-preview img { display: block; width: 100%; height: 100%; object-fit: cover; }
.mystery-card-preview:disabled { opacity: 1; cursor: default; }
.mystery-card-copy { display: grid; gap: 7px; min-width: 0; }
.mystery-card-copy strong { font-size: 15px; }
.mystery-card-copy span { color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.mystery-card-copy button { justify-self: start; padding: 5px 8px; font-size: 12px; }
.mystery-card-actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: end; gap: 6px; }
.mystery-card-actions button { padding: 7px 9px; font-size: 12px; min-height: 34px; }
.mystery-recipient { display: grid; gap: 3px; flex: 1 1 140px; color: var(--muted); font-size: 11px; min-width: 0; }
.mystery-recipient select { width: 100%; min-width: 0; min-height: 34px; padding: 5px; font-size: 12px; }
.mystery-transforms { grid-column: 1 / -1; display: grid; gap: 6px; }
.mystery-transforms label { display: grid; grid-template-columns: 34px minmax(0, 1fr) 42px; gap: 8px; align-items: center; font-size: 12px; color: var(--muted); }
.mystery-transforms input { width: 100%; min-width: 0; padding: 0; accent-color: #cba94e; }
.mystery-transforms output { text-align: right; font-variant-numeric: tabular-nums; }
#mysteryNotice { color: var(--gold); font-size: 12px; line-height: 1.6; min-height: 1em; margin-bottom: 0; }
.mystery-map-layer { position: absolute; inset: 0; z-index: 9; pointer-events: none; }
.mystery-map-piece { position: absolute; display: block; padding: 0; height: auto; min-height: 0; line-height: 0; border: 0; border-radius: 4px; background: transparent; touch-action: none; pointer-events: auto; cursor: grab; transform-origin: center; box-shadow: 0 1px 4px #0005; }
.mystery-map-piece img { display: block; width: 100%; height: auto; pointer-events: none; border-radius: 4px; }
.mystery-map-piece.locked { cursor: default; }
.mystery-map-piece.dragging { cursor: grabbing; outline: 2px solid #f2cc66; }
.suspect-token-layer, .crime-scene-layer, .player-token-layer, .hat-chip-layer, .reveal-marker-layer { z-index: 10; }
.case-reference-pages { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.case-reference-pages .asset-card { width: 100%; min-width: 0; }
.case-reference-pages .asset-card img { width: 100%; height: 300px; object-fit: contain; }
[hidden] { display: none !important; }
.story-audio-dialog { width: min(480px, calc(100vw - 32px)); }
.story-audio-dialog .case-audio-buttons { display: grid; grid-template-columns: 1fr; gap: 10px; }
#toggleCaseAudio { color: #f5d884; border-color: #987b37; }
.table-screen .case-heading { display: flex; align-items: center; gap: 12px; }
.case-heading-copy { min-width: 0; }
.table-screen .header-brief-card { display: block; flex: 0 0 70px; width: 70px; height: 64px; padding: 0; margin: 0; overflow: hidden; border-radius: 4px; }
.header-brief-card #briefTitle { display: none; }
.table-screen .header-brief-card img { display: block; width: 100%; height: 100%; max-height: none; object-fit: cover; }
.player-ribbon { padding: 10px 14px 0; }
.player-ribbon .player-board-row { grid-template-columns: repeat(var(--player-count, 4), minmax(0, 1fr)); gap: 8px; }
.player-ribbon .player-board-panel { padding: 8px 10px; border: 1px solid var(--line); border-left: 4px solid var(--board-color); background: #22241f; box-shadow: none; }
.player-ribbon .player-panel-header { display: flex; align-items: center; gap: 9px; min-width: 0; }
.player-panel-avatar { width: 32px; height: 32px; flex-shrink: 0; object-fit: cover; border-radius: 50%; border: 2px solid var(--board-color); }
.player-ribbon .player-identity { font-weight: 700; color: #f1f3ef; padding: 0; line-height: 1.5; }
.player-known-letters { display: flex; flex-wrap: wrap; gap: 4px; padding-top: 8px; border-top: 1px solid #ffffff12; }
.player-known-letter { display: grid; place-items: center; width: 20px; height: 22px; border: 1px solid #ffffff13; border-radius: 3px; color: #737b78; background: #171d1c; font-size: 12px; font-weight: 600; }
.player-known-letter.known { color: #fff; background: color-mix(in srgb, var(--board-color) 35%, #17201d); border-color: var(--board-color); box-shadow: inset 0 0 6px color-mix(in srgb, var(--board-color) 30%, transparent); }
.mystery-chip-bank { position: absolute; left: 1%; top: 22%; width: 18%; box-sizing: border-box; z-index: 14; padding: 8px; border: 1px solid #ffffff40; border-radius: 5px; background: #101b19a6; backdrop-filter: blur(2px); color: #fff; transform: scale(0.8); transform-origin: top left; }
.investigation-dialog { width: min(920px, calc(100vw - 32px)); max-height: 85vh; overflow-y: auto; }
.investigation-dialog .player-notes { margin: 0; }
.investigation-dialog textarea { width: 100%; min-height: 160px; box-sizing: border-box; }
.case-hover-preview { position: fixed; width: 220px; padding: 7px; z-index: 45; pointer-events: none; background: #171d1bf5; border: 1px solid #d2b05a; border-radius: 5px; box-shadow: 0 8px 24px #0008; }
.case-hover-preview img { display: block; width: 100%; height: 330px; object-fit: contain; }
.case-hover-preview strong { display: block; margin-top: 6px; color: #f7f4e8; font-size: 13px; line-height: 1.5; }
.suggested-answers { margin-top: 16px; border-top: 1px solid var(--line); padding-top: 12px; }
.suggested-answers h4 { margin: 0 0 10px; color: var(--gold); font-size: 14px; }
.suggested-answers article { border-bottom: 1px solid var(--line); padding: 10px 0; }
.suggested-answers article > strong { font-size: 12px; color: #e0c583; }
.suggested-answers article > p { margin: 7px 0; line-height: 1.7; white-space: pre-wrap; font-size: 13px; }
.reference-answer-actions { display: flex; gap: 8px; }
.reference-answer-actions button { padding: 6px 10px; font-size: 12px; }
.player-money-shortcuts { display: flex; gap: 8px; margin: 12px 0; }
.player-money-shortcuts button { min-width: 64px; min-height: 40px; font-size: 16px; }
.mystery-chip-bank > strong { display: block; margin-bottom: 6px; font-size: 12px; font-weight: 600; }
.mystery-chip-bank-tray { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; }
.mystery-chip-pile { display: flex; align-items: center; justify-content: center; gap: 4px; min-width: 0; padding: 3px 0; background: #ffffff0c; border-radius: 3px; font-size: 12px; }
.mystery-chip-pile img { width: 28px; height: 28px; object-fit: contain; filter: drop-shadow(0 1px 2px #0008); }
.mystery-chip-pile.empty { opacity: 0.4; }
.player-ribbon .player-board-panel.viewing { outline: 1px solid var(--board-color); }
.player-identity { display: block; width: 100%; padding: 2px 0 7px; border: 0; background: transparent; color: var(--board-color); text-align: left; font-size: 14px; overflow-wrap: anywhere; }
.player-identity:disabled { opacity: 1; }
.player-panel-actions { display: flex; flex-wrap: wrap; gap: 5px; }
.player-panel-actions button { min-height: 32px; padding: 5px 7px; font-size: 12px; }
.table-layout { grid-template-columns: minmax(0, 1fr) 420px; align-items: start; }
.table-layout .map-stage { grid-column: 1; grid-row: 1; min-width: 0; min-height: 0; }
.table-layout .case-panel { grid-column: 2; grid-row: 1; }
.table-layout .case-panel > .status-panel { display: grid; grid-column: auto; grid-row: auto; max-height: none; overflow: visible; padding: 16px 0 0; border: 0; border-top: 1px solid var(--line); background: transparent; border-radius: 0; box-shadow: none; }
.mystery-public-area { margin: 0; padding: 0; width: 100%; background: #fff; color: #252b2b; border: 0; border-top: 1px solid #d5dada; border-radius: 0; }
.mystery-public-area h3, .mystery-public-empty { display: none; }
.mystery-public-canvas { position: relative; height: 180px; min-height: 0; }
#mysteryPublicLayer .mystery-map-piece { box-shadow: none; }
#mysteryPublicLayer .mystery-map-piece img { width: auto; max-width: 100%; max-height: 160px; margin: auto; box-shadow: 0 1px 4px #0005; }
#truthBox:not(.locked) #revealTruth { display: inline-block; }
.player-tool-dialog { width: min(720px, calc(100vw - 24px)); max-height: 85vh; overflow: auto; }
.player-known-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 12px; }
.player-known-cards img { width: 100%; height: 180px; object-fit: contain; }
#playerToolContent { min-width: 0; }
#playerToolContent input { max-width: 100%; }
#playerToolContent > button { margin: 8px 8px 0 0; }
.case-panel > #actionPanel { order: -1; }
.action-panel .action-head { display: grid; gap: 8px; }
.action-panel .action-title-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.action-panel .action-title-row h3 { white-space: nowrap; font-size: 18px; }
.action-panel .action-title-row button { font-size: 12px; padding: 6px 8px; }
.action-panel #actionCounter { padding: 6px 8px; font-size: 12px; background: #2b2d26; color: #d4c48d; text-align: left; font-weight: 400; }
.action-panel .mystery-action-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.action-panel .mystery-action-row h4 { grid-column: 1 / -1; font-size: 14px; }
.action-panel .mystery-action-row button { min-width: 0; padding: 7px 5px; font-size: 12px; }
.request-tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.request-tabs button { padding: 8px 4px; font-size: 12px; min-width: 0; }
.request-tabs [aria-selected="true"] { background: #c5a04e; color: #191a17; }
.request-queue { max-height: 48vh; overflow-y: auto; overscroll-behavior: contain; }
.request-queue .interrogation-list { max-height: none; }
.guaranteed-question { display: flex; align-items: start; gap: 8px; color: #e6c66b; font-size: 13px; line-height: 1.6; }
.guaranteed-question input { width: 18px; height: 18px; margin-top: 3px; flex: 0 0 18px; }
.challenge-card-tokens { position: absolute; left: 0; right: 0; bottom: -17px; display: flex; flex-wrap: wrap; justify-content: center; gap: 2px; z-index: 12; pointer-events: none; }
.challenge-card-tokens span { display: inline-flex; background: var(--chip-color); color: #fff; padding: 2px 4px; font-size: 10px; line-height: 14px; border: 1px solid #fff; border-radius: 8px; text-shadow: 0 1px 2px #000; }
.challenge-card-tokens .challenge-chip-token { position: relative; display: inline-flex; align-items: center; background: none; border: 0; border-radius: 0; padding: 0; }
.challenge-chip-token img { width: 25px; height: 25px; object-fit: contain; background: none; box-shadow: none; }
.challenge-chip-token b { position: static; transform: none; padding: 0 2px; min-width: 0; border-radius: 3px; font-size: 9px; color: #fff; background: #18211ee6; }
.map-case-card { overflow: visible; }
.map-surface { position: relative; width: calc(1100px * var(--zoom, 1)); min-width: 0; }
.map-surface #mapBoard { width: 100%; overflow: visible; z-index: 10; }
.map-surface .mystery-public-area { box-sizing: border-box; width: 100%; }
.decision-player-info { position: absolute; right: 62px; top: 18px; max-width: 160px; }
.decision-player-info .interrogation-detective { display: flex; gap: 8px; align-items: center; margin: 0; }
.decision-player-info .interrogation-detective > img { margin: 0; width: 34px; height: 34px; flex-shrink: 0; }
.decision-player-info figcaption { white-space: pre-line; color: var(--detective-color); font-size: 12px; overflow-wrap: anywhere; line-height: 1.5; }
.decision-player-info:not(:empty) ~ #decisionDialogTitle { padding-right: 150px; }
.decision-dialog .interrogation-route--dialog { grid-template-columns: minmax(0, 1fr) 36px minmax(0, 1fr); max-width: 310px; }
.listener-choices { margin: 12px 0; padding: 12px; border: 1px solid var(--line); border-radius: 4px; }
.listener-choices legend { color: var(--muted); font-size: 13px; }
.listener-choices label { display: flex; align-items: center; gap: 10px; padding: 8px 0; font-size: 13px; }
.listener-choices input { width: 18px; height: 18px; flex-shrink: 0; }
.investigation-filters { display: grid; grid-template-columns: minmax(0, 1fr) 140px; gap: 8px; margin: 12px 0; }
.investigation-filters input, .investigation-filters select { min-width: 0; width: 100%; }
.investigation-day { grid-column: 1 / -1; margin: 16px 0 0; padding-bottom: 8px; border-bottom: 1px solid var(--line); color: var(--gold); }
.information-history-list article p { white-space: pre-wrap; line-height: 1.8; }
.information-history-list article > button { font-size: 12px; padding: 5px 9px; }
.search-reference-list article > button { margin-left: 10px; padding: 4px 8px; font-size: 12px; }
.interrogation-route { display: grid; grid-template-columns: minmax(50px, 1fr) 20px minmax(62px, 1fr) 28px minmax(62px, 1fr); align-items: start; gap: 8px; padding: 12px 0; min-width: 0; }
.interrogation-route figure { margin: 0; min-width: 0; text-align: center; }
.interrogation-route figcaption { margin-top: 6px; font-size: 12px; line-height: 1.5; overflow-wrap: anywhere; white-space: pre-line; color: var(--text); }
.interrogation-detective > img { display: block; width: 42px; height: 42px; margin: 14px auto 0; border: 2px solid var(--detective-color); border-radius: 50%; object-fit: cover; }
.interrogation-detective figcaption { color: var(--detective-color); }
.interrogation-route-link { padding-top: 30px; font-size: 13px; color: var(--muted); text-align: center; }
.interrogation-mini-preview { display: block; padding: 0; width: 68px; max-width: 100%; aspect-ratio: 0.65; margin: auto; border: 1px solid var(--line); border-radius: 4px; overflow: hidden; background: #24251f; }
.interrogation-mini-preview img { width: 100%; height: 100%; display: block; object-fit: cover; }
.interrogation-mini-preview:disabled { opacity: 1; cursor: default; }
.decision-dialog .interrogation-route { max-width: 440px; margin: 0 auto 12px; width: 100%; }
.information-history-list .interrogation-route { max-width: 400px; }
.interrogation-item > .interrogation-route { border-bottom: 1px solid var(--line); margin-bottom: 10px; }
@media (min-width: 821px) {
  .table-screen .topbar { grid-template-columns: minmax(200px, 1fr) 90px minmax(420px, 2fr); gap: 12px; padding: 10px 16px; }
  .table-screen .topbar h2 { font-size: 24px; }
  .table-screen .topbar .eyebrow { margin: 0 0 5px; font-size: 12px; }
  .table-screen .top-actions { justify-content: flex-end; gap: 6px; min-width: 0; }
  .table-screen .top-actions > button { font-size: 12px; padding: 7px 10px; }
  .table-screen .turn-summary { justify-self: stretch; grid-template-columns: 1fr; }
  .table-screen .turn-summary-item { min-height: 48px; padding: 7px 10px; }
  .table-screen .bgm-controls { min-height: 32px; }
  .table-screen .bgm-controls input { width: 90px; }
  .table-screen .role-pill, .table-screen .network-box { font-size: 12px; }
  .table-screen .player-ribbon .player-board-row { grid-template-columns: repeat(var(--player-count, 4), minmax(0, 1fr)); }
  .table-screen .player-board-panel { display: grid; align-content: start; gap: 8px; padding: 10px 12px; }
  .table-screen .player-identity { width: auto; padding: 0; font-size: 13px; }
  .table-screen .player-panel-actions { gap: 4px; }
  .table-screen .player-panel-actions button { font-size: 12px; padding: 5px 7px; }
  .table-screen .case-panel { display: flex; flex-direction: column; position: sticky; top: 112px; max-height: calc(100vh - 124px); overflow-y: auto; min-width: 0; gap: 18px; padding: 16px; box-shadow: none; }
  .table-screen .case-panel > * { flex-shrink: 0; min-width: 0; }
  .table-screen .map-scroll { height: calc(100vh - 238px); min-height: 430px; grid-template-columns: minmax(0, 1fr); }
  .table-screen .map-surface { width: calc(100% * var(--zoom, 1)); }
  .table-screen .map-surface .map-board { width: 100%; }
  .table-screen .action-panel { gap: 12px; }
  .table-screen .action-panel .mystery-action-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .table-screen .action-panel .mystery-action-row h4 { grid-column: 1 / -1; }
  .table-screen .action-panel .mystery-action-row { align-items: start; grid-auto-rows: max-content; }
  .table-screen .action-panel .mystery-action-row h4 { display: none; }
  .table-screen .request-queue { max-height: 44vh; }
  .table-screen #interrogateMystery { padding: 10px; }
  .table-screen .action-panel .interrogate-box { padding: 12px; }
  .table-screen .request-tabs button { font-size: 13px; padding: 9px 6px; }
}
@media (min-width: 821px) and (max-width: 1200px) {
  .table-screen .table-layout { grid-template-columns: minmax(0, 1fr) 360px; padding: 10px; gap: 10px; }
  .table-screen .topbar { grid-template-columns: minmax(0, 1fr) 90px; }
  .table-screen .top-actions { grid-column: 1 / -1; }
  .table-screen .case-panel { padding: 12px; top: 142px; max-height: calc(100vh - 154px); }
}
@media (max-width: 820px) {
  .player-ribbon .player-board-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .table-screen .topbar { grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
  .table-screen .top-actions { grid-column: 1 / -1; }
  .table-layout { grid-template-columns: minmax(0, 1fr); }
  .table-layout > * { min-width: 0; }
  .table-layout .map-stage { order: 1; min-height: 0; grid-column: auto; grid-row: auto; }
  .table-layout .case-panel { order: 2; grid-column: auto; grid-row: auto; }
  .table-layout .side-panel { order: 3; }
  .table-layout .status-panel { order: 4; grid-column: auto; grid-row: auto; }
  .table-layout .side-panel, .table-layout .case-panel, .table-layout .status-panel { max-height: none; overflow: visible; }
}
@media (max-width: 600px) {
  .player-ribbon { padding: 8px; overflow: hidden; }
  .player-ribbon .player-board-row { display: flex; overflow-x: auto; padding: 2px 1px 8px; }
  .player-ribbon .player-board-panel { flex: 0 0 285px; }
  .player-ribbon .player-board-panel { display: grid; gap: 8px; }
  .mystery-public-area { padding: 0; }
  .mystery-public-canvas { height: 150px; min-height: 0; }
  #mysteryPublicLayer .mystery-map-piece img { max-height: 130px; }
  .table-screen .topbar { position: static; padding: 12px; grid-template-columns: minmax(0, 1fr) 100px; }
  .table-screen .topbar h2 { font-size: 22px; line-height: 1.35; }
  .table-screen .topbar .eyebrow { margin: 0 0 6px; overflow-wrap: anywhere; }
  .table-screen .turn-summary { grid-template-columns: minmax(0, 1fr); width: 100%; }
  .table-screen .turn-summary-item { padding: 7px 10px; }
  .table-screen .top-actions { min-width: 0; gap: 6px; }
  .table-screen .top-actions > * { max-width: 100%; }
  .table-screen .bgm-controls { width: 100%; }
  .table-screen .bgm-controls input { min-width: 0; flex: 1; }
  .table-layout { padding: 8px; gap: 10px; }
  .table-layout .map-toolbar { flex-wrap: wrap; }
  .table-layout .map-scroll { height: 60vh; min-height: 320px; }
  .table-layout .player-board-row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .case-reference-pages { grid-template-columns: minmax(0, 1fr); }
  .case-reference-pages .asset-card img { height: 240px; }
}
#previewDialog > .dialog-close { position: absolute; top: 16px; right: 16px; z-index: 2; }
#previewDialog .preview-tools { grid-template-columns: 34px minmax(0, 1fr) 34px 52px; gap: 4px; }
#previewDialog .preview-tools input { min-width: 0; width: 100%; }