/* Army: existing VANTA navy/gold panels, local SVG icons and 3D actions.
   Layout is RTL-safe; decorative motion only animates transform/opacity. */
.ar-hero {
  position: relative; overflow: hidden; padding: 18px 15px 12px; border-radius: 22px;
  background: radial-gradient(ellipse at 90% 0, rgb(var(--sk-37415a, 55, 65, 90)), transparent 70%), linear-gradient(155deg, rgb(var(--sk-18263d, 24, 38, 61)), rgb(var(--sk-0b1425, 11, 20, 37)));
  border: 1px solid rgba(var(--sk-b99348, 185, 147, 72), 0.333); border-top-color: rgba(var(--sk-ffe49a, 255, 228, 154), 0.533);
  box-shadow: 0 12px 26px rgba(var(--sk-000000, 0, 0, 0), 0.4), inset 0 1px 0 #fff1;
}
.ar-hero-top, .ar-fs-head, .ar-rec-head, .ar-tgt-head { display: flex; align-items: center; gap: 12px; position: relative; }
.ar-hero small, .ar-stats small, .ar-fs-stats small, .ar-dmg small { display: block; font-size: 11px; color: var(--text-2); }
.ar-emblem { width: 56px; height: 64px; display: grid; place-items: center; flex: none; }
.ar-emblem .ic { width: 56px; height: 56px; filter: drop-shadow(0 5px 5px rgba(var(--sk-000000, 0, 0, 0), 0.533)); }
.ar-power { display: block; font-size: 34px; line-height: 1.3; font-weight: 900; color: var(--gold-hi); font-variant-numeric: tabular-nums; }
.ar-man { text-align: center; padding-inline-start: 12px; border-inline-start: 1px solid #ffffff18; }
.ar-man b { font-size: 18px; }
.ar-hero-radar { position: absolute; width: 200px; height: 200px; left: -80px; top: -90px; border: 1px solid rgba(var(--sk-f5c152, 245, 193, 82), 0.094); border-radius: 50%; pointer-events: none; }
.ar-hero-radar::before, .ar-hero-radar::after { content: ""; position: absolute; inset: 25px; border: 1px solid rgba(var(--sk-f5c152, 245, 193, 82), 0.094); border-radius: 50%; }
.ar-hero-radar::after { inset: 50px; }
.ar-hero-radar i { position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(transparent 280deg, rgba(var(--sk-f5c152, 245, 193, 82), 0.102)); animation: arSweep 12s linear infinite; }
.ar-stats, .ar-fs-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; text-align: center; margin-top: 16px; padding: 12px 0; border-block: 1px solid #ffffff12; position: relative; }
.ar-stats b, .ar-fs-stats b { display: block; font-size: 20px; font-weight: 900; }
.ar-stats > div + div { border-inline-start: 1px solid #ffffff12; }
.ar-domains { display: flex; flex-wrap: wrap; gap: 8px 14px; padding-top: 12px; }
.ar-dom { display: flex; align-items: center; gap: 4px; font-size: 12px; }
.ar-dom .ic { width: 23px; height: 23px; }
.ar-dom small { color: var(--text-3); }
.ar-dom.zero { opacity: .65; }
.ar-quick { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 8px; margin: 16px 0 6px; }
.ar-quick .btn { padding: 0 5px; font-size: 12px; gap: 4px; }
.ar-quick .ic { width: 20px; height: 20px; }
.ar-badge { font-style: normal; border-radius: 8px; background: #85120f; padding: 0 5px; font-size: 10px; }
.ar-wars { display: grid; gap: 8px; margin-top: 12px; }
.ar-war { display: flex; align-items: center; gap: 10px; padding: 12px; border-radius: 15px; background: #ff5d5210; border: 1px solid #ff5d5238; font-size: 13px; }
.ar-war small, .ar-eq small, .ar-drow small, .ar-shud small, .ar-routebar small { display: block; font-size: 11px; color: var(--text-2); margin-top: 3px; line-height: 1.7; }
.ar-dot { width: 7px; height: 7px; border-radius: 50%; flex: none; background: var(--red); }
.ar-war.live .ar-dot { animation: arPulse 2s ease-in-out infinite; }
.ar-warn, .ar-note, .ar-missing { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; line-height: 1.8; }
.ar-warn { margin-top: 12px; color: var(--gold-hi); }
.ar-warn > .ic, .ar-note > .ic, .ar-missing > .ic { width: 20px; height: 20px; flex: none; }
.ar-note { margin-top: 10px; color: var(--text-2); }
.ar-missing { margin-top: 10px; padding: 10px; border-radius: 12px; color: #ffd0b6; background: #ff945015; border: 1px solid #ff945026; }
.ar-list { display: grid; gap: 12px; }
.ar-list > .card + .card { margin-top: 0; }
.ar-lvl { display: grid; place-content: center; text-align: center; flex: none; width: 44px; height: 50px; border-radius: 13px; color: var(--gold-hi); border: 1px solid rgba(var(--sk-f5c152, 245, 193, 82), 0.333); background: linear-gradient(145deg, rgb(var(--sk-4c422a, 76, 66, 42)), rgb(var(--sk-172138, 23, 33, 56))); box-shadow: inset 0 2px 0 #fff2, 0 3px 0 rgb(var(--sk-060a13, 6, 10, 19)); }
.ar-lvl b { font-size: 22px; line-height: 1.1; }
.ar-lvl small { font-size: 9px; }
.ar-lvl.big { width: 55px; height: 62px; }
.ar-lvl.big b { font-size: 28px; }
.ar-roster { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin-top: 14px; }
.ar-unit { position: relative; display: grid; justify-items: center; gap: 2px; padding: 8px 3px; border-radius: 12px; background: rgba(var(--sk-050b16, 5, 11, 22), 0.31); border: 1px solid #ffffff0b; text-align: center; }
.ar-unit > .ic { width: 30px; height: 30px; }
.ar-unit b { font-size: 15px; }
.ar-unit small { color: var(--text-2); font-size: 10px; line-height: 1.5; }
.ar-unit.more { justify-content: center; align-content: center; }
.ar-rd { font-size: 10px; color: var(--green); font-style: normal; }
.ar-empty-roster { font-size: 12px; color: var(--text-3); padding: 18px 0 8px; line-height: 1.8; }
.ar-meters { margin-top: 12px; display: grid; gap: 6px; }
.ar-meter { display: grid; grid-template-columns: 46px 1fr 36px; gap: 8px; align-items: center; font-size: 10px; color: var(--text-2); }
.ar-meter .bar { height: 6px; }
.ar-meter b { text-align: end; font-variant-numeric: tabular-nums; }
.ar-fm-foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 12px; padding-top: 10px; border-top: 1px solid #ffffff10; }
.ar-pow { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: var(--text-2); }
.ar-pow b { color: var(--gold-hi); }
.ar-busy { margin-top: 12px; }
.ar-fm.st-battle, .ar-op.live { border-inline-start: 3px solid var(--red); }
.ar-hangar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ar-asset { display: flex; flex-direction: column; align-items: center; padding: 14px 10px; border-radius: 18px; text-align: center; background: linear-gradient(165deg, rgb(var(--sk-1c2a43, 28, 42, 67)), rgb(var(--sk-0e1729, 14, 23, 41))); border: 1px solid #ffffff12; border-top-color: #ffffff26; box-shadow: 0 7px 18px rgba(var(--sk-000000, 0, 0, 0), 0.333); }
.ar-asset .ttl { font-size: 13px; margin-top: 6px; }
.ar-asset .sub { font-size: 11px; margin-top: 3px; }
.ar-asset-pills { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; margin: 10px 0; }
.ar-asset-pills .pill { font-size: 10px; padding: 0 7px; height: 24px; max-width: 100%; }
.ar-asset-pills bdi { overflow: hidden; text-overflow: ellipsis; }
.ar-asset-btns { display: grid; gap: 10px; width: 100%; margin-top: auto; }
.ar-ring { position: relative; width: 76px; height: 76px; display: grid; place-items: center; flex: none; }
.ar-ring > svg:not(.ic) { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); fill: none; stroke-width: 3; }
.ar-ring .tr { stroke: #ffffff12; }
.ar-ring .fl { stroke: var(--gold); stroke-linecap: round; transition: stroke-dashoffset 1s linear; }
.ar-ring.ready .fl { stroke: var(--green); }
.ar-ring.cooling .fl { stroke: var(--blue); }
.ar-ring > .ic { width: 43px; height: 43px; }
.ar-ring-t { position: absolute; bottom: -1px; background: rgb(var(--sk-111b2e, 17, 27, 46)); padding: 0 5px; border-radius: 6px; color: rgb(var(--sk-cfe6ff, 207, 230, 255)); font-size: 10px; font-variant-numeric: tabular-nums; }
.ar-link { display: flex; align-items: center; gap: 10px; width: 100%; color: inherit; text-align: start; }
.ar-rules { margin: 20px 4px 0; font-size: 11px; color: var(--text-3); line-height: 1.9; }
.ar-sheet .sheet-body { padding-top: 8px; }
.ar-sheet .sub { line-height: 1.8; }
.ar-sheet .ar-rec-head, .ar-sheet .ar-fs-head, .ar-sheet .ar-tgt-head { padding-inline-end: 32px; margin-bottom: 16px; }
.ar-sheet h3 { overflow-wrap: anywhere; }
.ar-sheet .kv .v { flex-wrap: wrap; justify-content: flex-end; }
.ar-sheet .kv .k { flex-shrink: 0; }
.ar-label { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 20px 0 10px; font-size: 12px; font-weight: 800; color: var(--text-2); }
.ar-label .muted { font-size: 10px; font-weight: 400; }
.ar-grid-btns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 10px; margin-top: 18px; }
.ar-grid-btns .btn { font-size: 12px; padding: 0 6px; }
.ar-eq { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 12px 0; border-bottom: 1px solid #ffffff12; font-size: 13px; }
.ar-eq > .ic { width: 28px; height: 28px; flex: none; }
.ar-presets { display: flex; flex-wrap: wrap; gap: 8px; }
.ar-hist > div { display: flex; align-items: baseline; gap: 8px; font-size: 12px; padding: 8px 0; }
.ar-hist i { flex: none; width: 5px; height: 5px; border-radius: 50%; background: var(--gold); }
.ar-hist small { margin-inline-start: auto; color: var(--text-3); white-space: nowrap; }
.ar-input { width: 100%; min-height: 48px; border: 1px solid #ffffff25; border-radius: 13px; background: rgb(var(--sk-080e1b, 8, 14, 27)); padding: 12px 14px; color: var(--text); font: inherit; text-align: start; outline: none; }
.ar-input:focus-visible { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(var(--sk-f5c152, 245, 193, 82), 0.133); }
.ar-input::placeholder { color: var(--text-3); }
.ar-dchips { margin-bottom: 14px; }
.ar-cost { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; }
.ar-rfoot { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 12px; }
.ar-rcard.locked { border-inline-start: 2px solid rgba(var(--sk-f5c152, 245, 193, 82), 0.333); }
.ar-rcard.locked .ic-wrap { filter: saturate(.5); }
.ar-x { font-size: 12px; color: var(--text-2); }
.ar-drow { display: flex; align-items: center; gap: 10px; width: 100%; margin-top: 10px; padding: 12px; text-align: start; color: var(--text); font: inherit; font-size: 13px; background: linear-gradient(180deg, rgb(var(--sk-243352, 36, 51, 82)), rgb(var(--sk-121b2e, 18, 27, 46))); border: 1px solid #ffffff1a; border-radius: 14px; box-shadow: inset 0 1px 0 #fff1, 0 3px 0 rgb(var(--sk-060a13, 6, 10, 19)); }
.ar-drow.enemy { border-inline-start: 3px solid var(--red); }
.ar-drow.own { border-inline-start: 3px solid var(--green); }
.ar-drow.dim small { color: var(--text-3); }
.ar-mini { display: grid; place-items: center; width: 40px; height: 44px; flex: none; }
.ar-mini .ic { width: 34px; height: 34px; }
.ar-kind { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--green); }
.ar-kind.hostile { color: #ffb2a8; }
.ar-kind .ic { width: 26px; height: 26px; }
.ar-modes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 10px; }
.ar-mode { display: grid; justify-items: center; gap: 6px; padding: 12px 6px; border-radius: 13px; border: 1px solid #ffffff1a; background: rgb(var(--sk-111b2e, 17, 27, 46)); color: var(--text-2); font: inherit; font-size: 12px; box-shadow: inset 0 1px 0 #fff1, 0 3px 0 rgb(var(--sk-060a13, 6, 10, 19)); }
.ar-mode.on { border-color: var(--gold); color: var(--gold-hi); background: rgba(var(--sk-f5c152, 245, 193, 82), 0.086); }
.ar-mode .ic { width: 32px; height: 32px; }
.ar-mode .bar { width: 100%; height: 5px; }
.ar-mode small { font-size: 10px; }
.ar-band { color: var(--gold-hi); }
.ar-tgt-ic, .ar-routebar-ic, .ar-shud-ic { display: grid; place-items: center; width: 44px; height: 44px; flex: none; border-radius: 13px; background: #ff5d5218; }
.ar-tgt-ic .ic, .ar-routebar-ic .ic, .ar-shud-ic .ic { width: 32px; height: 32px; }
.ar-shud, .ar-routebar { position: absolute; z-index: 15; left: calc(12px + var(--safe-left)); right: calc(12px + var(--safe-right)); opacity: 0; transform: translateY(-12px); transition: opacity .25s ease, transform .35s var(--ease-out); }
.ar-shud { top: calc(var(--hud-h) + 12px); border: 1px solid #ff8f7e55; border-radius: 18px; padding: 12px; background: linear-gradient(160deg, rgba(var(--sk-232b40, 35, 43, 64), 0.961), rgba(var(--sk-0b1425, 11, 20, 37), 0.961)); box-shadow: 0 8px 24px rgba(var(--sk-000000, 0, 0, 0), 0.533); }
.ar-shud.on, .ar-routebar.on { opacity: 1; transform: none; }
.ar-shud-card { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.ar-shud-hint { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--text-2); margin-top: 10px; }
.ar-shud-targets { margin-top: 10px; margin-bottom: 0; }
.ar-shud-targets .chip { font-size: 11px; }
.ar-shud-targets small { margin: 0; }
.strike-on .season-chip, .route-on .season-chip { opacity: 0; pointer-events: none; }
.ar-routebar { bottom: calc(var(--tab-h) + 12px); display: flex; align-items: center; gap: 8px; padding: 12px; border: 1px solid rgba(var(--sk-f5c152, 245, 193, 82), 0.333); border-radius: 17px; background: rgba(var(--sk-111b2e, 17, 27, 46), 0.961); box-shadow: 0 8px 24px rgba(var(--sk-000000, 0, 0, 0), 0.6); font-size: 12px; transform: translateY(12px); }
.route-on .map-fab { bottom: calc(var(--tab-h) + 115px); }
.ar-result { text-align: center; padding: 6px 0; }
.ar-boom { display: grid; place-items: center; width: 90px; height: 90px; margin: 0 auto 14px; border-radius: 50%; background: radial-gradient(circle, #ff8f7e40, #ff5d5208 70%); }
.ar-boom .ic { width: 72px; height: 72px; animation: arImpact .5s var(--ease-spring) both; }
.ar-dmg-row { display: flex; justify-content: center; gap: 14px; margin: 20px 0 14px; }
.ar-dmg { flex: 1; padding: 12px 8px; border-radius: 15px; background: #ff5d5212; border: 1px solid #ff5d5226; }
.ar-dmg b { display: block; font-size: 28px; font-weight: 900; color: #ffb6a9; }
.ar-result .ar-note { justify-content: center; }
/* «حذف نیرو»: a quiet, collapsed danger zone at the bottom of a formation sheet,
   a low-key scrap button on hangar cards and the quantity chips of the confirm sheet. */
.ar-danger-zone { margin-top: 22px; padding: 2px 12px 12px; border-radius: 14px; border: 1px dashed #ff8f7e33; background: #2a0f1218; }
.ar-danger-zone summary { display: flex; align-items: center; gap: 6px; padding-block: 12px; cursor: pointer; list-style: none; color: var(--text-2); font-size: 12px; font-weight: 800; }
.ar-danger-zone summary::-webkit-details-marker { display: none; }
.ar-danger-zone summary > .ic:last-child { margin-inline-start: auto; transition: transform .2s; }
.ar-danger-zone[open] summary > .ic:last-child { transform: rotate(180deg); }
.ar-danger-zone .ar-note { margin-top: 0; }
.ar-danger-zone .ar-eq small { display: block; color: var(--text-3); font-size: 11px; }
.ar-disband-all { margin-top: 14px; }
.ar-asset-btns .ar-scrap { min-height: 34px; font-size: 11px; opacity: .82; }
.ar-asset-btns .ar-scrap .ic { width: 18px; height: 18px; }
.ar-disband .stepper, .ar-disband .ar-qchips { justify-content: center; }
.ar-disband .ar-qchips { margin: 10px 0 0; }
.ar-sheet button:focus-visible, [data-screen="army"] button:focus-visible, .ar-shud button:focus-visible, .ar-routebar button:focus-visible { outline: 2px solid var(--gold-hi); outline-offset: 4px; }
@keyframes arSweep { to { transform: rotate(360deg); } }
@keyframes arPulse { 50% { opacity: .35; transform: scale(.8); } }
@keyframes arImpact { from { opacity: 0; transform: scale(.5) rotate(-15deg); } }
@media (min-width: 640px) {
  .ar-hangar { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ar-shud, .ar-routebar { max-width: 540px; margin-inline: auto; }
}
@media (max-width: 360px) {
  .ar-quick { gap: 6px; }
  .ar-quick .btn { font-size: 11px; }
  .ar-quick .ic { width: 17px; height: 17px; }
  .ar-power { font-size: 28px; }
  .ar-emblem, .ar-emblem .ic { width: 45px; }
  .ar-man { padding-inline-start: 8px; }
  .ar-fm > .row { gap: 6px; }
  .ar-fm > .row .pill { font-size: 10px; padding: 0 6px; }
}
@media (prefers-reduced-motion: reduce) {
  .ar-hero-radar i, .ar-war.live .ar-dot, .ar-boom .ic { animation: none; }
  .ar-ring .fl, .ar-shud, .ar-routebar, .ar-danger-zone summary > .ic { transition: none; }
}