/* ============================================================================
   Limited Meta (/limited) — all lm-* prefixed.

   Served as a SERVER-RENDERED <link> (LimitedMetaStyles.razor), never via
   asset-loader: the page is static SSR and paints before any JS runs.

   Animation contract: nothing is ever hidden unless JS has proven itself by
   stamping .lm-anim on .lm-page (the inline choreography script; skipped under
   prefers-reduced-motion). Every pre-hidden state keys off .lm-anim, and a CSS
   failsafe forces visibility anyway — the mfx-pre pattern.
   ========================================================================== */

.lm-page { --lm-teal: #5BC0BE; --lm-up: #22C55E; --lm-down: #EF4444; --lm-gold: #D4AF37; }

/* ---- Scroll reveals (stats-fx.js drives [data-reveal] → .rv-in) ------------ */
.lm-page [data-reveal] { transition: opacity .5s ease, transform .5s ease; }
.lm-anim [data-reveal]:not(.rv-in) { opacity: 0; transform: translateY(14px); }
/* Belt and braces: even a stuck .lm-anim page forces itself visible. */
.lm-anim [data-reveal] { animation: lm-failsafe .01s 1.6s forwards; }
@keyframes lm-failsafe { to { opacity: 1; transform: none; } }

/* ============================== HERO ======================================= */
/* NO overflow:hidden on the hero itself — the set-picker menu is absolutely positioned inside it
   and must extend past the hero's bottom edge (it rendered clipped to one row otherwise). The
   Ken Burns art gets its own clipping layer instead. */
.lm-hero {
  position: relative;
  border-radius: 1rem; border: 1px solid #252A33;
  background: #0B0D10;
  padding: 2rem 1.5rem 1.5rem;
  min-height: 300px;
  display: flex; flex-direction: column; justify-content: flex-end;
}
.lm-hero-clip {
  position: absolute; inset: 0; z-index: 0;
  border-radius: inherit; overflow: hidden;
}
.lm-hero-art {
  position: absolute; inset: -4%;
  background: var(--art) center 28% / cover no-repeat;
  filter: saturate(1.08);
}
.lm-hero-veil {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse at 80% 10%, rgba(91,192,190,.14), transparent 55%),
    linear-gradient(100deg, rgba(11,13,16,.97) 22%, rgba(11,13,16,.78) 52%, rgba(11,13,16,.38));
}
.lm-hero > .lm-hero-body { position: relative; z-index: 2; }
@media (prefers-reduced-motion: no-preference) {
  .lm-anim .lm-hero-art { animation: lm-kenburns 16s cubic-bezier(.2,.6,.3,1) both; }
}
@keyframes lm-kenburns {
  from { transform: scale(1.09) translateY(-1.5%); }
  to   { transform: scale(1); }
}

.lm-hero-set { display: flex; align-items: center; flex-wrap: wrap; gap: .7rem; }
.lm-hero-icon {
  width: 34px; height: 34px; flex-shrink: 0;
  filter: invert(1) brightness(1.7) drop-shadow(0 0 6px rgba(91,192,190,.5));
}
.lm-hero h1 { font-size: 1.7rem; font-weight: 800; color: #EAEAEA; letter-spacing: -.01em; line-height: 1.15; }
.lm-hero-sub { display: block; font-size: .85rem; font-weight: 500; color: #9CA3AF; letter-spacing: .01em; }

/* Data-quality badge (same vocabulary as the draft lobby tiles). */
.lm-badge {
  display: inline-flex; align-items: center;
  padding: .18rem .5rem; border-radius: .4rem;
  font-size: .62rem; font-weight: 800; letter-spacing: .08em;
  border: 1px solid transparent; white-space: nowrap;
}
.lm-badge-crowd        { color: #7DE8A8; background: rgba(34,197,94,.12); border-color: rgba(34,197,94,.35); }
.lm-badge-airated      { color: #9BD1F0; background: rgba(96,165,250,.12); border-color: rgba(96,165,250,.35); }
.lm-badge-spoilerrated { color: #E2C86A; background: rgba(212,175,55,.12); border-color: rgba(212,175,55,.35); }
.lm-badge-heuristic    { color: #9CA3AF; background: rgba(107,114,128,.12); border-color: rgba(107,114,128,.35); }

/* Mode pills — plain links, full navigations. */
.lm-modes {
  display: inline-flex; padding: 3px; border-radius: .65rem;
  background: rgba(11,13,16,.72); border: 1px solid #252A33;
}
.lm-mode {
  padding: .38rem 1.05rem; border-radius: .5rem;
  font-size: .85rem; font-weight: 600; color: #9CA3AF;
  text-decoration: none; transition: color .2s, background .2s;
  white-space: nowrap;
}
.lm-mode:hover { color: #EAEAEA; }
.lm-mode.on { color: #0B0D10; background: var(--lm-teal); box-shadow: 0 0 14px -2px rgba(91,192,190,.55); }

.lm-hero-controls { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; margin-top: 1.1rem; }

/* "Play Draft/Sealed now" — the one loud thing in the hero. */
.lm-cta {
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .45rem 1.1rem; border-radius: .65rem;
  background: linear-gradient(140deg, #5BC0BE, #4DB6AC);
  color: #0B0D10; font-size: .85rem; font-weight: 700; text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 0 18px -4px rgba(91,192,190,.65);
  transition: transform .2s, box-shadow .2s;
}
.lm-cta:hover { transform: translateY(-1px); box-shadow: 0 0 26px -3px rgba(91,192,190,.85); }

/* Hero count-up strip. */
.lm-hero-stats { display: flex; flex-wrap: wrap; gap: 1.6rem 2.4rem; margin-top: 1.3rem; }
.lm-stat b {
  display: block; font-size: 1.45rem; font-weight: 800; color: #EAEAEA;
  font-variant-numeric: tabular-nums; line-height: 1.1;
}
.lm-stat span { font-size: .7rem; color: #9CA3AF; text-transform: uppercase; letter-spacing: .07em; }
.lm-stat-txt b { color: var(--lm-teal); font-size: 1.15rem; padding-top: .3rem; }

/* ============================ SET PICKER =================================== */
/* sp-nav mechanism: CSS-only hover/focus-within menu — static SSR, no circuit.
   Shown with visibility+opacity, never [hidden] (documented display-override trap). */
.lm-set-nav { position: relative; }
.lm-set-trigger {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .42rem .8rem; border-radius: .65rem;
  background: rgba(18,21,26,.85); border: 1px solid #252A33;
  color: #EAEAEA; font-size: .85rem; font-weight: 600; text-decoration: none;
  white-space: nowrap; transition: border-color .2s, box-shadow .2s;
}
.lm-set-trigger:hover { border-color: rgba(91,192,190,.6); box-shadow: 0 0 14px -4px rgba(91,192,190,.45); }
.lm-set-ico { width: 16px; height: 16px; filter: invert(1) brightness(1.6); }
.lm-set-menu {
  position: absolute; top: calc(100% + .45rem); left: 0; z-index: 60;
  min-width: 21rem; max-height: 60vh; overflow-y: auto;
  padding: .45rem; border-radius: .85rem;
  background: linear-gradient(180deg, #141922 0%, #0E1116 100%);
  border: 1px solid rgba(91,192,190,.28);
  box-shadow: 0 18px 40px -12px rgba(0,0,0,.75);
  visibility: hidden; opacity: 0; transform: translateY(-4px);
  transition: opacity .18s ease, transform .18s ease, visibility .18s;
}
.lm-set-nav:hover .lm-set-menu,
.lm-set-nav:focus-within .lm-set-menu { visibility: visible; opacity: 1; transform: none; }
.lm-set-search {
  width: 100%; margin-bottom: .35rem;
  padding: .45rem .7rem; border-radius: .55rem;
  background: #0B0D10; border: 1px solid #252A33;
  color: #EAEAEA; font-size: .82rem; outline: none;
}
.lm-set-search:focus { border-color: rgba(91,192,190,.55); }
.lm-set-menu a {
  display: flex; align-items: center; gap: .6rem;
  padding: .45rem .55rem; border-radius: .55rem;
  color: #EAEAEA; text-decoration: none; font-size: .84rem;
}
.lm-set-menu a:hover { background: rgba(91,192,190,.1); }
.lm-set-menu a.on { background: rgba(91,192,190,.14); }
.lm-set-mi-txt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.lm-set-mi-txt .n { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lm-set-mi-txt .d { font-size: .7rem; color: #6B7280; }
/* Set-symbol fallback: most historic sets have no MtgSets row / icon. */
.lm-set-ico-fallback {
  width: 16px; height: 16px; border-radius: 3px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: #252A33; color: #9CA3AF; font-size: .5rem; font-weight: 800;
}

/* ============================== SECTIONS =================================== */
.lm-sec { margin-top: 2.6rem; }
.lm-h2 { font-size: 1.15rem; font-weight: 700; color: #EAEAEA; letter-spacing: -.005em; }
.lm-h2-sub { font-size: .78rem; color: #6B7280; margin-top: .15rem; }
.lm-sec-head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1rem; }

.lm-card {
  background: #12151A; border: 1px solid #1A1E25; border-radius: .85rem;
  padding: 1rem;
}

/* ============================ TIER LIST ==================================== */
.lm-tier-band { display: flex; align-items: center; gap: .6rem; margin: 1.1rem 0 .45rem; }
.lm-tier-band:first-of-type { margin-top: 0; }
.lm-tier-band::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, #252A33, transparent); }
.lm-tier-chip {
  width: 30px; height: 30px; border-radius: .5rem;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: .95rem; font-weight: 800;
  border: 1px solid transparent;
}
.lm-tier-s { color: #0B0D10; background: linear-gradient(140deg, #F0D77B, var(--lm-gold)); box-shadow: 0 0 16px -4px rgba(212,175,55,.7); }
.lm-tier-a { color: #0B0D10; background: var(--lm-teal); box-shadow: 0 0 14px -4px rgba(91,192,190,.6); }
.lm-tier-b { color: #EAEAEA; background: #252A33; border-color: #343B47; }
.lm-tier-c { color: #9CA3AF; background: #1A1E25; border-color: #252A33; }
.lm-tier-d { color: #6B7280; background: #12151A; border-color: #1A1E25; }

.lm-tier-row {
  display: grid; align-items: center; gap: .7rem;
  grid-template-columns: 1.6rem 3.4rem minmax(7rem, 12rem) 1fr 3.6rem auto;
  padding: .5rem .65rem; border-radius: .65rem;
  transition: background .2s;
}
.lm-tier-row:hover { background: rgba(91,192,190,.05); }
.lm-tier-rank { font-size: .8rem; font-weight: 700; color: #6B7280; font-variant-numeric: tabular-nums; text-align: right; }
.lm-rank-1 { color: var(--lm-gold); }
.lm-rank-2 { color: #C8CDD6; }
.lm-rank-3 { color: #C08A5A; }
.lm-tier-pips { display: inline-flex; gap: .22rem; font-size: 15px; }
.lm-tier-name { min-width: 0; }
.lm-tier-name b { display: block; font-size: .92rem; font-weight: 650; color: #EAEAEA; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lm-tier-name em { display: block; font-style: normal; font-size: .68rem; color: #6B7280; }

/* 50%-centred diverging bar — the house matchup language. */
.lm-tier-track {
  position: relative; height: 12px; border-radius: 6px;
  background: #1A1E25; border: 1px solid #252A33; overflow: hidden;
}
.lm-tier-mid { position: absolute; top: 0; bottom: 0; left: 50%; width: 1px; background: #343B47; }
.lm-tier-fill { position: absolute; top: 2px; bottom: 2px; border-radius: 4px; }
.lm-tier-fill.up   { background: linear-gradient(90deg, rgba(34,197,94,.45), #4ade80); transform-origin: left; }
.lm-tier-fill.down { background: linear-gradient(270deg, rgba(239,68,68,.45), #f87171); transform-origin: right; }
/* Signature sweep: bars grow out of the midline with a per-row stagger once revealed. */
.lm-anim .lm-tier-fill { transform: scaleX(0); }
.lm-anim .rv-in .lm-tier-fill,
.lm-anim [data-reveal].rv-in .lm-tier-fill {
  transform: scaleX(1);
  transition: transform .7s cubic-bezier(.2,.75,.25,1) calc(var(--i, 0) * 70ms + .15s);
}
.lm-anim .lm-tier-fill { animation: lm-failsafe-x .01s 1.8s forwards; }
@keyframes lm-failsafe-x { to { transform: scaleX(1); } }

.lm-tier-pct { font-size: .95rem; font-weight: 800; font-variant-numeric: tabular-nums; text-align: right; }
.lm-tier-pct.up { color: var(--lm-up); }
.lm-tier-pct.down { color: var(--lm-down); }
.lm-tier-n { font-size: .68rem; color: #6B7280; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lm-tier-n .lm-sk { display: block; color: var(--lm-teal); }

@media (max-width: 640px) {
  .lm-tier-row { grid-template-columns: 1.3rem 3rem 1fr 3.4rem; }
  .lm-tier-track { grid-column: 1 / -1; order: 5; height: 9px; }
  .lm-tier-n { display: none; }
}

/* ============================ PULSE CARDS ================================== */
.lm-pulse-grid { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 768px)  { .lm-pulse-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1280px) { .lm-pulse-grid { grid-template-columns: repeat(4, 1fr); } }

.lm-pulse { position: relative; overflow: hidden; }
/* Pointer glow (landing-fx.js drives --mx/--my on .lx-glow-track). */
.lm-pulse.lx-glow-track::before {
  content: ''; position: absolute; inset: 0; pointer-events: none; opacity: 0;
  background: radial-gradient(200px circle at var(--mx, 50%) var(--my, 50%), rgba(91,192,190,.09), transparent 65%);
  transition: opacity .3s;
}
.lm-pulse.lx-glow-track:hover::before { opacity: 1; }
.lm-pulse-head { display: flex; align-items: center; gap: .5rem; margin-bottom: .2rem; }
.lm-pulse-head b { font-size: .92rem; font-weight: 700; color: #EAEAEA; }
.lm-pulse-ico {
  width: 28px; height: 28px; border-radius: .5rem; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.lm-pulse-ico.teal { color: var(--lm-teal); background: rgba(91,192,190,.12); }
.lm-pulse-ico.gold { color: var(--lm-gold); background: rgba(212,175,55,.12); }
.lm-pulse-ico.red  { color: var(--lm-down); background: rgba(239,68,68,.12); }
.lm-pulse-ico.blue { color: #60A5FA; background: rgba(96,165,250,.12); }
.lm-pulse-sub { font-size: .72rem; color: #6B7280; margin-bottom: .7rem; line-height: 1.35; }

.lm-pulse-row {
  display: flex; align-items: center; gap: .6rem;
  padding: .38rem .4rem; margin: 0 -.4rem; border-radius: .5rem;
  transition: background .15s;
}
.lm-pulse-row:hover { background: rgba(91,192,190,.07); }
.lm-thumb {
  width: 44px; height: 32px; border-radius: .35rem; object-fit: cover;
  background: #1A1E25; flex-shrink: 0;
}
.lm-pulse-txt { flex: 1 1 auto; min-width: 0; }
.lm-pulse-txt b {
  display: block; font-size: .8rem; font-weight: 600; color: #EAEAEA;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.lm-pulse-txt span { display: block; font-size: .68rem; color: #6B7280; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lm-pulse-stat { font-size: .78rem; font-weight: 700; color: var(--lm-teal); white-space: nowrap; font-variant-numeric: tabular-nums; }
.lm-pulse.gold .lm-pulse-stat { color: var(--lm-gold); }
.lm-pulse.red .lm-pulse-stat { color: var(--lm-down); }

/* Rarity letter chip — text, never colour alone. */
.lm-rar {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 16px; height: 16px; padding: 0 3px; border-radius: 3px;
  font-size: .58rem; font-weight: 800; flex-shrink: 0;
}
.lm-rar-common   { color: #C8CDD6; background: #252A33; }
.lm-rar-uncommon { color: #AEE3EF; background: rgba(142,197,215,.16); }
.lm-rar-rare     { color: #F0D77B; background: rgba(212,175,55,.16); }
.lm-rar-mythic   { color: #F0A46B; background: rgba(226,110,40,.16); }
.lm-rar-special, .lm-rar-bonus { color: #C9A6ED; background: rgba(167,139,250,.16); }

/* ============================ MECHANICS ==================================== */
.lm-mech-grid { display: grid; grid-template-columns: 1fr; gap: .8rem; }
@media (min-width: 900px) { .lm-mech-grid { grid-template-columns: repeat(2, 1fr); } }
.lm-mech { padding: .8rem 1rem; }
.lm-mech-head { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; }
.lm-mech-head b { font-size: .9rem; font-weight: 700; color: #EAEAEA; }
.lm-mech-lift {
  font-size: .72rem; font-weight: 800; color: var(--lm-teal);
  font-variant-numeric: tabular-nums; white-space: nowrap;
}
.lm-mech-track { height: 8px; border-radius: 4px; background: #1A1E25; margin: .5rem 0 .55rem; overflow: hidden; }
.lm-mech-fill {
  height: 100%; border-radius: 4px;
  background: linear-gradient(90deg, rgba(91,192,190,.35), var(--lm-teal));
  width: var(--w, 0%);
}
.lm-anim .lm-mech-fill { width: 0; }
.lm-anim .rv-in .lm-mech-fill { width: var(--w, 0%); transition: width .8s cubic-bezier(.2,.75,.25,1) .1s; }
.lm-anim .lm-mech-fill { animation: lm-failsafe-w .01s 1.8s forwards; }
@keyframes lm-failsafe-w { to { width: var(--w, 0%); } }
.lm-mech-meta { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; }
.lm-mech-chip {
  font-size: .68rem; color: #9CA3AF; padding: .14rem .5rem;
  background: #1A1E25; border: 1px solid #252A33; border-radius: 99px;
  cursor: default;
}
.lm-mech-chip:hover { color: #EAEAEA; border-color: rgba(91,192,190,.4); }

/* =========================== COMMUNITY ===================================== */
.lm-db-legend { display: flex; gap: 1.2rem; font-size: .7rem; color: #9CA3AF; margin-bottom: .7rem; }
.lm-db-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: .32rem; }
.lm-db-legend .crowd i { background: #6B7D8C; }
.lm-db-legend .us i { background: var(--lm-teal); box-shadow: 0 0 7px rgba(91,192,190,.7); }

.lm-db-row {
  display: grid; align-items: center; gap: .8rem;
  grid-template-columns: minmax(8rem, 14rem) 1fr auto;
  padding: .42rem .55rem; margin: 0 -.55rem; border-radius: .5rem;
}
.lm-db-row:hover { background: rgba(91,192,190,.06); }
.lm-db-name { font-size: .82rem; font-weight: 600; color: #EAEAEA; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.lm-db-track { position: relative; height: 20px; }
.lm-db-track::before {
  content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 2px;
  transform: translateY(-50%); background: #1A1E25; border-radius: 1px;
}
.lm-db-line {
  position: absolute; top: 50%; height: 2px; transform: translateY(-50%);
  left: var(--lo); width: var(--w);
  background: linear-gradient(90deg, rgba(107,125,140,.8), rgba(91,192,190,.8));
  border-radius: 1px;
}
.lm-db-dot {
  position: absolute; top: 50%; width: 9px; height: 9px; border-radius: 50%;
  transform: translate(-50%, -50%);
}
.lm-db-dot.crowd { background: #6B7D8C; }
.lm-db-dot.us { background: var(--lm-teal); box-shadow: 0 0 8px rgba(91,192,190,.8); }
.lm-db-delta { font-size: .74rem; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.lm-db-delta.up { color: var(--lm-up); }
.lm-db-delta.down { color: var(--lm-down); }
@media (max-width: 640px) {
  .lm-db-row { grid-template-columns: 1fr auto; }
  .lm-db-track { grid-column: 1 / -1; order: 3; }
}

/* Sidekick pair-record chips. */
.lm-pairrec { display: flex; flex-wrap: wrap; gap: .45rem; }
.lm-pairrec span {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .74rem; color: #9CA3AF; padding: .28rem .6rem;
  background: #12151A; border: 1px solid #1A1E25; border-radius: .5rem;
  font-variant-numeric: tabular-nums;
}
.lm-pairrec b { color: #EAEAEA; font-weight: 650; }

/* ============================ CARD TABLE =================================== */
.lm-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-bottom: .8rem; }
.lm-search {
  flex: 1 1 12rem; max-width: 210px;
  padding: .45rem .75rem; border-radius: .6rem;
  background: #12151A; border: 1px solid #252A33;
  color: #EAEAEA; font-size: .82rem; outline: none;
}
.lm-search:focus { border-color: rgba(91,192,190,.55); }
.lm-chip {
  padding: .32rem .7rem; border-radius: 99px;
  background: #12151A; border: 1px solid #252A33;
  color: #9CA3AF; font-size: .74rem; font-weight: 600;
  cursor: pointer; transition: color .15s, border-color .15s, background .15s;
}
.lm-chip:hover { color: #EAEAEA; }
.lm-chip[aria-pressed="true"] { color: #0B0D10; background: var(--lm-teal); border-color: var(--lm-teal); }
.lm-count { font-size: .72rem; color: #6B7280; margin-left: auto; font-variant-numeric: tabular-nums; }

.lm-table-scroll {
  overflow-x: auto; border: 1px solid #1A1E25; border-radius: .85rem;
  background: #12151A;
  /* Sticky header needs a bounded scroll area on mobile only; desktop scrolls the page. */
}
.lm-table { width: 100%; border-collapse: collapse; font-size: .82rem; min-width: 760px; }
.lm-table thead th {
  position: sticky; top: 0; z-index: 2;
  background: #161A20; color: #9CA3AF;
  font-size: .68rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
  padding: .6rem .55rem; text-align: right; white-space: nowrap;
  border-bottom: 1px solid #252A33;
}
.lm-table thead th.lm-th-card { text-align: left; padding-left: .9rem; }
.lm-table thead th[data-sort] { cursor: pointer; user-select: none; }
.lm-table thead th[data-sort]:hover { color: #EAEAEA; }
.lm-table thead th[data-sort].on { color: var(--lm-teal); }
.lm-table thead th[data-sort].on::after { content: ' ↓'; font-size: .6rem; }
.lm-table thead th[data-sort].on.asc::after { content: ' ↑'; }

.lm-row td {
  padding: .42rem .55rem; text-align: right; white-space: nowrap;
  border-bottom: 1px solid rgba(26,30,37,.7);
  font-variant-numeric: tabular-nums; color: #9CA3AF;
}
.lm-row:last-child td { border-bottom: 0; }
.lm-row:hover td { background: rgba(91,192,190,.05); }
.lm-td-card { text-align: left !important; padding-left: .9rem !important; min-width: 15rem; }
/* display:flex on a <td> breaks table layout — the flex row is an inner div. */
.lm-td-cardin { display: flex; align-items: center; gap: .55rem; }
.lm-card-name { font-weight: 600; color: #EAEAEA; overflow: hidden; text-overflow: ellipsis; max-width: 15rem; }
.lm-num b { font-weight: 700; }
.lm-num b.up { color: var(--lm-up); }
.lm-num b.down { color: var(--lm-down); }
.lm-power {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 30px; padding: .13rem .3rem; border-radius: .35rem;
  background: rgba(91,192,190,.1); border: 1px solid rgba(91,192,190,.25);
  color: var(--lm-teal); font-weight: 800; font-size: .76rem;
}
.lm-gih { min-width: 7.2rem; }
.lm-mini-track {
  display: inline-block; vertical-align: middle; margin-right: .45rem;
  width: 46px; height: 7px; border-radius: 4px; background: #1A1E25; overflow: hidden;
}
.lm-mini-fill { display: block; height: 100%; border-radius: 4px; background: linear-gradient(90deg, rgba(91,192,190,.35), var(--lm-teal)); }
.lm-edge-pos { color: var(--lm-up); font-weight: 700; }
.lm-edge-neg { color: var(--lm-down); font-weight: 700; }
.lm-dim { color: #4B5563; }

/* Sortable rows FLIP via WAAPI in limited-meta.js; rows hide via [hidden]. */
.lm-row[hidden] { display: none; }

/* ============================ MISC ========================================= */
.lm-note {
  display: inline-flex; align-items: center; gap: .45rem;
  font-size: .74rem; color: #9CA3AF;
  padding: .4rem .7rem; border-radius: .55rem;
  background: rgba(96,165,250,.08); border: 1px solid rgba(96,165,250,.25);
}
.lm-empty {
  border: 1px dashed rgba(37,42,51,.9); border-radius: .85rem;
  background: rgba(18,21,26,.4); padding: 2rem 1.2rem;
  text-align: center; color: #6B7280; font-size: .85rem;
}
.lm-empty a { color: var(--lm-teal); }
.lm-empty a:hover { text-decoration: underline; }

.lm-footer {
  margin-top: 3rem; padding-top: 1.1rem; border-top: 1px solid #1A1E25;
  font-size: .72rem; color: #6B7280; line-height: 1.6;
}
.lm-footer a { color: var(--lm-teal); }
.lm-footer a:hover { text-decoration: underline; }

/* Skeleton while StreamRendering waits on the payload. */
.lm-skel { border-radius: .85rem; background: #12151A; border: 1px solid #1A1E25; }

@media (prefers-reduced-motion: reduce) {
  .lm-page *, .lm-page *::before, .lm-page *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}