/* ============================================================
   jumvi-icons.css  —  Jumvi mission icon styles
   Wrap each icon in an element with class "jmv":
       <div class="jmv">{{ MISSION_ICONS[id] }}</div>
   The panel missions (13,19,20,22,23,27,28) use Tabler outline
   icons. Load the webfont once in your app, e.g.:
   <link rel="stylesheet"
     href="https://cdn.jsdelivr.net/npm/@tabler/icons-webfont@3/dist/tabler-icons.min.css">
   Colors auto-adapt to light/dark via prefers-color-scheme.
   ============================================================ */
.jmv{
  --color-text-primary:#1f2430;
  --color-text-secondary:#5b6573;
  --color-text-tertiary:#9aa1ac;
  --color-border-secondary:#cdd2d8;
  --color-border-tertiary:#e6e8ec;
  --color-background-primary:#ffffff;
  --color-background-secondary:#f4f6f8;
  --s:#5b6573; --b:#cdd2d8; --bg2:#f4f6f8; --p:#1f2430; --t:#9aa1ac;
  --border-radius-md:8px; --border-radius-lg:12px; --border-radius-xl:16px;
  --font-sans:inherit;
  color:var(--color-text-secondary);
  font-family:var(--font-sans);
  -webkit-font-smoothing:antialiased;
}
.jmv svg{display:block;max-width:100%;height:auto;}
.jmv text.ts,.jmv .ts{font-size:12px;fill:var(--s);}
.jmv text.th,.jmv .th{font-size:14px;fill:var(--p);font-weight:500;}
.jmv i.ti{font-style:normal;line-height:1;display:inline-flex;}
.jmv .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}
@media (prefers-color-scheme: dark){
  .jmv{
    --color-text-primary:#f0f2f5;
    --color-text-secondary:#aab2bd;
    --color-text-tertiary:#7c828c;
    --color-border-secondary:#3a4049;
    --color-border-tertiary:#2c3138;
    --color-background-primary:#1a1d22;
    --color-background-secondary:#23272e;
    --s:#aab2bd; --b:#3a4049; --bg2:#23272e; --p:#f0f2f5; --t:#7c828c;
  }
}
/* Project also supports manual theme toggle via html.theme--dark — keep icons in sync */
html.theme--dark .jmv{
  --color-text-primary:#f0f2f5;
  --color-text-secondary:#aab2bd;
  --color-text-tertiary:#7c828c;
  --color-border-secondary:#3a4049;
  --color-border-tertiary:#2c3138;
  --color-background-primary:#1a1d22;
  --color-background-secondary:#23272e;
  --s:#aab2bd; --b:#3a4049; --bg2:#23272e; --p:#f0f2f5; --t:#7c828c;
}
/* And when the user explicitly chooses LIGHT, force light vars even if OS prefers dark */
html.theme--light .jmv{
  --color-text-primary:#1f2430;
  --color-text-secondary:#5b6573;
  --color-text-tertiary:#9aa1ac;
  --color-border-secondary:#cdd2d8;
  --color-border-tertiary:#e6e8ec;
  --color-background-primary:#ffffff;
  --color-background-secondary:#f4f6f8;
  --s:#5b6573; --b:#cdd2d8; --bg2:#f4f6f8; --p:#1f2430; --t:#9aa1ac;
}