/* mobile.css —— 9:16 竖屏适配（本地 + 联机共用） */
html, body { height: 100%; }
body {
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #111;
  overflow: hidden;
  -webkit-text-size-adjust: 100%;
}
#app {
  width: min(100vw, calc(100dvh * 9 / 16));
  height: min(100dvh, calc(100vw * 16 / 9));
  aspect-ratio: 9 / 16;
  padding: 6px;
  background: #fff;
  overflow: hidden;
}
@media (min-width: 700px) {
  #app {
    border: 1px solid #111;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
  }
}

/* 竖屏：玩家上下排列，日志压缩，操作区固定底部可滚 */
.mid { flex-direction: column; gap: 6px; }
.player-area { flex-direction: column; gap: 6px; overflow-y: auto; }
.player-area > div { flex: 0 0 auto; overflow: visible; }
.log-panel {
  width: auto;
  max-height: 18dvh;
  margin-bottom: 0;
}
.log-panel .log { font-size: 12px; line-height: 1.35; }
#app > .box:last-child {
  max-height: 36dvh;
  padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px));
}
.box { padding: 6px; margin-bottom: 6px; }
.sec { font-size: 13px; }
.row { font-size: 12px; line-height: 1.45; }
button {
  min-height: 34px;
  padding: 5px 9px;
  margin: 3px 4px 3px 0;
  font-size: 13px;
  touch-action: manipulation;
}
.chip {
  padding: 3px 5px;
  font-size: 12px;
  touch-action: manipulation;
}
.detail { font-size: 12px; }
.detail .sec2 { font-size: 12px; }

/* 极窄屏再压一点 */
@media (max-width: 380px) {
  .row, .log-panel .log { font-size: 11px; }
  button { font-size: 12px; min-height: 32px; padding: 4px 7px; }
}