/* ── หัวแผงแบบ B: สถานะ + ชิปคำสั่งบรรทัดเดียว ── */
.sa-head{margin-top:8px!important;padding:6px 8px;border-radius:10px;background:var(--surface-page-2);font-size:11px!important;flex-wrap:nowrap!important}
.sa-head #mode-status{font-weight:700;white-space:nowrap}
.sa-head>span:nth-child(2){color:var(--text-mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.sa-head>span:last-child{gap:3px!important;flex:none}
.sa-head>span:last-child>span{border:none!important;background:var(--surface-panel-2);border-radius:6px!important;padding:3px 7px!important;font-size:10px!important;line-height:1.3}
.sa-head #combat-speed-toggle{color:#fde68a!important;background:rgba(233,187,97,.16)!important}
.sa-head .gi-inline{width:11px;height:11px}
/* ── แถบท่าแบบ A ── */
.sa-wrap{border-top:none!important;padding-top:4px!important}
.sa-wrap>div:first-child{display:none}
.sa-hud{gap:7px!important;align-items:center}
.sa-hud.row{flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none;padding:2px 2px 4px;-webkit-overflow-scrolling:touch}
.sa-hud.row::-webkit-scrollbar{display:none}
.sa-hud.two{flex-wrap:wrap!important}
.sa-hud.two .sa-t{width:calc((100% - 35px)/6)}
.sa-t{position:relative;flex:none;width:44px;aspect-ratio:1;border-radius:12px;display:grid;place-items:center;cursor:pointer;
  background:conic-gradient(color-mix(in srgb,var(--c) 60%,transparent) var(--p),var(--surface-panel-2) 0)}
.sa-t::before{content:'';position:absolute;inset:3px;border-radius:9px;background:var(--surface-page-2)}
.sa-t i{position:relative;font-style:normal;display:grid;place-items:center;opacity:.5;font-size:18px}
.sa-t i .gi-svg{width:20px;height:20px}
.sa-t b{position:absolute;right:3px;bottom:1px;font-size:10px;font-weight:700;color:var(--text-dim);font-variant-numeric:tabular-nums}
.sa-t.rdy{box-shadow:0 0 0 1.5px var(--c),0 0 12px color-mix(in srgb,var(--c) 55%,transparent)}
.sa-t.rdy i{opacity:1;color:var(--c)}
.sa-t.dom{width:52px;aspect-ratio:auto;height:44px;background:linear-gradient(180deg,#14532d,#0f2a1c);box-shadow:inset 0 0 0 1px #22c55e}
.sa-t.dom::before{display:none}.sa-t.dom i{color:#86efac;opacity:1}.sa-t.dom small{position:absolute;bottom:1px;font-size:8.5px;color:#86efac}
.sa-t.gap,.sa-mini.gap{margin-left:6px}
.sa-mini{flex:none;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font-size:10px;color:var(--text-mute);border:1px dashed var(--border-soft);opacity:.6}
.sa-mini .gi-svg{width:10px;height:10px}
.sa-set b{display:block;font-size:13px;color:var(--text-primary)}.sa-set small{display:block;font-size:10.5px;color:var(--text-mute);margin:2px 0 8px}
.sa-seg{display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:3px;border-radius:10px;background:var(--surface-page-2)}
.sa-seg button{border:none;border-radius:8px;padding:7px 4px;font:600 12px inherit;font-family:inherit;background:none;color:var(--text-mute)}
.sa-seg button.on{background:var(--surface-panel-2);color:#fde68a;box-shadow:0 1px 2px rgba(0,0,0,.4)}
/* ── แถบกรอง log แบบ 3: ช่องจมในพื้นเดียวกับ log ── */
.cat5{display:grid!important;grid-template-columns:repeat(6,1fr);gap:0!important;padding:3px!important;margin-bottom:7px;border-radius:10px;background:var(--surface-sunken);box-shadow:inset 0 1px 3px rgba(0,0,0,.55);overflow:visible!important}
.cat5 button{border:none!important;background:none!important;border-radius:8px!important;padding:5px 0!important;font-size:10.5px!important;color:var(--text-mute)!important;white-space:nowrap}
.cat5 button.on{background:var(--surface-panel-2)!important;color:#fde68a!important;box-shadow:0 1px 2px rgba(0,0,0,.5)}
/* ── log ดวล 1v1 แบบใหม่ ── */
#cpop-log .dl{margin:0 0 5px;display:grid;grid-template-columns:22px 1fr auto;gap:8px;align-items:center;padding:6px 9px;border-radius:9px;background:var(--surface-page-2);font-size:12px;color:var(--text-primary);border-left:3px solid transparent;animation:dlIn .25s ease-out}
@keyframes dlIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
#cpop-log .dl-d{width:20px;height:20px;border-radius:50%;display:grid;place-items:center;font:700 11px "Noto Serif TC",serif;color:#111}
#cpop-log .dm{background:#fbbf24}#cpop-log .df{background:#fb7185}#cpop-log .ds{background:#c084fc}#cpop-log .dd{background:#93c5fd}#cpop-log .dp{background:#a3e635}
#cpop-log .dl-v{font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
#cpop-log .dl-v.g,#cpop-log .g{color:#fbbf24}#cpop-log .dl-v.r,#cpop-log .r{color:#f87171}#cpop-log .dl-v.b{color:#60a5fa}#cpop-log .dl-v.p{color:#c084fc}
#cpop-log .dl-na{color:#fbbf24}#cpop-log .dl-nf{color:#f87171}
#cpop-log .dl-crit{font-style:normal;font-weight:800;color:#fde68a}
#cpop-log .dl-sub{display:block;font-size:10.5px;color:var(--text-mute)}#cpop-log .dl-sub.g{color:#4ade80}
#cpop-log .dl.crit{border-left-color:#fbbf24}#cpop-log .dl.st{border-left-color:#c084fc}#cpop-log .dl.dg{border-left-color:#60a5fa}
#cpop-log .dl.sk{border-left-color:#a78bfa;background:linear-gradient(90deg,rgba(167,139,250,.1),transparent 70%),var(--surface-page-2)}
#cpop-log .dl.sk.f{border-left-color:#fb7185;background:linear-gradient(90deg,rgba(251,113,133,.1),transparent 70%),var(--surface-page-2)}
#cpop-log .dl.sk .cpop-card{background:none;border:none;padding:0;margin:0}
#cpop-log .dl.tick{padding-top:3px;padding-bottom:3px;font-size:11.5px;border-left:3px dashed #3a3a2a}
#cpop-log .dl-tk{font-size:9.5px;font-weight:700;padding:0 6px;border-radius:6px;background:rgba(248,113,113,.2);color:#fca5a5}#cpop-log .dl-tk.our{background:rgba(163,230,53,.18);color:#d9f99d}
#cpop-log .dl.sum{grid-template-columns:1fr;gap:2px;background:rgba(233,187,97,.08);border:1px solid rgba(233,187,97,.35);font-size:11.5px}
