/* Readable panels instead of a phone-height dashboard squeeze. */
.play-main { display:flex; flex-direction:column; }
.story-feed { flex:1; }
.scene-board, .scene-panel, .choice-dock, #critical-banner, #roll-card { flex-shrink:0; }
.scene-panel { margin:12px; }
.scene-panel summary { padding:8px 0; }
.story-entry { border-radius:8px; }
.typed-mode { flex-direction:row; }
.typed-mode button { min-height:40px; padding:8px 12px; }
.typed-move-row { grid-template-columns:minmax(0,1fr) 76px; }
.typed-mode { grid-column:1/-1; }
.typed-move button[type="submit"] { border-radius:8px; min-height:48px; }
.intel-nav button { min-height:44px; }
.log-entry { margin:16px 0; padding:18px; border:1px solid #343c44; border-radius:10px; background:#171e25; }
.log-entry p { font-size:15px; line-height:1.8; white-space:pre-wrap; }
.journal-input { color:#e7bc7f; }

@media (max-width:700px) {
  .game-screen { height:auto; min-height:100dvh; overflow:visible; padding:0 12px 24px; }
  .game-header { height:64px; padding:0 2px; border-bottom:0; }
  .game-logo { font-size:20px; }
  .game-header .back-button { font-size:10px; }
  .stat-strip { height:auto; overflow:visible; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:1px; border:1px solid #303941; border-radius:12px; background:#303941; }
  .stat-strip > div { grid-column:span 2; padding:12px; min-width:0; border:0; background:#11171c; overflow:hidden; }
  .stat-strip > div:nth-child(n+4) { grid-column:span 3; }
  .stat-strip > div:first-child { border-top-left-radius:12px; }
  .stat-strip > div:nth-child(3) { border-top-right-radius:12px; }
  .stat-strip > div:nth-child(4) { border-bottom-left-radius:12px; }
  .stat-strip > div:last-child { border-bottom-right-radius:12px; }
  .stat-strip span { font-size:9px; letter-spacing:.09em; color:#a4aeb8; }
  .stat-strip strong { display:block; margin-top:5px; font-size:22px; overflow-wrap:anywhere; }
  .mobile-utilities { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; margin:14px 0 18px; padding:0; border:0; background:none; }
  .mobile-utilities button { grid-column:span 2; min-width:0; min-height:64px; padding:10px 8px; text-align:left; border:1px solid #343c44; border-radius:10px; background:#171e25; color:#f0e5d4; }
  .mobile-utilities button:nth-child(n+4) { grid-column:span 3; }
  .mobile-utilities span { display:block; font:600 14px/1.4 system-ui,sans-serif; }
  .mobile-utilities small { display:block; margin-top:4px; color:#9eabb7; font:11px/1.3 system-ui,sans-serif; }
  .game-layout { display:block; height:auto; padding:0; overflow:visible; background:none; }
  .play-column { display:flex; flex-direction:column; height:auto; overflow:visible; border:0; background:none; gap:14px; }
  .play-main { overflow:visible; gap:12px; }
  .scene-board { padding:16px; border:1px solid #303941; border-radius:12px; background:#11171c; }
  .scene-board-top { grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:16px; }
  .scene-board-top span { font-size:9px; color:#9ca9b5; }
  .scene-board-top strong { margin-top:7px; font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
  .scene-panel { margin:0; padding:10px 14px; border-radius:12px; }
  .story-feed { flex:auto; height:55dvh; min-height:330px; max-height:640px; padding:22px 18px; gap:28px; border:1px solid #303941; border-radius:12px; background:linear-gradient(145deg,#1b232b,#10151a); scroll-padding:20px; }
  .story-entry { flex-shrink:0; padding:0 0 0 16px; }
  .story-entry > div { flex-wrap:wrap; gap:8px; line-height:1.5; }
  .story-entry p { font-size:17px; line-height:1.85; overflow-wrap:anywhere; }
  .player-entry { margin:0 0 0 5%; padding:14px; }
  .choice-dock { display:block; padding:12px; border:1px solid #303941; border-radius:12px; box-shadow:none; overflow:visible; }
  #more-moves { width:100%; margin:0 0 8px; min-height:44px; text-align:left; }
  .suggested-row { display:grid; grid-template-columns:1fr; overflow:visible; padding:0; gap:8px; }
  .suggested-row button { width:100%; min-height:52px; padding:12px; border-radius:8px; text-align:left; }
  .typed-move { padding:16px; border:1px solid #87512d; border-radius:12px; background:#141a20; }
  .typed-move-head { display:block; margin-bottom:12px; }
  .typed-move-row { gap:12px; }
  .typed-mode { gap:8px; }
  .typed-mode button { flex:1; min-height:40px; padding:8px; font-size:11px; border-radius:6px; }
  #typed-move-input { min-height:100px; }
  .typed-move button[type="submit"] { min-width:60px; }
  .intel-panel.mobile-open { position:fixed; inset:0; z-index:1000; padding:env(safe-area-inset-top) 14px calc(24px + env(safe-area-inset-bottom)); background:#10161c; overflow-y:auto; overscroll-behavior:contain; }
  #close-intel { position:sticky; top:0; z-index:12; min-height:60px; padding:18px 4px; background:#10161c; }
  .intel-nav { position:static; gap:8px; margin:12px 0 20px; }
  .intel-nav button { padding:12px 6px; border-radius:8px; }
  .intel-content { min-height:0; padding:6px 4px 24px; }
  #turn-status:not(:empty) { padding:12px; }
}