.room-screen { height: 100dvh; overflow: auto; padding: 32px 24px; background: linear-gradient(#111c1acd,#111c1ae8), url('./assets/covenant/scenes/council-chamber.webp') center/cover; }
.room-paper { max-width: 960px; margin: auto; padding: 24px 32px; border: 1px solid #806d46; background: #182420ee; }
.room-paper h1 { font: 30px var(--display); color: var(--gold); }
.room-paper label { display: block; margin: 12px 0; }
.room-paper input, .room-paper select { display: block; width: 100%; min-height: 40px; padding: 8px; color: var(--paper); background: #101715; border: 1px solid #806d46; }
.room-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.room-seats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 16px 0; }
.room-seats article { border: 1px solid #806d46; padding: 14px; background: #131d1a; border-radius: 4px; display: flex; flex-direction: column; gap: 8px; }
.room-seats article h3 { margin: 0; color: var(--gold); font-size: 16px; display: flex; align-items: center; }
.seat-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px; }
.seat-status-badge { font-size: 12px; padding: 2px 8px; border-radius: 3px; background: #1f2b28; border: 1px solid #3c4c47; color: #a4b3ae; }
.seat-status-badge.ready { color: #8ec379; border-color: #538142; background: #1b2e22; }
.seat-status-badge.ai { color: #d1b478; border-color: #8c713b; background: #262116; }
.seat-desc { margin: 0; font-size: 13px; color: #8fa099; }
.room-clock, .room-share-id { color: var(--gold); font-weight: bold; }
.room-connection { position: fixed; top: 0; left: 0; width: 100%; min-height: 56px; padding: 6px 18px; display: flex; gap: 16px; align-items: center; flex-wrap: wrap; z-index: 85; background: #101715; border-bottom: 1px solid #806d46; }
.room-connection p { margin: 0; width: 100%; }
.network-active .war-screen, .network-active .room-screen { margin-top: 56px; height: calc(100dvh - 56px); }
.network-active .overlay { top: 56px; }
.network-active.network-alert .war-screen, .network-active.network-alert .room-screen { margin-top: 96px; height: calc(100dvh - 96px); }
.network-active.network-alert .overlay { top: 96px; }
.network-alert .room-connection { min-height: 96px; }
@media (max-width: 900px) { .room-screen { padding: 16px; } .room-paper { padding: 16px; } .room-seats { grid-template-columns: repeat(2,minmax(0,1fr)); } .room-connection { gap: 6px; padding: 4px 10px; font-size: 12px; } .room-paper h1 { font-size: 24px; } }
@media (max-width: 640px) {
  .room-screen { padding: 12px 10px calc(24px + env(safe-area-inset-bottom)); height: auto; min-height: 100dvh; }
  .room-paper { padding: 16px 12px; }
  .room-paper h1 { font-size: 20px; }
  .room-paper p { font-size: 12px; line-height: 1.5; }
  .room-paper input, .room-paper select { min-height: 44px; font-size: 16px; border-radius: 4px; }
  .room-seats { grid-template-columns: 1fr; gap: 10px; }
  .room-actions { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .room-actions button { width: 100%; min-height: 44px; font-size: 14px; }
  .room-connection { padding: 6px 10px; font-size: 11px; gap: 6px; }
}
.turn-timer { display: inline-flex; align-items: center; font-size: 12px; font-weight: bold; color: var(--gold); padding: 2px 7px; border: 1px solid #806d46; border-radius: 3px; background: rgba(24, 36, 32, 0.85); margin-left: 6px; }
.turn-timer.urgent { color: #f87171; border-color: #ef4444; background: rgba(45, 18, 18, 0.9); animation: pulse-urgent 1s infinite alternate; }
@keyframes pulse-urgent { from { opacity: 0.75; transform: scale(0.97); } to { opacity: 1; transform: scale(1.03); } }
.signals-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.signal-button { padding: 12px 14px; font-size: 14px; border: 1px solid #806d46; background: #131d1a; color: var(--paper); border-radius: 4px; cursor: pointer; text-align: left; transition: all 0.15s; }
.signal-button:hover { background: #263832; border-color: var(--gold); color: #fff; }

/* 联机房间移动端横屏优化（高度 <= 520px 的横屏手机设备） */
@media (max-height: 520px) and (orientation: landscape) {
  .room-screen {
    padding: 6px max(16px, env(safe-area-inset-right)) 8px max(16px, env(safe-area-inset-left));
    height: 100dvh;
    overflow-y: auto;
  }
  .room-paper {
    padding: 8px 14px;
    max-width: 880px;
    margin: 2px auto;
  }
  .room-paper h1 {
    font-size: 18px;
    margin: 0 0 2px;
  }
  .room-paper p {
    font-size: 11px;
    margin: 2px 0 4px;
    line-height: 1.35;
  }
  .room-paper label {
    margin: 2px 0;
    font-size: 11px;
  }
  .room-paper input,
  .room-paper select {
    min-height: 28px;
    padding: 2px 6px;
    font-size: 12px;
  }
  .room-seats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
    margin: 4px 0;
  }
  .room-seats article {
    padding: 4px 6px;
    gap: 2px;
    border-radius: 3px;
  }
  .room-seats article h3 {
    font-size: 12px;
  }
  .seat-desc {
    font-size: 10px;
    line-height: 1.2;
  }
  .seat-status-badge {
    font-size: 9px;
    padding: 1px 4px;
  }
  .room-actions {
    margin-top: 4px;
    gap: 6px;
    display: flex;
    flex-wrap: wrap;
  }
  .room-actions button {
    min-height: 28px;
    padding: 3px 8px;
    font-size: 11px;
  }
  .room-connection {
    min-height: 32px;
    padding: 2px max(14px, env(safe-area-inset-right)) 2px max(14px, env(safe-area-inset-left));
    font-size: 10px;
    gap: 6px;
  }
  .network-active .war-screen,
  .network-active .room-screen {
    margin-top: 32px;
    height: calc(100dvh - 32px);
  }
}


