/* ==========================================================================
   06 · SIDEBAR CONTENT — log, players, guide + table talk + toasts
   ========================================================================== */

/* ---------- AI activity capsule ------------------------------------------- */
.ai-activity{
  flex:none;display:flex;align-items:center;gap:10px;
  margin:10px 12px 0;padding:8px 11px;border-radius:11px;
  border:1px solid var(--line-1);background:rgba(0,0,0,.22);
}
.ai-activity-icon{
  flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;
  font-family:var(--font-display);font-size:.68rem;font-weight:700;
  background:var(--accent-soft);border:1px solid var(--accent-line);color:var(--accent);
}
.ai-activity[data-tone="remote"] .ai-activity-icon{background:var(--blue-soft);border-color:rgba(98,169,232,.4);color:var(--blue)}
.ai-activity-copy{display:flex;flex-direction:column;gap:1px;min-width:0}
.ai-activity-copy strong{font-size:.68rem;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-activity-copy small{font-size:.56rem;color:var(--tx-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ai-activity .thinking{display:none;align-items:center;gap:3px;margin-left:auto;flex:none}
.ai-activity[data-active="true"] .thinking{display:inline-flex}
.thinking i{width:5px;height:5px;border-radius:50%;background:var(--accent);animation:thinkDot 1.2s ease-in-out infinite}
.thinking i:nth-child(2){animation-delay:.18s}
.thinking i:nth-child(3){animation-delay:.36s}
.ai-activity[data-tone="remote"] .thinking i{background:var(--blue)}
@keyframes thinkDot{0%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}

/* ---------- game log ------------------------------------------------------- */
.log{
  flex:1;min-height:120px;overflow-y:auto;overscroll-behavior:contain;
  padding:10px 12px;display:flex;flex-direction:column;gap:8px;
}
.log-hand-empty,.log-entry{font-size:.72rem;line-height:1.55;color:var(--tx-2)}
.log-hand-empty{padding:14px 4px;color:var(--tx-3);text-align:center}
.log-hand-group{border:1px solid var(--line-1);border-radius:10px;background:rgba(255,255,255,.018);overflow:hidden;flex:none}
.log-hand-group.is-current{border-color:var(--accent-line)}
.log-hand-toggle{
  display:flex;align-items:center;gap:8px;width:100%;
  padding:7px 10px;text-align:left;
  transition:background var(--t-fast);
}
.log-hand-toggle:hover{background:rgba(255,255,255,.045)}
.log-hand-index{
  font-family:var(--font-display);font-size:.54rem;font-weight:700;letter-spacing:.1em;
  color:var(--tx-3);padding:2px 6px;border-radius:5px;background:rgba(255,255,255,.05);
}
.is-current .log-hand-index{background:var(--accent-soft);color:var(--accent)}
.log-hand-title{font-size:.68rem;font-weight:800;color:var(--tx-1)}
.log-hand-count{margin-left:auto;font-size:.56rem;color:var(--tx-3);font-variant-numeric:tabular-nums}
.log-hand-chevron{
  width:7px;height:7px;flex:none;
  border-right:1.6px solid var(--tx-3);border-bottom:1.6px solid var(--tx-3);
  transform:rotate(45deg);transition:transform var(--t-fast);
}
.is-collapsed .log-hand-chevron{transform:rotate(-45deg)}
.log-hand-body{display:flex;flex-direction:column;gap:2px;padding:2px 10px 9px}
.is-collapsed .log-hand-body{display:none}
.log-entry{padding:3px 0 3px 9px;border-left:2px solid var(--line-2)}
.log-entry.win{color:#f5cf7d;border-left-color:var(--gold)}
.log-entry.pot{color:#9fdcb9;border-left-color:var(--green)}
.log-entry.street{color:var(--accent);border-left-color:var(--accent);font-weight:700}
.log-entry.hero{color:#cfe3f7;border-left-color:var(--blue)}
.log-entry.warn{color:#e8bd7a;border-left-color:var(--gold)}
.log-entry.error{color:#f09aa1;border-left-color:var(--red)}
.log-entry.deal,.log-entry.action,.log-entry.info,.log-entry.system{color:var(--tx-2)}
.log-entry b,.log-entry strong{color:var(--tx-1);font-weight:800}

/* ---------- players list: one player per row ------------------------------- */
.players-list{
  flex:0 0 auto;min-height:0;max-height:212px;overflow-y:auto;overscroll-behavior:contain;
  padding:7px 9px;display:flex;flex-direction:column;gap:4px;
}
.row.player-status-row{
  display:grid;grid-template-columns:minmax(0,1fr) max-content;align-items:center;gap:7px;
  min-width:0;padding:5px 8px;border-radius:9px;
  border:1px solid var(--line-1);background:rgba(255,255,255,.02);
}
.player-status-main{display:flex;align-items:center;gap:6px;min-width:0;white-space:nowrap;overflow:hidden}
.row-player-name{display:flex;align-items:center;gap:6px;min-width:0;overflow:hidden}
.player-flag,.character-flag-button{
  flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:7px;
  font-size:.76rem;background:rgba(255,255,255,.05);border:1px solid var(--line-1);
}
.character-flag-button:hover{border-color:var(--accent-line)}
.row-name-text{
  font-size:.72rem;font-weight:700;color:var(--seat-name-color,var(--tx-1));
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.row-role{display:inline-flex;gap:3px;flex:none}
.row-role b{
  display:grid;place-items:center;min-width:17px;height:15px;padding:0 4px;border-radius:5px;
  font-family:var(--font-display);font-size:.46rem;font-weight:700;
  background:rgba(255,255,255,.07);color:var(--tx-2);
}
.row-role b.d{background:#e8edf3;color:#151a22}
.row-role b.sb,.row-role b.bb{background:var(--blue-soft);color:var(--blue)}
.row-role b.turn{background:var(--gold);color:#241604}
.player-status-expression{flex:none;font-size:.8rem}
.player-status-metrics{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex:none;white-space:nowrap}
.player-status-stack{font-family:var(--font-num);font-size:.76rem;font-weight:700;font-variant-numeric:tabular-nums}
.player-status-bet{font-size:.56rem;color:var(--tx-3);font-variant-numeric:tabular-nums}
.pill{
  display:inline-flex;align-items:center;height:17px;padding:0 7px;border-radius:99px;
  font-style:normal;font-size:.52rem;font-weight:800;letter-spacing:.04em;
  background:rgba(255,255,255,.06);color:var(--tx-2);
  max-width:74px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.waiting-human{padding:14px;text-align:center;font-size:.74rem;color:var(--tx-3)}

/* ---------- hand guide: half height, collapsible ---------------------------- */
.side-card[data-mobile-card="guide"] .side-title{cursor:pointer;user-select:none}
.side-card[data-mobile-card="guide"] .side-title:hover .side-title-label{color:var(--accent)}
.side-card[data-mobile-card="guide"] .side-title-meta{display:flex;align-items:center;gap:7px}
.guide-toggle-chevron{
  width:8px;height:8px;flex:none;
  border-right:1.6px solid var(--tx-3);border-bottom:1.6px solid var(--tx-3);
  transform:rotate(45deg) translateY(-2px);transition:transform var(--t-fast);
}
.side-card[data-mobile-card="guide"].guide-collapsed .guide-toggle-chevron{transform:rotate(-45deg)}
.side-card[data-mobile-card="guide"].guide-collapsed .tips{display:none}
.tips{padding:8px 11px;max-height:150px;overflow-y:auto;display:flex;flex-direction:column;gap:5px}
.hand-guide{min-height:0}
.guide-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:7px 10px;border-radius:9px;background:rgba(255,255,255,.02);border:1px solid var(--line-1);
}
.guide-row:first-child{border-color:color-mix(in srgb,var(--gold) 45%,transparent);background:var(--gold-soft,#f5d9a81c)}
.guide-row b{font-size:.68rem;font-weight:800;flex:none}
.guide-cards{display:flex;gap:3px}
.guide-cards i{
  display:grid;place-items:center;min-width:23px;height:29px;padding:0 2px;
  border-radius:5px;font-style:normal;font-family:var(--font-num);
  font-size:.56rem;font-weight:700;
  background:linear-gradient(165deg,#f7f7f2,#e6e8e0);color:#171c22;
  border:1px solid rgba(20,26,32,.25);box-shadow:0 1px 3px rgba(0,0,0,.3);
}
.guide-cards i.red{color:#c22f3d}

/* ==========================================================================
   Table talk bubbles, fixed docks, toasts
   ========================================================================== */
.dialogue-layer{position:absolute;inset:0;z-index:40;pointer-events:none;overflow:visible}
.dialogue-layer>div{
  position:absolute;width:var(--dialogue-width,220px);
  display:flex;flex-direction:column;gap:4px;
  padding:9px 12px;border-radius:13px 13px 13px 4px;
  background:rgba(10,13,18,.92);border:1px solid var(--line-2);
  box-shadow:0 14px 34px rgba(0,0,0,.5);
  backdrop-filter:blur(10px);
  animation:bubbleIn .3s var(--ease-out);
  font-size:.72rem;line-height:1.5;color:var(--tx-1);
  word-break:break-word;
  /* 发言 2 秒后 JS 打上 is-fading，这里负责 0.5 秒渐隐 */
  transition:opacity .5s var(--ease-out),filter .5s var(--ease-out);
}
.dialogue-layer>div.is-fading{opacity:0;filter:blur(.45px) saturate(.86)}
@keyframes bubbleIn{from{opacity:0;transform:translateY(6px) scale(.94)}to{opacity:1;transform:none}}
.dialogue-speaker-name{
  font-size:.54rem;font-weight:800;letter-spacing:.1em;color:var(--accent);
  text-transform:uppercase;
}
.dialogue-layer>div span{min-width:0}

/* next round dock — lives inside the center HUD; on desktop it anchors to the
   HUD's bottom edge (the pot's row), on mobile it takes the pot's grid slot */
.next-round-dock{
  position:absolute;left:50%;bottom:0;transform:translateX(-50%);z-index:45;
  grid-column:auto;grid-row:auto;pointer-events:auto;
}
/* while the dock is up it takes the pot box's spot — the pot fades out */
.table-stage.next-round-ready .pot-box{opacity:0;visibility:hidden}
.next-round-dock button{
  display:inline-flex;align-items:center;gap:7px;
  min-height:36px;padding:0 18px;border-radius:99px;
  font-size:.76rem;font-weight:800;color:var(--on-accent);
  background:linear-gradient(180deg,var(--accent),color-mix(in srgb,var(--accent) 72%,#000));
  border:1px solid color-mix(in srgb,var(--accent) 70%,#fff 15%);
  box-shadow:0 12px 28px rgba(0,0,0,.5),0 0 26px var(--accent-glow);
  transition:transform var(--t-fast),filter var(--t-fast);
}
.next-round-dock button:hover{transform:translateY(-2px);filter:brightness(1.07)}

/* mobile AI wait banner (rendered above phone console) */
.mobile-ai-wait{
  position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:46;
  display:flex;align-items:center;gap:10px;
  max-width:min(92vw,380px);padding:9px 14px;border-radius:14px;
  background:rgba(10,13,18,.94);border:1px solid var(--accent-line);
  box-shadow:0 16px 40px rgba(0,0,0,.55),0 0 26px var(--accent-glow);
  backdrop-filter:blur(12px);
}
.mobile-ai-wait-avatar{
  flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:10px;
  font-family:var(--font-display);font-size:.62rem;font-weight:700;
  background:var(--accent-soft);color:var(--accent);border:1px solid var(--accent-line);
}
.mobile-ai-wait-copy{display:flex;flex-direction:column;min-width:0}
.mobile-ai-wait-copy strong{font-size:.72rem;font-weight:800;white-space:nowrap}
.mobile-ai-wait-copy small{font-size:.58rem;color:var(--tx-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mobile-ai-wait-dots{display:inline-flex;gap:3px;flex:none}
.mobile-ai-wait-dots i{width:5px;height:5px;border-radius:50%;background:var(--accent);animation:thinkDot 1.2s ease-in-out infinite}
.mobile-ai-wait-dots i:nth-child(2){animation-delay:.18s}
.mobile-ai-wait-dots i:nth-child(3){animation-delay:.36s}

/* toasts */
.toast-stack{
  position:fixed;right:18px;bottom:18px;z-index:400;
  display:flex;flex-direction:column;gap:8px;pointer-events:none;
}
.toast{
  max-width:340px;padding:11px 16px;border-radius:12px;
  background:rgba(12,16,22,.96);border:1px solid var(--line-2);
  box-shadow:var(--shadow-2);backdrop-filter:blur(12px);
  font-size:.78rem;font-weight:600;color:var(--tx-1);
  animation:toastIn .32s var(--ease-out);
}
.toast.error{border-color:rgba(224,88,99,.5);color:#f3b6bb}
.toast.success,.toast.ok{border-color:rgba(47,181,121,.5);color:#a9e6c8}
@keyframes toastIn{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}