/* 牛马杀 v0.15.2 牌桌（参考三国杀）
   横屏：对手分在左右两列，只到操作台上沿；中间上方是出牌动画区，下面是居中的提示行（文字 + 动态虚线读条 + “结束”圆钮）；
        最下面一整行操作台：轮数/菜单 | 自己的角色牌 + 装备 | 手牌 | 三条技能。
   竖屏：对手一行在顶部，中间动画区，然后提示行、操作台（轮数/菜单、角色牌、装备、技能）、手牌。
   所有角色牌同一个尺寸 --C（高）/ --card-w（宽），由 app.js 的 tableMetrics 按屏幕算好。
   这份样式只作用于 .tb-shell，不影响开局页和弹窗。 */

.tb-shell{
  --tb-ink:#f3e7cc;--tb-muted:#c3ccc5;--tb-gold:#f2c66d;--tb-red:#ff6b4f;--tb-teal:#5fe0c8;
  --tb-panel:rgba(8,18,20,.88);--tb-line:rgba(242,198,109,.42);
  --labor:#55e0d5;--capital:#ff8868;--merchant:#bd9afa;
  --atk:#d9583b;--def:#2f86d0;--rng:#2e9a5c;
  --C:96px;--card-w:72px;--side-w:92px;--hand-h:100px;--card-zoom:.6;--pcard-w:80px;--skill-w:110px;--strip:40px;
  --gap:10px;--text:13px;--orb:40px;
  position:fixed;inset:0;z-index:1;overflow:hidden;display:grid;
  padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
  background:linear-gradient(180deg,rgba(5,12,14,.6) 0%,rgba(5,12,14,.26) 34%,rgba(5,12,14,.32) 58%,rgba(4,10,12,.88) 100%),url(./assets/art-v5/office-city.webp) center 38%/cover no-repeat,#0c181a;
  color:var(--tb-ink);font-family:var(--sans,"PingFang SC","Microsoft YaHei",sans-serif);-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;
}
.tb-shell button{font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}
.tb-shell svg{flex:none}
.tb-shell .tb-skillbar,.tb-shell .tb-orb,.tb-shell .tb-card,.tb-shell .tb-pill,.tb-shell .tb-round,.tb-shell .tb-menu,.tb-shell .tb-event,.tb-shell .zone-choice,.tb-shell .equip-slot{min-height:0;min-width:0}

/* ───────── 角色牌（所有人同一尺寸） ───────── */
.tb-seat{position:relative;isolation:isolate;flex:none;width:var(--card-w);cursor:pointer;outline:none;transition:transform .2s}
.tb-seat:focus-visible .tb-card{outline:2px solid var(--tb-gold);outline-offset:3px}
.tb-card{position:relative;display:block;width:var(--card-w);aspect-ratio:3/4;padding:0;margin:0;border:0;border-radius:9px;cursor:pointer;text-align:left;
  background:radial-gradient(120% 80% at 50% 18%,#3f5d58 0%,#1c2f2d 58%,#111d1c 100%);
  box-shadow:0 0 0 1.5px rgba(242,198,109,.55),0 0 0 3px rgba(8,16,17,.85),0 5px 12px rgba(0,0,0,.5);transition:box-shadow .2s,filter .2s,transform .2s}
[data-side="capital"]>.tb-card,.tb-me[data-side="capital"] .tb-card{background:radial-gradient(120% 80% at 50% 18%,#6a4038 0%,#352220 58%,#1d1312 100%)}
[data-side="merchant"]>.tb-card,.tb-me[data-side="merchant"] .tb-card{background:radial-gradient(120% 80% at 50% 18%,#55456e 0%,#2b2338 58%,#17131f 100%)}
.tb-shell .tb-card.self-portrait{flex:none;height:auto;overflow:visible;border:0;align-self:auto}
.tb-shell .tb-card.self-portrait:before,.tb-shell .tb-card.self-portrait:after{display:none;content:none}
.tb-art{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}
.tb-shell .tb-art img{position:absolute;left:50%;top:3%;right:auto;bottom:auto;width:114%;max-width:none;height:auto;max-height:none;margin:0;transform:translateX(-50%)!important;filter:drop-shadow(0 3px 4px rgba(0,0,0,.45))!important;opacity:1!important;animation:none!important;object-fit:contain;border-radius:0}
.tb-tag{position:absolute;left:50%;top:-11px;z-index:6;transform:translateX(-50%);height:17px;padding:0 7px;border-radius:9px;font-size:11px;font-weight:900;line-height:17px;letter-spacing:.5px;white-space:nowrap;background:rgba(6,14,16,.92);color:var(--tb-muted);border:1px solid var(--tb-line)}
.tb-tag.is-acting{background:var(--tb-gold);color:#1c1408;border-color:transparent}
.tb-seatno{position:absolute;left:4px;top:4px;z-index:3;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:900;line-height:1;background:rgba(5,12,13,.88);color:var(--tb-gold);border:1px solid rgba(242,198,109,.6)}
.tb-faction{position:absolute;right:4px;top:4px;z-index:3;display:block;height:16px;padding:0 5px;margin:0;border-radius:4px;font-size:10px;font-weight:900;line-height:16px;color:#0b1414;background:#c9d3cf}
.tb-faction[data-side="labor"]{background:var(--labor)}.tb-faction[data-side="capital"]{background:var(--capital)}.tb-faction[data-side="merchant"]{background:var(--merchant)}
.tb-card .participant-label{position:absolute;left:25px;right:auto;top:5px;max-width:calc(100% - 64px);z-index:3;display:block;height:15px;padding:0 4px;border-radius:4px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:9px;line-height:15px;background:rgba(5,12,13,.8);color:var(--tb-muted)}
.tb-card .participant-label b{font-weight:800}.tb-card .participant-label i{display:none}
.tb-card .participant-label[data-participant="human"]{background:var(--tb-gold);color:#1c1408}
.tb-card .tb-count{position:absolute;left:4px;top:26px;right:auto;bottom:auto;z-index:3;display:flex;align-items:center;gap:1px;height:17px;min-width:0;width:auto;margin:0;padding:0 4px 0 2px;border-radius:4px;background:rgba(5,12,13,.86);border:1px solid rgba(255,255,255,.2);font-size:11px;font-weight:900;color:var(--tb-ink);transform:none;box-shadow:none}
.tb-card .tb-count svg{width:11px;height:11px}.tb-card .tb-count small{display:none}.tb-card .tb-count b{font-size:11px}
.tb-card .identity-guess{position:absolute;left:4px;right:auto;top:47px;z-index:3;min-width:16px;height:16px;padding:0 3px;border-radius:4px;font-size:9px;font-weight:900;line-height:16px;text-align:center;background:var(--guess-color,#888);color:#0b1414}
.tb-plate{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 3px 4px;border-radius:0 0 9px 9px;background:linear-gradient(180deg,transparent,rgba(5,11,12,.82) 45%,rgba(5,11,12,.94))}
.tb-stamps{display:flex;flex-wrap:nowrap;justify-content:center;gap:2px;margin-bottom:1px}
.tb-stamps i{display:grid;place-items:center;min-width:15px;height:15px;padding:0 2px;border-radius:8px;font-style:normal;font-size:9px;font-weight:900;line-height:1;background:rgba(240,214,160,.95);color:#3a1c12;box-shadow:0 1px 2px rgba(0,0,0,.5)}
.tb-stamps i[data-status="focus"]{background:#8fe3cf;color:#0e2f2a}
.tb-stamps i[data-status="meeting"],.tb-stamps i[data-status="tape"],.tb-stamps i[data-status="freeze"]{background:#ffb347}
.tb-name{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:clamp(10px,calc(var(--card-w) * .15),16px);font-weight:900;line-height:1.2;letter-spacing:0;color:#fff3da;text-shadow:0 1px 2px #000}
.tb-plate .hp-row{display:flex;align-items:center;justify-content:center;gap:2px;flex-wrap:nowrap}
.tb-plate .hp-dot{display:block;width:clamp(6px,calc(var(--card-w) * .08),10px);height:clamp(6px,calc(var(--card-w) * .08),10px);border-radius:2px;background:#56d68e;box-shadow:inset 0 -1px rgba(0,0,0,.35)}
.tb-plate .hp-dot.empty{background:rgba(255,255,255,.2)}
.tb-plate .hp-number{margin-left:3px;font-size:10px;font-weight:800;line-height:1;color:var(--tb-muted)}
.tb-plate .countdown{display:flex;align-items:center;gap:2px;font-size:10px;font-weight:900;color:#ffb347}.tb-plate .countdown svg{width:10px;height:10px}
.tb-plate .out-stamp{font-size:10px;font-weight:900;color:#ff9b86;letter-spacing:1px}
/* 扣血动画：刚掉的心态格先放大闪红，再碎成空格；整条心态条抖一下 */
.tb-plate .hp-dot.is-lost{animation:tb-hp-lose 1.1s ease-out .45s both}
.tb-plate .hp-row.is-hit,.tb-plate .countdown.is-hit{animation:tb-hp-shake .5s ease-out .45s both}
@keyframes tb-hp-lose{0%{background:#56d68e;transform:scale(1)}18%{background:#ff3b2f;transform:scale(1.9);box-shadow:0 0 10px #ff3b2f}45%{background:#ff3b2f;transform:scale(1.4)}100%{background:rgba(255,255,255,.2);transform:scale(1);box-shadow:none}}
@keyframes tb-hp-shake{0%,100%{transform:none}20%{transform:translateX(-3px)}40%{transform:translateX(3px)}60%{transform:translateX(-2px)}80%{transform:translateX(1px)}}
/* 对手的装备：右侧三块小色块（攻红 / 防蓝 / 距绿），点整张牌看详情 */
.tb-gear{position:absolute;right:4px;top:24px;z-index:3;display:flex;flex-direction:column;gap:3px;pointer-events:none}
.gear-chip{display:grid;place-items:center;width:clamp(16px,calc(var(--card-w) * .24),26px);height:clamp(16px,calc(var(--card-w) * .24),26px);border-radius:5px;background:var(--slot-color);color:#fff;font-style:normal;box-shadow:0 1px 3px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.35)}
.gear-chip svg{width:62%;height:62%}
.tb-shell .target-rune{display:none!important}
.tb-card .player-feedback{display:none}

/* 角色牌状态：整张牌边框变色；轮到谁，谁的牌放大一点并亮金框 */
.tb-seat.is-active,.tb-me.is-turn-owner .tb-card{transform:scale(1.08);z-index:4}
.tb-me .tb-card{transform-origin:50% 100%}
.tb-seat.is-active .tb-card,.tb-me.is-turn-owner .tb-card{box-shadow:0 0 0 2px var(--tb-gold),0 0 0 4px rgba(8,16,17,.85),0 0 20px rgba(242,198,109,.65)}
.tb-seat.is-responding .tb-card,.tb-me.is-acting:not(.is-turn-owner) .tb-card{box-shadow:0 0 0 2px #ffb347,0 0 0 4px rgba(8,16,17,.85),0 0 16px rgba(255,179,71,.55)}
.tb-seat.is-action-target .tb-card,.tb-me.is-action-target .tb-card{box-shadow:inset 0 0 0 2px var(--tb-red),0 0 0 2px var(--tb-red),0 0 16px rgba(255,107,79,.55)}
.tb-seat.is-action-benefit .tb-card,.tb-me.is-action-benefit .tb-card{box-shadow:inset 0 0 0 2px var(--tb-teal),0 0 0 2px var(--tb-teal),0 0 16px rgba(95,224,200,.5)}
.tb-shell .targetable .tb-card{animation:tb-target 1.2s ease-in-out infinite}
.tb-shell .target-selected .tb-card{transform:translateY(-3px);box-shadow:0 0 0 3px #fff0c8,0 0 0 5px var(--tb-red),0 0 22px rgba(255,107,79,.9)}
.tb-shell .target-muted .tb-card{filter:brightness(.5) saturate(.55)}
.tb-shell .status-slacking .tb-card .tb-art{filter:sepia(.55) brightness(.8)}
.tb-shell .status-out .tb-card{filter:grayscale(1) brightness(.55)}
.tb-shell .status-out .tb-card:after{content:"已优化";position:absolute;left:50%;top:42%;z-index:5;transform:translate(-50%,-50%) rotate(-14deg);padding:1px 6px;border:2px solid #ff8f78;border-radius:4px;color:#ff8f78;background:rgba(10,14,15,.7);font-size:13px;font-weight:1000;letter-spacing:2px;white-space:nowrap}

/* 说话气泡：朝牌桌中间冒出来 */
.tb-shell .taunt-bubble{position:absolute;top:auto;right:auto;bottom:auto;left:auto;clip-path:none;border:0;z-index:14;width:max-content;max-width:140px;padding:5px 9px;border-radius:10px;background:#fff3da;color:#1c2422;font-size:12px;font-weight:800;line-height:1.3;text-align:left;box-shadow:0 3px 8px rgba(0,0,0,.45);animation:tb-pop .2s ease-out both;pointer-events:none}
.tb-side.is-left .taunt-bubble{left:calc(100% + 8px);top:30%}
.tb-side.is-right .taunt-bubble{right:calc(100% + 8px);top:30%}
.tb-toprow .taunt-bubble,.tb-topseat .taunt-bubble{left:50%;top:calc(100% + 6px);transform:translateX(-50%)}
.tb-me .taunt-bubble{bottom:calc(100% + 14px);left:calc(var(--card-w) * .85)}

/* ───────── 出牌动画区 ───────── */
.tb-stage{grid-area:stage;position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;min-height:0;min-width:0}
.tb-topseat{flex:none;display:flex;justify-content:center;padding-top:16px}
/* 横屏6人局：两位对手坐在桌面左上角、右上角（逆时针先右后左），正上方留给出牌动画。 */
.tb-topseat.is-split{position:absolute;z-index:3;top:0;left:0;right:0;flex-direction:row-reverse;justify-content:space-between;padding:16px clamp(10px,12%,120px) 0;pointer-events:none}
.tb-topseat.is-split>*{pointer-events:auto}
/* 竖屏6人局：下家、上家坐在桌面右侧、左侧，和上排3位围成一圈。 */
.tb-wing{position:absolute;z-index:3;top:calc(var(--C) * .28 + 14px)}
.tb-wing.is-right{right:10px}.tb-wing.is-left{left:10px}
.tb-wing .taunt-bubble{top:calc(100% + 6px);left:50%;transform:translateX(-50%)}
.tb-stage-free{flex:1 1 auto;min-height:0;width:100%;display:flex;align-items:center;justify-content:center}
.tb-shell .tb-pile{position:relative;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:0;min-height:0;width:auto;max-width:none;margin:0;padding:0 0 20px;pointer-events:none}
.tb-shell .tb-pile.is-empty{display:none}
.tb-pcard{position:relative;flex:none;width:var(--pcard-w);aspect-ratio:5/7;display:flex;flex-direction:column;align-items:stretch;padding:4px 4px 3px;border:2px solid #152623;border-radius:0;background:linear-gradient(153deg,#f7e8c9,#e3c590);color:#152623;box-shadow:0 0 0 1px rgba(242,198,109,.55),0 8px 18px rgba(0,0,0,.55)}
.tb-pcard+.tb-pcard{margin-left:calc(var(--pcard-w) * -.18)}
.tb-pcard-art{display:block;flex:1 1 auto;min-height:0;overflow:hidden;border-radius:0;background:#152623}
.tb-pcard-art svg,.tb-pcard-art img{display:block;width:100%;height:100%;object-fit:cover}
.tb-pcard b{display:block;padding-top:2px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:clamp(11px,calc(var(--pcard-w) * .15),18px);font-weight:1000;font-style:italic;line-height:1.2}
.tb-pcard small{position:absolute;right:4px;top:4px;padding:0 4px;border-radius:3px;font-size:9px;font-weight:900;background:var(--tb-teal);color:#0e2f2a}
.tb-pcard.is-attack{border-color:#8f2417}.tb-pcard.is-good{border-color:#245b52}
.tb-pcard.is-skill{background:linear-gradient(#24463f,#122a26);color:#f3e7cc;border-color:var(--tb-teal)}
.tb-pcard.is-skill .tb-pcard-art{background:radial-gradient(circle at 50% 30%,#3f5d58,#152623)}
.tb-pcard.is-skill .tb-pcard-art img{object-fit:cover;object-position:50% 8%;height:150%}
.tb-pcard-route{position:absolute;left:50%;top:calc(100% + 4px);transform:translateX(-50%);display:flex;align-items:center;gap:3px;padding:1px 7px;border-radius:0;white-space:nowrap;font-size:11px;font-weight:800;font-style:normal;line-height:16px;color:var(--tb-ink);background:rgba(5,12,13,.8)}
.tb-pcard-route em{font-style:normal;color:var(--tb-red);font-size:9px}
.tb-pcard.is-old{transform:scale(.88) rotate(-5deg);filter:brightness(.62) saturate(.6);z-index:0}
.tb-pcard.is-old .tb-pcard-route{display:none}
.tb-pcard.is-newest{z-index:1;animation:tb-settle .35s ease-out both}
.tb-pile.is-arriving .tb-pcard.is-newest{animation:tb-land 1ms linear var(--arrive-delay,0ms) both}
.tb-banners{position:absolute;top:6px;left:50%;z-index:11;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:4px;max-width:96%}
.tb-banner{display:flex;align-items:center;gap:8px;padding:4px 6px 4px 10px;border-radius:14px;background:var(--tb-panel);border:1px solid var(--tb-red);color:#ffd2c8;font-size:12px;font-weight:800;line-height:1.3;box-shadow:0 3px 8px rgba(0,0,0,.4)}
.tb-banner .text-btn{font-size:12px;color:var(--tb-gold);background:none;border:0;padding:2px 6px}

/* 需要点牌的面板（拿牌、拆牌、离职员工发朋友圈、选装备区）浮在动画区中间 */
.tb-float-wrap{grid-area:stage;position:relative;z-index:30;display:flex;align-items:center;justify-content:center;min-height:0;padding:6px;pointer-events:none}
.tb-float-wrap>*{pointer-events:auto}
.tb-float{display:flex;flex-direction:column;gap:6px;max-width:100%;max-height:100%;overflow:auto;padding:10px 12px;border-radius:12px;background:rgba(10,22,24,.96);border:1px solid var(--tb-line);box-shadow:0 10px 30px rgba(0,0,0,.6)}
.tb-float .ghost-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.tb-float .ghost-row b{flex:none;width:30px;font-size:12px;color:var(--tb-gold)}
.tb-float .tb-pill.ghost-like{border-color:var(--tb-teal)}.tb-float .tb-pill.ghost-roast{border-color:var(--tb-red)}
.tb-float.target-zones{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center}
.tb-float .zone-target{display:flex;align-items:center;gap:5px;font-size:12px}.tb-float .zone-target img{width:30px;height:30px;object-fit:cover;object-position:top;border-radius:6px}
.tb-float .zone-choice{display:flex;flex-direction:column;align-items:center;gap:3px;width:64px;padding:4px;border-radius:8px;background:rgba(242,198,109,.12);border:1px solid rgba(242,198,109,.5);cursor:pointer}
.tb-float .zone-choice svg{width:44px;height:33px}.tb-float .zone-choice small{font-size:11px;line-height:1.2;text-align:center}
.tb-shell .tb-float-wrap .card-choice-panel{position:relative;left:auto;top:auto;right:auto;bottom:auto;transform:none;height:auto!important;min-height:0;width:min(560px,100%);max-height:100%;overflow:auto;margin:0;padding:10px 12px;border-radius:12px;background:rgba(10,22,24,.97);border:1px solid var(--tb-line);box-shadow:0 12px 40px rgba(0,0,0,.6);color:var(--tb-ink);display:block}
.tb-shell .card-choice-panel header{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.tb-shell .card-choice-panel .pick-owner img{width:38px;height:38px;object-fit:cover;object-position:top;border-radius:6px}
.tb-shell .card-choice-panel .choice-cards{display:flex;flex-wrap:wrap;justify-content:center;gap:6px}
/* 选牌面板在深色桌面上：牌面仍用浅底深字，牌名和花色才看得见。 */
.tb-shell .card-choice-panel .pick-card.is-face{color:#193d2c}
.tb-shell .card-choice-panel .pick-card.is-face .pick-card-suit{color:#193d2c}

/* ───────── 提示行：文字居中一行，下面动态虚线读条，右边“结束”圆钮 ───────── */
.tb-strip{grid-area:strip;position:relative;z-index:6;display:flex;align-items:center;gap:10px;min-width:0;padding:0 6px 2px}
.tb-strip-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:3px}
.tb-say-row{display:flex;align-items:center;justify-content:center;gap:8px;min-width:0;min-height:20px}
.tb-say{flex:0 1 auto;min-width:0;margin:0;font-size:var(--text);line-height:1.35;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 2px #000,0 0 8px rgba(0,0,0,.75)}
.tb-say b{font-weight:900;color:var(--tb-ink);margin-right:.6em}
.tb-say span{font-weight:600;color:var(--tb-muted)}
.tb-say em{font-style:normal;font-weight:800;color:rgba(195,204,197,.6)}
.tb-say em.is-held{color:var(--tb-gold)}
.tb-say em.is-warn{color:#ffb4a2}
.tb-say small{font-size:.9em;color:rgba(195,204,197,.6);margin-left:2px}
.tb-strip.is-mine .tb-say b,.tb-strip.is-armed .tb-say b{color:var(--tb-gold)}
.tb-strip.is-response .tb-say b,.tb-strip.is-incoming .tb-say b{color:#ffb4a2}
.tb-strip.is-auto .tb-say b{color:var(--tb-teal)}
.tb-pills{flex:none;display:flex;align-items:center;gap:5px;max-width:60%;overflow-x:auto;scrollbar-width:none}
.tb-pills::-webkit-scrollbar{display:none}
.tb-pill{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:3px;height:26px;padding:0 10px;border-radius:13px;cursor:pointer;border:1px solid rgba(242,198,109,.55);background:rgba(8,20,22,.9);color:var(--tb-ink);font-size:12px;font-weight:800;line-height:1;white-space:nowrap}
.tb-pill.is-primary{background:linear-gradient(#f5d99f,#c58f46);border-color:#f6dfac;color:#1c1408}
.tb-pill.is-icon{width:26px;padding:0;font-size:13px;color:var(--tb-muted)}
.tb-pill.is-icon svg{width:13px;height:13px}
.tb-line{display:flex;align-items:center;min-width:0;height:14px}
.tb-clock{position:relative;display:block;flex:1 1 auto;min-width:40px;height:14px;padding-right:26px}
.tb-clock:before{content:"";position:absolute;left:0;right:26px;top:50%;height:2px;margin-top:-1px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.18) 0 8px,transparent 8px 14px)}
.tb-clock .tb-clock-fill{position:absolute;left:calc((100% - 26px) * (1 - var(--clock-progress,1)) / 2);top:50%;height:3px;margin-top:-1.5px;width:calc((100% - 26px) * var(--clock-progress,1));background:repeating-linear-gradient(90deg,#6fe0a2 0 8px,transparent 8px 14px);background-size:14px 100%;animation:tb-dash .7s linear infinite;transition:width .25s linear,left .25s linear;filter:drop-shadow(0 0 3px rgba(111,224,162,.6))}
.tb-clock.is-urgent .tb-clock-fill{background-image:repeating-linear-gradient(90deg,#ff6b4f 0 8px,transparent 8px 14px);filter:drop-shadow(0 0 3px rgba(255,107,79,.7))}
.tb-clock.is-paused .tb-clock-fill{animation-play-state:paused;opacity:.5}
.tb-clock.is-idle .tb-clock-fill{opacity:0}
.tb-clock b{position:absolute;right:0;top:50%;transform:translateY(-50%);width:22px;text-align:right;font-size:12px;font-weight:900;line-height:1;color:var(--tb-ink);font-variant-numeric:tabular-nums;text-shadow:0 1px 2px #000}
.tb-clock.is-urgent b{color:var(--tb-red)}
.tb-clock.is-idle b{opacity:.4}
/* “结束”圆钮：只写两个字 */
.tb-orb{flex:none;display:grid;place-items:center;width:var(--orb);height:var(--orb);padding:0;border-radius:50%;cursor:pointer;border:1.5px solid rgba(255,255,255,.22);background:rgba(8,20,22,.85);color:rgba(195,204,197,.55);font-size:calc(var(--orb) * .3);font-weight:900;line-height:1;letter-spacing:1px;white-space:nowrap;box-shadow:0 3px 8px rgba(0,0,0,.4)}
.tb-orb.is-primary{color:#1c1408;border-color:#f6dfac;background:radial-gradient(circle at 50% 35%,#f8e2ae,#c58f46);box-shadow:inset 0 1px #fff3cf,0 3px 0 #6b4a25,0 5px 12px rgba(0,0,0,.4)}
.tb-orb:disabled{cursor:default}

/* ───────── 操作台 ───────── */
.tb-console{grid-area:console;position:relative;z-index:7;display:flex;align-items:flex-end;gap:var(--gap);min-width:0;padding:0 8px 6px}
.tb-sys{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;align-self:stretch}
.tb-round,.tb-menu{position:relative;display:grid;place-items:center;width:38px;height:38px;padding:0;border-radius:50%;cursor:pointer;border:1.5px solid var(--tb-line);background:rgba(5,12,13,.8);color:var(--tb-gold)}
.tb-round b{font-size:17px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
.tb-round i{position:absolute;inset:-1.5px;border-radius:50%;background:conic-gradient(var(--tb-gold) calc(var(--bell,0) * 360deg),transparent 0);-webkit-mask:radial-gradient(circle,transparent 16.5px,#000 17px);mask:radial-gradient(circle,transparent 16.5px,#000 17px);pointer-events:none}
.tb-round.is-over b{font-size:14px}
.tb-round.bell-soon{border-color:var(--tb-red);color:#ffd2c8;animation:tb-bell 1.2s ease-in-out infinite}
.tb-round.bell-soon i{background:conic-gradient(var(--tb-red) calc(var(--bell,0) * 360deg),transparent 0)}
.tb-menu svg{width:17px;height:17px}
.tb-event{max-width:96px;height:22px;padding:0 8px;border-radius:11px;border:1px solid var(--tb-red);background:rgba(255,107,79,.16);color:#ffd2c8;font-size:11px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:pointer}
.tb-me{position:relative;isolation:isolate;flex:none;display:flex;align-items:flex-end;gap:5px}
/* 自己的装备：竖排三格，颜色和字说明槽位：攻（红）/ 防（蓝）/ 距（绿） */
.tb-equip{display:flex;flex-direction:column;gap:4px}
.tb-equip .equip-slot{all:unset;box-sizing:border-box;position:relative;display:grid;place-items:center;width:clamp(28px,calc(var(--card-w) * .42),46px);height:calc((var(--C) - 8px) / 3);border-radius:7px;cursor:pointer;
  background:color-mix(in srgb,var(--slot-color) 18%,rgba(5,12,13,.7));border:1.5px dashed color-mix(in srgb,var(--slot-color) 70%,transparent);color:var(--slot-color)}
.tb-equip .equip-slot .equip-slot-glyph{font-size:clamp(11px,calc(var(--card-w) * .17),16px);font-weight:900;line-height:1}
.tb-equip .equip-slot.occupied{border-style:solid;border-color:color-mix(in srgb,var(--slot-color) 85%,#fff);background:var(--slot-color);color:#fff}
.tb-equip .equip-slot.occupied .equip-slot-glyph{position:absolute;left:2px;top:1px;font-size:9px;opacity:.85}
.tb-equip .equip-slot.can-equip{box-shadow:0 0 0 1px var(--slot-color),0 0 10px color-mix(in srgb,var(--slot-color) 70%,transparent)}
.tb-equip .equip-slot small,.tb-equip .equip-tooltip,.tb-equip .equip-empty-mark,.tb-equip .equip-ready,.tb-equip .equip-slot-symbol{display:none}
.tb-equip .equip-art{display:grid;place-items:center;width:100%;height:100%}
.tb-equip .equip-art svg{width:clamp(14px,calc(var(--card-w) * .22),24px);height:clamp(14px,calc(var(--card-w) * .22),24px)}
.tb-equip .equip-slot.can-equip:after{content:"";position:absolute;right:-3px;top:-3px;width:8px;height:8px;border-radius:50%;background:var(--slot-color)}
/* 选中装备牌后：目标槽亮起；已有装备时显示“换” */
.tb-equip .equip-slot.is-equip-target{border-style:solid;box-shadow:0 0 0 2px #fff6df,0 0 16px var(--slot-color);animation:tb-equip-pulse 1s ease-in-out infinite}
.tb-equip .equip-slot.will-replace:before{content:"换";position:absolute;right:-6px;top:-7px;z-index:2;width:16px;height:16px;border-radius:50%;display:grid;place-items:center;font-size:10px;font-weight:900;background:#fff6df;color:#7a2a1f;box-shadow:0 1px 3px rgba(0,0,0,.5)}
@keyframes tb-equip-pulse{50%{transform:scale(1.08)}}
/* 手牌：放不下时互相叠一部分，再放不下就横向滑动 */
.tb-hand{position:relative;flex:1 1 auto;min-width:0;container-type:inline-size}
.tb-hand-cards{display:flex;align-items:flex-end;justify-content:flex-start;padding:14px 2px 0;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.tb-hand-cards::-webkit-scrollbar{display:none}
.tb-hand-cards>:first-child{margin-left:auto}
.tb-hand-cards>:last-child{margin-right:auto}
.tb-cardbox{--cw:calc(120px * var(--card-zoom));position:relative;flex:0 0 var(--cw);width:var(--cw);height:calc(168px * var(--card-zoom));
  margin-left:calc(var(--cw) * -.3);
  margin-left:max(calc(var(--strip) - var(--cw)),min(4px,calc((100cqw - var(--card-count) * var(--cw) - 4px) / max(1,var(--card-count) - 1))));
  transition:transform .15s ease-out}
.tb-hand-cards>.tb-cardbox:first-child{margin-left:auto}
.tb-cardbox:hover{transform:translateY(-6px);z-index:4}
.tb-cardbox.is-selected{transform:translateY(-14px);z-index:6}
.tb-shell .tb-cardbox .playing-card{position:absolute;left:0;top:0;width:120px;height:168px;min-height:168px;max-height:168px;margin:0;flex:none;transform:scale(var(--card-zoom))!important;transform-origin:0 0;rotate:none;translate:none;grid-template-rows:minmax(0,1fr) 22px 34px;transition:box-shadow .15s}
.tb-cardbox .playing-card .card-quip,.tb-cardbox .playing-card .card-type{display:none}
.tb-cardbox .playing-card .card-name{font-size:17px;line-height:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-cardbox .playing-card .card-summary{font-size:12px;line-height:16px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tb-hand-empty{display:grid;place-items:center;height:calc(var(--hand-h) * .8);padding:0 16px;color:var(--tb-muted);font-size:14px;font-weight:800;text-align:center}
/* 装备手牌：顶条和右下角大字标出槽位（攻红 / 防蓝 / 距绿） */
.playing-card.is-gear{--card-color:var(--gear-color)}
.playing-card.gear-tool{--gear-color:#d9583b}.playing-card.gear-confidence{--gear-color:#2f86d0}.playing-card.gear-reach{--gear-color:#2e9a5c}
.playing-card.is-gear:after{height:8px!important;background:var(--gear-color)!important}
.playing-card .card-slot-glyph{position:absolute;right:6px;top:66px;z-index:5;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--slot-color);color:#fff;font-size:17px;font-weight:1000;line-height:1;border:2px solid #fff6df;box-shadow:0 2px 4px rgba(0,0,0,.45)}
/* 三条技能：主动 / 被动 / 解压，三条总高 = 角色牌高 */
.tb-skills{--bar-h:calc((var(--C) - 10px) / 3);flex:none;display:flex;flex-direction:column;gap:5px;width:var(--skill-w)}
.tb-skillbar{display:flex;align-items:center;gap:6px;width:100%;height:var(--bar-h);padding:0 8px 0 4px;border-radius:calc(var(--bar-h) * .3);cursor:pointer;text-align:left;border:1px solid rgba(242,198,109,.38);background:linear-gradient(90deg,rgba(10,26,27,.94),rgba(10,26,27,.8));color:var(--tb-ink);box-shadow:0 2px 6px rgba(0,0,0,.35);transition:box-shadow .2s,border-color .2s}
.tb-skillbar i{flex:none;display:grid;place-items:center;width:calc(var(--bar-h) * .68);height:calc(var(--bar-h) * .68);border-radius:calc(var(--bar-h) * .2);font-style:normal;font-size:clamp(10px,calc(var(--bar-h) * .36),16px);font-weight:900;line-height:1;background:rgba(242,198,109,.18);color:var(--tb-gold);border:1px solid rgba(242,198,109,.45)}
.tb-skillbar b{flex:1 1 auto;min-width:0;font-size:clamp(11px,calc(var(--bar-h) * .42),17px);font-weight:900;line-height:1.15;letter-spacing:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb-skillbar b.is-long{font-size:clamp(9px,calc(var(--bar-h) * .32),13px);white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.1}
.tb-skillbar.is-passive i{background:rgba(255,255,255,.08);color:var(--tb-muted);border-color:rgba(255,255,255,.25)}
.tb-skillbar.is-passive b{color:var(--tb-muted);font-weight:800}
.tb-skillbar.is-rest i{background:rgba(155,227,122,.14);color:#c9f2b3;border-color:rgba(155,227,122,.5)}
.tb-skillbar.can-use{border-color:var(--tb-teal);box-shadow:0 0 0 1px rgba(95,224,200,.35),0 0 12px rgba(95,224,200,.35)}
.tb-skillbar.can-use i{background:var(--tb-teal);color:#0e2f2a;border-color:var(--tb-teal)}
.tb-skillbar.is-rest.can-use{border-color:#9be37a;box-shadow:0 0 0 1px rgba(155,227,122,.35),0 0 12px rgba(155,227,122,.3)}
.tb-skillbar.is-rest.can-use i{background:#9be37a;color:#17300d;border-color:#9be37a}
.tb-skillbar.is-used{opacity:.45}
.tb-skills.is-idle .tb-skillbar{opacity:.4}

/* 读屏用的关系提示，不占画面 */
.tb-shell .live-action-callout{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;padding:0!important;border:0!important}

/* ───────── 横屏 ───────── */
.tb-shell[data-orient="land"]{
  grid-template-columns:var(--side-w) minmax(0,1fr) var(--side-w);
  grid-template-rows:minmax(0,1fr) auto auto;
  grid-template-areas:"left stage right" "left strip right" "console console console";
}
[data-orient="land"] .tb-side{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:22px;min-height:0;padding:16px 0 18px}
[data-orient="land"] .tb-side.is-left{grid-area:left}
/* 左列只有一位（6人局的上家）：放在左下，和右下的下家对齐。 */
.tb-shell[data-orient="land"][data-seats="5"] .tb-side.is-left[data-n="1"]>.tb-seat:first-child{margin-top:calc(var(--C) + 22px)}
[data-orient="land"] .tb-side.is-right{grid-area:right;flex-direction:column-reverse;justify-content:flex-end}
[data-orient="land"] .tb-console{padding:0 calc(8px + env(safe-area-inset-right,0px)) 6px calc(8px + env(safe-area-inset-left,0px))}
@media (orientation:landscape) and (min-height:560px){
  .tb-shell{--text:15px;--orb:54px;--gap:14px}
  [data-orient="land"] .tb-console{padding-top:20px}
  .tb-pill{height:32px;padding:0 14px;font-size:14px;border-radius:16px}.tb-pill.is-icon{width:32px}
  .tb-clock b{font-size:14px}
  .tb-round,.tb-menu{width:46px;height:46px}.tb-round b{font-size:20px}
  .tb-round i{-webkit-mask:radial-gradient(circle,transparent 20.5px,#000 21px);mask:radial-gradient(circle,transparent 20.5px,#000 21px)}
  .tb-tag{height:20px;line-height:20px;font-size:12px;top:-13px}
  .tb-seatno{width:22px;height:22px;font-size:13px}
  .tb-faction{height:19px;line-height:19px;font-size:12px}
  .tb-card .tb-count{top:31px;height:20px}.tb-card .tb-count b{font-size:13px}
  .tb-gear{top:30px}
  .tb-stamps i{min-width:19px;height:19px;font-size:10px}
  .tb-pcard-route{font-size:13px}
  .tb-shell .taunt-bubble{font-size:14px;max-width:180px}
}

/* v0.18 平板（iPad 等，短边 ≥ 700px）：横竖屏都把提示行、按钮、角标放大，不再是放大版手机字号。 */
@media (min-width:700px) and (min-height:700px){
  .tb-shell{--text:18px;--orb:58px;--gap:16px}
  .tb-pill{height:40px;padding:0 18px;font-size:16px;border-radius:20px}.tb-pill.is-icon{width:40px}
  .tb-clock b{font-size:16px}
  .tb-round,.tb-menu{width:56px;height:56px}.tb-round b{font-size:23px}
  .tb-round i{-webkit-mask:radial-gradient(circle,transparent 25.5px,#000 26px);mask:radial-gradient(circle,transparent 25.5px,#000 26px)}
  .tb-tag{height:24px;line-height:24px;font-size:14px;top:-15px}
  .tb-seatno{width:28px;height:28px;font-size:16px}
  .tb-faction{height:24px;line-height:24px;font-size:14px}
  .tb-card .tb-count{top:38px;height:24px}.tb-card .tb-count b{font-size:15px}
  .tb-gear{top:38px}
  .tb-stamps i{min-width:22px;height:22px;font-size:12px}
  .tb-plate .hp-number{font-size:13px}
  .tb-pcard-route{font-size:15px}
  .tb-shell .taunt-bubble{font-size:16px;max-width:240px}
}

/* ───────── 竖屏（回到 v0.15 的排法） ───────── */
.tb-shell[data-orient="port"]{
  grid-template-columns:minmax(0,1fr);
  grid-template-rows:auto minmax(0,1fr) auto auto;
  grid-template-areas:"top" "stage" "strip" "console";
  --strip:44px;
}
.tb-toprow{grid-area:top;position:relative;z-index:3;display:flex;flex-direction:row-reverse;justify-content:center;gap:var(--seat-gap,8px);padding:20px 10px 0}
[data-orient="port"] .tb-console{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;grid-template-areas:"sys me . skills" "hand hand hand hand";align-items:end;gap:8px 10px;padding:22px 8px 8px}
[data-orient="port"] .tb-sys{grid-area:sys;align-self:end}
[data-orient="port"] .tb-me{grid-area:me}
[data-orient="port"] .tb-skills{grid-area:skills;width:clamp(120px,calc(var(--card-w) * 1.75),170px)}
[data-orient="port"] .tb-hand{grid-area:hand}
[data-orient="port"] .tb-float-wrap{grid-row:2}
[data-orient="port"] .tb-strip{padding:0 8px 2px}
/* 竖屏宽度有限：响应 / 装备预览时选项按钮另起一行，说明文字不被挤掉 */
[data-orient="port"] .tb-strip.is-response .tb-say-row,[data-orient="port"] .tb-strip.is-armed .tb-say-row,[data-orient="port"] .tb-strip.is-incoming .tb-say-row{flex-wrap:wrap;row-gap:4px}
[data-orient="port"] .tb-strip.is-response .tb-say,[data-orient="port"] .tb-strip.is-armed .tb-say,[data-orient="port"] .tb-strip.is-incoming .tb-say{flex-basis:100%;white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
[data-orient="port"] .tb-strip .tb-pills{max-width:100%}
@media (orientation:portrait) and (max-width:340px){
  .tb-shell{--text:12px;--orb:36px}
  .tb-pill{height:24px;padding:0 8px;font-size:11px}
  .tb-round,.tb-menu{width:34px;height:34px}
  .tb-round i{-webkit-mask:radial-gradient(circle,transparent 14.5px,#000 15px);mask:radial-gradient(circle,transparent 14.5px,#000 15px)}
}
/* 横屏：别人对你出牌时，效果和化解牌可以折成两行，不被省略号吃掉 */
[data-orient="land"] .tb-strip.is-response .tb-say,[data-orient="land"] .tb-strip.is-incoming .tb-say{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.3}
/* 二选一的响应：选项按钮另起一行 */
.tb-strip.choice-response .tb-say-row{flex-wrap:wrap;row-gap:4px}
.tb-strip.choice-response .tb-say{flex-basis:100%}
.tb-strip.choice-response .tb-pills{max-width:100%}

@keyframes tb-dash{to{background-position:14px 0}}
@keyframes tb-land{from{visibility:hidden}to{visibility:visible}}
@keyframes tb-settle{from{transform:translateY(-4px) scale(1.04)}to{transform:none}}
@keyframes tb-pop{from{opacity:0;transform:translateY(4px) scale(.96)}to{opacity:1;transform:none}}
@keyframes tb-target{0%,100%{box-shadow:0 0 0 2px var(--tb-red),0 0 10px rgba(255,107,79,.45)}50%{box-shadow:0 0 0 2px #ffd0c4,0 0 22px rgba(255,107,79,.95)}}
@keyframes tb-bell{0%,100%{box-shadow:none}50%{box-shadow:0 0 12px rgba(255,107,79,.7)}}
@media (prefers-reduced-motion:reduce){.tb-shell *{animation-duration:1ms!important;transition:none!important}.tb-pile.is-arriving .tb-pcard.is-newest{animation:none}}

/* ───────── 出牌动画：整张角色牌亮框、虚线箭头、飞到桌心的大牌 ───────── */
.fx-source-frame,.fx-target-frame{position:absolute;border-radius:9px;pointer-events:none;z-index:4;transform-origin:50% 50%}
.fx-source-frame{box-shadow:0 0 0 3px #ffd28a,0 0 22px rgba(255,210,138,.75)}
.fx-target-frame{box-shadow:0 0 0 3px #ff6b55,0 0 22px rgba(255,107,85,.75)}
.fx-target-frame.tone-good{box-shadow:0 0 0 3px #4ed9b4,0 0 22px rgba(78,217,180,.7)}
.fx-target-frame.tone-risk,.fx-target-frame.tone-skill{box-shadow:0 0 0 3px #ffb347,0 0 22px rgba(255,179,71,.7)}
.fx-source-frame.tone-ghost{box-shadow:0 0 0 3px #bda0ff,0 0 22px rgba(189,160,255,.7)}
.fx-source-frame .fx-tag,.fx-target-frame .fx-tag{top:-10px;font-size:11px;padding:0 6px;border-width:1.5px}
.fx-target-frame .fx-tag{top:auto;bottom:-10px;background:#ff6b55;color:#fff}
.fx-target-frame.tone-good .fx-tag{background:#4ed9b4;color:#152623}.fx-target-frame.tone-risk .fx-tag,.fx-target-frame.tone-skill .fx-tag{background:#ffb347;color:#152623}
.fx-source-frame.tone-ghost .fx-tag{background:#bda0ff}
.arena-effects .fx-aim-hit{position:absolute;width:76px;height:76px;border-radius:50%;pointer-events:none;z-index:6;background:radial-gradient(circle,rgba(255,244,214,.95) 0,rgba(255,150,110,.6) 38%,rgba(255,107,79,0) 70%)}
.arena-effects .fx-aim-path{fill:none;stroke:#ff6b55;stroke-width:3.5;stroke-linecap:round;stroke-dasharray:9 7;stroke-dashoffset:0;filter:drop-shadow(0 0 3px rgba(255,107,85,.65));animation:fx15-march .6s linear infinite}
.arena-effects .fx-aim-layer.tone-ghost .fx-aim-path{stroke-dasharray:5 7}
@keyframes fx15-march{to{stroke-dashoffset:-32}}
.arena-effects .fx-fly-card{width:var(--pcard-w,92px);aspect-ratio:5/7;padding:4px 4px 3px;display:flex;flex-direction:column;border-radius:0;box-shadow:0 0 0 1px rgba(242,198,109,.6),0 12px 24px rgba(0,0,0,.55);background:linear-gradient(153deg,#f7e8c9,#e3c590)}
.arena-effects .fx-fly-art{display:block;flex:1 1 auto;min-height:0;overflow:hidden;border-radius:0;background:#152623}
.arena-effects .fx-fly-card .fx-fly-sprite{width:100%;height:100%;object-fit:cover;border-radius:0}
.arena-effects .fx-fly-card b{margin-top:2px;font-size:clamp(11px,calc(var(--pcard-w,92px) * .15),18px);font-style:italic;line-height:1.2}
/* 扣血数字：大一点，落在被打的角色牌上 */
.arena-effects .fx-damage-number{font-size:clamp(30px,calc(var(--C,96px) * .42),64px)!important}
/* 技能切入：恢复 v0.15 的深青横幅底框（金边 + 红影），尺寸按动画区放大 */
.arena-effects .fx-skill-cut{display:flex!important;align-items:center;gap:12px;width:auto!important;max-width:min(var(--stage-w,420px),460px);min-width:min(260px,var(--stage-w,420px));height:auto!important;min-height:0;padding:8px 22px 8px 8px!important;z-index:16;border-radius:12px;clip-path:none!important;
  background:linear-gradient(100deg,rgba(12,30,30,.96),rgba(18,44,40,.96))!important;border:2px solid #f2c66d!important;box-shadow:0 0 0 2px rgba(8,16,17,.9),6px 6px 0 #c83b2b,0 14px 28px rgba(0,0,0,.55)!important}
.arena-effects .fx-skill-cut .portrait{flex:none;width:calc(var(--cut-h,96px) * .82)!important;height:calc(var(--cut-h,96px) * .82)!important;margin:0!important;object-fit:cover!important;object-position:50% 4%!important;border-radius:9px!important;background:radial-gradient(circle at 50% 30%,#3f5d58,#152623)!important;border:1px solid rgba(242,198,109,.6)!important;filter:none}
.arena-effects .fx-skill-cut>div{display:flex!important;flex-direction:column;gap:3px;min-width:0;color:#f3e7cc!important;text-shadow:none!important}
.arena-effects .fx-skill-cut small{font-size:clamp(11px,calc(var(--cut-h,96px) * .12),14px)!important;font-weight:800;color:#9fe3cf!important;letter-spacing:1px;text-shadow:none!important}
.arena-effects .fx-skill-cut strong{font:1000 italic clamp(20px,calc(var(--cut-h,96px) * .3),40px)/1.1 var(--sans,sans-serif)!important;color:#f2c66d!important;-webkit-text-stroke:0!important;text-shadow:2px 2px 0 #7a2a1f!important;white-space:nowrap}
.arena-effects .fx-skill-cut span{font-size:clamp(12px,calc(var(--cut-h,96px) * .15),17px)!important;font-weight:700;line-height:1.3!important;color:#f3e7cc!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:none!important}
.arena-effects .fx-skill-cut.is-ghost{border-color:#bda0ff!important}
/* 锦囊漫画：恢复 v0.15 的纸面漫画格底框，尺寸按动画区放大 */
.arena-effects .fx-panel15{position:absolute;inset:-2% -5% 2%;z-index:0;background:radial-gradient(#152623 .8px,transparent 1.1px) 0 0/6px 6px,linear-gradient(160deg,#f6e7c6,#e4c995);opacity:1;border:3px solid #152623;border-radius:4px;box-shadow:6px 6px 0 #c83b2b,0 14px 30px rgba(0,0,0,.5);transform:rotate(-2deg)}
.arena-effects .fx-comic-theatre .fx-comic-rays{opacity:.35}
.arena-effects .fx-comic-theatre .fx-action-mark,.arena-effects .fx-comic-theatre .fx-setup-caption{display:none!important}
.arena-effects .fx-comic-theatre .fx-card-title{left:3%;top:2%;right:auto;z-index:20;max-width:70%;padding:2px 10px 4px;transform:rotate(-3deg);font:1000 italic clamp(16px,calc(var(--theatre-h,160px) * .13),32px)/1.15 var(--sans,sans-serif);letter-spacing:1px;-webkit-text-stroke:0;text-shadow:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:#152623!important;color:#f6e7c6!important;box-shadow:3px 3px 0 #c83b2b!important;border:0!important;border-radius:2px}
.arena-effects .fx-comic-theatre .fx-scene-caption{left:50%;right:auto;top:auto;bottom:4%;z-index:21;width:max-content;max-width:90%;padding:3px 12px;transform:translateX(-50%) rotate(-1deg);font:1000 clamp(12px,calc(var(--theatre-h,160px) * .1),20px)/1.25 var(--sans,sans-serif);-webkit-text-stroke:0;text-shadow:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:#fff6df!important;color:#152623!important;border:2px solid #152623!important;border-bottom:4px solid #c83b2b!important;box-shadow:3px 3px 0 #152623!important;border-radius:2px;animation:fx15-caption var(--fx-duration) both!important}
.arena-effects .fx-comic-theatre.fx-tableau .fx-scene-caption{animation:none!important;opacity:1!important;translate:0 0!important}
@keyframes fx15-caption{0%,26%{opacity:0;translate:0 8px}34%,97%{opacity:1;translate:0 0}100%{opacity:0;translate:0 0}}
.arena-effects .fx-comic-theatre .fx-impact-word{right:3%;left:auto;top:12%;font-size:clamp(26px,calc(var(--theatre-h,160px) * .3),60px)}

/* 菜单里的本局信息（目标、进度、牌堆、事件）和声音/全屏开关 */
.menu-status{display:flex;flex-direction:column;gap:6px;margin:0 0 12px;font-size:14px;line-height:1.5}
.menu-status p{margin:0}
.menu-status b{display:inline-block;min-width:4.6em;margin-right:6px;color:#f2c66d}
.menu-status .text-btn{margin-left:6px;padding:0 4px;font-size:13px}
.menu-toggles{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 12px}
.menu-toggles .btn{min-height:42px;font-size:14px;letter-spacing:1px}

/* 工位观察（点角色牌打开）：装备和技能做成大按钮，手机上点得准 */
.file-rows{display:flex;flex-direction:column;gap:10px;margin:12px 0}
.file-rows>div{display:flex;align-items:flex-start;gap:10px}
.file-rows>div>b{flex:none;width:2.6em;padding-top:12px;font-size:13px;color:#f2c66d}
.file-chips{display:flex;flex-wrap:wrap;gap:8px}
.file-chip{display:flex;align-items:center;gap:8px;min-height:44px;padding:4px 12px 4px 8px;border-radius:10px;border:1px solid rgba(242,198,109,.5);background:rgba(242,198,109,.1);color:inherit;font:inherit;text-align:left;cursor:pointer}
.file-chip svg{width:20px;height:20px;flex:none;color:#f2c66d}
.file-chip span{display:flex;flex-direction:column;line-height:1.2}
.file-chip small{font-size:11px;opacity:.7}
.file-chip b{font-size:14px;font-weight:800}
.file-chip.is-empty{cursor:default;opacity:.45;border-style:dashed;background:none}
.file-chip.slot-tool{border-color:#d9583b;background:rgba(217,88,59,.14)}.file-chip.slot-tool svg{color:#ff8a6a}
.file-chip.slot-confidence{border-color:#2f86d0;background:rgba(47,134,208,.14)}.file-chip.slot-confidence svg{color:#6db8ff}
.file-chip.slot-reach{border-color:#2e9a5c;background:rgba(46,154,92,.14)}.file-chip.slot-reach svg{color:#6fdc8c}

/* v0.17: visible heat state and touch-friendly contextual controls. */
.tb-shell .tb-art.is-redhot{background:radial-gradient(ellipse at 50% 35%,#ff7443,#831d17 70%);box-shadow:inset 0 0 20px #ff4329}
.tb-shell .tb-art.is-redhot img{filter:sepia(.7) saturate(2.8) hue-rotate(325deg) contrast(1.12) drop-shadow(0 0 6px #f53)!important}
.tb-art.is-redhot:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 35%,#ff351c66,transparent 68%);mix-blend-mode:multiply}
.redhot-heat{position:absolute;right:5px;top:23%;font-size:24px;color:#ffd6a7;z-index:2;text-shadow:0 0 6px #ff2900}
/* v0.18：“红温”写进心态那一行（原来的“破”字位置），不再浮在立绘上压住名字和装备图标；×2 写在提示行和角色详情里。 */
.tb-plate .hp-number .hp-redhot{display:inline-block;padding:0 3px;border-radius:3px;background:#c8261b;color:#fff;font-weight:900;box-shadow:0 0 6px rgba(255,67,41,.7)}
.optimized-stamp{position:absolute;inset:35% -4px auto;transform:rotate(-12deg);z-index:9;text-align:center;background:#311416ed;color:#ffb4a4;border:2px solid #ef705e;padding:5px 1px;font-size:17px;font-weight:900;letter-spacing:1px;pointer-events:none}
.tb-strip.is-response .tb-say{white-space:normal;line-height:1.35}
.tb-strip.is-response .tb-say b{color:#ffe1a0}
.tb-strip.is-armed .tb-say span{line-height:1.3}
.tb-pills .tb-pill{min-height:36px;padding:6px 10px}
.tb-shell .playing-card:focus-visible,.tb-shell button:focus-visible{outline:3px solid #ffd778;outline-offset:2px}
.role-playstyle{background:rgba(184,76,48,.16);color:#f1e3c4;padding:12px;border-left:3px solid #d0613f;border-radius:0 8px 8px 0;line-height:1.6}
.role-playstyle b,.role-playstyle strong{color:#f2c66d}
.ghost-plan-row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:10px 0}.ghost-plan-row b{flex:1;min-width:90px}
/* v0.18：结算高光改成深底浅字，和结算卡同一套颜色（原来浅字压在米色底上看不见）。 */
.match-highlights{margin:18px 0;padding:14px;background:rgba(255,255,255,.06);border:1px solid rgba(234,219,185,.28);border-radius:10px;color:#eadbb9}.match-highlights h4{margin:0 0 8px;color:#f2c66d;font-size:15px}.match-highlights span b{color:#f2c66d}.match-highlights span{color:#eadbb9}.match-highlights p{color:#c9d6d2}.match-highlights>div{display:flex;gap:12px;flex-wrap:wrap}.match-highlights span{display:grid;gap:4px}.match-highlights p{font-size:13px;line-height:1.5}
@media(orientation:portrait){.tb-strip .tb-say-row{align-items:center;gap:5px}.tb-strip .tb-say{white-space:normal;line-height:1.3}.tb-strip .tb-say span{font-size:12px}.tb-strip .tb-pills{flex-wrap:wrap;justify-content:flex-end}.tb-shell .playing-card .card-quip{display:none}.tb-shell .playing-card .card-summary{font-size:12px}}
@media(prefers-reduced-motion:reduce){.tb-art.is-redhot,.redhot-heat{animation:none!important}}
/* v0.18 平板：竖屏提示行里的小字（上面 v0.17 竖屏规则写死 12px）也放大。 */
@media (min-width:700px) and (min-height:700px){
  .tb-shell .tb-strip .tb-say span{font-size:16px}
  .tb-shell .playing-card .card-summary{font-size:13px}
}
/* v0.18.3 全屏入口：开局页右上角一个“全屏”；牌桌出牌区右上角一个全屏圆钮（见下）；对局菜单里也有。 */
.site-tools{display:flex;align-items:center;gap:10px}
.lobby-fullscreen{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 12px;border:1px solid #668381;border-radius:4px;background:#1b3331;color:#eadbb9;font-size:13px;font-weight:700;cursor:pointer}
.lobby-fullscreen svg{width:16px;height:16px}
.tb-fs{display:none}
/* 牌桌全屏钮：出牌区右上角；窗口两边都 ≥ 400px（平板、电脑、Claude 里的预览框）时显示，手机上用菜单里的“全屏”。 */
@media (min-width:400px) and (min-height:400px){
  .tb-fs{position:absolute;top:6px;right:6px;z-index:5;display:grid;place-items:center;width:34px;height:34px;padding:0;border-radius:50%;cursor:pointer;border:1.5px solid var(--tb-line);background:rgba(5,12,13,.8);color:var(--tb-gold)}
  .tb-fs svg{width:17px;height:17px}
}
@media (min-width:700px) and (min-height:700px){
  .tb-fs{top:10px;right:10px;width:44px;height:44px}.tb-fs svg{width:21px;height:21px}
}