/* v1.9.0 — reserve the sound controls, add lobby chat and human turn timeout UI. */
body.game-active .game-hud{padding-right:clamp(305px,27vw,365px)!important}
.game-hud .turn-banner{position:relative}

.lobby-panel{max-width:980px}
.lobby-chat{
  display:grid;
  grid-template-rows:auto minmax(100px,180px) auto 34px;
  gap:8px;
  margin:20px 0 16px;
  padding:14px;
  border:1px solid #7b5638;
  border-radius:15px;
  background:linear-gradient(155deg,#211711e8,#100d0bea);
  box-shadow:inset 0 1px #fff1,0 10px 25px #0005;
}
.lobby-chat-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.lobby-chat-head>div{display:flex;flex-direction:column;gap:3px}
.lobby-chat-head strong{color:#f0d29c;font:800 17px/1.1 Georgia,"Noto Serif SC",serif}
.lobby-chat-head small{color:#a99479;font-size:9px}
.lobby-chat-head>span{color:#8f7a62;font-size:8px}
.lobby-chat-list{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-height:100px;
  padding:9px;
  overflow-y:auto;
  overscroll-behavior:contain;
  border:1px solid #48372b;
  border-radius:10px;
  background:#0b0908bb;
  scrollbar-width:thin;
}
.lobby-chat .chat-message{max-width:min(78%,520px)}
.lobby-chat .chat-emoji-bar{width:min(330px,100%);margin:0;padding:5px}
.lobby-chat-compose{width:100%;height:34px}
.lobby-chat-compose input{font-size:12px}
.lobby-chat-compose button{height:32px;flex-basis:34px;width:34px;min-width:34px}

.human-timeout-warning{
  position:absolute;
  z-index:186;
  top:calc(100% + 5px);
  left:8px;
  display:flex;
  align-items:center;
  gap:9px;
  max-width:min(350px,55vw);
  padding:7px 11px;
  border:1px solid #e1934e;
  border-radius:9px;
  color:#ffe4bd;
  background:linear-gradient(135deg,#712d1ef5,#351711f7);
  box-shadow:0 10px 26px #000b,0 0 18px #d7552a35;
  opacity:0;
  visibility:hidden;
  transform:translateY(-4px);
  pointer-events:none;
  transition:.2s ease;
}
.human-timeout-warning.show{opacity:1;visibility:visible;transform:translateY(0);animation:timeoutPulse 1.6s ease-in-out infinite}
.human-timeout-warning strong{font-size:10px;white-space:nowrap}
.human-timeout-warning small{font-size:8px;color:#f0bd83;white-space:nowrap}
.timeout-action-replay{border-color:#d87843!important;box-shadow:0 10px 34px #000c,0 0 22px #d55d3438!important}
.timeout-action-replay .ai-replay-kicker{color:#f3a46d!important}

@keyframes timeoutPulse{50%{box-shadow:0 10px 26px #000b,0 0 25px #e36f405e}}

@media(max-width:1050px){body.game-active .game-hud{padding-right:285px!important}}
@media(orientation:landscape) and (max-width:760px){
  body.game-active .game-hud{padding-right:190px!important}
  .human-timeout-warning{left:4px;top:calc(100% + 3px);padding:5px 7px;gap:5px}
  .human-timeout-warning strong{font-size:8px}.human-timeout-warning small{font-size:7px}
}
@media(orientation:landscape) and (max-height:520px){
  .lobby-panel{margin:10px auto;padding:18px}
  .lobby-panel h2{font-size:25px}
  .lobby-players{margin:12px 0;gap:7px}.lobby-player{padding:10px}
  .lobby-chat{grid-template-rows:auto 90px auto 30px;gap:5px;margin:10px 0;padding:9px}
  .lobby-chat-head strong{font-size:14px}.lobby-chat-head small{font-size:8px}
  .lobby-chat-list{min-height:90px;padding:6px}
  .lobby-chat .chat-emoji-bar{padding:3px}.lobby-chat .chat-emoji-bar button{height:24px}
  .lobby-chat-compose{height:30px}.lobby-chat-compose button{height:28px}
}
@media(prefers-reduced-motion:reduce){.human-timeout-warning.show{animation:none}}