/* ============================================================================
   ARÈNE DE COMBAT
   ========================================================================== */
.ar-dialog { width: min(980px, calc(100vw - 32px)); }
.ar-card { display: flex; flex-direction: column; gap: 12px; max-height: calc(100vh - 60px); overflow: auto; }
.ar-head { display: flex; align-items: center; gap: 14px; padding-right: 34px; }
.ar-head > div { flex: 1; min-width: 0; }
.ar-head h2, .ar-head .eyebrow { margin: 0; }
.ar-head .eyebrow { color: #ff8f7a; }
.ar-head small { color: var(--muted); }
.ar-crest svg { width: 64px; height: 64px; }
.ar-wallet { display: grid; justify-items: end; gap: 0; padding: 8px 14px; border-radius: 14px; border: 1px solid rgba(255, 143, 122, .35); background: rgba(194, 52, 63, .12); }
.ar-wallet b { font-size: 1.3rem; color: #ffd0c4; }
.ar-wallet small { color: var(--muted); font-size: .72rem; }
.ar-mark { color: #ff8f7a; font-weight: 900; }
.ar-tabs { flex-wrap: wrap; }
.ar-body { display: flex; flex-direction: column; gap: 12px; }
.ar-muted { color: var(--muted); margin: 0; font-size: .88rem; }
.res { color: #ffb36b !important; }
.ar-me { display: grid; grid-template-columns: auto minmax(160px, 1fr) repeat(4, auto); gap: 14px; align-items: center; padding: 12px 14px; border-radius: 14px; border: 1px solid var(--border); background: rgba(255, 255, 255, .03); }
.ar-me > div:nth-child(2) { display: grid; }
.ar-me small { color: var(--muted); }
.ar-kv { display: grid; text-align: right; }
.ar-kv span { color: var(--muted); font-size: .74rem; }
.ar-kv b { font-size: 1.05rem; }
.ar-kv small { font-size: .7rem; color: var(--muted); }
.ar-tools { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.ar-tools .primary-button { margin-left: auto; }
.ar-rate { display: grid; padding: 4px 12px; border-left: 1px solid var(--border); }
.ar-rate span, .ar-rate small { color: var(--muted); font-size: .74rem; }
.ar-rate b { font-size: 1.1rem; color: #ffd0c4; }
.ar-check { display: inline-flex; gap: 6px; align-items: center; color: var(--muted); font-size: .86rem; }
.ar-box { display: flex; flex-direction: column; gap: 6px; padding: 12px; border-radius: 14px; border: 1px solid var(--border); background: rgba(255, 255, 255, .02); }
.ar-box h3 { margin: 0 0 4px; font-size: .95rem; display: flex; gap: 10px; align-items: center; justify-content: space-between; }
.ar-row { display: grid; grid-template-columns: auto 1fr auto; gap: 10px; align-items: center; padding: 6px 8px; border-radius: 10px; background: rgba(255, 255, 255, .03); }
.ar-row > div { display: grid; min-width: 0; }
.ar-row small { color: var(--muted); }
.ar-row em, .ar-f em, .ar-ai, .ar-you { font-style: normal; font-size: .7rem; padding: 1px 6px; border-radius: 999px; background: rgba(95, 224, 255, .15); color: #5fe0ff; margin-left: 4px; }
.ar-ai { background: rgba(255, 255, 255, .08); color: #b8c6e0; }
.ar-act { display: inline-flex; gap: 6px; }
.ar-tag { font-size: .78rem; color: var(--muted); }
.ar-tag.ok { color: #54e39e; }
.ar-noicon { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: rgba(255, 255, 255, .06); color: #ff8f7a; font-weight: 900; }
.ar-fight { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 16px; border: 1px solid rgba(255, 143, 122, .35); background: radial-gradient(120% 120% at 50% 0%, rgba(194, 52, 63, .16), rgba(8, 14, 26, .6)); }
.ar-fhead { display: flex; gap: 12px; align-items: center; }
.ar-fhead span { color: var(--muted); margin-right: auto; }
.ar-sides { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: center; }
.ar-side { display: flex; flex-direction: column; gap: 6px; }
.ar-vs { font-size: 1.4rem; color: #ff8f7a; letter-spacing: .1em; }
.ar-f { display: grid; grid-template-columns: auto 1fr; gap: 8px; align-items: center; padding: 8px 10px; border-radius: 12px; background: rgba(255, 255, 255, .04); transition: opacity .3s; }
.ar-f > div { display: grid; gap: 2px; min-width: 0; }
.ar-f small { color: var(--muted); font-size: .74rem; }
.ar-f.ko { opacity: .4; }
.ar-hp { display: block; height: 7px; border-radius: 999px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.ar-hp s { display: block; height: 100%; background: linear-gradient(90deg, #54e39e, #a6f06f); text-decoration: none; transition: width .15s linear; }
.ar-side:last-child .ar-hp s { background: linear-gradient(90deg, #ff5f6d, #ff9a5f); }
.ar-hpv { font-variant-numeric: tabular-nums; }
.ar-log { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; font-size: .82rem; color: #c9d6ee; min-height: 7.5em; }
.ar-log li:first-child { color: #fff; font-weight: 700; }
.ar-log .crit { color: #ffcf5a; }
.ar-log .heal { color: #6ff0b0; }
.ar-log .ko { color: #ff8f7a; }
.ar-result { margin: 0; padding: 10px 12px; border-radius: 12px; font-weight: 800; text-align: center; }
.ar-result.win { background: rgba(84, 227, 158, .14); color: #6ff0b0; }
.ar-result.lose { background: rgba(255, 95, 109, .14); color: #ff9aa6; }
.ar-rseg { align-self: flex-start; }
.ar-table { width: 100%; border-collapse: collapse; font-size: .88rem; }
.ar-table th { text-align: left; color: var(--muted); font-size: .74rem; font-weight: 700; padding: 6px 8px; border-bottom: 1px solid var(--border); }
.ar-table td { padding: 6px 8px; border-bottom: 1px solid rgba(255, 255, 255, .05); }
.ar-table tr.me td { background: rgba(95, 224, 255, .08); }
.ar-shop { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 8px; }
.ar-item { display: grid; grid-template-columns: auto 1fr; gap: 6px 10px; align-items: center; padding: 10px; border-radius: 12px; border: 1px solid var(--border); background: rgba(255, 255, 255, .03); }
.ar-item > div:nth-child(2) { display: grid; }
.ar-item small { color: var(--muted); }
.ar-buy { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ar-buy button { display: grid; gap: 1px; min-height: 46px; padding: 4px 8px; font-size: .78rem; }
.ar-buy button b { font-size: .9rem; }
.ar-hist { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ar-hist li { display: grid; grid-template-columns: 90px 1fr; gap: 2px 10px; padding: 8px 12px; border-radius: 10px; background: rgba(255, 255, 255, .03); border-left: 3px solid #54e39e; }
.ar-hist li.lose { border-left-color: #ff5f6d; }
.ar-hist small { grid-column: 2; color: var(--muted); }
@media (max-width: 720px) {
  .ar-me { grid-template-columns: auto 1fr; }
  .ar-kv { text-align: left; }
  .ar-sides { grid-template-columns: 1fr; }
  .ar-vs { text-align: center; }
  .ar-tools .primary-button { margin-left: 0; }
}
.ar-buy button span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
@media (max-width: 420px) { .ar-buy { grid-template-columns: 1fr; } }