.team-mode-picker { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.team-mode-picker:has(#team-create-btn.hidden) #arena-create-btn { grid-column:1 / -1; }
.team-mode-picker .btn { width:100%; min-height:56px; margin:0; font-size:.95rem; font-weight:700; }
/* 導覽列只在遊戲中（選角、答題、攻守）收起來；等待房、結算都留著 */
body:has(#view-team-room:not(.hidden):is([data-phase="selecting"],[data-phase="question"],[data-phase="action"])) #main-header { display:none !important; }
body:has(#view-team-room:not(.hidden):is([data-phase="selecting"],[data-phase="question"],[data-phase="action"])) .container { padding-top:calc(8px + var(--safe-top)); }
/* 這個畫面顯示時是 flex：一律上下排列。以前只有對戰中才改成上下，等待隊友時標題列被擠到左邊變直排 */
#view-team-room { flex-direction:column; }
#view-team-room > .nav-bar, #view-team-room > .team-room { width:100%; box-sizing:border-box; }
#view-team-room .nav-bar { margin-bottom:8px; }
.team-room { max-width:820px; margin:0 auto; padding:24px 16px 100px; }
.team-room-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; }
.team-kicker { color:var(--accent,#a5c4ff); font-size:.68rem; font-weight:800; letter-spacing:.2em; }
.team-room h2 { margin:.25rem 0 0; font-size:clamp(1.45rem,4vw,2rem); }
.team-room-code { font:700 1.15rem monospace; letter-spacing:.14em; padding:9px 12px; border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.05); }
#view-team-room:not([data-phase="waiting"]) .team-room-code { display:none; }
.team-room-notice,.team-room-feedback,.team-hint { color:var(--text-sub); line-height:1.6; font-size:.86rem; }
.team-room-feedback { min-height:1.7em; margin-top:20px; }
.team-room-feedback:empty,.team-room-notice:empty { display:none; }
.team-last-result { padding:11px 15px; border:1px solid rgba(182,203,255,.3); border-radius:14px; background:rgba(146,180,244,.1); font-weight:700; }
.team-last-result.is-new { animation:team-impact .45s both; }
.team-share,.team-actions { display:flex; gap:10px; margin:18px 0; flex-wrap:wrap; }
.team-button { border:1px solid var(--border); border-radius:14px; background:rgba(255,255,255,.08); color:var(--text-main); min-height:44px; padding:10px 15px; font:inherit; cursor:pointer; transition:transform .18s,background .18s,box-shadow .18s; }
.team-button:hover:not(:disabled) { transform:translateY(-2px); background:rgba(255,255,255,.14); box-shadow:0 8px 24px rgba(0,0,0,.15); }
.team-button:active:not(:disabled) { transform:scale(.97); }
.team-button:disabled { opacity:.45; cursor:default; }
.team-button.primary,.team-start { background:linear-gradient(135deg,rgba(123,184,255,.38),rgba(174,132,255,.32)); border-color:rgba(167,191,255,.48); }
.team-button.small { min-height:32px; padding:5px 10px; font-size:.76rem; }
.team-board { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:22px 0; }
.team-side { min-width:0; padding:16px; border:1px solid rgba(143,177,255,.24); border-radius:22px; background:linear-gradient(145deg,rgba(72,108,177,.2),rgba(255,255,255,.035)); backdrop-filter:blur(16px); }
.team-side.side-1 { border-color:rgba(230,173,231,.25); background:linear-gradient(145deg,rgba(151,86,153,.2),rgba(255,255,255,.035)); }
.team-side h3 { margin:0 0 14px; }
.team-health { font-weight:700; font-size:.84rem; margin-bottom:7px; }
.team-health-track { height:8px; border-radius:10px; background:rgba(255,255,255,.12); overflow:hidden; margin-bottom:13px; }
.team-health-track span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#73d3f6,#b4adff); transition:width .5s; }
.team-uses { color:var(--text-sub); font-size:.74rem; margin-bottom:10px; }
.side-1 .team-health-track span { background:linear-gradient(90deg,#f4b4d0,#d7a3ff); }
.team-player { min-width:0; display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:10px; margin-top:8px; border:1px solid rgba(255,255,255,.09); border-radius:14px; background:rgba(0,0,0,.1); }
.team-player.is-me { border-color:rgba(255,214,126,.65); }
.team-player-avatar { position:relative; flex:none; width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:rgba(190,211,255,.18); font-weight:800; }
.team-player-avatar:is(button) { padding:0; border:1px solid rgba(255,255,255,.4); color:var(--text-main); cursor:pointer; }
.team-player-avatar img { width:100%; height:100%; border-radius:50%; object-fit:cover; }
.team-player-avatar .team-player-frame { position:absolute; inset:-8%; width:116%; height:116%; border-radius:0; object-fit:contain; pointer-events:none; }
.team-player-actions { display:flex; gap:6px; flex-wrap:wrap; width:100%; }
.team-player-actions.hidden { display:none; }
.team-player-info { display:flex; flex:1; min-width:75px; flex-direction:column; gap:2px; }
.team-player-info strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.88rem; }
.team-player-info span { font-size:.68rem; color:var(--text-sub); }
.team-role { padding-top:14px; font-size:.78rem; color:var(--text-sub); }
.team-control,.team-settings,.team-question,.team-action,.team-final,.team-request { border:1px solid var(--border); border-radius:20px; background:rgba(255,255,255,.055); backdrop-filter:blur(14px); padding:18px; margin:14px 0; }
.team-control label { display:block; font-weight:700; margin-bottom:9px; }
.team-select { width:100%; min-height:48px; color:var(--text-main); background:rgba(20,23,40,.95); border:1px solid var(--border); border-radius:13px; padding:10px; font:inherit; }
.team-setting-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin:16px 0; }
.team-setting-grid label { display:flex; flex-direction:column; gap:6px; color:var(--text-sub); font-size:.8rem; }
.team-setting-grid input,.team-setting-grid select { width:100%; box-sizing:border-box; color:var(--text-main); background:rgba(20,23,40,.95); border:1px solid var(--border); border-radius:10px; padding:10px; font:inherit; }
.team-range { border-color:rgba(158,201,255,.45); background:linear-gradient(135deg,rgba(116,166,241,.13),rgba(255,255,255,.04)); }
.team-range strong { display:block; margin-bottom:8px; }
.team-range p { margin:4px 0; color:var(--text-sub); }
.team-choice-group { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0 16px; }
.team-choice { flex:1 1 auto; min-height:42px; padding:8px 12px; border-radius:13px; font-weight:700; }
.team-choice.is-selected,.team-book-card.is-selected,.team-role-card.is-selected { border-color:rgba(139,215,255,.8); background:linear-gradient(140deg,rgba(82,183,235,.29),rgba(167,132,234,.19)); box-shadow:inset 0 0 0 1px rgba(141,211,255,.19),0 5px 22px rgba(42,142,216,.12); }
.team-source-tabs .team-choice { flex:1 1 42%; }
.team-levels .team-choice { flex:1 1 27%; }
.team-book-search { width:100%; box-sizing:border-box; min-height:48px; margin:3px 0 12px; padding:10px 14px; border:1px solid var(--border); border-radius:14px; background:rgba(9,17,35,.43); color:var(--text-main); font:inherit; }
.team-book-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:240px; overflow:auto; padding:2px; }
.team-book-card { width:100%; text-align:left; overflow-wrap:anywhere; }
.team-book-list p { grid-column:1 / -1; padding:12px; }
.team-source-applied { padding:10px 12px; border-radius:12px; background:rgba(255,255,255,.045); overflow-wrap:anywhere; }
.team-source-save { width:100%; margin:4px 0 10px; }
.team-setting-choice { display:flex; flex-direction:column; gap:5px; color:var(--text-sub); font-size:.8rem; }
.team-setting-choice .team-choice-group { margin:0; }
.team-setting-choice .team-choice { min-height:38px; padding:7px; font-size:.8rem; }
.team-role-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:290px; overflow:auto; padding:2px; }
.team-role-card { text-align:left; font-weight:700; }
.team-role-card strong,.team-role-card span { display:block; }
.team-role-card span { margin-top:4px; color:var(--text-sub); font-size:.75rem; font-weight:400; line-height:1.4; }
.team-range-row { display:grid; grid-template-columns:1fr 1fr auto; align-items:end; gap:10px; }
.team-range-row label { margin:0; font-size:.8rem; }
.team-range-row .team-button { white-space:nowrap; }
.team-role-pick h3 { margin:0 0 8px; }
.team-role-confirm { display:block; width:100%; margin:10px 0; font-weight:800; }
.team-start { display:block; width:100%; font-weight:800; margin:10px 0; }
.team-round { color:var(--text-sub); font-size:.8rem; }
.team-timer { float:right; font-weight:800; font-variant-numeric:tabular-nums; }
.team-question h3 { margin:22px 0; font-size:clamp(1.3rem,5vw,2rem); }
.team-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.team-option { width:100%; text-align:left; min-height:64px; padding:14px 18px; overflow-wrap:anywhere; border-radius:16px; font-size:.98rem; font-weight:650; line-height:1.45; background:linear-gradient(130deg,rgba(141,182,247,.105),rgba(255,255,255,.045)); transition:border-color .16s,background .16s,box-shadow .16s,transform .16s,opacity .16s; }
.team-option:not(:disabled):hover { border-color:rgba(169,215,255,.65); background:rgba(136,182,250,.17); }
.team-option:focus-visible { outline:2px solid #a6e9ff; outline-offset:2px; }
.team-option.team-option-submitted { border-color:rgba(183,205,255,.9); background:rgba(132,172,244,.22); box-shadow:inset 0 0 0 1px rgba(183,205,255,.5); animation:team-answer-pulse .28s ease-out; }
.team-option.team-option-right, .team-option.team-option-right:disabled { opacity:1; border-color:#52dca1; color:var(--text-main); background:linear-gradient(135deg,rgba(53,188,128,.28),rgba(39,130,111,.16)); box-shadow:inset 0 0 0 1px rgba(98,234,169,.65),0 0 20px rgba(59,205,134,.16); }
.team-option.team-option-wrong, .team-option.team-option-wrong:disabled { opacity:1; border-color:#ef8484; color:var(--text-main); background:rgba(206,76,87,.18); box-shadow:inset 0 0 0 1px rgba(237,113,121,.38); }
.team-answer-note { display:flex; align-items:center; gap:8px; margin:16px 0 0; }
.team-answer-note::before { content:'✓'; width:19px; height:19px; display:grid; place-items:center; border-radius:50%; background:rgba(67,202,142,.2); color:#8cf5bd; font-size:.7rem; }
.team-answer-note.is-wrong::before { content:'×'; background:rgba(206,76,87,.2); color:#ffaaa9; }
.team-question { animation:team-rise .3s ease-out both; border-color:rgba(153,192,249,.3); background:linear-gradient(160deg,rgba(50,80,135,.19),rgba(255,255,255,.045) 55%,rgba(101,67,135,.1)); box-shadow:0 14px 40px rgba(0,0,0,.11); }
.team-question h3 { clear:both; padding:16px 0 6px; text-align:center; letter-spacing:.02em; }
.team-timer { color:#b9eaff; }
.team-option.is-removed { text-decoration:line-through; opacity:.35; }
.team-action h3,.team-final h3 { margin-top:0; }
.team-skill { display:block; width:100%; margin:0 0 10px; border-color:rgba(192,158,255,.5); }
@keyframes team-rise { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } }
@keyframes team-impact { 0% { opacity:0; transform:scale(.95); filter:brightness(1.8); } 70% { filter:brightness(1.3); } 100% { opacity:1; transform:scale(1); filter:brightness(1); } }
@keyframes team-answer-pulse { 50% { transform:scale(.97); } }
@media(max-width:540px) {
  .team-room { padding:8px 10px 80px; }
  .team-room-head { margin-bottom:6px; }
  .team-kicker { display:none; }
  .team-room h2 { font-size:1.25rem; }
  .team-room-notice { margin:4px 0 8px; line-height:1.35; font-size:.76rem; }
  .team-share { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:8px 0; }
  .team-share .team-button { min-width:0; padding:8px; font-size:.78rem; }
  .team-last-result { padding:8px 10px; font-size:.8rem; }
  .team-board { gap:7px; margin:16px 0; }
  .team-side { padding:10px; border-radius:16px; }
  .team-player { padding:7px; }
  .team-player-avatar { width:32px; height:32px; }
  .team-player .team-button { width:100%; }
  .team-control,.team-question,.team-action,.team-final { margin:8px 0; padding:12px; }
  .team-role-grid { max-height:clamp(150px,30dvh,240px); }
  .team-options { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .team-option { min-height:60px; padding:9px 10px; font-size:.9rem; }
  .team-question h3 { margin:8px 0 12px; padding:4px 0; font-size:clamp(1.2rem,5vw,1.55rem); }
  .team-book-list { grid-template-columns:1fr; }
  .team-setting-grid { grid-template-columns:1fr; }
}
/* Match the 1v1 battle screen: two full-width health cards, then the current
   question or decision in the remaining viewport. The lobby stays scrollable. */
#view-team-room:not([data-phase="waiting"]) .team-room-head { display:none; }
#view-team-room:is([data-phase="question"],[data-phase="action"]) .team-room-notice { display:none; }
body:has(#view-team-room:is([data-phase="question"],[data-phase="action"]):not(.hidden)) { overflow:hidden; }
body:has(#view-team-room:is([data-phase="question"],[data-phase="action"]):not(.hidden)) .container {
  height:100vh; height:100dvh; min-height:0; box-sizing:border-box;
  padding-bottom:calc(8px + var(--safe-bottom,0px)); overflow:hidden;
}
#view-team-room:is([data-phase="question"],[data-phase="action"]):not(.hidden) {
  flex:1; min-height:0; display:flex !important; flex-direction:column;
}
#view-team-room:is([data-phase="question"],[data-phase="action"]) .nav-bar { flex:none; margin-bottom:6px; }
#view-team-room:is([data-phase="question"],[data-phase="action"]) .team-room {
  display:flex; flex-direction:column; flex:1; min-height:0; width:100%; box-sizing:border-box; padding:0;
}
#view-team-room:is([data-phase="question"],[data-phase="action"]) #team-room-stage {
  display:flex; flex-direction:column; flex:1; min-height:0;
}
.team-hud { display:flex; flex-direction:column; flex:none; gap:8px; margin:0 0 8px; }
.team-hud-side { padding:9px 12px; border:1px solid var(--border); border-radius:13px; background:var(--card-bg); }
.team-hud-top { display:flex; align-items:center; gap:10px; min-width:0; }
.team-hud-avatars { display:flex; flex:none; padding-right:8px; }
.team-hud-avatar { display:grid; place-items:center; flex:none; width:36px; height:36px; border-radius:50%; border:1px solid var(--border); background:rgba(135,174,241,.28); font-weight:700; overflow:hidden; }
.team-hud-avatar + .team-hud-avatar { margin-left:-9px; }
.team-hud-avatar img { width:100%; height:100%; object-fit:cover; }
.team-hud-info { flex:1; min-width:0; }
.team-hud-info strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.85rem; }
.team-hud-info .team-role { display:block; padding:0; margin-top:2px; font-size:.7rem; }
.team-hud-hp { flex:none; font-size:1.12rem; font-variant-numeric:tabular-nums; }
.team-hud-meter { height:8px; margin-top:8px; overflow:hidden; border-radius:8px; background:rgba(128,128,128,.22); }
.team-hud-meter span { display:block; height:100%; border-radius:inherit; background:#3fb98a; transition:width .45s; }
.team-hud-side.is-foe .team-hud-meter span { background:#e0554f; }
.team-hud-uses { display:flex; gap:8px; margin-top:6px; }
.team-hud-use { color:var(--text-sub); font-size:.68rem; }
.team-hud-use.heal::before,.team-hud-use.shield::before { content:''; display:inline-block; width:12px; height:4px; margin-right:4px; vertical-align:middle; border-radius:3px; background:#3fb98a; }
.team-hud-use.shield::before { background:#7c9cff; }
#view-team-room:is([data-phase="question"],[data-phase="action"]) .team-last-result { flex:none; margin-bottom:6px; }
#view-team-room:is([data-phase="question"],[data-phase="action"]) .team-question,
#view-team-room:is([data-phase="question"],[data-phase="action"]) .team-action {
  display:flex; flex-direction:column; flex:1; min-height:0; overflow-y:auto; overscroll-behavior:contain;
  scrollbar-width:none; margin:0; padding:0 2px 8px; border:0; border-radius:0; background:none; box-shadow:none; backdrop-filter:none;
}
#view-team-room:is([data-phase="question"],[data-phase="action"]) :is(.team-question,.team-action)::-webkit-scrollbar { display:none; }
#view-team-room[data-phase="question"] .team-round { display:none; }
#view-team-room[data-phase="question"] .team-question-clock { flex:none; }
#view-team-room[data-phase="question"] .team-clock-track { height:5px; overflow:hidden; border-radius:5px; background:rgba(128,128,128,.22); }
#view-team-room[data-phase="question"] .team-clock-track span { display:block; height:100%; border-radius:inherit; background:#00bcd4; }
#view-team-room[data-phase="question"] .team-timer { float:none; text-align:right; margin-top:4px; font-size:.78rem; }
#view-team-room[data-phase="question"] .team-question h3 { flex:none; margin:8px 0 12px; padding:0; font-size:clamp(1.4rem,7vw,2rem); }
#view-team-room[data-phase="question"] .team-options { display:flex; flex-direction:column; flex:1 0 auto; gap:7px; }
#view-team-room[data-phase="question"] .team-option { display:flex; align-items:center; flex:1 0 44px; min-height:44px; padding:8px 14px; border-radius:12px; background:var(--card-bg); }
#view-team-room[data-phase="question"] .team-answer-note { flex:none; margin:8px 0 0; }
#view-team-room[data-phase="action"] .team-action h3 { margin:10px 0 0; text-align:center; font-size:1.25rem; }
#view-team-room[data-phase="action"] .team-action > p { margin:8px 0 12px; text-align:center; color:var(--text-sub); font-size:.82rem; }
.team-action-count { flex:none; margin:2px 0 8px; text-align:center; color:#e0554f; font-size:1.75rem; font-weight:700; font-variant-numeric:tabular-nums; }
#view-team-room[data-phase="action"] .team-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); flex:none; gap:10px; margin:12px 0 0; }
.team-action-choice { min-width:0; min-height:92px; text-align:left; border-radius:14px; background:var(--card-bg); }
.team-action-choice strong { display:block; font-size:1rem; }
.team-action-choice span { display:block; margin-top:5px; color:var(--text-sub); font-size:.76rem; line-height:1.35; }
.team-action-choice.attack { border-color:rgba(224,85,79,.4); }
.team-action-choice.heal { border-color:rgba(63,185,138,.4); }
.team-action-choice.shield { border-color:rgba(124,156,255,.4); }
.team-action-choice.is-selected { border-color:#ffd27a; background:rgba(255,210,122,.15); box-shadow:inset 0 0 0 1px #ffd27a; }
.team-action-commit { flex:none; width:100%; min-height:50px; margin-top:12px; position:sticky; bottom:0; z-index:2; font-weight:700; background:linear-gradient(90deg,rgba(181,118,35,.58),rgba(255,255,255,.06)); }
#view-team-room[data-phase="action"] .team-skill { flex:none; margin:10px 0 0; }
@media(prefers-reduced-motion:reduce) { .team-side,.team-control,.team-settings,.team-question,.team-action,.team-final,.team-request,.team-last-result.is-new,.team-option.team-option-submitted { animation:none; } .team-button { transition:none; } }
/* 建立房間：先選遊戲（room-modes.js） */
.room-create-open { width:100%; min-height:56px; margin:0; font-size:1rem; font-weight:800; }
.room-mode-pick { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.room-mode-pick:has(#room-mode-bomb.hidden) { grid-template-columns:1fr; }
.room-mode-card { display:flex; flex-direction:column; align-items:center; gap:4px; padding:18px 10px 16px; border-radius:18px; cursor:pointer;
  border:1px solid var(--border); background:rgba(255,255,255,.04); color:var(--text-main); font:inherit;
  transition:transform .14s, border-color .2s, background .2s, box-shadow .2s; }
.room-mode-card:hover { border-color:rgba(255,255,255,.35); background:rgba(255,255,255,.07); transform:translateY(-2px); }
.room-mode-card:active { transform:scale(.97); }
.room-mode-card:disabled { opacity:.6; cursor:default; transform:none; }
.room-mode-card b { font-size:1.05rem; letter-spacing:2px; }
.room-mode-card > span:last-child { font-size:.74rem; color:var(--text-sub); line-height:1.4; }
.room-mode-ico { width:42px; height:42px; display:grid; place-items:center; margin-bottom:4px; border-radius:14px; background:rgba(255,255,255,.06); }
.room-mode-ico svg { width:28px; height:28px; }
#room-mode-bomb .room-mode-ico { color:#ffb38a; background:rgba(255,140,60,.16); }
#room-mode-bomb:hover { box-shadow:0 0 18px rgba(255,140,60,.18); border-color:rgba(255,140,60,.5); }
#room-mode-duel .room-mode-ico { color:#ff9800; }
.room-duel-pick { grid-template-columns:repeat(2,minmax(0,1fr)); }
.room-mode-back { grid-column:1 / -1; justify-self:center; margin-top:4px; background:none; border:0; color:var(--text-sub); font:inherit; font-size:.8rem;
  text-decoration:underline; text-underline-offset:3px; cursor:pointer; }
.room-step-in > * { animation:roomStepIn .34s cubic-bezier(.2,.9,.25,1.15) both; }
.room-step-in > *:nth-child(2) { animation-delay:.06s; }
.room-step-in > *:nth-child(3) { animation-delay:.12s; }
@keyframes roomStepIn { from { opacity:0; transform:translateY(10px) scale(.96); } }
@media (prefers-reduced-motion: reduce) { .room-step-in > * { animation:none; } }
.daily-chat-invite-card.invite-bomb strong::before { content:''; display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:6px; background:#ff9a6b; vertical-align:middle; }

/* 2v2 新版：沿用傳炸彈的題目、四選項、三格道具節奏；顏色跟隨網站主題。 */
#view-team-room[data-protocol="4"] {
  background:radial-gradient(ellipse at 50% 19%,rgba(123,75,34,.18),transparent 54%),
    radial-gradient(circle at 88% 82%,rgba(155,106,46,.075),transparent 30%);
}
#view-team-room[data-protocol="4"] .team-side {
  border-color:rgba(222,182,114,.3);
  background:linear-gradient(145deg,rgba(101,66,30,.19),rgba(255,255,255,.025));
}
#view-team-room[data-protocol="4"] .team-side.side-1 {
  border-color:rgba(204,131,119,.28);
  background:linear-gradient(145deg,rgba(108,54,50,.18),rgba(255,255,255,.025));
}
#view-team-room[data-protocol="4"] :is(.team-choice.is-selected,.team-book-card.is-selected,.team-role-card.is-selected) {
  border-color:rgba(245,199,121,.82);
  background:linear-gradient(135deg,rgba(145,91,38,.32),rgba(78,54,34,.19));
  box-shadow:inset 0 0 0 1px rgba(245,199,121,.2),0 6px 22px rgba(159,98,34,.15);
}
#view-team-room[data-protocol="4"] :is(.team-button.primary,.team-start,.team-source-save) {
  border-color:rgba(245,199,121,.6);
  background:linear-gradient(125deg,rgba(156,99,43,.5),rgba(95,60,41,.38));
}
#view-team-room[data-protocol="4"] .team-role-card:not(.is-selected):hover {
  border-color:rgba(245,199,121,.5);
  background:rgba(158,106,50,.13);
}
#view-team-room[data-protocol="4"] .team-room { max-width:680px; }
#view-team-room[data-protocol="4"] .team-hud { gap:6px; margin-bottom:7px; }
#view-team-room[data-protocol="4"] .team-hud-side {
  padding:8px 11px; border-radius:16px; background:var(--card-bg);
  border:1px solid var(--border); box-shadow:inset 0 1px rgba(255,255,255,.055);
}
#view-team-room[data-protocol="4"] .team-hud-side.is-own { border-color:rgba(231,190,116,.5); }
#view-team-room[data-protocol="4"] .team-hud-side.is-foe { border-color:rgba(231,128,119,.32); }
#view-team-room[data-protocol="4"] .team-hud-avatar.is-active {
  position:relative; z-index:1; border-color:#f4d49a; box-shadow:0 0 0 2px rgba(239,194,114,.32),0 0 17px rgba(239,194,114,.38);
  animation:team-active-glow 1.7s ease-in-out infinite alternate;
}
@keyframes team-active-glow { to { box-shadow:0 0 0 3px rgba(239,194,114,.5),0 0 25px rgba(239,194,114,.66); } }
#view-team-room[data-protocol="4"] .team-hud-meter span { background:linear-gradient(90deg,#66caa4,#b1e5c0); }
#view-team-room[data-protocol="4"] .team-hud-side.is-foe .team-hud-meter span { background:linear-gradient(90deg,#df6b69,#f0a27d); }
#view-team-room[data-protocol="4"][data-phase="question"] .team-question,
#view-team-room[data-protocol="4"][data-phase="action"] .team-action {
  overflow:hidden; padding:0 2px calc(5px + var(--safe-bottom,0px)); gap:6px;
}
#view-team-room[data-protocol="4"] .team-turn-tag {
  flex:none; width:fit-content; max-width:100%; margin:2px auto 0; padding:4px 12px;
  border:1px solid rgba(236,191,112,.4); border-radius:999px; background:rgba(131,90,38,.2);
  color:var(--text-main); font-size:.72rem; font-weight:700; text-align:center;
}
#view-team-room[data-protocol="4"][data-phase="question"] .team-question h3 {
  margin:3px 0; text-align:center; font-size:clamp(1.25rem,6vw,1.9rem); line-height:1.25;
  overflow-wrap:anywhere;
}
#view-team-room[data-protocol="4"][data-phase="question"] .team-options {
  flex:1 1 auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(44px,1fr));
  gap:8px; min-height:96px; margin:2px 0;
}
#view-team-room[data-protocol="4"][data-phase="question"] .team-options:has(> :nth-child(5)) {
  grid-template-rows:repeat(3,minmax(44px,1fr)); min-height:148px;
}
#view-team-room[data-protocol="4"][data-phase="question"] .team-option {
  display:flex; align-items:center; justify-content:center; min-width:0; min-height:0; width:100%;
  padding:7px 9px; border:1px solid var(--border); border-radius:15px; background:var(--card-bg);
  color:var(--text-main); font-size:clamp(.88rem,3.8vw,1.13rem); font-weight:700; line-height:1.18;
  text-align:center; overflow-wrap:anywhere; white-space:normal;
  transition:transform .12s ease, background .17s ease, border-color .17s ease, box-shadow .17s ease;
}
#view-team-room[data-protocol="4"] .team-option:not(:disabled):active,
#view-team-room[data-protocol="4"] .team-item:not(:disabled):active { transform:scale(.96); }
#view-team-room[data-protocol="4"] .team-option-hint {
  border-color:rgba(246,206,132,.88)!important; background:rgba(160,111,51,.2)!important;
  box-shadow:inset 0 0 0 1px rgba(246,206,132,.4); flex-direction:column; gap:2px; }
#view-team-room[data-protocol="4"] .team-option-hint::after { content:'隊友建議'; display:block; font-size:.57rem; color:#f5d9a6; }
#view-team-room[data-protocol="4"] .team-ally-hint {
  flex:none; min-height:1.3em; margin:0; color:var(--text-sub); font-size:.73rem; text-align:center;
}
#view-team-room[data-protocol="4"] .team-items {
  flex:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; width:100%; min-height:72px;
}
#view-team-room[data-protocol="4"] .team-item {
  min-width:0; min-height:70px; padding:8px 5px; border:1px solid var(--border); border-radius:15px;
  background:var(--card-bg); color:var(--text-main); font-size:clamp(.72rem,2.7vw,.88rem); font-weight:800;
  box-shadow:inset 0 1px rgba(255,255,255,.06); transition:transform .12s, border-color .18s, box-shadow .18s;
}
#view-team-room[data-protocol="4"] .team-item-primary { border-color:rgba(240,143,107,.5); }
#view-team-room[data-protocol="4"] .team-item-skill.ready {
  border-color:rgba(247,200,113,.7); box-shadow:0 0 12px rgba(247,200,113,.16),inset 0 1px rgba(255,255,255,.1);
  animation:team-skill-ready 2.5s ease-in-out infinite alternate;
}
@keyframes team-skill-ready { to { box-shadow:0 0 19px rgba(247,200,113,.33),inset 0 0 10px rgba(247,200,113,.1); } }
#view-team-room[data-protocol="4"] .team-item:disabled { opacity:.48; }
#view-team-room[data-protocol="4"] .team-answer-note { display:none; }
#view-team-room[data-protocol="4"] .team-action-duo { justify-content:center; }
#view-team-room[data-protocol="4"] .team-action-duo .team-items { margin-top:auto; }
#view-team-room[data-protocol="4"] .team-action-duo .team-action-count { font-size:2.5rem; }
#view-team-room[data-protocol="4"] .team-action-duo .team-hint { margin:6px 0 0; text-align:center; }
@media(max-height:720px) {
  #view-team-room[data-protocol="4"] .team-hud-side { padding:5px 9px; }
  #view-team-room[data-protocol="4"] .team-hud-avatar { width:30px; height:30px; }
  #view-team-room[data-protocol="4"] .team-item { min-height:58px; }
  #view-team-room[data-protocol="4"] .team-items { min-height:58px; }
}
@media(prefers-reduced-motion:reduce) {
  #view-team-room[data-protocol="4"] .team-hud-avatar.is-active { animation:none; }
  #view-team-room[data-protocol="4"] .team-item-skill.ready { animation:none; }
  #view-team-room[data-protocol="4"] .team-option, #view-team-room[data-protocol="4"] .team-item { transition:none; }
}

/* 傳炸彈好友房的三個座位：一定要能縮（minmax(0,1fr)）。只寫 1fr 的話，
   很長又不換行的暱稱會把第一格撐爆，整頁往右溢出。
   畫面本身在伺服器那一包（bomb.css），這裡用 id 蓋過去，網頁一更新就生效。 */
#view-bomb .bomb-room-seats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
#view-bomb .bomb-room-seat { min-width: 0; }
#view-bomb .bomb-room-card { max-width: 100%; box-sizing: border-box; overflow: hidden; }

/* 隊伍道具剩餘數量（答完題後才用，不是按鈕） */
.team-item-stock { flex: 1 1 100%; margin: 0; font-size: .78rem; color: var(--text-sub); text-align: center; }

/* ── 等待房：照 1v1 對戰準備區的版面 ── */
#view-team-room[data-phase="waiting"] .team-room-head { display:none; }
#view-team-room[data-phase="waiting"] .team-room { padding-top:4px; }
.tw-card { text-align:center; padding:28px 18px 22px; border-color:var(--border); }
.tw-code-label { font-size:.85rem; color:var(--text-sub); letter-spacing:1px; }
.tw-life { color:var(--text-sub); font-size:.82rem; line-height:1.6; margin:6px 0 4px; }
.tw-code { font-size:3.2rem; font-weight:700; color:#ff9800; letter-spacing:8px; font-family:'Courier New',Courier,monospace; line-height:1.15; }
.tw-card .team-share { justify-content:center; margin:14px 0 22px; gap:8px; }
.tw-card .team-share .team-button { min-height:36px; padding:7px 13px; font-size:.82rem; border-radius:10px; background:transparent; }
.tw-board { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px; margin:0 0 26px; }
.tw-vs { font-size:1.5rem; font-weight:700; color:var(--text-sub); font-style:italic; }
.tw-board.team-board { display:grid; }
#view-team-room .tw-board .tw-team.team-side { min-width:0; box-shadow:none; padding:0; border:none; border-radius:0; background:none; backdrop-filter:none; }
.tw-board .tw-seat.team-player { display:flex; flex-direction:column; flex-wrap:nowrap; gap:0; padding:0; margin:0; border:none; border-radius:0; background:none; }
.tw-team-name { font-size:.8rem; font-weight:700; letter-spacing:3px; margin-bottom:10px; }
.tw-team.side-0 .tw-team-name { color:#ffb347; }
.tw-team.side-1 .tw-team-name { color:#8fb8ff; }
.tw-seats { display:flex; justify-content:center; gap:6px; }
.tw-seat { position:relative; display:flex; flex-direction:column; align-items:center; width:64px; min-width:0; }
.tw-avatar { position:relative; flex:none; width:52px; height:52px; border-radius:50%; margin-bottom:8px; display:flex; align-items:center; justify-content:center;
    background:#222; color:var(--text-main); font-weight:700; font-size:1.2rem; border:2px solid var(--tw-c,#888); padding:0; cursor:default; font-family:inherit; }
button.tw-avatar { cursor:pointer; }
.tw-avatar > img:first-child { width:100%; height:100%; border-radius:50%; object-fit:cover; }
.tw-frame { position:absolute; inset:-14%; width:128%; height:128%; pointer-events:none; }
.tw-team.side-0 .tw-avatar { --tw-c:#ffb347; }
.tw-team.side-1 .tw-avatar { --tw-c:#8fb8ff; }
.tw-seat.is-empty .tw-avatar { border:2px dashed #555; color:#555; font-size:1.4rem; }
.tw-seat.is-me .tw-avatar { box-shadow:0 0 0 3px rgba(255,152,0,.35); }
.tw-name { font-size:.78rem; font-weight:700; color:var(--text-main); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width:100%; }
.tw-seat.is-empty .tw-name { color:var(--text-sub); font-weight:400; }
.tw-tag { font-size:.72rem; color:var(--text-sub); margin-top:4px; }
.tw-actions { position:absolute; top:56px; left:50%; transform:translateX(-50%); z-index:5; display:flex; flex-direction:column; gap:6px;
    background:var(--card-bg,#1b1b1b); border:1px solid var(--border); border-radius:12px; padding:8px; box-shadow:0 10px 30px rgba(0,0,0,.35); }
.tw-actions.hidden { display:none; }
.tw-actions .team-button { min-height:34px; padding:6px 12px; font-size:.8rem; white-space:nowrap; }
.tw-card .aw-src, .tw-card .aw-custom { text-align:left; }
div.aw-src-btn { cursor:default; }
.tw-start { width:100%; font-weight:700; font-size:1.05rem; padding:15px; margin-top:4px; }
.tw-hint { margin:6px 0 0; font-weight:700; color:var(--text-main); }
.tw-sub { margin:4px 0 0; font-size:.8rem; color:var(--text-sub); }
.tw-sheet-shade { position:fixed; inset:0; z-index:1200; background:rgba(0,0,0,.55); display:flex; align-items:flex-end; justify-content:center; padding:16px; }
.tw-sheet { width:100%; max-width:520px; max-height:82vh; overflow:auto; border-radius:18px; background:var(--card-bg,#18181b); border:1px solid var(--border);
    padding:16px; text-align:left; box-shadow:0 20px 60px rgba(0,0,0,.5); }
.tw-sheet-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; }
.tw-sheet-head strong { font-size:1rem; }
.tw-sheet-close { min-height:34px; padding:6px 12px; }
.tw-sheet-foot { display:flex; gap:10px; margin-top:16px; }
.tw-sheet-foot .team-button { flex:1; }
.tw-help { color:var(--text-sub); font-size:.82rem; margin:10px 0 8px; }
@media (min-width:640px) { .tw-sheet-shade { align-items:center; } }
@media (max-width:380px) { .tw-seat { width:58px; } .tw-avatar { width:46px; height:46px; } .tw-code { font-size:2.6rem; letter-spacing:6px; } .tw-board { gap:4px; } }
