/*! ScrollVault Direction B — manabase bundle. Do not edit here. */

@font-face {
  font-family: "Plex Sans";
  src: url("../fonts/plex-sans-var.woff2") format("woff2-variations");
  font-weight: 400 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Plex Mono";
  src: url("../fonts/plex-mono-500.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Plex Mono";
  src: url("../fonts/plex-mono-400.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Shoulders";
  src: url("../fonts/big-shoulders-var.woff2") format("woff2-variations");
  font-weight: 700 800; font-style: normal; font-display: swap;
}

@font-face {
  font-family: "Plex Sans Fallback";
  src: local("Arial"), local("Helvetica"), local("Liberation Sans");
  size-adjust: 99.9%;
  ascent-override: 103.1%;
  descent-override: 28.0%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Shoulders Fallback";
  src: local("Arial"), local("Helvetica"), local("Liberation Sans");
  size-adjust: 72.9%;
  ascent-override: 134.5%;
  descent-override: 28.8%;
  line-gap-override: 0%;
}

@font-face {
  font-family: "Plex Mono Fallback";
  src: local("Liberation Mono"), local("Courier New"), local("DejaVu Sans Mono");
  size-adjust: 99.7%;
  ascent-override: 103.4%;
  descent-override: 28.1%;
  line-gap-override: 0%;
}

:root {

  --measure-read: 56rem;

  --ground:        #0A0908;
  --panel:         #131110;
  --raised:        #1B1917;
  --line:          rgba(255, 255, 255, 0.09);
  --line-strong:   rgba(255, 255, 255, 0.16);

  --ink:           #F2EDE4;
  --ink-dim:       #A8A199;
  --ink-muted:     #8A837B;

  --flare:         #FFB020;
  --flare-soft:    #FFCE6A;
  --flare-tint:    rgba(255, 176, 32, 0.13);
  --flare-line:    rgba(255, 176, 32, 0.34);

  --b1:            #4E9E72;
  --b2:            #8FB84A;
  --b3:            #E0A93A;
  --b4:            #E8722E;
  --b5:            #E2453A;
  --b1-tint:       rgba(78, 158, 114, 0.14);
  --b2-tint:       rgba(143, 184, 74, 0.14);
  --b3-tint:       rgba(224, 169, 58, 0.14);
  --b4-tint:       rgba(232, 114, 46, 0.14);
  --b5-tint:       rgba(226, 69, 58, 0.14);

  --b5-ink:        #EE6A60;

  --mana-w:        #D9D2C0;
  --mana-u:        #6FA3D6;
  --mana-b:        #A99BB5;
  --mana-r:        #E08472;
  --mana-g:        #6FB57C;

  --font-display: "Shoulders", "Shoulders Fallback", system-ui, sans-serif;
  --font-sans:    "Plex Sans", "Plex Sans Fallback", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono:    "Plex Mono", "Plex Mono Fallback", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --fs-12: 0.75rem;
  --fs-14: 0.875rem;
  --fs-16: 1rem;
  --fs-18: 1.125rem;
  --fs-22: 1.375rem;
  --fs-28: 1.75rem;
  --fs-36: 2.25rem;
  --fs-48: 3rem;
  --fs-64: 4rem;

  --track-caps: 0.06em;
  --track-tight: -0.02em;

  --s-1: 0.25rem; --s-2: 0.5rem;  --s-3: 0.75rem; --s-4: 1rem;
  --s-5: 1.5rem;  --s-6: 2rem;    --s-7: 3rem;    --s-8: 4rem;

  --r-sm: 2px;
  --r-md: 4px;
  --r-lg: 8px;
  --r-pill: 999px;

  --dur-fast:   120ms;
  --dur-normal: 160ms;
  --ease:       cubic-bezier(0.2, 0.8, 0.2, 1);

  --nav-h: 56px;
  --rail-w: 200px;
  --measure: 1280px;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur-normal: 0ms; }
}

*, *::before, *::after { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--ground);
  color: var(--ink);
  font-family: var(--font-sans);
  font-size: var(--fs-14);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

.card { padding: var(--s-5); }

.eyebrow {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
  color: var(--ink-muted);
}

.note {
  font-size: var(--fs-12);
  color: var(--ink-muted);
  border-top: 1px solid var(--line);
  padding-top: var(--s-3);
}

.row { display: flex; flex-wrap: wrap; gap: var(--s-3); align-items: center; }
.col { display: flex; flex-direction: column; gap: var(--s-3); }
.stack-4 { display: flex; flex-direction: column; gap: var(--s-4); }

:focus-visible {
  outline: 2px solid var(--flare);
  outline-offset: 2px;
}

.display {
  font-family: var(--font-display);
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: var(--track-caps);
  line-height: 0.92;
  margin: 0;
}
.display-xl { font-size: var(--fs-64); }
.display-lg { font-size: var(--fs-48); }
.display-md { font-size: var(--fs-28); }
.display-sm { font-size: var(--fs-18); }

.num {
  font-family: var(--font-mono);
  font-weight: 500;
  font-variant-numeric: tabular-nums;
}

.ladder { display: flex; gap: 3px; align-items: flex-end; }
.rung {
  flex: 1;
  min-width: 0;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  font: inherit;
  color: var(--ink-muted);
  text-align: center;
}
.rung-bar {

  display: block;
  height: 6px;
  border-radius: var(--r-sm);
  background: currentColor;
  opacity: 0.28;
  transition: opacity var(--dur-fast) var(--ease);
}
.rung-label {
  display: block;
  margin-top: var(--s-2);
  font-family: var(--font-mono);
  font-size: 10px;
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
}
.rung:hover .rung-bar { opacity: 0.6; }
.rung[aria-current="true"] .rung-bar { opacity: 1; height: 12px; }
.rung[aria-current="true"] .rung-label { color: var(--ink); }

.rung-1 { color: var(--b1); } .rung-2 { color: var(--b2); }
.rung-3 { color: var(--b3); } .rung-4 { color: var(--b4); }
.rung-5 { color: var(--b5); }

@media (max-width: 580px) {
  .ladder {
    display: grid; grid-template-columns: auto minmax(0, 1fr);
    align-items: center; gap: var(--s-2) var(--s-3);
  }
  .ladder li.rung, .ladder button.rung {
    display: grid; grid-column: span 2; grid-template-columns: subgrid;
    align-items: center; text-align: left; min-height: 0;
  }
  .ladder .rung-label { margin-top: 0; order: -1; white-space: nowrap; }
}

.chip {
  display: inline-flex;
  align-items: center;
  gap: var(--s-2);
  padding: 4px 10px;
  border-radius: var(--r-md);
  border: 1px solid currentColor;
  background: transparent;
  font-family: var(--font-display);
  font-weight: 800;
  font-size: var(--fs-14);
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
  line-height: 1.1;
}
.chip-b1 { color: var(--b1); background: var(--b1-tint); }
.chip-b2 { color: var(--b2); background: var(--b2-tint); }
.chip-b3 { color: var(--b3); background: var(--b3-tint); }
.chip-b4 { color: var(--b4); background: var(--b4-tint); }

.chip-b5 { color: var(--b5-ink); background: var(--b5-tint); }

.signal {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 9px 4px 7px;
  border: 1px solid var(--line);
  border-radius: var(--r-pill);
  background: var(--panel);
  font-size: var(--fs-12);
  color: var(--ink-dim);
  transition: border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.signal svg { width: 13px; height: 13px; flex: none; display: block; }
.signal[data-on="true"] { color: var(--flare); border-color: var(--flare-line); background: var(--flare-tint); }
.signal .count { font-family: var(--font-mono); font-weight: 500; font-variant-numeric: tabular-nums; }

.counters { display: flex; gap: var(--s-6); flex-wrap: wrap; }
.counter { display: flex; flex-direction: column; gap: 2px; }
.counter-label {
  display: flex; align-items: center; gap: 6px;
  font-family: var(--font-mono); font-size: 10px; font-weight: 500;
  letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--ink-muted);
}
.dot { width: 6px; height: 6px; border-radius: 50%; background: var(--flare); flex: none; }
.dot-live { background: var(--b1); }
.counter-value {
  font-family: var(--font-mono); font-weight: 500; font-size: var(--fs-28);
  font-variant-numeric: tabular-nums; color: var(--ink); line-height: 1.1;
}

.btn,
.btn-primary,
.btn-secondary,
.btn-ghost {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2);
  padding: 10px 18px;
  border-radius: var(--r-md);
  border: 1px solid transparent;
  font-family: var(--font-display);
  font-weight: 800; font-size: var(--fs-16);
  letter-spacing: var(--track-caps); text-transform: uppercase;
  cursor: pointer; line-height: 1;
  transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.btn-primary { background: var(--flare); color: #17120A; }
.btn-primary:hover { background: var(--flare-soft); }
.btn-secondary { background: transparent; border-color: var(--line-strong); color: var(--ink); }
.btn-secondary:hover { border-color: var(--flare-line); color: var(--flare); }

.btn-ghost { background: transparent; color: var(--ink-dim); padding-left: 8px; padding-right: 8px; }
.btn-ghost:hover { color: var(--ink); }
.btn:active, .btn-primary:active, .btn-secondary:active, .btn-ghost:active { transform: translateY(1px); }

.input {
  width: 100%;
  padding: 10px 12px;
  background: var(--ground);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-md);
  color: var(--ink);
  font-family: var(--font-mono);
  font-size: var(--fs-14);
  resize: vertical;
}
.input::placeholder { color: var(--ink-muted); font-family: var(--font-sans); }
.input:focus { border-color: var(--flare-line); outline: none; box-shadow: 0 0 0 2px var(--flare-tint); }

.deck-card {
  display: flex;
  flex-direction: column;
  background: var(--panel);
  border: 1px solid var(--line);
  border-top: 3px solid var(--rung, var(--line));
  border-radius: var(--r-lg);
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: border-color var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}

.deck-card[data-b="1"] { --rung: var(--b1); }
.deck-card[data-b="2"] { --rung: var(--b2); }
.deck-card[data-b="3"] { --rung: var(--b3); }
.deck-card[data-b="4"] { --rung: var(--b4); }
.deck-card[data-b="5"] { --rung: var(--b5); }
.deck-card:hover { border-color: var(--flare-line); transform: translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .deck-card:hover { transform: none; } }

.deck-card--nolink { cursor: default; }
.deck-card--nolink:hover { border-color: var(--line); transform: none; }

.gallery-note {
  margin: 0 0 var(--s-4);
  padding: var(--s-3) var(--s-4);
  border-left: 3px solid var(--flare-line);
  background: var(--panel);
  color: var(--ink-dim);
  font-size: var(--fs-14);
  line-height: 1.55;
  border-radius: var(--r-md);
}

.deck-art {
  position: relative;
  aspect-ratio: 626 / 320;
  overflow: hidden;
  background: var(--raised);
}
.deck-art img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 32%;
  display: block;
}

.deck-art::after {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(to top, var(--panel) 0%, rgba(19,17,16,0.35) 26%, rgba(19,17,16,0) 55%);
  pointer-events: none;
}

.deck-body { padding: var(--s-3) var(--s-4) var(--s-4); display: flex; flex-direction: column; gap: 6px; flex: 1; }
.deck-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--s-3); }
.deck-name {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-18);
  letter-spacing: var(--track-caps); text-transform: uppercase; line-height: 1;
  margin: 0; color: var(--ink); text-wrap: balance;
}
.deck-body .credit { margin-top: auto; }
.deck-meta {
  display: flex; gap: var(--s-3); flex-wrap: wrap;
  font-family: var(--font-mono); font-size: var(--fs-12);
  color: var(--ink-dim); font-variant-numeric: tabular-nums;
}
.credit {
  font-size: 10px; color: var(--ink-muted); line-height: 1.35;
  border-top: 1px solid var(--line); padding-top: 6px; margin-top: 2px;
}

.verdict {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  overflow: hidden;
}
.verdict-head {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: var(--s-4); padding: var(--s-5); border-bottom: 1px solid var(--line);
}
.verdict-num {
  font-family: var(--font-display); font-weight: 800;
  font-size: var(--fs-64); line-height: 0.82;
  letter-spacing: var(--track-tight);
}
.verdict-b3 { color: var(--b3); }
.verdict-label {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--track-caps);
  text-transform: uppercase; color: var(--ink-muted); margin-bottom: 6px;
}
.verdict-read { font-size: var(--fs-16); color: var(--ink-dim); margin: var(--s-2) 0 0; max-width: 46ch; }
.verdict-read b { color: var(--ink); font-weight: 600; }
.verdict-body { padding: var(--s-5); display: flex; flex-direction: column; gap: var(--s-5); }

.readout { display: flex; flex-wrap: wrap; gap: var(--s-5); }
.readout-item { display: flex; flex-direction: column; gap: 2px; }
.readout-k {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--track-caps);
  text-transform: uppercase; color: var(--ink-muted);
}
.readout-v {
  font-family: var(--font-mono); font-weight: 500; font-size: var(--fs-22);
  font-variant-numeric: tabular-nums; color: var(--ink); line-height: 1.15;
}

.rail { display: flex; flex-direction: column; }
.rail-head {
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: var(--s-3); border-bottom: 1px solid var(--line); margin-bottom: var(--s-2);
}
.rail-item {
  display: flex; align-items: center; gap: var(--s-3);
  padding: var(--s-2) var(--s-2); border-radius: var(--r-md);
  text-decoration: none; color: inherit;
  transition: background var(--dur-fast) var(--ease);
}
.rail-item:hover { background: var(--raised); }
.rail-thumb {
  width: 40px; height: 40px; border-radius: var(--r-md); flex: none;
  object-fit: cover; object-position: center 30%; background: var(--raised);
}
.rail-text { min-width: 0; flex: 1; }
.rail-name {
  font-size: var(--fs-14); font-weight: 600; color: var(--ink);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.rail-sub {
  font-family: var(--font-mono); font-size: 10px; color: var(--ink-muted);
  font-variant-numeric: tabular-nums;
}

.nav {
  display: flex; align-items: center; gap: var(--s-5);
  height: var(--nav-h); padding: 0 var(--s-4);
  background: var(--ground); border-bottom: 1px solid var(--line);
}
.wordmark {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-22);
  letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--ink);
  display: flex; align-items: center; gap: 8px; text-decoration: none;
}
.wordmark .vault { color: var(--flare); }
.nav-links { display: flex; gap: var(--s-4); margin-left: auto; }
.nav-link {
  font-family: var(--font-mono); font-size: var(--fs-12); letter-spacing: var(--track-caps);
  text-transform: uppercase; color: var(--ink-dim); text-decoration: none;
  padding: 6px 0; border-bottom: 2px solid transparent;
  transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.nav-link:hover { color: var(--ink); }
.nav-link[aria-current="page"] { color: var(--flare); border-bottom-color: var(--flare); }

.swatch-row { display: flex; gap: 1px; border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; }
.swatch { flex: 1; height: 56px; display: flex; align-items: flex-end; padding: 6px; }
.swatch code { font-family: var(--font-mono); font-size: 9px; color: var(--ink-dim); }

.curve { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; gap: 4px; align-items: end; height: 96px; }
.curve-col { display: flex; flex-direction: column; align-items: center; gap: 4px; height: 100%; justify-content: flex-end; }
.curve-bar { width: 100%; background: var(--flare); border-radius: var(--r-sm) var(--r-sm) 0 0; min-height: 2px; }
.curve-n { font-family: var(--font-mono); font-size: 10px; color: var(--ink-muted); }

.sv-card-preview { position: fixed; z-index: 9999; pointer-events: none; opacity: 0; transition: opacity var(--dur-fast) var(--ease); }
.sv-card-preview.is-visible { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .sv-card-preview { transition: none; } }
.sv-card-preview--hover {
  width: 244px; height: 340px; border-radius: var(--r-md);
  background: var(--ground); border: 1px solid var(--line-strong);
  box-shadow: 0 12px 28px rgba(0,0,0,0.6); overflow: hidden;
}
.sv-card-preview--hover img { width: 100%; height: 100%; display: block; object-fit: cover; }
.sv-card-preview--sticky {
  inset: 0; background: rgba(0,0,0,0.78); pointer-events: auto;
  display: flex; align-items: center; justify-content: center; padding: var(--s-4);
}
.sv-card-preview--sticky:not(.is-visible) { pointer-events: none; }
.sv-card-preview-inner {
  position: relative; background: var(--panel); border-radius: var(--r-lg);
  border: 1px solid var(--line-strong); padding: var(--s-3); max-width: 340px;
}
.sv-card-preview-inner img { width: 100%; display: block; border-radius: var(--r-md); }
.sv-card-preview-title { font-family: var(--font-mono); font-size: var(--fs-12); color: var(--ink-dim); text-align: center; margin-top: var(--s-2); }
.sv-card-preview-close {
  position: absolute; top: -12px; right: -12px; width: 32px; height: 32px;
  border-radius: 50%; border: 1px solid var(--line-strong); background: var(--ground);
  color: var(--ink); font-size: 18px; line-height: 1; cursor: pointer;
}

[data-card] { cursor: help; }
[data-card]:hover { border-color: var(--flare-line); color: var(--flare); }

[class$="-fill"], .mfill { display: block; }

[class$="-fill"]:not([style*="width:0%"]), .mfill:not([style*="width:0%"]) { min-width: 2px; }

.table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;

  padding-bottom: 2px;
}
.table-scroll > .dtable { min-width: 100%; }

.table-scroll:focus-visible { outline: 2px solid var(--flare); outline-offset: 2px; }

.dtable { width: 100%; border-collapse: collapse; font-size: var(--fs-14); }
.dtable th {
  text-align: left; font-family: var(--font-mono); font-size: 10px;
  letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--ink-muted);
  font-weight: 500; padding: 0 var(--s-3) var(--s-2) 0; border-bottom: 1px solid var(--line);
}
.dtable td { padding: 6px var(--s-3) 6px 0; border-bottom: 1px solid var(--line); color: var(--ink-dim); vertical-align: middle; }
.dtable tr:last-child td { border-bottom: 0; }
.dtable td.n { font-family: var(--font-mono); text-align: right; color: var(--ink); font-variant-numeric: tabular-nums; width: 64px; }
.dtable th.n { text-align: right; }
.dtable td.dim { color: var(--ink-muted); font-size: var(--fs-12); }
.mtrack { display: block; height: 6px; background: var(--ground); border-radius: var(--r-sm); overflow: hidden; }
.mfill { display: block; height: 100%; background: var(--flare); border-radius: var(--r-sm); }

.dtable .meter { width: 130px; }

.card-pill {
  font-family: var(--font-mono); font-size: 11px;
  padding: 2px 7px; border-radius: var(--r-sm);
  background: var(--raised); color: var(--ink-dim); border: 1px solid var(--line);
}
.panel-title {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-18);
  text-transform: uppercase; letter-spacing: var(--track-caps);
  margin: 0 0 var(--s-3); line-height: 1; color: var(--ink);
}
.stiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: var(--s-3); }

.stile { border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--s-3); background: var(--raised); position: relative; overflow: hidden; }

.stile::after { content: ""; position: absolute; left: 0; bottom: 0; height: 2px; width: var(--w, 0); background: var(--flare); }
.stile-n { display: block; font-family: var(--font-display); font-size: var(--fs-22); line-height: 1; color: var(--ink); }
.stile-l { display: block; margin-top: 4px; font-size: var(--fs-12); line-height: 1.35; color: var(--ink-dim); }

.linklike {
  background: none; border: 0; padding: 0; font: inherit; cursor: pointer;
  color: var(--flare); text-decoration: underline; text-underline-offset: 2px;
  min-height: 24px;
}
.linklike:focus-visible { outline: 2px solid var(--flare); outline-offset: 2px; }

.modal-backdrop {
  position: fixed; inset: 0; z-index: 60;
  display: flex; align-items: center; justify-content: center;
  padding: var(--s-4);

  background: rgba(10, 9, 8, .82);
  overflow-y: auto; overscroll-behavior: contain;
}
.modal-backdrop[hidden] { display: none; }
.modal-dialog {
  position: relative; width: 100%; max-width: 34rem;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-lg);
  padding: var(--s-5);

  box-shadow: 0 12px 40px rgba(0, 0, 0, .5);
  max-height: calc(100dvh - var(--s-6)); overflow-y: auto;
}
.modal-close {
  position: absolute; top: var(--s-3); right: var(--s-3);
  min-width: 32px; min-height: 32px; line-height: 1;
  background: none; border: 0; color: var(--ink-dim); font-size: 24px; cursor: pointer;
}
.modal-close:hover { color: var(--ink); }
.modal-close:focus-visible { outline: 2px solid var(--flare); outline-offset: 2px; }
.modal-dialog h2 { margin: 0 0 var(--s-2); padding-right: var(--s-5); }
.modal-intro { margin: 0 0 var(--s-4); color: var(--ink-dim); font-size: var(--fs-14); }
.modal-fieldset { border: 0; padding: 0; margin: 0 0 var(--s-4); }
.modal-fieldset legend {
  padding: 0; margin-bottom: var(--s-2);
  font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--track-caps);
  text-transform: uppercase; color: var(--ink-muted);
}
.bracket-radio-row { display: flex; flex-wrap: wrap; gap: var(--s-2); }

.bracket-radio {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 32px; padding: 4px 10px;
  border: 1px solid var(--line); border-radius: var(--r-sm);
  font-size: var(--fs-14); color: var(--ink-dim); cursor: pointer;
}
.bracket-radio:hover { border-color: var(--flare-line); color: var(--ink); }
.bracket-radio:focus-within { outline: 2px solid var(--flare); outline-offset: 1px; }
.modal-label {
  display: block; margin: 0 0 6px; font-size: var(--fs-14); color: var(--ink);
}
.req { color: var(--ink-muted); font-size: var(--fs-12); }
#disputeReason, #disputeEmail, .input-line {
  width: 100%; margin-bottom: var(--s-4);
  background: var(--ground); color: var(--ink);
  border: 1px solid var(--line); border-radius: var(--r-sm);
  padding: 8px 10px; font: inherit; font-size: var(--fs-14);
}
#disputeReason:focus-visible, #disputeEmail:focus-visible, .input-line:focus-visible {
  outline: 2px solid var(--flare); outline-offset: -1px;
}
.modal-error {
  margin: 0 0 var(--s-3); padding: 8px 10px;
  border: 1px solid var(--b5); border-radius: var(--r-sm);
  color: var(--b5-ink); font-size: var(--fs-14);
}
.modal-actions { display: flex; gap: var(--s-2); justify-content: flex-end; }
.dispute-ok h3 { margin: 0 0 var(--s-2); }
.dispute-id code { font-family: var(--font-mono); color: var(--flare); }

.hp-field, .nl-hp-wrap {
  position: absolute; width: 1px; height: 1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap;
}

.rrp-lede { margin: 0 0 var(--s-4); color: var(--ink-dim); }
.rrp-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: var(--s-3); margin-bottom: var(--s-4);
}
.rrp-card {
  display: flex; flex-direction: column; gap: 4px;
  padding: var(--s-3); text-decoration: none;
  background: var(--panel); border: 1px solid var(--line); border-radius: var(--r-md);
}
.rrp-card:hover { border-color: var(--flare-line); }
.rrp-card:focus-visible { outline: 2px solid var(--flare); outline-offset: 2px; }
.rrp-card-top { display: flex; align-items: center; justify-content: space-between; gap: var(--s-2); }
.rrp-card-name { font-weight: 600; color: var(--ink); }
.rrp-card-cmd { font-size: var(--fs-14); color: var(--ink-dim); }
.rrp-card-meta { font-family: var(--font-mono); font-size: var(--fs-12); color: var(--ink-muted); }
.rrp-all { display: inline-flex; align-items: center; min-height: 24px; color: var(--flare); }

.nl-signup { margin: var(--s-6) 0 var(--s-5); max-width: var(--measure-read); }
.nl-label { display: block; font-family: var(--font-display); font-weight: 800;
  font-size: var(--fs-18); text-transform: uppercase; letter-spacing: var(--track-caps); color: var(--ink); }
.nl-sub { margin: 4px 0 var(--s-3); color: var(--ink-dim); font-size: var(--fs-14); }
.nl-row { display: flex; gap: var(--s-2); flex-wrap: wrap; }
.nl-row .input-line { flex: 1 1 16rem; margin-bottom: 0; }
.nl-signup-msg:empty { display: none; }
.nl-signup-msg { margin: var(--s-2) 0 0; font-size: var(--fs-14); }
.nl-ok { color: var(--b1); }
.nl-err { color: var(--b5-ink); }
.restore-chip { margin-bottom: var(--s-2); font-size: var(--fs-14); }
.restore-chip[hidden] { display: none; }
.paste-label { display: block; margin: var(--s-3) 0 6px; font-size: var(--fs-14); color: var(--ink); }

.article-wrap { margin-top: var(--s-7); display: grid; gap: var(--s-6); }
.prose { max-width: var(--measure-read); }

.prose h2 {
  font-family: var(--font-display); font-size: var(--fs-22); letter-spacing: .01em;
  text-transform: uppercase; color: var(--ink); margin: 0 0 var(--s-3);
}
.prose h3 {
  font-family: var(--font-display); font-size: var(--fs-16); letter-spacing: .03em;
  text-transform: uppercase; color: var(--flare-soft); margin: var(--s-5) 0 var(--s-2);
}
.prose p { margin: 0 0 var(--s-3); color: var(--ink-dim); font-size: var(--fs-16); line-height: 1.65; }
.prose p strong, .prose p b { color: var(--ink); font-weight: 600; }
.prose p em { color: var(--ink); font-style: italic; }
.prose a { color: var(--flare); }
.prose .acc-d { max-width: none; }
.prose .sub { font-size: var(--fs-16); line-height: 1.65; }

.related { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-5); }
.related a {
  display: inline-flex; align-items: center; min-height: 24px;
  font-family: var(--font-mono); font-size: var(--fs-12);
  letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--flare);
}

@media (min-width: 1000px) {
  .article-wrap { grid-template-columns: minmax(0, var(--measure-read)); }
}

.zone { padding-top: var(--s-6); }
.zone-h {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--s-4);
  border-bottom: 1px solid var(--line); padding-bottom: var(--s-2); margin-bottom: var(--s-4);
  max-width: var(--measure-read);
}
.zone-h h2 {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-28);
  text-transform: uppercase; letter-spacing: var(--track-caps); margin: 0; line-height: 1;
}
.zone-lede { font-size: var(--fs-16); color: var(--ink-dim); max-width: var(--measure-read); margin: 0 0 var(--s-4); }
.r-text { font-size: var(--fs-14); color: var(--ink); margin: 0; }

.foot a, .section-head a, .zone-h a {
  display: inline-flex; align-items: center; min-height: 24px;
}
.rung { min-height: 26px; padding-block: 2px; }

.faq-item { border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--panel); margin-bottom: var(--s-3); overflow: hidden; }
.faq-q { padding: var(--s-3) var(--s-4); cursor: pointer; font-weight: 600; display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); min-height: 24px; }
.faq-q::after { content: '+'; margin-left: auto; font-family: var(--font-mono); font-weight: 400; flex-shrink: 0; color: var(--ink-muted); }
.faq-q:hover { color: var(--flare); }
.faq-item.open .faq-q::after { content: '\2212'; }
.faq-q:focus-visible { outline: 2px solid var(--flare); outline-offset: 2px; }
.faq-a { max-height: 0; overflow: hidden; transition: max-height 0.3s ease, padding 0.3s ease; }
.faq-item.open .faq-a { max-height: 1200px; padding: 0 var(--s-4) var(--s-4); }
.faq-a p { margin: 0.5rem 0; line-height: 1.6; }

.info-box { border: 1px solid var(--line, #2a2a2e); border-radius: 10px; padding: 1.25rem; margin-top: 1.5rem; }
.info-box h3 { font-size: 0.95rem; margin-bottom: 0.5rem; }
.info-box p { line-height: 1.65; margin-bottom: 0.5rem; }
.info-box p:last-child { margin-bottom: 0; }
.info-box code { padding: 0.15rem 0.4rem; border-radius: 4px; }
.faq-section { margin-top: 3rem; padding-top: 2rem; border-top: 1px solid var(--line, #2a2a2e); }

.breadcrumb a { color: var(--ink-dim, #a8a199); text-decoration: none; }
.breadcrumb a:hover { color: var(--accent, #FFB020); text-decoration: underline; }
.breadcrumb a:focus-visible { outline: 2px solid var(--accent, #FFB020); outline-offset: 2px; }

.skip-link {
  position: absolute;
  top: -40px;
  left: 0;
  z-index: 100;
  padding: 8px 14px;
  background: var(--raised);
  color: var(--ink);
  border: 1px solid var(--flare);
  border-radius: 0 0 var(--btn-radius-sm, 8px) 0;
  font-size: 0.9rem;
  text-decoration: none;
  transition: top 0.2s;
}
.skip-link:focus { top: 0; }
.skip-link:focus-visible { outline: 2px solid var(--flare); outline-offset: 2px; }

.info-box a,
.faq-a a {
  color: var(--flare);
  text-decoration: underline;
  text-decoration-color: var(--flare-line);
  text-underline-offset: 2px;
}
.info-box a:hover,
.faq-a a:hover {
  color: var(--flare-soft);
  text-decoration-color: var(--flare-soft);
}

main p > a,
main li > a,

.precon-source-row a,
.breadcrumb a {
  text-decoration: underline;
  text-decoration-color: var(--flare-line);
  text-underline-offset: 2px;
}
main p > a:hover,
main li > a:hover,
.precon-source-row a:hover,
.breadcrumb a:hover {
  text-decoration-color: currentColor;
}

footer.foot { padding-bottom: 2rem; }

@media (max-width: 700px) {
  .zone-h { flex-wrap: wrap; row-gap: var(--s-1); }
  .zone-h > h2       { flex: 1 0 100%; }
  .zone-h > .eyebrow { flex: 1 0 100%; white-space: nowrap; }
}

.paste-label { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 var(--s-2); }
.paste-label > .req { white-space: nowrap; }

.stile-l { text-wrap: pretty; }

body { background: var(--ground); }

.shell { display: grid; grid-template-columns: var(--rail-w) minmax(0, 1fr); min-height: 100vh; }

.rail-nav {
  border-right: 1px solid var(--line);
  padding: var(--s-4) var(--s-3);
  display: flex; flex-direction: column; gap: var(--s-6);
  position: sticky; top: 0;

  overflow-y: scroll;
  scrollbar-gutter: stable;
  scrollbar-color: var(--flare) rgba(255, 255, 255, .07);
  scrollbar-width: thin;

  max-height: calc(100vh - var(--adhesion-h) - env(safe-area-inset-bottom, 0px));
}

.rail-nav::-webkit-scrollbar { width: 10px; }
.rail-nav::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, .07); border-radius: var(--r-pill);
}
.rail-nav::-webkit-scrollbar-thumb {
  background: var(--flare); border-radius: var(--r-pill);
  border: 2px solid transparent; background-clip: padding-box;
}
.rail-group { display: flex; flex-direction: column; gap: 2px; }
.rail-group > .eyebrow { padding: 0 var(--s-3) var(--s-2); }
.rail-nav .wordmark { padding: 0 var(--s-3) var(--s-2); font-size: var(--fs-22); }

.rail-link {
  display: flex; align-items: center; gap: var(--s-3);
  padding: 9px var(--s-3); border-radius: var(--r-md);
  text-decoration: none; color: var(--ink-dim);
  font-size: var(--fs-14); font-weight: 500;
  border-left: 2px solid transparent;
  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.rail-link:hover { background: var(--panel); color: var(--ink); }
.rail-link[aria-current="page"] { color: var(--ink); background: var(--panel); border-left-color: var(--flare); }
.rail-link svg { width: 15px; height: 15px; flex: none; opacity: 0.85; }

.rail-hub {
  margin-top: var(--s-2);
  padding-top: var(--s-3);
  border-top: 1px solid var(--line);
  border-radius: 0 0 var(--r-md) var(--r-md);
  color: var(--ink-muted);

}
.rail-hub:hover { color: var(--ink); }

.main { padding: 0 var(--s-6) var(--s-8); max-width: var(--measure); }

.topbar {
  display: flex; align-items: center; gap: var(--s-4);
  height: var(--nav-h); position: sticky; top: 0; z-index: 5;
  background: var(--ground); border-bottom: 1px solid var(--line);
  margin: 0 calc(var(--s-6) * -1) var(--s-5); padding: 0 var(--s-6);
}
.topbar .spacer { margin-left: auto; }

.hero { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); gap: var(--s-6); align-items: start; }
.hero h1 {
  font-family: var(--font-display); font-weight: 800;
  font-size: clamp(2.75rem, 5.4vw, 4.5rem); line-height: 0.9;
  letter-spacing: var(--track-tight); text-transform: uppercase;
  margin: 0 0 var(--s-4); color: var(--ink); text-wrap: balance;
}
.hero h1 .hl { color: var(--flare); }
.hero-sub { font-size: var(--fs-18); color: var(--ink-dim); max-width: 44ch; margin: 0 0 var(--s-5); }
.paste { display: flex; flex-direction: column; gap: var(--s-3); }
.paste-actions { display: flex; gap: var(--s-3); align-items: center; flex-wrap: wrap; }
.sources {
  font-size: var(--fs-12); color: var(--ink-muted);
  border-top: 1px solid var(--line); padding-top: var(--s-3); margin-top: var(--s-3);
}
.sources b { color: var(--ink-dim); font-weight: 600; }

.featured {
  border: 1px solid var(--line);
  border-top: 3px solid var(--rung, var(--line));
  border-radius: var(--r-lg); overflow: hidden; background: var(--panel);
}
.featured[data-b="1"] { --rung: var(--b1); } .featured[data-b="2"] { --rung: var(--b2); }
.featured[data-b="3"] { --rung: var(--b3); } .featured[data-b="4"] { --rung: var(--b4); }
.featured[data-b="5"] { --rung: var(--b5); }
.featured .deck-art { aspect-ratio: 626 / 300; }

.featured-body { padding: var(--s-4) var(--s-5) var(--s-5); display: flex; flex-direction: column; gap: var(--s-3); min-height: 208px; }
[hidden] { display: none !important; }
.featured-head { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--s-4); }
.featured-name {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-28);
  letter-spacing: var(--track-caps); text-transform: uppercase; line-height: 0.95; margin: 0;
}
.featured .verdict-num { font-size: var(--fs-48); }

.section { padding-top: var(--s-6); }
.section-head {
  display: flex; align-items: baseline; justify-content: space-between; gap: var(--s-4);
  border-bottom: 1px solid var(--line); padding-bottom: var(--s-2); margin-bottom: var(--s-4);
}
.section-head h1, .section-head h2 {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-28);
  letter-spacing: var(--track-caps); text-transform: uppercase; margin: 0; line-height: 1;
}
.section-head a { font-family: var(--font-mono); font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--flare); text-decoration: none; }
.section-head a:hover { text-decoration: underline; }

.wall { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: var(--s-3); }

.ladder-strip { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--s-3); }
.ladder-cell { border: 1px solid var(--line); border-top-width: 3px; border-radius: var(--r-md); padding: var(--s-4); background: var(--panel); }
.ladder-cell h3 { font-family: var(--font-display); font-weight: 800; font-size: var(--fs-22); text-transform: uppercase; letter-spacing: var(--track-caps); margin: 0 0 6px; line-height: 1; }
.ladder-cell p { margin: 0; font-size: var(--fs-12); color: var(--ink-dim); }
.lc-1 { border-top-color: var(--b1); } .lc-1 h3 { color: var(--b1); }
.lc-2 { border-top-color: var(--b2); } .lc-2 h3 { color: var(--b2); }
.lc-3 { border-top-color: var(--b3); } .lc-3 h3 { color: var(--b3); }
.lc-4 { border-top-color: var(--b4); } .lc-4 h3 { color: var(--b4); }
.lc-5 { border-top-color: var(--b5); } .lc-5 h3 { color: var(--b5); }

.rotator-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); padding: var(--s-3) var(--s-4) 0; }
.rotator-dots { display: flex; gap: 6px; align-items: center; }
.dot-btn {
  width: 24px; height: 24px; padding: 0; border: 0; background: transparent;
  cursor: pointer; display: grid; place-items: center;
}
.dot-btn::after {
  content: ""; width: 7px; height: 7px; border-radius: 50%;
  background: var(--line-strong);
  transition: background var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
}
.dot-btn:hover::after { background: var(--ink-dim); }
.dot-btn[aria-current="true"]::after { background: var(--flare); transform: scale(1.3); }

.rotator-toggle {
  width: 26px; height: 26px; padding: 0; border: 1px solid var(--line);
  border-radius: var(--r-md); background: transparent; color: var(--ink-muted);
  cursor: pointer; display: grid; place-items: center;
  transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
}
.rotator-toggle:hover { color: var(--ink); border-color: var(--line-strong); }
.rotator-toggle .ico-pause { display: block; }
.rotator-toggle .ico-play { display: none; }
.rotator-toggle[aria-pressed="true"] .ico-pause { display: none; }
.rotator-toggle[aria-pressed="true"] .ico-play { display: block; }

.dist { display: flex; flex-direction: column; gap: var(--s-2); padding: 0 var(--s-3); }
.dist-row { display: grid; grid-template-columns: 26px minmax(0, 1fr) 40px; align-items: center; gap: var(--s-2); }
.dist-key {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-14);
  letter-spacing: var(--track-caps); text-transform: uppercase; line-height: 1;
}
.dist-track { height: 10px; background: var(--panel); border-radius: var(--r-sm); overflow: hidden; }
.dist-fill { display: block; height: 100%; background: currentColor; border-radius: var(--r-sm); }
.dist-val { font-family: var(--font-mono); font-size: var(--fs-12); font-variant-numeric: tabular-nums; color: var(--ink-dim); text-align: right; }
.dist-row[data-b="1"] { color: var(--b1); } .dist-row[data-b="2"] { color: var(--b2); }
.dist-row[data-b="3"] { color: var(--b3); } .dist-row[data-b="4"] { color: var(--b4); }
.dist-row[data-b="5"] { color: var(--b5); }
.dist-note { font-size: 11px; line-height: 1.45; color: var(--ink-muted); border-top: 1px solid var(--line); padding-top: var(--s-2); margin: var(--s-1) 0 0; }

.ad-slot {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: var(--s-2);
  min-height: var(--slot-h, 280px);
  margin: var(--s-6) 0;
  contain: layout;
}

.ad-slot[data-format="billboard"] { --slot-h: 280px; }
.ad-slot[data-format="in-content"] { --slot-h: 300px; }
@media (max-width: 860px) { .ad-slot { --slot-h: 300px; } }

.tool-strip { display: none; }

@media (max-width: 860px) {
  .tool-strip {
    display: flex;
    gap: var(--s-1);
    position: sticky; top: 0; z-index: 20;
    background: var(--ground);
    border-bottom: 1px solid var(--line);
    margin: 0 calc(var(--s-4) * -1) var(--s-5);
    padding: 0 var(--s-4);
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .tool-strip::-webkit-scrollbar { display: none; }

  .tool-tab {
    display: flex; align-items: center; gap: 6px;
    flex: 1 0 auto; justify-content: center;
    min-height: 44px; padding: 0 10px;
    white-space: nowrap; text-decoration: none;
    color: var(--ink-muted);
    font-family: var(--font-mono); font-size: 11px;
    letter-spacing: var(--track-caps); text-transform: uppercase;
    border-bottom: 2px solid transparent;
    transition: color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease);
  }
  .tool-tab svg { width: 15px; height: 15px; flex: none; }
  .tool-tab:hover { color: var(--ink-dim); }
  .tool-tab[aria-current="page"] { color: var(--flare); border-bottom-color: var(--flare); }

  @media (max-width: 430px) {
    .tool-tab svg { display: none; }
    .tool-tab { padding: 0 8px; gap: 0; }
  }

  .topbar { position: static; margin-bottom: 0; }
}

:root { --adhesion-h: 90px; }
@media (max-width: 860px) { :root { --adhesion-h: 50px; } }

.foot { border-top: 1px solid var(--line); margin-top: var(--s-6); padding-top: var(--s-4); font-size: var(--fs-12); color: var(--ink-muted); display: flex; gap: var(--s-5); flex-wrap: wrap; justify-content: space-between; }
.foot a { color: var(--ink-dim); text-decoration: none; }
.foot a:hover { color: var(--ink); }

.foot-legal { flex-basis: 100%; order: 3; margin-top: var(--s-3); color: var(--ink-muted); font-size: var(--fs-11, var(--fs-12)); line-height: 1.5; }

.foot-links {
  display: inline-block;
  line-height: 1.9;
  text-align: right;
  color: var(--ink-muted);
}
@media (max-width: 720px) { .foot-links { text-align: left; } }

@media (max-width: 1080px) {
  .hero { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
  .ladder-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  .shell { grid-template-columns: minmax(0, 1fr); }
  .rail-nav { display: none; }
  .main { padding: 0 var(--s-4) var(--s-7); }
  .topbar { margin: 0 calc(var(--s-4) * -1) var(--s-5); padding: 0 var(--s-4); }
}
@media (max-width: 520px) {
  .ladder-strip { grid-template-columns: minmax(0, 1fr); }
  .wall { grid-template-columns: minmax(0, 1fr); }
}

.main { padding-bottom: calc(var(--s-5) + var(--adhesion-h) + env(safe-area-inset-bottom, 0px)); }

@media (max-width: 860px) {
  .topbar { flex-wrap: wrap; height: auto; min-height: var(--nav-h); row-gap: 2px; }
  .topbar .eyebrow { white-space: nowrap; }
}

html body {
  font-family: var(--font-sans);
  line-height: 1.5;
  background: var(--ground);
  color: var(--ink);
}

#results .ad-slot .eyebrow,
.ad-slot .eyebrow { display: none !important; }

.topbar-home { display: inline-flex; align-items: center; font-weight: 700;
  letter-spacing: .01em; color: var(--ink); text-decoration: none; margin-right: var(--s-3); }
.topbar-home .vault { color: var(--flare); }
.topbar-home:hover { color: var(--flare); }
@media (min-width: 861px) { .topbar-home { display: none; } }

.topbar { flex-wrap: nowrap; }
.topbar .eyebrow { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.topbar .nav-link { flex: 0 0 auto; }
.topbar-home { flex: 0 0 auto; }

:root {
  --accent-purple:        var(--flare);
  --accent-purple-hover:  var(--flare-soft);

  --card-bg:              var(--panel);
  --card-border:          var(--line);
  --nav-border:           var(--line);

  --shadow-md:            0 2px 8px rgba(0, 0, 0, .35);

  --text-primary:         var(--ink);
  --text-secondary:       var(--ink-dim);
  --text-muted:           var(--ink-dim);
}

:root {
  --gradient-purple: linear-gradient(135deg, var(--flare) 0%, var(--flare-soft) 100%);
  --gradient-gold:   linear-gradient(135deg, var(--flare) 0%, var(--flare-soft) 100%);
  --gradient-blue:   linear-gradient(135deg, var(--flare) 0%, var(--flare-soft) 100%);
  --gradient-navy:   linear-gradient(135deg, var(--flare) 0%, var(--flare-soft) 100%);
  --gradient-green:  linear-gradient(135deg, var(--moss-soft, #3F8560) 0%, var(--moss, #2F6B4F) 100%);
  --gradient-orange: linear-gradient(135deg, var(--flare-soft) 0%, var(--flare) 100%);
  --gradient-red:    linear-gradient(135deg, #E07A72 0%, #C0483F 100%);

  --accent:       var(--flare);
  --accent-hover: var(--flare-soft);
}

.page-header h1,
.page-body h2,
.page-body h3 {
  font-family: var(--font-display);
  letter-spacing: var(--track-tight);
}

html {
    --color-W: #F9FAF4;
    --color-U: #0E68AB;
    --color-B: #150B00;
    --color-R: #D3202A;
    --color-G: #00733E;
}
html { scroll-behavior: auto; }
footer { margin-top: 4rem; }
main { padding-bottom: 2rem; }
.footer-scryfall-link {; text-decoration: underline; }
.footer-scryfall-link:hover {; }
.mana-dot { width: 10px; height: 10px; }
.mana-dot-W {; }
.mana-dot-U {; }
.mana-dot-B {; border: 1px solid var(--line); }
.mana-dot-R {; }
.mana-dot-G {; }

.breadcrumb { padding: 1.25rem 0 0; font-size: 0.85rem;; }
.breadcrumb a {; }
.breadcrumb a:hover {; }
.breadcrumb span { margin: 0 0.4rem; }

.hero-section { padding: 2rem 0 2.5rem; text-align: center; }
.hero-section h1 { font-size: 2.5rem; margin-bottom: 0.5rem;;;;; }
.hero-section .subtitle {; font-size: 1.05rem; max-width: 640px; margin: 0 auto; }

.calc-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    align-items: start;
    isolation: isolate;
    overflow-anchor: none;
}
@media (min-width: 960px) {
    .calc-layout { grid-template-columns: 380px minmax(0, 1fr); }
}
@media (min-width: 1400px) {
    .calc-layout { grid-template-columns: 400px minmax(0, 1fr); }
}
@media (max-width: 960px) {
    .panel { max-width: 100%; overflow-x: hidden; }
}

.panel-collapse-bar { display: none; }
@media (min-width: 1400px) {
    .panel-collapse-bar {
        display: flex; align-items: center; gap: 0.5rem; cursor: pointer;
        padding: 0.4rem 0.5rem; margin: -1.5rem -1.5rem 1rem -1.5rem;
        border-bottom: 1px solid var(--card-border); border-radius: 12px 12px 0 0;; user-select: none;
    }
    .collapse-icon {
        font-size: 0.7rem;; display: inline-block;
        width: 1.2rem; text-align: center;
    }
    .collapse-label {
        font-size: 0.72rem; font-weight: 600;;
        text-transform: uppercase; letter-spacing: 0.05em;
    }
    .collapse-recalc {
        display: none; margin-left: auto;; border: 1px solid var(--card-border);; font-size: 1rem; border-radius: 6px;
        width: 28px; height: 28px; cursor: pointer; line-height: 1;
    }
    .collapse-recalc:hover {;; }
    .panel-collapse-bar:hover {; }

    .calc-layout.collapsed { grid-template-columns: 56px 1fr; }
    .calc-layout.collapsed #inputPanel {
        padding: 0; overflow: hidden; min-height: 200px;
    }
    .calc-layout.collapsed .panel-inner { display: none; }
    .calc-layout.collapsed .panel-collapse-bar {
        flex-direction: column; align-items: center; justify-content: flex-start;
        margin: 0; padding: 0.75rem 0; border-bottom: none; border-radius: 12px;
        height: 100%; gap: 0.75rem; min-height: 200px;
    }
    .calc-layout.collapsed .collapse-icon {
        font-size: 0.8rem; transform: rotate(180deg);
    }
    .calc-layout.collapsed .collapse-label {
        writing-mode: vertical-rl; text-orientation: mixed;
        font-size: 0.65rem; letter-spacing: 0.08em;
    }
    .calc-layout.collapsed .collapse-recalc {
        display: flex; align-items: center; justify-content: center;
        width: 32px; height: 32px; font-size: 1.1rem;
    }
}

.panel {; border: 1px solid var(--card-border); border-radius: 12px; padding: 1.5rem; }
#inputPanel {; }
#resultsPanel { overflow-anchor: none; }
.panel h2 { font-size: 1.3rem; margin-bottom: 1.25rem; display: flex; align-items: center; gap: 0.5rem; }
.panel h2 .icon { font-size: 1.2rem; }
.panel h3 { font-size: 1.1rem; margin-bottom: 0.85rem;; font-weight: 600; }

.format-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 110px), 1fr)); gap: 0.6rem; margin-bottom: 1.75rem; }
.format-btn { padding: 0.75rem 0.85rem;; border: 2px solid var(--line); border-radius: 12px; font-size: 0.95rem; font-weight: 700;; cursor: pointer; font-family: 'Space Grotesk', sans-serif; transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease; text-align: center; min-width: 0; }
.format-btn:hover {;;;; }
.format-btn.active {;;;; }
.format-btn .fmt-detail { display: block; font-size: 0.75rem;; margin-top: 4px; font-family: 'Inter', sans-serif; font-weight: 400; }
.format-btn.active .fmt-detail {; }
.budget-selector { margin-bottom: 1.25rem; }
.budget-selector label { font-size: 0.88rem;; margin-bottom: 0.5rem; display: block; font-weight: 600; }
.budget-btns { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.5rem; }
.budget-btn {
    padding: 0.55rem 0.5rem;;
    border: 2px solid var(--line);
    border-radius: 10px;
    font-size: 0.85rem;
    font-weight: 600;;
    cursor: pointer;
    font-family: 'Space Grotesk', sans-serif;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
    text-align: center;
}

.budget-btn:hover {;;;
}
.budget-btn.active {;;;;
}

.life-limit-selector { margin-bottom: 0.75rem; }
.life-limit-selector label { font-size: 0.8rem;; margin-bottom: 0.35rem; display: flex; align-items: center; }
.life-limit-row { display: flex; align-items: center; gap: 0.5rem; }
.life-limit-row input { width: 80px; padding: 0.4rem 0.5rem;; border: 1px solid var(--card-border); border-radius: 6px; font-size: 0.85rem;; font-family: inherit; box-sizing: border-box; }
.life-limit-row input:focus { outline: none;; }
.life-limit-row input::placeholder {; font-size: 0.8rem; }
.life-limit-hint { font-size: 0.72rem;; }

.mv-cap-selector { margin-bottom: 0.75rem; }
.mv-cap-selector label { font-size: 0.8rem;; margin-bottom: 0.35rem; display: flex; align-items: center; }
.mv-cap-row { display: flex; align-items: center; gap: 0.5rem; }
.mv-cap-row input { width: 80px; padding: 0.4rem 0.5rem;; border: 1px solid var(--card-border); border-radius: 6px; font-size: 0.85rem;; font-family: inherit; box-sizing: border-box; }
.mv-cap-row input:focus { outline: none;; }
.mv-cap-row input::placeholder {; font-size: 0.8rem; }
.mv-cap-hint { font-size: 0.72rem;; }

.fetch-option { margin-bottom: 1rem; }
.fetch-toggle { display: flex; align-items: center; gap: 0.5rem; font-size: 0.9rem; font-weight: 500;; cursor: pointer; padding: 0.5rem 0.65rem;; border: 1px solid var(--card-border); border-radius: 8px; }
.fetch-toggle input[type="checkbox"] {; cursor: pointer; width: 16px; height: 16px; }
.fetch-toggle:hover {;; }

.commander-input-panel { margin-bottom: 0.75rem; }
.commander-input-panel label { font-size: 0.8rem;; margin-bottom: 0.35rem; display: block; }
.commander-autocomplete-wrap { position: relative; }
.commander-autocomplete-wrap input { width: 100%; padding: 0.45rem 0.6rem;; border: 1px solid var(--card-border); border-radius: 6px; font-size: 0.85rem;; font-family: inherit; box-sizing: border-box; }
.commander-autocomplete-wrap input:focus { outline: none;; }
.commander-suggestions { position: absolute; top: 100%; left: 0; right: 0;; border: 1px solid var(--card-border); border-radius: 0 0 6px 6px; max-height: 180px; overflow-y: scroll; overflow-anchor: none; scrollbar-gutter: stable; z-index: 100; display: none;; }
.commander-suggestions.open { display: block; }
.commander-suggestion { padding: 0.4rem 0.6rem; font-size: 0.8rem;; cursor: pointer; display: flex; flex-direction: column; gap: 1px; }
.commander-suggestion:hover {;; }
.cmd-sug-name { font-weight: 500; }
.cmd-sug-type { font-size: 0.7rem; opacity: 0.6; }
.commander-info { margin-top: 0.35rem; font-size: 0.75rem;; min-height: 1.1em; }
.commander-partner-wrap { margin-top: 0.5rem; }
.commander-partner-wrap label { font-size: 0.8rem;; margin-bottom: 0.35rem; display: block; }
.bracket-toggle-wrap { margin-top: 0.6rem; }
.bracket-toggle-wrap > label { font-size: 0.8rem;; margin-bottom: 0.35rem; display: block; }
.bracket-toggle { display: flex; gap: 0; border: 1px solid var(--card-border); border-radius: 6px; overflow: hidden; }
.bracket-toggle button { flex: 1; padding: 0.35rem 0.5rem; font-size: 0.75rem; font-family: inherit;;; border: none; cursor: pointer; transition: background 0.15s, color 0.15s; }
.bracket-toggle button:not(:last-child) { border-right: 1px solid var(--card-border); }
.bracket-toggle button:hover {;; }
.bracket-toggle button.active {;; font-weight: 600; }
.option-hint { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; font-size: 0.65rem; font-weight: 700;; border: 1px solid var(--line); border-radius: 50%; cursor: help; flex-shrink: 0; position: relative; vertical-align: middle; margin-left: 4px; -webkit-tap-highlight-color: transparent; }
.option-hint:hover {;; }
.option-hint .option-tip { display: none; position: absolute; bottom: calc(100% + 8px); left: 50%; transform: translateX(-50%); width: 230px; padding: 0.6rem 0.75rem;; border: 1px solid var(--line); border-radius: 8px; font-size: 0.75rem; font-weight: 400; line-height: 1.5;; text-align: left; white-space: normal; z-index: 200; pointer-events: none;; }
.option-hint .option-tip::after { content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); border: 6px solid transparent;; }
.option-hint.active .option-tip { display: block; }
@media (hover: hover) { .option-hint:hover .option-tip { display: block; } }

.advanced-body .option-hint { position: static; }
.advanced-body .option-hint .option-tip { position: absolute; top: calc(100% + 4px); bottom: auto; left: 0; right: 0; width: auto; transform: none; }
.advanced-body .option-hint .option-tip::after { display: none; }
.life-limit-selector, .mv-cap-selector { position: relative; }

.fetch-option .option-hint .option-tip { left: auto; right: 0; transform: none; }
.fetch-option .option-hint .option-tip::after { left: auto; right: 10px; transform: none; }

.color-toggles { display: flex; gap: 1rem; margin-bottom: 1.75rem; justify-content: center; }
.color-toggle { width: 58px; height: 58px; border-radius: 50%; border: 3px solid transparent; cursor: pointer; font-weight: 700; font-size: 1.2rem; font-family: 'Space Grotesk', sans-serif; transition: opacity 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease; display: flex; align-items: center; justify-content: center; opacity: 0.35; position: relative; }
.color-toggle:hover { opacity: 0.75; transform: scale(1.12); }
.color-toggle.active { opacity: 1;; transform: scale(1.18);; }
.color-toggle[data-color="W"] {;; }
.color-toggle[data-color="U"] {;; }
.color-toggle[data-color="B"] {;; border: 3px solid var(--line); }
.color-toggle[data-color="B"].active {; }
.color-toggle[data-color="R"] {;; }
.color-toggle[data-color="G"] {;; }

.pip-hint { font-size: 0.78rem;; margin: -0.25rem 0 0.5rem; }
.pip-section { margin-bottom: 1.5rem; }
.pip-row { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0; border-bottom: 1px solid var(--line); }
.pip-row:last-child { border-bottom: none; }
.pip-color-dot { width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.7rem; font-weight: 700; flex-shrink: 0; }
.pip-label { flex: 1; font-size: 0.85rem;; }
.pip-controls { display: flex; align-items: center; gap: 0; }
.pip-btn { width: 32px; height: 32px;; border: 1px solid var(--card-border);; font-size: 1rem; font-weight: 600; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background 0.15s ease, border-color 0.15s ease; font-family: inherit; }
.pip-btn:hover {;; }
.pip-btn:active {; transform: scale(0.92); }
.pip-btn:first-child { border-radius: 6px 0 0 6px; }
.pip-btn:last-child { border-radius: 0 6px 6px 0; }
.pip-value { width: 52px; height: 32px;; border: 1px solid var(--card-border); border-left: none; border-right: none;; font-size: 0.9rem; font-weight: 600; text-align: center; font-family: inherit; cursor: text; }
.pip-value:hover {; }
.pip-value:focus { outline: none;; }

.size-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 1.5rem; }
.size-group label { display: block; font-size: 0.8rem;; margin-bottom: 0.35rem; }
.size-group input { width: 100%; padding: 0.5rem 0.75rem;; border: 1px solid var(--card-border); border-radius: 8px;; font-size: 1rem; font-weight: 600; font-family: inherit; text-align: center; }
.size-group input:focus { outline: none;;; }

.curve-section { margin-bottom: 1.5rem; }
.curve-inputs { display: grid; grid-template-columns: repeat(8, 1fr); gap: 0.4rem; }
.curve-col { text-align: center; }
.curve-col label { display: block; font-size: 0.7rem;; margin-bottom: 0.3rem; font-weight: 500; }
.curve-col input { width: 100%; padding: 0.4rem;; border: 1px solid var(--card-border); border-radius: 6px;; font-size: 0.85rem; font-weight: 600; text-align: center; font-family: inherit; }
.curve-col input:focus { outline: none;;; }
.curve-total { margin-top: 0.5rem; font-size: 0.8rem;; text-align: center; }
.curve-total strong {; }
@media (min-width: 1400px) {
    .curve-inputs { grid-template-columns: repeat(4, 1fr); gap: 0.35rem; }
}

.calc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    width: 100%;
    margin-top: 1rem;;;
    font-family: 'Space Grotesk', -apple-system, sans-serif;
    font-size: 0.95rem;
    font-weight: 600;
    border: none;
    border-radius: var(--btn-radius);
    padding: 0.85rem 1rem;
    cursor: pointer;
    transition: box-shadow 0.15s ease, opacity 0.15s ease;
    text-decoration: none;
    white-space: nowrap;
}
.calc-btn:hover {; }
.calc-btn:active {; }
.calc-btn:disabled { opacity: 0.5; cursor: not-allowed;; }

.results-empty { text-align: center; padding: 2.5rem 1.25rem;; }
.results-empty-headline { font-family: 'Space Grotesk', sans-serif; font-size: 1.15rem; font-weight: 600;; margin-bottom: 1rem; }
.preset-demo { margin-top: 2rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.preset-demo-label { font-size: 0.82rem; text-transform: uppercase; letter-spacing: 0.7px;; margin-bottom: 0.85rem; font-weight: 500; }
.preset-btns { display: flex; gap: 0.75rem; justify-content: center; flex-wrap: wrap; }
.preset-btn { padding: 0.7rem 1.4rem;; border: 2px solid var(--line); border-radius: 10px;; font-size: 0.9rem; font-weight: 700; font-family: 'Space Grotesk', sans-serif; cursor: pointer; transition: background 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease; }
.preset-btn:hover {;;;; }
.preset-btn:active { transform: scale(0.97); }

.land-counts { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 0.75rem; margin-bottom: 1.75rem; }
.land-card {; border: 1px solid var(--card-border); border-radius: 10px; padding: 1rem; text-align: center; transition: border-color 0.2s ease, box-shadow 0.2s ease; position: relative; overflow: clip; }
.land-card::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 3px; }
.land-card[data-color="W"]::before {; }
.land-card[data-color="U"]::before {; }
.land-card[data-color="B"]::before {; }
.land-card[data-color="R"]::before {; }
.land-card[data-color="G"]::before {; }
.land-card[data-color="C"]::before {; }
.land-card .land-count { font-family: 'Space Grotesk', sans-serif; font-size: 2.25rem; font-weight: 700; }
.land-card[data-color="W"] .land-count {; }
.land-card[data-color="U"] .land-count {; }
.land-card[data-color="B"] .land-count {; }
.land-card[data-color="R"] .land-count {; }
.land-card[data-color="G"] .land-count {; }
.land-card[data-color="C"] .land-count {; }
.land-card .land-label { font-size: 0.85rem;; margin-top: 0.25rem; }
.land-card .land-pct { font-size: 0.78rem;; margin-top: 0.15rem; }

.chart-section { margin-bottom: 1.75rem; }
.bar-chart { display: flex; align-items: flex-end; gap: 8px; height: 140px; padding: 0 0.5rem; }
.bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 0; }
.bar-fill { width: 100%; border-radius: 4px 4px 0 0; transition: height 0.4s ease; min-height: 0; }
.bar-fill[data-color="W"] {; opacity: 0.85; }
.bar-fill[data-color="U"] {; }
.bar-fill[data-color="B"] {; }
.bar-fill[data-color="R"] {; }
.bar-fill[data-color="G"] {; }
.bar-fill[data-color="C"] {; }
.bar-label { font-size: 0.7rem;; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.bar-count { font-size: 0.7rem;; font-weight: 600; }

.curve-chart { display: flex; align-items: flex-end; gap: 6px; height: 140px; padding: 0 0.25rem; margin-bottom: 0.5rem; }
.curve-chart .curve-col { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 3px; min-width: 0; max-width: 60px; }
.curve-stack { width: 100%; display: flex; flex-direction: column-reverse; border-radius: 3px 3px 0 0; overflow: clip; }
.curve-seg { width: 100%; min-height: 0; }
.curve-mv-label { font-size: 0.75rem;; }
.curve-count { font-size: 0.75rem;; font-weight: 600; }
.curve-chart-wrapper {; border: 1px solid var(--card-border); border-radius: 8px; padding: 0.85rem; margin-bottom: 1rem; }
.curve-chart-title { font-size: 0.82rem;; margin-bottom: 0.5rem; }

.whatif-section { margin-bottom: 1.75rem; }
.whatif-item { display: flex; gap: 0.5rem; align-items: flex-start; padding: 0.55rem 0.75rem; border-radius: 6px; margin-bottom: 0.35rem; font-size: 0.85rem;;; border: 1px solid var(--card-border); }
.whatif-icon { flex-shrink: 0; font-size: 0.9rem; line-height: 1.2; }
.whatif-text { flex: 1; line-height: 1.4; }
.whatif-text strong {; font-weight: 600; }
.whatif-add { border-left: 3px solid var(--line); }
.whatif-swap { border-left: 3px solid var(--line); }
.whatif-synergy { border-left: 3px solid var(--accent-purple); }
.whatif-warning { border-left: 3px solid var(--line); }

.deck-health { margin-bottom: 1.75rem; }
.deck-health h3 { margin-bottom: 0.5rem; }
.health-role { display: flex; align-items: center; gap: 0.5rem; padding: 0.45rem 0.6rem; margin-bottom: 0.3rem; border-radius: 6px; font-size: 0.85rem; }
.health-icon { flex-shrink: 0; width: 1.3rem; text-align: center; }
.health-label { width: 6rem;; }
.health-count { width: 2.25rem; text-align: right; font-weight: 600; }
.health-bar-wrap { flex: 1; height: 8px;; border-radius: 4px; overflow: hidden; position: relative; }
.health-bar { height: 100%; border-radius: 3px; }
.health-bar.good {; }
.health-bar.warn {; }
.health-bar.bad {; }
.health-benchmark { position: absolute; top: -1px; bottom: -1px; border-left: 2px solid var(--line); border-right: 2px solid var(--line);; }
.health-note { font-size: 0.78rem;; margin-top: 0.15rem; padding-left: 0.5rem; }

.theme-staples { margin-bottom: 1.75rem; }
.staple-item { display: flex; gap: 0.5rem; align-items: center; padding: 0.4rem 0.5rem; margin-bottom: 0.25rem; border-radius: 6px;; border: 1px solid var(--card-border); border-left: 3px solid var(--accent-purple); }
.staple-name { font-weight: 600;; }
.staple-role { font-size: 0.65rem; padding: 0.1rem 0.4rem; border-radius: 3px;;; }
.staple-reason { font-size: 0.72rem;; flex: 1; }

.prob-section { margin-bottom: 1.75rem; }
.prob-table-wrapper { overflow-x: auto; }
.prob-table { width: 100%; border-collapse: collapse; font-size: 0.88rem; }
.prob-table th { padding: 0.6rem 0.7rem; text-align: center; font-weight: 600;; border-bottom: 2px solid var(--card-border); white-space: nowrap;; }
.prob-table td { padding: 0.55rem 0.7rem; text-align: center; border-bottom: 1px solid var(--line);; font-variant-numeric: tabular-nums; }
.prob-table tr:hover td {; }
.prob-table .turn-col { font-weight: 600;; text-align: left; }
.prob-good {; }
.prob-ok {; }
.prob-bad {; }

.suggested-section { margin-bottom: 1.75rem; }
.suggest-card {; border: 1px solid var(--card-border); border-radius: 8px; padding: 1rem 1.15rem; margin-bottom: 0.6rem; }
.suggest-card h4 { font-size: 0.95rem; margin-bottom: 0.4rem;; }
.suggest-card p { font-size: 0.85rem;; line-height: 1.55; }
.suggest-card .suggest-lands { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.5rem; }
.suggest-land { display: inline-flex; align-items: center; gap: 0.35rem;; border: 1px solid var(--line); border-radius: 5px; padding: 0.25rem 0.6rem; font-size: 0.8rem;; }
.suggest-land .sl-count { font-weight: 700;; }

.info-box {; border: 1px solid var(--line); border-radius: 10px; padding: 1.35rem; margin-top: 1.5rem; }
.info-box h3 { font-size: 1.05rem; margin-bottom: 0.5rem;; display: flex; align-items: center; gap: 0.4rem; }
.info-box p { font-size: 0.88rem;; line-height: 1.65; margin-top: 0.5rem; }
.info-box p:first-of-type { margin-top: 0; }
.info-box a {; text-decoration: underline; }
.info-box a:hover {; }

.faq-section { margin-top: 2rem; }
.faq-section h2 { font-size: 1.4rem; margin-bottom: 1rem;; }
.faq-item {; border: 1px solid var(--card-border); border-radius: 10px; margin-bottom: 0.75rem; }
.faq-q { padding: 1rem 1.25rem; font-weight: 600; font-size: 0.95rem; cursor: pointer;; display: flex; justify-content: space-between; align-items: center; -webkit-user-select: none; user-select: none; }
.faq-q::after { content: '+'; font-size: 1.2rem;; flex-shrink: 0; margin-left: 1rem; }
.faq-item.open .faq-q::after { content: '\2212'; }
.faq-item.open .faq-q { border-bottom: 1px solid var(--card-border); }
.faq-a { display: none; }
.faq-item.open .faq-a { display: block; }
.faq-a p { padding: 1rem 1.25rem; font-size: 0.88rem;; line-height: 1.7; margin: 0; }

.dual-lands-toggle { padding:0.6rem 0;font-size:0.85rem;font-weight:600;cursor:pointer;;display:flex;align-items:center;gap:0.4rem;-webkit-user-select:none;user-select:none; }
.dual-lands-toggle::before { content:'\25B6';font-size:0.55rem;;transition:transform 0.2s ease; }
.dual-lands-body { display:none; }
.dual-lands-wrap.open .dual-lands-toggle::before { transform:rotate(90deg); }
.dual-lands-wrap.open .dual-lands-body { display:block; }

.pip-btn:focus-visible, .color-toggle:focus-visible, .calc-btn:focus-visible,
.format-btn:focus-visible, .budget-btn:focus-visible, .input-tab:focus-visible,
.optimizer-land-exclude:focus-visible, .faq-q:focus-visible,
.dual-lands-toggle:focus-visible { outline: none;; }

@media (max-width: 640px) {
    .hero-section { padding: 1rem 0 1rem; }
    .hero-section h1 { font-size: 1.5rem; margin-bottom: 0.25rem; }
    .hero-section .subtitle { font-size: 0.9rem; margin-bottom: 0; }
    .breadcrumb { padding-top: 0.5rem; }
    .panel h2 { font-size: 1.1rem; margin-bottom: 0.75rem; }
    .color-toggles { gap: 0.5rem; }
    .color-toggle { width: 50px; height: 50px; font-size: 1rem; }
    .pip-btn { width: 44px; height: 44px; }
    .pip-value { height: 44px; width: 52px; }
    .curve-col input, .size-group input, .import-textarea, .url-input-group input { font-size: 16px; }
    .url-input-group { flex-direction: column; }
    .btn-import { width: 100%; }
    .curve-inputs { grid-template-columns: repeat(4, 1fr); }
    .land-counts { grid-template-columns: repeat(2, 1fr); }

    .size-inputs { grid-template-columns: 1fr; }
}

.sim-engine-badge { display: inline-block; font-size: 0.7rem; font-weight: 700; padding: 1px 6px; border-radius: 3px; vertical-align: middle; letter-spacing: 0.5px; }
.sim-engine-wasm {;; }
.sim-engine-js {;; }

.ramp-banner-wrap { margin-bottom: 0.75rem; }
.ramp-banner { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.95rem; border-radius: 8px; font-size: 0.85rem; font-weight: 500;; border: 1px solid var(--line);; flex-wrap: wrap; }
.ramp-banner strong {; }
.ramp-adjust {; font-size: 0.78rem; }
.ramp-toggle {; border: none;; font-size: 0.78rem; font-weight: 600; cursor: pointer; padding: 0; text-decoration: underline; text-underline-offset: 2px; }
.ramp-toggle:hover {; }
.ramp-details-list { display: none; padding: 0.5rem 0.85rem 0.4rem;; border: 1px solid var(--line); border-top: none; border-radius: 0 0 8px 8px; }
.ramp-details-list.open { display: block; }
.ramp-group { margin-bottom: 0.35rem; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.25rem 0.5rem; }
.ramp-group:last-child { margin-bottom: 0; }
.ramp-group-label { font-size: 0.78rem; font-weight: 700;; min-width: 110px; }
.ramp-card { font-size: 0.8rem;;; padding: 0.2rem 0.5rem; border-radius: 4px; border: 1px solid var(--line); cursor: pointer; text-decoration: underline;; text-underline-offset: 2px; }
.ramp-card:hover {;;;; }
.ramp-banner-wrap .ramp-banner { border-radius: 8px 8px 8px 8px; }
.ramp-banner-wrap:has(.ramp-details-list.open) .ramp-banner { border-radius: 8px 8px 0 0; }
.land-count-hint { display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.95rem; border-radius: 8px; font-size: 0.85rem; margin-bottom: 0.75rem;; border: 1px solid var(--line);; flex-wrap: wrap; }
.land-count-hint strong {; }
.land-count-hint .hint-detail {; font-size: 0.78rem; }

.tempo-badge { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.95rem; border-radius: 8px; font-size: 0.85rem; font-weight: 500; margin-bottom: 0.5rem; }
.color-tempo-row { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1rem; }
.color-tempo-chip { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.3rem 0.7rem; border-radius: 6px; font-size: 0.8rem; border: 1px solid;; }
.color-tempo-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.color-tempo-label { font-weight: 600; text-transform: capitalize; }
.color-tempo-mv { opacity: 0.7; font-size: 0.68rem; }

.share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.3rem;;;
    border: 1.5px solid var(--btn-share-border);
    padding: 0.3rem 0.75rem;
    border-radius: 6px;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.75rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    white-space: nowrap;
}
.share-btn:hover {;;;
}
.share-copied {;; }
@keyframes share-pulse { 0%,100% {; } 50% {; } }
.share-nudge { animation: share-pulse 0.8s ease 2; }
.results-cta { margin: 0.75rem 0 1.5rem; padding: 0.75rem 1rem;; border: 1px solid var(--line); border-radius: 8px; font-size: 0.88rem;; }
.results-cta a {; text-decoration: none; font-weight: 500; }
.results-cta a:hover {; text-decoration: underline; }
.optimizer-heading { font-size: 1rem;; margin: 1rem 0 0.5rem; }
.optimizer-land-row { display: flex; align-items: center; gap: 0.6rem; padding: 0.45rem 0.6rem; border-bottom: 1px solid var(--line); font-size: 0.88rem; flex-wrap: wrap; }
.optimizer-land-row:last-child { border-bottom: none; }
.optimizer-land-qty { font-weight: 700;; min-width: 1.5em; text-align: right; font-family: 'Space Grotesk', sans-serif; font-size: 1rem; }
.optimizer-land-name { font-weight: 500;; flex-shrink: 0; }
.optimizer-land-tag { font-size: 0.72rem; font-weight: 600; padding: 2px 7px; border: 1px solid; border-radius: 4px; white-space: nowrap; flex-shrink: 0; }
.optimizer-land-reason { font-size: 0.75rem;; margin-left: auto; text-align: right; }
.optimizer-land-price { font-size: 0.8rem;; font-family: 'Space Grotesk', monospace; white-space: nowrap; opacity: 0; transition: opacity 0.3s; }
.optimizer-land-price.loaded { opacity: 1; }
.manabase-total-cost { margin-top: 0.75rem; padding: 0.6rem 0.85rem;; border-radius: 8px; font-size: 0.88rem; display: flex; justify-content: space-between; align-items: center; border: 1px solid var(--line); }
.manabase-total-cost .cost-label {; }
.manabase-total-cost .cost-value { font-weight: 700; font-family: 'Space Grotesk', monospace;; font-size: 1.05rem; }

.manabase-cart { grid-column: 1 / -1; margin-top: 0.85rem; padding: 0.9rem 1rem;; border: 1px solid var(--line); border-radius: 10px; }
#manabaseCartLive { grid-column: 1 / -1; }
.manabase-cart .mbcart-head { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; margin-bottom: 0.7rem; flex-wrap: wrap; }
.manabase-cart .mbcart-title { font-weight: 700;; font-size: 0.95rem; }
.manabase-cart .mbcart-total { font-family: 'Space Grotesk', monospace; font-weight: 700;; font-size: 1.05rem; white-space: nowrap; }
.manabase-cart .mbcart-all { display: flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; box-sizing: border-box; padding: 0.7rem 1rem;;; font-weight: 700; font-size: 0.95rem; text-decoration: none; border-radius: 8px; transition: background 0.15s, transform 0.05s; }
.manabase-cart .mbcart-all:hover {; }
.manabase-cart .mbcart-all:active { transform: translateY(1px); }
.manabase-cart .mbcart-details { margin-top: 0.65rem; }
.manabase-cart .mbcart-details summary { cursor: pointer;; font-size: 0.82rem; }
.manabase-cart .mbcart-list { list-style: none; margin: 0.5rem 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.manabase-cart .mbcart-item { display: flex; align-items: center; gap: 0.6rem; padding: 0.35rem 0.4rem; border-radius: 6px; font-size: 0.85rem; }
.manabase-cart .mbcart-item:nth-child(odd) {; }
.manabase-cart .mbcart-name { flex: 1 1 auto; min-width: 0;; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.manabase-cart .mbcart-price { flex: 0 0 auto; font-family: 'Space Grotesk', monospace;; font-size: 0.8rem; white-space: nowrap; }
.manabase-cart .mbcart-add { flex: 0 0 auto; padding: 0.2rem 0.6rem; border: 1px solid var(--line);; border-radius: 6px; font-size: 0.78rem; font-weight: 600; text-decoration: none; transition: background 0.15s; }
.manabase-cart .mbcart-add:hover {; }
.manabase-cart .mbcart-disc { margin-top: 0.6rem; font-size: 0.7rem;; line-height: 1.4; }
.basic-land-summary {
    padding: 0.5rem 0.6rem; margin-top: 0.5rem; margin-bottom: 0.25rem;
    font-size: 0.82rem;;; border-radius: 6px;
    border-left: 2px solid var(--line);
}
.basic-label { font-weight: 600;; margin-right: 0.4rem; }
.source-summary { margin-top: 1rem; }
.source-row { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.4rem; }
.source-label { font-size: 0.88rem; font-weight: 600; min-width: 3.5em; }
.source-bar-track { flex: 1; height: 10px;; border-radius: 5px; overflow: hidden; }
.source-bar-fill { height: 100%; border-radius: 5px; transition: width 0.3s ease; }
.source-count { font-size: 0.85rem; font-weight: 600; min-width: 3.5em; text-align: right; }
.source-met {; }
.source-short {; }
.source-chart { margin: 1rem 0; }
.source-chart-title { font-size: 0.88rem; font-weight: 600; margin-bottom: 0.5rem;; }
.sc-row { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.4rem; }
.sc-label { font-size: 0.88rem; font-weight: 600; min-width: 3.5em; text-align: right; }
.sc-track { flex: 1; height: 18px;; border-radius: 5px; position: relative; overflow: visible; }
.sc-bar { height: 100%; border-radius: 5px; transition: width 0.3s ease; }
.sc-target { position: absolute; top: -2px; bottom: -2px; width: 2px;; border-radius: 1px; }
.sc-count { font-size: 0.85rem; font-weight: 600; min-width: 5.5em; }
.sc-met {; }
.sc-short {; }
.sc-role-badge { font-size: 0.65rem; font-weight: 500; padding: 0.1em 0.35em; border-radius: 3px;;; vertical-align: middle; text-transform: uppercase; letter-spacing: 0.03em; }
.life-estimate { margin-top: 0.75rem; font-size: 0.85rem;; padding: 0.55rem 0.85rem;; border: 1px solid var(--line); border-radius: 6px; }
@media (max-width: 640px) {
    .optimizer-land-reason { margin-left: 0; width: 100%; padding-left: 2em; }
}
@media (min-width: 1400px) {
    .optimizer-land-row { gap: 0.85rem; }
    .optimizer-land-reason { font-size: 0.78rem; }
    .optimizer-land-name { font-size: 0.92rem; }
}

.card-preview { position: fixed; left: 0; top: 0; z-index: 9999; pointer-events: none; opacity: 0; transition: opacity 0.15s ease; }
.card-preview.visible { opacity: 1; }
.card-preview img { display: block; width: 240px; border-radius: 10px;; }
.card-preview-price { position: absolute; bottom: 0; left: 0; right: 0; text-align: center;;; font-family: 'Space Grotesk', monospace; font-size: 0.85rem; font-weight: 700; padding: 0.3rem 0; border-radius: 0 0 10px 10px; white-space: nowrap; border-top: 1px solid var(--line); visibility: hidden; }
.card-name-link { cursor: pointer; text-decoration: underline;; text-underline-offset: 2px; transition: text-decoration-color 0.15s; }
.card-name-link:hover {;; }
@media (max-width: 768px) { .card-preview img { width: 200px; } }

.detected-themes { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-bottom: 1rem; }
.theme-chip { display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.25rem 0.7rem; border-radius: 5px; font-size: 0.82rem; font-weight: 600;; border: 1px solid var(--line);; }
.theme-chip-icon { font-size: 0.8rem; line-height: 1; }

.has-tip { position: relative; cursor: help; border-bottom: 1px dotted var(--line); }
.has-tip::after { content: attr(data-tip); position: absolute; bottom: calc(100% + 6px); left: 50%; transform: translateX(-50%);;; font-size: 0.7rem; font-weight: 400; line-height: 1.4; padding: 0.4rem 0.6rem; border-radius: 6px; border: 1px solid var(--line); white-space: nowrap; max-width: 260px; white-space: normal; pointer-events: none; opacity: 0; z-index: 100;; transition: opacity 0.15s ease; }
.has-tip:hover::after { opacity: 1; }
@media (max-width: 640px) { .has-tip::after { left: 0; transform: none; max-width: 200px; } }

.onboard-steps { display: flex; gap: 1rem; margin-top: 1.5rem; justify-content: center; flex-wrap: wrap; }
.onboard-step { text-align: center; max-width: 140px; position: relative; }
.onboard-num { font-family: 'Space Grotesk', sans-serif; font-size: 1.25rem; font-weight: 700; width: 32px; height: 32px; line-height: 32px; margin: 0 auto 0.35rem; border-radius: 50%;;; }
.onboard-icon { font-size: 1.25rem; margin: 0.2rem 0; opacity: 0.4; }
.onboard-label { font-size: 0.78rem;; line-height: 1.4; }
.onboard-or { font-size: 0.75rem;; margin-top: 1rem; }

.source-donut-wrap { display: flex; align-items: center; gap: 1.25rem; margin: 0.75rem 0 1rem; }
.source-donut-svg { flex-shrink: 0; }
.source-donut-legend { display: flex; flex-direction: column; gap: 0.3rem; }
.source-donut-item { display: flex; align-items: center; gap: 0.4rem; font-size: 0.82rem;; }
.source-donut-swatch { width: 12px; height: 12px; border-radius: 3px; flex-shrink: 0; }
@media (max-width: 640px) { .source-donut-wrap { flex-direction: column; align-items: flex-start; } }

.export-preview {; border: 1px solid var(--card-border); border-radius: 6px; padding: 0.5rem 0.75rem; margin-top: 0.5rem; max-height: 200px; overflow-y: scroll; font-size: 0.72rem; font-family: 'Courier New', monospace;; line-height: 1.5; white-space: pre-wrap; display: none; }
.export-preview.visible { display: block; }

.quick-changes { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.75rem; }
.qc-pill { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.2rem 0.5rem; border-radius: 4px; font-size: 0.7rem; font-weight: 600; }
.qc-keep {;; }
.qc-upgrade {;; }
.qc-cut {;; }

.input-tabs {
    display: flex;
    gap: 0.25rem;
    margin: 0 0 1rem;
    padding: 0.25rem;;
    border: 1px solid var(--card-border);
    border-radius: 9px;
}
.input-tab {
    flex: 1 1 50%;
    padding: 0.6rem 0.75rem;;
    border: 1.5px solid var(--line);
    border-radius: 7px;;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.9rem;
    font-weight: 700;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
    text-align: center;
    -webkit-tap-highlight-color: transparent;
}
.input-tab .tab-hint {
    display: block;
    font-size: 0.72rem;
    font-weight: 400;;
    margin-top: 3px;
    font-family: 'Inter', sans-serif;
    letter-spacing: 0;
}
.input-tab:hover {;;;
}
.input-tab.active {;;;;
}
.input-tab.active .tab-hint {; }
.input-tab:focus-visible {
    outline: 2px solid var(--line);
    outline-offset: 2px;
}

#importPanel,
#pastePanel,
#urlPanel {
    visibility: hidden;
    height: 0;
    overflow: hidden;
    pointer-events: none;
}
#importPanel.active,
#pastePanel.active,
#urlPanel.active {
    visibility: visible;
    height: auto;
    overflow: visible;
    pointer-events: auto;
}
#manualPanel {
    visibility: hidden;
    height: 0;
    overflow: hidden;
    pointer-events: none;
}
#manualPanel.active {
    visibility: visible;
    height: auto;
    overflow: visible;
    pointer-events: auto;
}

.import-textarea {
    width: 100%;
    min-height: 200px;
    padding: 0.75rem;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, monospace;
    font-size: 0.85rem;
    line-height: 1.6;
    resize: vertical;
}

.import-desc {
    font-size: 0.8rem;;
    margin-bottom: 0.75rem;
    line-height: 1.5;
}

.url-import-section {
    margin-bottom: 0.75rem;
}
.url-import-section label {
    display: block;
    font-size: 0.78rem;;
    margin-bottom: 0.4rem;
}

.url-input-group {
    display: flex;
    gap: 0.5rem;
    align-items: stretch;
}
.url-input-group input { flex: 1; }

.btn-import {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;;;
    font-family: 'Space Grotesk', sans-serif;
    font-size: 0.85rem;
    font-weight: 700;
    border: 1.5px solid var(--line);
    border-radius: 8px;
    padding: 0.55rem 1rem;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
    white-space: nowrap;
}
.btn-import:hover {;;;;
}
.btn-import:disabled { opacity: 0.5; cursor: not-allowed; }
.import-divider {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 0.6rem 0;
}
.import-divider::before, .import-divider::after {
    content: '';
    flex: 1;
    height: 1px;;
}
.import-divider span {
    font-size: 0.7rem;;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.import-status {
    margin-top: 0.25rem;
    padding: 0.6rem 0.75rem;
    font-size: 0.82rem;;
    border-radius: 6px;
    display: none;
    line-height: 1.5;
}
.import-status.visible {
    display: block;
}
.import-status.info {;
    border: 1px solid var(--line);
}
.import-status.success {;
    border: 1px solid var(--line);;
}
.import-status.error {;
    border: 1px solid var(--line);;
}
.import-status.loading {;
    border: 1px solid var(--line);
}

.import-spinner {
    display: inline-block;
    width: 14px;
    height: 14px;
    border: 2px solid var(--line);;
    border-radius: 50%;
    animation: import-spin 0.6s linear infinite;
    vertical-align: middle;
    margin-right: 0.4rem;
}
@keyframes import-spin {
    to { transform: rotate(360deg); }
}

.import-notfound {
    margin-top: 0.5rem;
    padding: 0;
    list-style: none;
    font-size: 0.78rem;;
}
.import-notfound li {
    padding: 0.15rem 0;
}
.import-notfound li::before {
    content: '\2717 ';;
}

.sim-progress {;
    border: 1px solid var(--card-border);
    border-radius: 8px;
    height: 32px;
    position: relative;
    overflow: hidden;
    margin: 1rem 0;
}
.sim-progress-bar {
    height: 100%;;
    border-radius: 8px;
    transition: width 0.3s;
    opacity: 0.8;
}
.sim-progress-text {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;;
}

.sim-summary {
    font-size: 0.8rem;;
    margin-bottom: 0.75rem;
}

.sim-tipping-point {
    margin: 0.4rem 0 0.9rem;
    padding: 0.65rem 0.9rem;
    border-radius: 6px;;
    border: 1px solid var(--line);
    font-size: 0.85rem;
    line-height: 1.45;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0.4rem 0.6rem;
}
.sim-tipping-point.tp-fast {;; }
.sim-tipping-point.tp-mid  {;; }
.sim-tipping-point.tp-slow {;; }
.sim-tipping-point .tp-icon { font-size: 1.1rem; }
.sim-tipping-point .tp-headline { font-size: 0.95rem;; }
.sim-tipping-point .tp-headline strong {; font-size: 1.05rem; }
.sim-tipping-point.tp-fast .tp-headline strong {; }
.sim-tipping-point.tp-mid  .tp-headline strong {; }
.sim-tipping-point.tp-slow .tp-headline strong {; }
.sim-tipping-point .tp-detail {; font-size: 0.78rem; }
.sim-tipping-point .tp-detail-distrib { display: inline-flex; flex-wrap: wrap; align-items: baseline; gap: 0.15rem 0.45rem; font-variant-numeric: tabular-nums; }
.sim-tipping-point .tp-pct { display: inline-flex; align-items: baseline; gap: 0.2rem; }
.sim-tipping-point .tp-pct .tp-pct-k {; font-size: 0.7rem; font-weight: 500; letter-spacing: 0.02em; }
.sim-tipping-point .tp-pct strong {; font-size: 0.85rem; font-weight: 600; }
.sim-tipping-point.tp-fast .tp-pct strong {; }
.sim-tipping-point.tp-mid  .tp-pct strong {; }
.sim-tipping-point.tp-slow .tp-pct strong {; }
.sim-tipping-point .tp-pct-sep {; font-size: 0.7rem; opacity: 0.7; }
.sim-tipping-point .tp-pct-target {; font-size: 0.7rem; margin-left: 0.4rem; padding-left: 0.5rem; border-left: 1px solid var(--line); font-style: italic; }
.sim-tipping-point .tp-source { margin-left: auto; font-size: 0.7rem;; text-transform: uppercase; letter-spacing: 0.04em; }

.cast-mana {
    font-family: monospace;
    font-size: 0.75rem;;
}
.cost-edit-btn {
    display: inline-block;
    cursor: pointer;
    opacity: 0.3;
    font-size: 0.65rem;
    margin-left: 0.25rem;
    vertical-align: middle;
    transition: opacity 0.15s;
}
.cost-edit-btn:hover { opacity: 0.8; }
.cost-edit-inline {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
}
.cost-edit-inline input {
    width: 80px;
    padding: 0.15rem 0.3rem;
    font-family: monospace;
    font-size: 0.75rem;;
    border: 1px solid var(--line);
    border-radius: 4px;;
}
.cost-edit-inline input:focus { outline: none;; }
.cost-edit-inline button {
    padding: 0.1rem 0.4rem;
    font-size: 0.7rem;
    cursor: pointer;
    border-radius: 4px;
    border: 1px solid var(--card-border);;;
    font-family: inherit;
}
.cost-edit-inline button.cancel-btn {;;
}
.sim-fallback-notice {
    font-size: 0.78rem;;;
    border: 1px solid var(--line);
    border-radius: 6px;
    padding: 0.5rem 0.75rem;
    margin-bottom: 0.75rem;
}

.land-filter-panel {;
    border: 1px solid var(--card-border);
    border-radius: 10px;
    margin-bottom: 1.25rem;
}
.land-filter-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.65rem 0.85rem;
    cursor: pointer;
    font-family: 'Space Grotesk', -apple-system, sans-serif;
    font-size: 0.85rem;
    font-weight: 600;;
    transition: color 0.2s ease;
    list-style: none;
}
.land-filter-toggle::after {
    content: '\25B6';
    font-size: 0.6rem;
    transition: transform 0.2s ease;;
}
.land-filter-panel.open .land-filter-toggle::after {
    transform: rotate(90deg);
}
.land-filter-toggle:hover {;
}

.land-filter-count {
    font-size: 0.72rem;
    font-weight: 600;;;
    border: 1px solid var(--line);
    border-radius: 10px;
    padding: 0.1rem 0.45rem;
    margin-left: 0.5rem;
    display: none;
}
.land-filter-count.visible {
    display: inline-block;
}
.land-filter-count.pin-count {;;;
}

.land-filter-body {
    display: none;
    padding: 0 0.85rem 0.75rem;
}
.land-filter-panel.open .land-filter-body {
    display: block;
}

.land-filter-search {
    width: 100%;
    padding: 0.4rem 0.6rem;;
    border: 1px solid var(--card-border);
    border-radius: 6px;;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 0.8rem;
    margin-bottom: 0.5rem;
    transition: border-color 0.2s ease;
}
.land-filter-search::placeholder {;
}
.land-filter-search:focus {
    outline: none;;;
}

.land-filter-actions {
    display: flex;
    gap: 0.5rem;
    margin-bottom: 0.5rem;
}
.land-filter-action-btn {
    flex: 1;
    padding: 0.25rem 0.5rem;
    font-size: 0.72rem;
    font-weight: 600;
    font-family: 'Space Grotesk', -apple-system, sans-serif;;;
    border: 1px solid var(--card-border);
    border-radius: 5px;
    cursor: pointer;
    transition: border-color 0.15s ease, color 0.15s ease;
}
.land-filter-action-btn:hover {;;
}

.land-filter-list {
    max-height: 220px;
    overflow-y: scroll;
    scrollbar-gutter: stable;
    overflow-anchor: none;
    border: 1px solid var(--card-border);
    border-radius: 6px;;
}
.land-filter-list::-webkit-scrollbar { width: 4px; }
.land-filter-list::-webkit-scrollbar-track {; }
.land-filter-list::-webkit-scrollbar-thumb {; border-radius: 2px; }

.land-filter-flex-heading {
    font-size: 0.72rem;
    font-weight: 600;;
    margin-top: 0.6rem;
    margin-bottom: 0.35rem;
    font-family: 'Space Grotesk', -apple-system, sans-serif;
}

.land-filter-item {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.3rem 0.5rem;
    font-size: 0.78rem;;
    border-bottom: 1px solid var(--line);
    cursor: pointer;
}
.land-filter-item:last-child { border-bottom: none; }
.land-filter-item:hover {;
}
.land-filter-item input[type="checkbox"] {;
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    cursor: pointer;
}
.land-filter-item-name {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.land-filter-tier {
    font-size: 0.62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    padding: 0.08rem 0.35rem;
    border-radius: 4px;
    flex-shrink: 0;
}
.land-filter-tier.budget {;;
    border: 1px solid var(--line);
}
.land-filter-tier.mid {;;
    border: 1px solid var(--line);
}
.land-filter-tier.premium {;;
    border: 1px solid var(--line);
}

.land-filter-tier.casual {;;
    border: 1px solid var(--line);
}
.land-filter-tier.optimized {;;
    border: 1px solid var(--line);
}

.optimizer-land-row {
    position: relative;
}
.optimizer-land-exclude {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1px solid var(--line);;;
    font-size: 0.7rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s ease, background 0.15s ease;
    padding: 0;
    margin-left: auto;
    flex-shrink: 0;
}
.optimizer-land-row:hover .optimizer-land-exclude {
    opacity: 1;
}
.optimizer-land-exclude:hover {;;
}

.excluded-lands-section {
    margin-top: 0.75rem;
    padding: 0.5rem 0.65rem;;
    border: 1px solid var(--line);
    border-radius: 8px;
}
.excluded-lands-heading {
    font-size: 0.72rem;
    font-weight: 600;;
    margin-bottom: 0.35rem;
    font-family: 'Space Grotesk', -apple-system, sans-serif;
}
.excluded-land-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
}
.excluded-land-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.7rem;;;
    border: 1px solid var(--card-border);
    border-radius: 12px;
    padding: 0.15rem 0.5rem;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.excluded-land-chip:hover {;;;
}
.excluded-land-chip::before {
    content: '+';
    font-weight: 700;
    font-size: 0.75rem;
}

.optimizer-land-pin {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1px solid var(--line);;;
    font-size: 0.6rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0.4;
    transition: opacity 0.15s ease, background 0.15s ease;
    padding: 0;
    flex-shrink: 0;
}
.optimizer-land-row:hover .optimizer-land-pin {
    opacity: 1;
}
.optimizer-land-pin.pinned {
    opacity: 1;;;
}
.optimizer-land-pin:hover {;;
}

.optimizer-land-row.pinned {
    border-left: 2px solid var(--line);
    padding-left: calc(0.5rem - 2px);
}

.optimizer-land-tag.pinned-tag {;;
    font-size: 0.6rem;
}

.pinned-summary {
    font-size: 0.75rem;;
    padding: 0.35rem 0.5rem;
    margin: 0.5rem 0;;
    border: 1px solid var(--line);
    border-radius: 6px;
}

.pinned-summary {
    cursor: pointer;
}
.pinned-summary:hover {;;
}
.pinned-summary-link {
    font-size: 0.65rem;;
    margin-left: 0.5rem;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.pinned-summary:hover .pinned-summary-link {;
}

.auto-pin-notice {
    font-size: 0.7rem;;;
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 0.35rem 0.5rem;
    margin-bottom: 0.4rem;
    transition: opacity 0.5s ease;
}
.auto-pin-notice.fade-out {
    opacity: 0;
}

.pin-toast {
    position: fixed;
    bottom: 1.5rem;
    left: 0;
    right: 0;
    text-align: center;
    pointer-events: none;
    z-index: 9999;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.pin-toast > span {
    display: inline-block;;;
    border: 1px solid var(--line);
    padding: 0.5rem 1rem;
    border-radius: 8px;
    font-size: 0.8rem;
    font-family: 'Space Grotesk', -apple-system, sans-serif;
}
.pin-toast.visible {
    opacity: 1;
}

.included-land-chips.flash-highlight {
    animation: chipFlash 1.5s ease;
}
@keyframes chipFlash {
    0% {; }
    15% {; }
    100% {; }
}

.included-lands-section {
    margin-top: 0.75rem;
    padding: 0.5rem 0.65rem;;
    border: 1px solid var(--line);
    border-radius: 8px;
}
.included-lands-heading {
    font-size: 0.72rem;
    font-weight: 600;;
    margin-bottom: 0.15rem;
    font-family: 'Space Grotesk', -apple-system, sans-serif;
}
.included-lands-desc {
    font-size: 0.68rem;;
    margin: 0 0 0.4rem;
    line-height: 1.35;
}
.included-count {
    font-size: 0.65rem;;
    border-radius: 8px;
    padding: 0.05rem 0.35rem;
    margin-left: 0.25rem;
}
.included-land-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.3rem;
    margin-bottom: 0.4rem;
}
.included-land-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.7rem;;;
    border: 1px solid var(--line);
    border-radius: 12px;
    padding: 0.15rem 0.5rem;
    cursor: pointer;
    transition: color 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.included-land-chip:hover {;;;
}
.included-land-chip::after {
    content: '\00d7';
    font-weight: 700;
    font-size: 0.75rem;
    margin-left: 0.15rem;
}
.included-land-chip.imported {
    border-style: dashed;
}
.included-land-chip.unpin-all {;;;
    font-size: 0.65rem;
}
.included-land-chip.unpin-all::after {
    content: '';
}
.included-land-chip.unpin-all:hover {;;;
}

.pin-input-row {
    display: flex;
    gap: 0.35rem;
    margin-top: 0.25rem;
}
.pin-land-input {
    flex: 1;
    padding: 0.3rem 0.5rem;;
    border: 1px solid var(--card-border);
    border-radius: 6px;;
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-size: 0.75rem;
}
.pin-land-input::placeholder {;
}
.pin-land-input:focus {
    outline: none;;;
}
.pin-land-btn {
    padding: 0.3rem 0.6rem;
    font-size: 0.72rem;
    font-weight: 600;
    font-family: 'Space Grotesk', -apple-system, sans-serif;;;
    border: 1px solid var(--line);
    border-radius: 6px;
    cursor: pointer;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.pin-land-btn:hover {;;
}

.pin-autocomplete {
    position: absolute;
    left: 0;
    right: 0;
    top: 100%;
    z-index: 50;;
    border: 1px solid var(--line);
    border-radius: 6px;
    margin-top: 2px;
    max-height: 280px;
    overflow-y: scroll;
    scrollbar-gutter: stable;
    overflow-anchor: none;;
}
.pin-ac-item {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.6rem;
    font-size: 0.78rem;;
    cursor: pointer;
    border-bottom: 1px solid var(--line);
}
.pin-ac-item:last-child { border-bottom: none; }
.pin-ac-item:hover, .pin-ac-item.highlighted {;;
}
.pin-ac-item.pinned {
    opacity: 0.4;
    cursor: default;
}
.pin-ac-name {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.pin-ac-name strong {;
    font-weight: 700;
}
.pin-ac-tag {
    font-size: 0.6rem;
    font-weight: 600;;;
    border: 1px solid var(--line);
    border-radius: 4px;
    padding: 0.05rem 0.3rem;
    flex-shrink: 0;
    white-space: nowrap;
}
.pin-ac-pinned {
    font-size: 0.58rem;
    font-weight: 700;;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    flex-shrink: 0;
}
.pin-ac-empty {
    padding: 0.5rem 0.6rem;
    font-size: 0.72rem;;
    font-style: italic;
}

.pin-warning {
    margin-top: 0.5rem;
    padding: 0.4rem 0.6rem;;
    border: 1px solid var(--line);
    border-radius: 6px;;
    font-size: 0.72rem;
    line-height: 1.4;
}

.deck-warning {
    margin: 1rem 0;
    padding: 0.75rem 1rem;;
    border: 1px solid var(--line);
    border-left: 3px solid var(--line);
    border-radius: 6px;;
    font-size: 0.85rem;
    line-height: 1.5;
}
.deck-warning strong {; }
.deck-warning em {; font-style: italic; }

.deck-info {
    margin: 1rem 0;
    padding: 0.75rem 1rem;;
    border: 1px solid var(--line);
    border-left: 3px solid var(--line);
    border-radius: 6px;;
    font-size: 0.85rem;
    line-height: 1.5;
}
.deck-info strong {; }
.deck-info em {; font-style: italic; }

.modifier-source-table {
    width: 100%;
    margin: 0.5rem 0 0.25rem 0;
    border-collapse: collapse;
    font-size: 0.8rem;
}
.modifier-source-table th,
.modifier-source-table td {
    padding: 0.25rem 0.5rem;
    text-align: left;
    border-bottom: 1px solid var(--line);
}
.modifier-source-table th {;
    font-weight: 500;
    font-size: 0.72rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}
.modifier-source-table .mod-up {; font-weight: 600; }
.modifier-source-table .mod-down {; font-weight: 600; }
.modifier-source-table .modifier-expected { font-variant-numeric: tabular-nums; }
.modifier-prob {
    margin-top: 0.4rem;
    font-size: 0.72rem;;
    font-style: italic;
}

.modifier-narrative {
    margin-top: 0.25rem;
    font-size: 0.78rem;;
}

.synergy-callouts {
    margin: 1rem 0;
    padding: 0.75rem 1rem;;
    border: 1px solid var(--line);
    border-left: 3px solid var(--line);
    border-radius: 6px;;
    font-size: 0.85rem;
    line-height: 1.5;
}
.synergy-callouts-heading {
    font-weight: 600;;
    margin-bottom: 0.4rem;
    font-size: 0.85rem;
}
.synergy-callout {
    margin: 0.4rem 0;
    padding: 0.4rem 0.6rem;;
    border-radius: 4px;
}
.synergy-pair {
    font-weight: 600;;
    font-size: 0.82rem;
    margin-bottom: 0.15rem;
}
.synergy-arrow {; margin-right: 0.2rem; }
.synergy-effect {;
    font-size: 0.78rem;
    line-height: 1.4;
}

@media (max-width: 479px) {
    .modifier-source-table { font-size: 0.72rem; }
    .modifier-source-table th,
    .modifier-source-table td { padding: 0.2rem 0.3rem; }
}

.ramp-card-note {;
    font-size: 0.72rem;
    font-weight: 400;
}

@media (hover: none) {
    .optimizer-land-exclude {
        opacity: 0.7;
    }
    .optimizer-land-pin {
        opacity: 0.7;
    }
    .optimizer-land-pin.pinned {
        opacity: 1;
    }
}

.report-card { display:grid; grid-template-columns:repeat(3,1fr); gap:0.85rem; margin-bottom:1.75rem; padding:1.15rem;; border:1px solid var(--card-border); border-radius:10px; }
.report-card-metric { text-align:center; padding:0.85rem 0.6rem; border-radius:8px;; }
.report-card-value { font-family:'Space Grotesk',sans-serif; font-size:2.25rem; font-weight:700; line-height:1.2; }
.report-card-value.placeholder {; opacity:0.4; }
.report-card-label { font-size:0.82rem;; margin-top:0.25rem; }
.report-card-sub { font-size:0.72rem;; margin-top:0.15rem; }

.report-card-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:0.75rem; padding-bottom:0.75rem; border-bottom:1px solid var(--line); grid-column:1/-1; }
.report-card-title { font-size:0.95rem; font-weight:600;; }
.report-card-grade { font-family:'Space Grotesk',sans-serif; font-size:1.75rem; font-weight:700; padding:0.3rem 0.85rem; border-radius:6px; border:1px solid transparent; line-height:1; }
.report-card-grade.placeholder { opacity:0.3;; }

.report-card-delta { font-size:0.68rem; margin-top:0.15rem; opacity:0.7; }
.report-card-delta.positive {; }

.report-card-desc { font-size:0.8rem;; text-align:center; margin-top:0.5rem; padding-top:0.5rem; border-top:1px solid var(--line); grid-column:1/-1; }

.tempo-breakdown { display:flex; justify-content:center; gap:1rem; margin-top:0.5rem; padding-top:0.5rem; border-top:1px solid var(--line); }
.tempo-turn { text-align:center; font-size:0.82rem; }
.tempo-turn-label {; font-size:0.72rem; }
.tempo-turn-value { font-weight:700; font-family:'Space Grotesk',sans-serif; font-size:0.95rem; }

.cast-rate-badge { font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:1rem; }

.tap-delta { font-weight:700; font-family:'Space Grotesk',sans-serif; }

@media (max-width:640px) {
    .report-card { grid-template-columns:1fr; gap:0.5rem; padding:0.75rem; }
    .report-card-value { font-size:1.5rem; }
    .report-card-grade { font-size:1.2rem; }
    .tempo-breakdown { flex-wrap:wrap; gap:0.5rem; }
}

.budget-detail {
    font-size: 0.68rem;
    opacity: 0.8;
    font-weight: 400;
}

.results-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.5rem;
    padding-bottom: 1rem;
    margin-bottom: 0.5rem;
    border-bottom: 1px solid var(--line);
}
.results-header h2 { margin: 0; }

.info-box h2 {
    font-size: 1.1rem;
    margin-bottom: 0.75rem;
}

.seo-footer-text {
    max-width: 900px;
    margin: 1.5rem auto 0;
    padding: 0 1rem;;
    font-size: 0.82rem;
    line-height: 1.6;
}
.seo-footer-text a {; }

#importPanel .calc-btn, #pastePanel .calc-btn { margin-top: 0.75rem; }

.input-section {
    padding-bottom: 1.15rem;
    margin-bottom: 1.15rem;
    border-bottom: 1px solid var(--line);
}

.advanced-section {
    margin-bottom: 1rem;
}
.advanced-toggle {
    display: flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0;
    cursor: pointer;
    font-size: 0.8rem;
    font-weight: 600;;
    transition: color 0.2s ease;
    user-select: none;
}
.advanced-toggle::after {
    content: '\25B6';
    font-size: 0.5rem;
    transition: transform 0.2s ease;
    margin-left: auto;
}
.advanced-section.open .advanced-toggle::after {
    transform: rotate(90deg);
}
.advanced-toggle:hover {;
}
.advanced-body {
    display: none;
    padding-top: 0.35rem;
}
.advanced-section.open .advanced-body {
    display: block;
}

.cfg-badge {
    margin-left: auto;
    font-size: 0.72rem;
    font-weight: 600;;;
    border: 1px solid var(--line);
    border-radius: 999px;
    padding: 0.1rem 0.55rem;
    white-space: nowrap;
}

.req-mark {; font-weight: 700; }
.commander-req-hint { font-size: 0.72rem;; margin: 0.3rem 0 0; }
input.input-invalid {;;
}

@media (max-width: 960px) {
    #calcBtn {
        position: sticky;
        bottom: 0.75rem;
        z-index: 10;;
    }
}

.format-btn.active {;;;
}

.info-box + .info-box {
    margin-top: 1.5rem;
}

.section-subtitle { font-size: 0.72rem;; margin: 0.25rem 0 0.5rem; }
.section-subtitle-lg { font-size: 0.75rem;; margin: -0.5rem 0 0.75rem; }
.section-subtitle-narrow { font-size: 0.75rem;; margin: -0.5rem 0 0.5rem; }

.tag-basic {;; }
.tag-imported {;; }
.tag-utility-purple {;; }

.text-error {; }
.text-success {; }
.text-warn {; }
.text-accent-blue {; }

.untapped-indicator { font-size: 0.7rem; opacity: 0.85; }

.effective-basics-row { opacity: 0.6; font-size: 0.8rem; padding-left: 0.5rem; }
.effective-basics-text { font-size: 0.75rem; }
.optimizer-total-row { text-align: right; padding: 0.5rem 0.75rem 0.25rem; font-size: 0.85rem;; border-top: 1px solid var(--line); margin-top: 0.25rem; }

.optimizer-header-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 0.5rem; }
.optimizer-header-row h3 { margin: 0; }
.export-btn-sm { font-size: 0.78rem; padding: 0.35rem 0.7rem; }
.export-preview-btn { font-size: 0.72rem; padding: 0.35rem 0.6rem; opacity: 0.7; }

.import-success-banner { padding: 0.5rem 0.75rem; margin-bottom: 1rem; border-radius: 6px; font-size: 0.8rem;; border: 1px solid var(--line);; }

.results-error { padding: 1.5rem;; font-size: 0.85rem; }
.results-error-hint {; font-size: 0.75rem; }
.results-error-sm {; font-size: 0.8rem; }
.results-empty {; font-size: 0.85rem; text-align: center; padding: 1rem 0; }

.mono-subsection { margin-top: 0.75rem; }
.mono-subsection h5 { font-size: 0.8rem;; margin-bottom: 0.5rem; }

.suggest-pair-heading { display: flex; align-items: center; gap: 0.5rem; }
.suggest-lands-col { flex-direction: column; gap: 0.3rem; }
.suggest-land-between { justify-content: space-between; width: 100%; }
.suggest-land-desc {; font-size: 0.65rem; }
.suggest-conditional-note {; font-size: 0.6rem; margin-top: 0.3rem; }
.tier-label { font-size: 0.65rem; font-weight: 600; }
.pip-dot-lg { width: 20px; height: 20px; font-size: 0.55rem; }

.explore-link-wrap { text-align: center; padding: 1rem 0 0.5rem; }
.explore-link { display: inline-flex; align-items: center; gap: 0.4rem;; font-size: 0.85rem; font-weight: 500; border-bottom: 1px dashed var(--line); }

.ramp-banner-cost {; }
.ramp-banner-cost strong {; }
.ramp-banner-effect {; }
.ramp-banner-effect strong {; }
.ramp-banner-fixer {; }
.ramp-banner-fixer strong {; }

.hint-detail { padding-left: 0.15rem; }
.hint-sources-label {; }
.hint-opacity { opacity: 0.7; }

.sim-note {; font-size: 0.72rem; margin-top: 0.5rem; padding: 0 0.5rem; }

.detected-label { font-size: 0.72rem;; margin-right: 0.25rem; }

.cost-sublabel { font-size: 0.65rem; opacity: 0.6; font-weight: 400; }

.muted-opacity { opacity: 0.6; }
.tag-sm { font-size: 0.65rem; }

.prob-table th.th-left, .prob-table td.td-left { text-align: left; }
.prob-table th.th-right, .prob-table td.td-right { text-align: right; }

.life-limit-note {; font-size: 0.75rem; }

.optimizer-intro { font-size: 0.72rem;; margin: 1rem 0 0.25rem; }

.tempo-explain { font-size: 0.72rem;; margin: 0.25rem 0 0.5rem; }

.budget-label { font-size: 0.72rem; }

.also-suggested {; font-size: 0.65rem; }

.mismatch-expected {; font-size: 0.75rem; }

.floor-note {; }

.synergy-note {; }

@media (min-width: 960px) {
    #resultsPanel { padding: 1.75rem; }
    #resultsPanel h2 { font-size: 1.4rem; }
    #resultsPanel h3 { font-size: 1.2rem; }
    .land-counts { grid-template-columns: repeat(auto-fill, minmax(155px, 1fr)); gap: 0.85rem; }
    .land-card { padding: 1.15rem; }
    .land-card .land-count { font-size: 2.5rem; }
    .curve-chart { height: 160px; gap: 8px; }
    .curve-chart .curve-col { max-width: 72px; }
    .source-bar-track { height: 12px; }
    .sc-track { height: 22px; border-radius: 6px; }
    .sc-bar { border-radius: 6px; }
    .health-bar-wrap { height: 10px; }
    .prob-table { font-size: 0.92rem; }
    .prob-table th { padding: 0.65rem 0.8rem; }
    .prob-table td { padding: 0.6rem 0.8rem; }
    .report-card { gap: 1rem; padding: 1.35rem; }
    .report-card-metric { padding: 1rem 0.75rem; }
    .report-card-value { font-size: 2.5rem; }
    .report-card-grade { font-size: 2rem; padding: 0.35rem 1rem; }
    .source-donut-wrap { gap: 1.5rem; }
}

@media (min-width: 1400px) {
    #resultsPanel { padding: 2rem; }
    #resultsPanel h2 { font-size: 1.5rem; }
    #resultsPanel h3 { font-size: 1.3rem; }
    .land-counts { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); gap: 1rem; }
    .land-card { padding: 1.25rem; border-radius: 12px; }
    .land-card .land-count { font-size: 2.75rem; }
    .land-card .land-label { font-size: 0.9rem; }
    .land-card .land-pct { font-size: 0.82rem; }
    .curve-chart { height: 180px; }
    .source-bar-track { height: 14px; border-radius: 7px; }
    .source-bar-fill { border-radius: 7px; }
    .sc-track { height: 24px; }
    .health-bar-wrap { height: 12px; border-radius: 6px; }
    .health-bar { border-radius: 6px; }
    .prob-table { font-size: 0.95rem; }
    .prob-table th { padding: 0.75rem 0.9rem; }
    .prob-table td { padding: 0.65rem 0.9rem; }
    .report-card-value { font-size: 2.75rem; }
    .report-card-grade { font-size: 2.25rem; }
    .suggest-card { padding: 1.15rem 1.3rem; border-radius: 10px; }
    .suggest-card h4 { font-size: 1.05rem; }
    .suggest-card p { font-size: 0.92rem; }
    .suggest-land { font-size: 0.85rem; padding: 0.3rem 0.65rem; }
    .info-box { padding: 1.5rem; }
    .info-box h3 { font-size: 1.15rem; }
    .info-box p { font-size: 0.92rem; }
    .ramp-banner { font-size: 0.9rem; padding: 0.55rem 1rem; }
    .land-count-hint { font-size: 0.88rem; padding: 0.55rem 1rem; }
    .optimizer-land-row { font-size: 0.92rem; padding: 0.5rem 0.75rem; }
    .optimizer-land-qty { font-size: 1.1rem; }
    .optimizer-land-tag { font-size: 0.75rem; }
    .optimizer-heading { font-size: 1.1rem; }
    .source-donut-wrap { gap: 1.75rem; margin: 1rem 0 1.25rem; }
    .source-donut-item { font-size: 0.88rem; }
    .source-donut-swatch { width: 14px; height: 14px; }
}

.land-db-error {
    display: none;
    padding: 1.5rem;;
    border: 1px solid var(--line);
    border-radius: 8px;
    margin-bottom: 1rem;;
    text-align: center;
}
.land-db-error.is-visible { display: block; }
.land-db-error-hint {; font-size: 0.9rem; }

.paste-row { display: flex; align-items: center; gap: 0.75rem; margin: 0.5rem 0; flex-wrap: wrap; }
.paste-btn { padding: 0.5rem 1rem; font-size: 0.85rem; }
.paste-hint { font-size: 0.78rem;; }
.restore-chip { display: inline-block; margin: 0.5rem 0 0.25rem 0; padding: 0.4rem 0.9rem;; border: 1px solid var(--line); border-radius: 999px;; font-size: 0.8rem; font-weight: 500; cursor: pointer; transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease; font-family: inherit; }
.restore-chip:hover {;;; }
.restore-chip[hidden] { display: none; }

.deeplink-banner { margin: 0.75rem 0; padding: 0.65rem 0.95rem; border-radius: 6px; font-size: 0.85rem; line-height: 1.45; }
.deeplink-banner.is-success {; border-left: 3px solid var(--line);; }
.deeplink-banner.is-error {; border-left: 3px solid var(--line);; }
@media (max-width: 500px) {
    .deeplink-banner { font-size: 0.78rem; padding: 0.55rem 0.7rem; }

    .sim-tipping-point .tp-source { width: 100%; margin-left: 0; padding-top: 0.2rem; }
    .sim-tipping-point .tp-pct-target { display: block; margin-left: 0; padding-left: 0; border-left: 0; padding-top: 0.15rem; }
}

.seo-footer-text a {; text-decoration: underline;; text-underline-offset: 2px; }
.seo-footer-text a:hover {;; }

body.mb-island.mb-active #resultsContent{display:none}body.mb-island:not(.mb-active) .calc-layout{grid-template-columns:1fr}body.mb-island:not(.mb-active) #inputPanel{max-width:640px;width:100%;margin-left:auto;margin-right:auto}body.mb-island:not(.mb-active) #resultsPanel{display:none}body.mb-island:not(.mb-active) #collapseBar{display:none}body.mb-island.mb-active .calc-layout{grid-template-columns:1fr}body.mb-island.mb-active:not(.mb-input-open) #inputPanel{display:none}body.mb-island.mb-active.mb-input-open #inputPanel{display:block}body.mb-island.mb-active.mb-input-open .mb-new-deck{display:none}body.mb-island.mb-active #main-content>.container{max-width:min(1500px,95vw)}body.mb-island.mb-active #faqSection,body.mb-island.mb-active .info-box{display:none}body.mb-island.mb-active .mb-bento .acc{grid-column:span 6}body.mb-island.mb-active .mb-bento .acc+.acc{margin-top:0}@media(max-width:860px){body.mb-island.mb-active .mb-bento .acc{grid-column:1 / -1}}.mb-report-bar{display:flex;justify-content:flex-end;margin:0 0 .6rem}.mb-new-deck{display:inline-flex;align-items:center;gap:.4rem;font-size:.85rem;font-weight:600;line-height:1;;;border:1px solid var(--line);border-radius:10px;padding:.5rem .95rem;cursor:pointer;transition:background .15s ease}.mb-tips{margin:.4rem 0 0;padding-left:1.1rem;;font-size:.88rem;line-height:1.5}.mb-tips li{margin:.25rem 0}#mbReport.mb-report{margin:0 0 1.1rem}.mbv{border:1px solid var(--border, var(--line));border-left:4px solid var(--mbv-col, var(--line));;border-radius:12px;padding:1rem 1.25rem}.mbv-top{display:flex;align-items:center;gap:1rem}.mbv-grade{font-family:Georgia,Times New Roman,serif;font-size:2.6rem;font-weight:800;line-height:1;min-width:2.2ch;text-align:center;padding:.3rem .55rem;border-radius:10px;border:1px solid;transition:opacity .25s ease}.mbv-grade.pending{opacity:.45}.mbv-grade.revealed{opacity:1}.mbv-head{display:flex;flex-direction:column;gap:.15rem}.mbv-title{font-family:Georgia,Times New Roman,serif;font-size:1.3rem;font-weight:700;}.mbv-desc{font-size:.88rem;}.mbv-facts{display:flex;flex-wrap:wrap;gap:.5rem .95rem;margin-top:.8rem;font-size:.85rem;}.mbv-fact b{;font-weight:700}@media(max-width:560px){.mbv-grade{font-size:2.1rem}.mbv-title{font-size:1.15rem}}.rr-bento{--gap: 18px;--card-glow: rgba(212, 175, 55, .22);--serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;--g-purple: linear-gradient(135deg, #a855f7, #6366f1);--g-green: linear-gradient(135deg, #10b981, #14b8a6);display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap);margin:var(--gap) 0}.rr-bento .span3{grid-column:span 3}.rr-bento .span4{grid-column:span 4}.rr-bento .span6{grid-column:span 6}.rr-bento .span8{grid-column:span 8}.rr-bento .span12{grid-column:1 / -1}.rr-bento .tile{;border:1px solid var(--card-border);border-radius:14px;padding:18px 20px;position:relative;;overflow:hidden}.rr-bento .tile:after{content:"";position:absolute;inset:0 0 auto;height:1px;}.rr-bento .tile h3{font-size:.92rem;font-weight:600;display:flex;align-items:center;gap:8px;margin-bottom:13px;}.rr-bento .tile h3 .ic{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;font-size:.8rem;;border:1px solid var(--line);flex:none}.rr-bento .clickthru{margin-left:auto;font-size:.68rem;;font-weight:500}.rr-bento .stats-strip{grid-column:1 / -1;display:grid;grid-template-columns:repeat(6,1fr);gap:11px;padding:14px 16px}.rr-bento .stat-card{;border:1px solid var(--line);border-radius:11px;padding:12px 6px;text-align:center}.rr-bento .stat-card .sv{font-family:var(--serif);font-size:1.5rem;font-weight:600;;line-height:1}.rr-bento .stat-card .sl{font-size:.58rem;letter-spacing:.05em;text-transform:uppercase;;margin-top:6px}.rr-bento .pip-row{display:grid;grid-template-columns:18px 1fr 64px;align-items:center;gap:10px;margin-bottom:9px}.rr-bento .pip{width:18px;height:18px;border-radius:50%;border:1px solid var(--line)}.rr-bento .pip-row .track{height:8px;border-radius:6px;;overflow:hidden}.rr-bento .pip-row .track i{display:block;height:100%;border-radius:6px;}.rr-bento .pip-val{font-size:.74rem;;text-align:right}.rr-bento .curve{display:flex;align-items:flex-end;gap:9px;height:128px;margin:8px 2px 2px}.rr-bento .curve .cc{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;justify-content:flex-end;height:100%}.rr-bento .curve .cc .b{width:100%;border-radius:5px 5px 0 0;;min-height:3px;opacity:.85}.rr-bento .curve .cc .cv{font-size:.66rem;;font-weight:600}.rr-bento .curve .cc .cl{font-size:.62rem;}.rr-bento .tune-note{margin-top:10px;font-size:.74rem;}.mb-themes{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:0 0 1rem}.mb-themes-label{font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;;font-weight:700}.mb-theme-chip{font-size:.74rem;padding:3px 10px;border-radius:999px;;border:1px solid var(--line);}.rr-bento .mb-ramp{font-size:.86rem;;line-height:1.5}.rr-bento .mb-effect{font-size:.82rem;;padding:4px 0}.rr-bento .mb-effect+.mb-effect{border-top:1px solid var(--line)}.rr-bento .mb-effect-delta{font-size:.76rem;;margin-top:7px}.rr-bento .mb-synergy{padding:6px 0}.rr-bento .mb-synergy+.mb-synergy{border-top:1px solid var(--line)}.rr-bento .mb-syn-pair{font-size:.84rem;;font-weight:600}.rr-bento .mb-syn-effect{font-size:.78rem;;margin-top:2px}.rr-bento .mb-whatif{font-size:.82rem;;padding:7px 10px;margin-bottom:6px;border-radius:8px;border-left:3px solid var(--card-border);;line-height:1.45}.rr-bento .mb-whatif:last-child{margin-bottom:0}.rr-bento .mb-whatif b,.rr-bento .mb-whatif strong{;font-weight:600}.rr-bento .mb-whatif .card-name-link{;cursor:pointer}.rr-bento .mb-tap-delta{;font-weight:600;white-space:nowrap}.rr-bento .mb-staple{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;padding:6px 0}.rr-bento .mb-staple+.mb-staple{border-top:1px solid var(--line)}.rr-bento .mb-staple-name{font-size:.84rem;;font-weight:600}.rr-bento .mb-staple-role{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;}.rr-bento .mb-staple-reason{font-size:.78rem;;flex:1 1 100%}.mb-mods{display:flex;flex-direction:column;gap:10px;margin:0 0 1rem}.mb-mod{border-radius:12px;padding:12px 16px;border:1px solid;font-size:.84rem}.mb-mod-hostile,.mb-mod-destroy{;}.mb-mod-info{;}.mb-mod-head{;line-height:1.45}.mb-mod-table{width:100%;border-collapse:collapse;margin:9px 0 7px;font-size:.78rem}.mb-mod-table th{text-align:left;;font-weight:600;padding:3px 8px;border-bottom:1px solid var(--line)}.mb-mod-table td{padding:3px 8px;border-bottom:1px solid var(--line);}.mb-mod-table .pip{display:inline-block;width:11px;height:11px;border-radius:50%;vertical-align:middle;margin-right:3px;border:1px solid var(--line)}.mb-mod-prob{font-size:.74rem;}.rr-bento .acc{grid-column:1 / -1;border:1px solid var(--card-border);border-radius:14px;;overflow:hidden;}.rr-bento .acc+.acc{margin-top:-4px}.rr-bento .acc>summary{list-style:none;cursor:pointer;padding:16px 20px;display:flex;align-items:center;gap:13px;user-select:none;transition:background .15s}.rr-bento .acc>summary::-webkit-details-marker{display:none}.rr-bento .acc .chev{;display:flex;transition:transform .2s;flex:none}.rr-bento .acc .chev svg{width:17px;height:17px}.rr-bento .acc[open] .chev{transform:rotate(180deg)}.rr-bento .acc .asum-ic{width:26px;height:26px;border-radius:8px;display:grid;place-items:center;;border:1px solid var(--line);font-size:.85rem;flex:none}.rr-bento .acc .asum-t{font-family:var(--serif);font-size:1.02rem;}.rr-bento .acc .asum-d{font-size:.73rem;;margin-left:auto;text-align:right}.rr-bento .acc[open]>summary{border-bottom:1px solid var(--line);}.rr-bento .acc-body{padding:18px 20px 20px;display:grid;grid-template-columns:repeat(12,1fr);gap:var(--gap)}.rr-bento .acc-body .tile{;;}.rr-bento .acc-body .tile:after{display:none}.rr-bento .mb-tip{margin-bottom:12px;font-size:.82rem;}.rr-bento .mb-tip-dist,.rr-bento .mb-tempo-turns{margin:0 0 10px;font-size:.8rem;}.rr-bento .mb-tip-dist b,.rr-bento .mb-tempo-turns b{;font-weight:700}.rr-bento .mb-yourbase{overflow:hidden}.rr-bento .mb-yourbase .suggested-section{margin-top:0}.rr-bento .mb-prob{width:100%;border-collapse:collapse;font-size:.8rem}.rr-bento .mb-prob td{padding:4px 8px;border-bottom:1px solid var(--line)}.rr-bento .mb-prob .mb-mv{;text-align:center;width:3ch}.rr-bento .mb-prob .mb-cr{text-align:right;width:5ch}.rr-bento .cast-badge{display:inline-block;min-width:3.6ch;text-align:center;padding:1px 6px;border-radius:5px;font-weight:600;font-size:.74rem}.rr-bento .cast-good{;}.rr-bento .cast-ok{;}.rr-bento .cast-bad{;}.rr-bento .mb-landlist{display:flex;flex-direction:column;gap:4px;font-size:.82rem}.rr-bento .mb-landlist .ll-row{display:flex;gap:8px;padding:3px 0;border-bottom:1px solid var(--line);}.rr-bento .mb-landlist .ll-q{;font-weight:600;min-width:2.5ch}@media(max-width:860px){.rr-bento{grid-template-columns:repeat(6,1fr)}.rr-bento .span6,.rr-bento .span8{grid-column:1 / -1}.rr-bento .stats-strip{grid-template-columns:repeat(3,1fr)}}

.calc-layout { display: grid; grid-template-columns: 380px minmax(0, 1fr); gap: var(--s-5); align-items: start; isolation: isolate; }

.calc-col-in {
  position: sticky; top: calc(var(--nav-h) + var(--s-3));
  max-height: calc(100vh - var(--nav-h) - var(--s-5));
  overflow-y: scroll; scrollbar-gutter: stable; overflow-anchor: none;
  padding-right: 2px;
}
@media (max-width: 960px) {
  .calc-col-in { position: static; max-height: none; overflow-y: visible; }
}
@media (max-width: 960px) { .calc-layout { grid-template-columns: minmax(0, 1fr); } }

.panel {
  border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--panel); padding: var(--s-4);

}
.panel + .panel { margin-top: var(--s-4); }
.panel-h {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-18);
  text-transform: uppercase; letter-spacing: var(--track-caps);
  margin: 0 0 var(--s-3); line-height: 1; color: var(--ink);
}

.sub,
.section-subtitle,
.section-subtitle-lg { font-size: var(--fs-12); color: var(--ink-muted); margin: 0 0 var(--s-3); }

.f { display: flex; flex-direction: column; gap: 5px; margin-bottom: var(--s-3); }
.f > label { font-family: var(--font-mono); font-size: 10px; letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--ink-muted); }
.f input, .f select, .f textarea {
  width: 100%; padding: 9px 10px; background: var(--ground);
  border: 1px solid var(--line-strong); border-radius: var(--r-md);
  color: var(--ink); font-family: var(--font-sans); font-size: var(--fs-14);
}
.f textarea { font-family: var(--font-mono); font-size: var(--fs-12); resize: vertical; }
.f input:focus, .f select:focus, .f textarea:focus {
  outline: none; border-color: var(--flare-line); box-shadow: 0 0 0 2px var(--flare-tint);
}
.f-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.hint { font-size: 10.5px; color: var(--ink-muted); }

.seg { display: flex; gap: 4px; flex-wrap: wrap; }
.seg button {
  flex: 1 0 auto; min-width: 0; padding: 7px 10px;
  background: var(--ground); border: 1px solid var(--line-strong);
  border-radius: var(--r-md); color: var(--ink-dim); cursor: pointer;
  font-family: var(--font-mono); font-size: var(--fs-12);
  transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.seg button[aria-pressed="true"] { border-color: var(--flare); color: var(--flare); background: var(--flare-tint); }

.pip-toggles { display: flex; gap: 5px; }
.pip-t {
  width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid var(--line-strong); background: var(--ground); color: var(--ink-dim);
  font-family: var(--font-mono); font-size: var(--fs-14); cursor: pointer;
  display: grid; place-items: center;
  transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.pip-t[aria-pressed="true"] { border-color: var(--flare); color: var(--flare); background: var(--flare-tint); }

.curve-in { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 4px; }
.curve-in label { font-family: var(--font-mono); font-size: 9.5px; color: var(--ink-muted); text-align: center; display: block; margin-bottom: 3px; }
.curve-in input { padding: 6px 2px; text-align: center; font-family: var(--font-mono); font-size: var(--fs-12); }

.land-list {
  max-height: 220px; overflow-y: scroll; scrollbar-gutter: stable;
  overflow-anchor: none;
  border: 1px solid var(--line); border-radius: var(--r-md);
  background: var(--ground); padding: var(--s-2);
}
.land-row { display: flex; align-items: center; gap: var(--s-2); padding: 4px 6px; border-radius: var(--r-sm); font-size: var(--fs-12); color: var(--ink-dim); }
.land-row:hover { background: var(--raised); }
.land-row input { accent-color: var(--flare); }
.land-row .qty { margin-left: auto; font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); }

.grade-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--s-4); align-items: center; }
.grade-badge {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-64);
  line-height: 0.82; letter-spacing: var(--track-tight);
  padding: var(--s-3) var(--s-4); border: 1px solid currentColor;
  border-radius: var(--r-lg); background: var(--panel);
}
.grade-desc { font-size: var(--fs-16); color: var(--ink); margin: 0; }
.grade-sub { font-family: var(--font-mono); font-size: var(--fs-12); color: var(--ink-muted); margin-top: 4px; }

.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: var(--s-3); }
.tile { border: 1px solid var(--line); border-radius: var(--r-md); background: var(--panel); padding: var(--s-3); display: flex; flex-direction: column; gap: 2px; }
.tile-k { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--ink-muted); }
.tile-v { font-family: var(--font-mono); font-weight: 500; font-size: var(--fs-28); color: var(--ink); line-height: 1.15; font-variant-numeric: tabular-nums; }
.tile-n { font-size: 11px; color: var(--ink-muted); margin-top: 2px; }

.src { display: grid; grid-template-columns: 26px minmax(0, 1fr) 78px; gap: var(--s-3); align-items: center; padding: 5px 0; }
.src-c { font-family: var(--font-mono); font-size: var(--fs-14); font-weight: 500; }
.src-track { height: 10px; background: var(--ground); border-radius: var(--r-sm); position: relative; overflow: hidden; }
.src-fill { display: block; height: 100%; border-radius: var(--r-sm); }
.src-target { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--ink-dim); }
.src-n { font-family: var(--font-mono); font-size: 11px; color: var(--ink-dim); text-align: right; font-variant-numeric: tabular-nums; }
.src-W .src-fill { display: block; background: #D9D2C0; } .src-U .src-fill { display: block; background: #5A8FC7; }
.src-B .src-fill { display: block; background: #9A8FA6; } .src-R .src-fill { display: block; background: #D06A54; }
.src-G .src-fill { display: block; background: #5FA46A; } .src-C .src-fill { display: block; background: var(--ink-muted); }

.cast { display: grid; grid-template-columns: minmax(0, 1fr) 28px 52px; gap: var(--s-3); align-items: center; padding: 4px 0; border-bottom: 1px solid var(--line); font-size: var(--fs-12); }
.cast:last-child { border-bottom: 0; }

.cast-name { color: var(--ink-dim); overflow-wrap: anywhere; line-height: 1.3; }
.cast-mv { font-family: var(--font-mono); font-size: 11px; color: var(--ink-muted); text-align: center; }
.cast-r { font-family: var(--font-mono); font-size: 11px; text-align: right; font-variant-numeric: tabular-nums; }
.cast-good { color: var(--b1); } .cast-ok { color: var(--b3); } .cast-bad { color: var(--b5-ink); }

.lands-out { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 4px; }
.land-out { display: flex; align-items: center; gap: var(--s-2); padding: 5px 8px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--panel); font-size: var(--fs-12); }
.land-out .n { font-family: var(--font-mono); color: var(--flare); font-size: 11px; }

.land-out .t { color: var(--ink-dim); overflow-wrap: anywhere; }
.etb { font-family: var(--font-mono); font-size: 9px; letter-spacing: .04em; text-transform: uppercase; margin-left: auto; padding: 1px 5px; border-radius: var(--r-sm); border: 1px solid var(--line); color: var(--ink-muted); }
.etb-untapped { color: var(--b1); border-color: rgba(78,158,114,.4); }
.etb-conditional, .etb-choice { color: var(--b3); border-color: rgba(224,169,58,.4); }

.acc-d { border: 1px solid var(--line); border-radius: var(--r-lg); background: var(--panel); overflow: hidden; }
.acc-d + .acc-d { margin-top: var(--s-3); }
.acc-d > .acc-h {
  width: 100%; text-align: left; background: none; border: 0; cursor: pointer;
  padding: var(--s-3) var(--s-4); display: flex; align-items: center; gap: var(--s-3);
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-18);
  text-transform: uppercase; letter-spacing: var(--track-caps); color: var(--ink);
  transition: color var(--dur-fast) var(--ease);
}
.acc-d > .acc-h:hover { color: var(--flare); }
.acc-d > .acc-h::after { content: "+"; margin-left: auto; font-family: var(--font-mono); font-weight: 400; color: var(--ink-muted); }
.acc-d.open > .acc-h::after { content: "\2212"; }
.acc-d > .acc-c { display: none; padding: 0 var(--s-4) var(--s-4); }
.acc-d.open > .acc-c { display: block; }
.acc-sum { font-family: var(--font-mono); font-size: var(--fs-12); color: var(--ink-muted); font-weight: 400; letter-spacing: 0; text-transform: none; }

.callout { border-left: 2px solid var(--flare); background: var(--ground); padding: var(--s-3); border-radius: 0 var(--r-md) var(--r-md) 0; font-size: var(--fs-12); color: var(--ink-dim); }
.callout + .callout { margin-top: var(--s-2); }
.callout strong { color: var(--ink); }

.staple { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--s-3); align-items: center; padding: 6px 0; border-bottom: 1px solid var(--line); font-size: var(--fs-12); }
.staple:last-child { border-bottom: 0; }
.role { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--ink-muted); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 1px 6px; }

.tile-v.over { color: var(--b4); }
.tile-v.under { color: var(--b3); }

.acc-c [style*="#555" i],
.acc-c [style*="#150B00" i] { color: var(--mana-b) !important; }
.acc-c [style*="#00733E" i],
.acc-c [style*="#00733e" i] { color: var(--mana-g) !important; }
.acc-c [style*="#0E68AB" i],
.acc-c [style*="#0e68ab" i] { color: var(--mana-u) !important; }
.acc-c [style*="#D3202A" i],
.acc-c [style*="#d3202a" i] { color: var(--mana-r) !important; }
.acc-c [style*="#F9FAF4" i],
.acc-c [style*="#f9faf4" i] { color: var(--mana-w) !important; }

.source-row, .sc-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); padding: 4px 0; font-size: var(--fs-12); }
.source-label, .sc-label { color: var(--ink-dim); flex: 0 0 124px; }

.acc-c [style*="#555" i] { color: var(--mana-b) !important; }

.source-bar-track, .sc-track { flex: 1 1 auto; position: relative; height: 8px; min-width: 60px;
  background: var(--ground); border-radius: var(--r-sm); overflow: hidden; }
.source-bar-fill, .sc-bar { display: block; height: 100%; border-radius: var(--r-sm); }
.sc-track { overflow: visible; }

.sc-target { position: absolute; top: -2px; width: 2px; height: 12px; background: var(--ink); opacity: .7; }
.source-count, .sc-count { flex: 0 0 auto; margin-left: auto; font-family: var(--font-mono);
  font-size: 11px; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.sc-met { color: var(--b1); }
.sc-role-badge { font-size: 10px; color: var(--ink-muted); letter-spacing: .04em; }

.source-chart-title, .optimizer-heading, .deck-health h3 { font-family: var(--font-display); font-size: var(--fs-14);
  letter-spacing: .04em; text-transform: uppercase; color: var(--ink); margin: var(--s-4) 0 var(--s-2); }
.sc-role-badge {
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: var(--track-caps);
  text-transform: uppercase; color: inherit; opacity: 1;
  border: 1px solid var(--line); border-radius: var(--r-sm); padding: 1px 5px; margin-left: 6px;
}

@media (min-width: 900px) {
  #mbHealth-c .hitem { break-inside: avoid; }
  #mbHealth-c > div:not(.tiles):not(.axes),
  #mbHealth-c { column-count: 2; column-gap: var(--s-5); }
  #mbWhatIf-c { column-count: 2; column-gap: var(--s-5); }
  #mbWhatIf-c .callout { break-inside: avoid; margin-top: 0; margin-bottom: var(--s-2); }
}

@media (min-width: 900px) {
  .flow-list { column-count: 2; column-gap: var(--s-6); }
  .flow-list > * { break-inside: avoid; }
}
@media (min-width: 1200px) {
  .flow-list { column-count: 3; }
}

#pastePanel:not(.active),
#urlPanel:not(.active) { display: none; }

.input-tab.active,
.budget-btn.active { color: var(--flare); border-color: var(--flare); background: var(--flare-tint); }

.color-toggle.active { border-color: var(--flare); color: var(--flare); background: var(--flare-tint); }

.pip-row { display: flex; align-items: center; gap: var(--s-2); margin-bottom: 6px; }
.pip-color-dot {
  width: 24px; height: 24px; flex: none; border-radius: 50%;
  display: grid; place-items: center;
  font-family: var(--font-mono); font-size: 11px; font-weight: 700;
}
.pip-label { flex: 1 1 auto; min-width: 0; color: var(--ink-dim); font-size: var(--fs-14); }
.pip-controls { display: flex; align-items: center; gap: 4px; flex: none; }

.pip-btn {
  width: 28px; height: 28px; min-width: 28px; padding: 0;
  display: grid; place-items: center;
  font: inherit; line-height: 1; cursor: pointer;
  color: var(--ink); background: var(--raised);
  border: 1px solid var(--line-strong); border-radius: var(--r-sm);
}
.pip-btn:hover { border-color: var(--flare-line); color: var(--flare); }
.pip-btn:focus-visible { outline: 2px solid var(--flare); outline-offset: 1px; }
.pip-value {
  width: 52px; min-height: 28px; text-align: center;
  font-family: var(--font-mono); color: var(--ink);
  background: var(--ground); border: 1px solid var(--line-strong); border-radius: var(--r-sm);
}

.deck-health { margin-bottom: var(--s-5); }

.health-role { display: flex; align-items: center; gap: var(--s-2); padding: 5px 0; font-size: var(--fs-12); break-inside: avoid; }

.health-icon { flex: none; width: 1.15rem; text-align: center; color: var(--ink-muted); }
.health-icon:empty { display: none; }
.health-label { flex: 0 0 116px; color: var(--ink-dim); }
.health-count {
  flex: 0 0 2.5rem; text-align: right;
  font-family: var(--font-mono); font-weight: 500; font-variant-numeric: tabular-nums;
}

.health-bar-wrap {
  flex: 1 1 auto; min-width: 60px; position: relative;
  height: 8px; background: var(--ground); border-radius: var(--r-sm); overflow: visible;
}
.health-bar { display: block; height: 100%; border-radius: var(--r-sm); }

.health-bar.good { background: var(--b1); }
.health-bar.warn { background: var(--b3); }
.health-bar.bad  { background: var(--b5); }

.health-benchmark {
  position: absolute; top: -2px; bottom: -2px;
  background: rgba(255, 255, 255, .05);
  border-left: 2px solid var(--line-strong); border-right: 2px solid var(--line-strong);
}

.health-note { font-size: 11px; color: var(--ink-muted); padding-left: calc(1.15rem + var(--s-2)); break-inside: avoid; }
.health-note + .health-note { margin-top: 2px; }

.health-count[style*="#4ade80" i] { color: var(--b1) !important; }
.health-count[style*="#f59e0b" i] { color: var(--b3) !important; }
.health-count[style*="#f87171" i] { color: var(--b5-ink) !important; }

.format-grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 110px), 1fr));
  gap: var(--s-2); margin-bottom: var(--s-3);
}

.format-btn {
  min-width: 0; padding: 7px 8px; text-align: center; line-height: 1.25;
  background: var(--ground); border: 1px solid var(--line-strong);
  border-radius: var(--r-md); color: var(--ink-dim); cursor: pointer;
  font-family: var(--font-mono); font-size: var(--fs-12);
  transition: background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.format-btn:hover { border-color: var(--flare-line); color: var(--ink); }
.format-btn.active { border-color: var(--flare); color: var(--flare); background: var(--flare-tint); }
.format-btn:focus-visible { outline: 2px solid var(--flare); outline-offset: 1px; }
.fmt-detail { display: block; margin-top: 3px; font-family: var(--font-sans); font-size: 10px; color: var(--ink-muted); }

.format-btn.active .fmt-detail { color: var(--ink-dim); }

.quick-changes { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-bottom: var(--s-3); }
.qc-pill {
  display: inline-flex; align-items: center; gap: var(--s-1);
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: var(--track-caps);
  text-transform: uppercase; padding: 1px 6px;
  border: 1px solid var(--line); border-radius: var(--r-sm); color: var(--ink-muted);
}

.qc-keep    { color: var(--b1);     border-color: rgba(78, 158, 114, .4); }
.qc-upgrade { color: var(--b3);     border-color: rgba(224, 169, 58, .4); }
.qc-cut     { color: var(--b5-ink); border-color: rgba(226, 69, 58, .4); }

.text-success { color: var(--b1); }
.text-warn    { color: var(--b3); }
.text-error   { color: var(--b5-ink); }

.optimizer-land-row {
  display: flex; align-items: center; flex-wrap: wrap; gap: var(--s-2);
  position: relative; padding: 5px 0; font-size: var(--fs-12);
  border-bottom: 1px solid var(--line);
}
.optimizer-land-row:last-child { border-bottom: 0; }
.optimizer-land-qty {
  flex: none; min-width: 1.6em; text-align: right;
  font-family: var(--font-mono); font-size: 11px; color: var(--flare);
  font-variant-numeric: tabular-nums;
}

.optimizer-land-name { min-width: 0; color: var(--ink); font-weight: 500; overflow-wrap: anywhere; }

.optimizer-land-tag {
  flex: none; white-space: nowrap;
  font-family: var(--font-mono); font-size: 9px; letter-spacing: .04em;
  padding: 1px 5px; border: 1px solid var(--line); border-radius: var(--r-sm);
  color: var(--ink-muted);
}
.optimizer-land-reason { margin-left: auto; text-align: right; font-size: 11px; color: var(--ink-muted); }
@media (max-width: 640px) {

  .optimizer-land-reason { margin-left: 0; width: 100%; text-align: left; padding-left: calc(1.6em + var(--s-2)); }
}

.basic-land-summary {
  margin-top: var(--s-2); padding: var(--s-3);
  border-left: 2px solid var(--flare); border-radius: 0 var(--r-md) var(--r-md) 0;
  background: var(--ground); font-size: var(--fs-12); color: var(--ink-dim);
}
.basic-label {
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: var(--track-caps);
  text-transform: uppercase; color: var(--ink-muted); margin-right: var(--s-1);
}

.card-name-link {
  cursor: pointer; text-decoration: underline;
  text-decoration-color: var(--line-strong); text-underline-offset: 2px;
  transition: color var(--dur-fast) var(--ease), text-decoration-color var(--dur-fast) var(--ease);
}
.card-name-link:hover { color: var(--flare); text-decoration-color: var(--flare-line); }
.card-name-link:focus-visible { outline: 2px solid var(--flare); outline-offset: 2px; }

.source-chart   { margin: var(--s-4) 0; }
.source-summary { margin-top: var(--s-4); }

:root {
  --accent:            var(--flare);
  --btn-radius:        var(--r-md);
  --btn-share-border:  var(--flare-line);
  --btn-share-color:   var(--flare);
}

.calc-layout input[type="text"],
.calc-layout input[type="number"],
.calc-layout textarea,
.calc-layout select {
  background: var(--ground);
  color: var(--ink);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-md);
  font-family: var(--font-mono);
}
.calc-layout input::placeholder,
.calc-layout textarea::placeholder { color: var(--ink-muted); font-family: var(--font-sans); }
.calc-layout input:focus,
.calc-layout textarea:focus,
.calc-layout select:focus {
  border-color: var(--flare-line);
  outline: none;
  box-shadow: 0 0 0 2px var(--flare-tint);
}

.calc-layout button {
  background: var(--raised);
  color: var(--ink-dim);
  border: 1px solid var(--line);
  border-radius: var(--r-md);
  font-family: var(--font-sans);
  cursor: pointer;
  transition: background var(--dur-fast) var(--ease),
              border-color var(--dur-fast) var(--ease),
              color var(--dur-fast) var(--ease);
}
.calc-layout button:hover { border-color: var(--flare-line); color: var(--ink); }
.calc-layout button:focus-visible { outline: 2px solid var(--flare); outline-offset: 2px; }

.calc-layout button.color-toggle { border-radius: 50%; }

.calc-layout .color-toggles { gap: 12px; flex-wrap: wrap; }
.calc-layout button.color-toggle {
  flex: 0 0 auto;
  width:  clamp(40px, 12.5vw, 50px);
  height: clamp(40px, 12.5vw, 50px);
}
.calc-layout button.color-toggle.active { transform: scale(1.10); }

.calc-layout .input-tab.active,
.calc-layout .format-btn.active,
.calc-layout .budget-btn.active,
.calc-layout .color-toggle[aria-pressed="true"],
.calc-layout button.active {
  background: var(--flare-tint);
  border-color: var(--flare-line);
  color: var(--flare);
}

.calc-layout .calc-btn,
.calc-layout .pin-land-btn {
  background: var(--flare);
  color: #17120A;
  border-color: transparent;
  font-family: var(--font-display);
  font-weight: 800;
  letter-spacing: var(--track-caps);
  text-transform: uppercase;
}
.calc-layout .calc-btn:hover,
.calc-layout .pin-land-btn:hover { background: var(--flare-soft); color: #17120A; }

.calc-layout .calc-btn:disabled,
.calc-layout button:disabled {
  background: var(--panel); color: var(--ink-muted);
  border-color: var(--line); cursor: not-allowed;
}
.calc-layout .share-btn { background: transparent; color: var(--btn-share-color); border-color: var(--btn-share-border); }

.calc-layout .commander-suggestions,
.calc-layout .land-filter-panel,
.calc-layout .pin-land-panel {
  background: var(--raised);
  border: 1px solid var(--line-strong);
  border-radius: var(--r-md);
  color: var(--ink-dim);
}
.calc-layout .commander-suggestion:hover,
.calc-layout .commander-suggestion.active { background: var(--flare-tint); color: var(--ink); }
.calc-layout .cfg-badge,
.calc-layout .restore-chip,
.calc-layout .included-land-chips > * {
  background: var(--flare-tint); color: var(--flare);
  border: 1px solid var(--flare-line); border-radius: 999px;
}
.calc-layout input[type="range"] { accent-color: var(--flare); background: transparent; }
.calc-layout input[type="checkbox"] { accent-color: var(--flare); }
.calc-layout .land-db-error { color: var(--signal-danger, #E07A72); border: 1px solid var(--flare-line); background: var(--panel); }

body.mb-island.mb-active .main { max-width: min(1500px, 95vw); }

.curve-chart .curve-seg { background: var(--flare) !important; }
.curve-chart .curve-stack { background: var(--ground); }
.curve-chart .curve-mv-label { color: var(--ink-muted); }
.curve-chart .curve-count { color: var(--ink-dim); }

#mbReport .mbv {
  border: 1px solid var(--line);
  border-top: 3px solid var(--flare);
  border-radius: var(--r-lg);
  background: var(--panel);
  padding: var(--s-5);
  margin-bottom: var(--s-5);
}
#mbReport .mbv-title {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-28);
  text-transform: uppercase; letter-spacing: var(--track-caps);
  color: var(--ink); line-height: 1; display: block;
}
#mbReport .mbv-desc {
  display: block; margin-top: var(--s-2);
  font-size: var(--fs-16); color: var(--ink-dim); max-width: 34rem;
}
#mbReport .mbv-facts {
  display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4);
  margin-top: var(--s-4); padding-top: var(--s-3);
  border-top: 1px solid var(--line);
}
#mbReport .mbv-fact {
  font-family: var(--font-mono); font-size: var(--fs-12);
  color: var(--ink-muted); font-variant-numeric: tabular-nums;
}
#mbReport .mbv-fact b { color: var(--ink); font-weight: 500; }

#mbReport .tile {
  background: var(--panel) !important;
  border: 1px solid var(--line);
  border-radius: var(--r-lg);
  box-shadow: none;
  font-family: var(--font-sans);
}
#mbReport .tile::after { display: none; }
#mbReport .tile:hover { transform: none; border-color: var(--line-strong); box-shadow: none; }
#mbReport .tile h3 {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-18);
  text-transform: uppercase; letter-spacing: var(--track-caps); color: var(--ink);
}
#mbReport .tile h3 .ic {
  background: var(--raised); border: 1px solid var(--line); color: var(--flare);
}
#mbReport .clickthru { font-family: var(--font-mono); font-size: var(--fs-12); color: var(--ink-muted); }

#mbReport .stats-strip {
  gap: 1px; background: var(--line); padding: 0; border: 1px solid var(--line);
  border-radius: var(--r-md); overflow: hidden;
}
#mbReport .stat-card {
  background: var(--panel); padding: var(--s-3);
  display: flex; flex-direction: column; gap: 2px;
}
#mbReport .stat-card .sv {
  font-family: var(--font-mono); font-weight: 500; font-size: var(--fs-22);
  font-variant-numeric: tabular-nums; color: var(--ink); line-height: 1.1;
}
#mbReport .stat-card .sl {
  font-family: var(--font-mono); font-size: 9.5px; letter-spacing: var(--track-caps);
  text-transform: uppercase; color: var(--ink-muted);
}
#mbReport .stat-card.mana .sv { color: var(--flare); }

#mbReport .pip-row { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-2) 0; }
#mbReport .pip { border: 1px solid var(--line-strong); background: var(--ink-muted); }
#mbReport .pip-W { background: var(--mana-w); }
#mbReport .pip-U { background: var(--mana-u); }
#mbReport .pip-B { background: var(--mana-b); }
#mbReport .pip-R { background: var(--mana-r); }
#mbReport .pip-G { background: var(--mana-g); }

#mbReport .pip {
  display: grid;
  place-items: center;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 10px;
  line-height: 1;
  color: var(--ground);
}
#mbReport .pip-W::after { content: "W"; }
#mbReport .pip-U::after { content: "U"; }
#mbReport .pip-B::after { content: "B"; }
#mbReport .pip-R::after { content: "R"; }
#mbReport .pip-G::after { content: "G"; }
#mbReport .pip-C::after { content: "C"; }
#mbReport .track {
  background: var(--ground); border-radius: var(--r-pill);
  overflow: hidden; flex: 1 1 auto;
}
#mbReport .track > i { display: block; height: 100%; background: var(--flare); }
#mbReport .pip-W ~ .track > i { background: var(--mana-w); }
#mbReport .pip-U ~ .track > i { background: var(--mana-u); }
#mbReport .pip-B ~ .track > i { background: var(--mana-b); }
#mbReport .pip-R ~ .track > i { background: var(--mana-r); }
#mbReport .pip-G ~ .track > i { background: var(--mana-g); }
#mbReport .pip-val {
  font-family: var(--font-mono); font-size: var(--fs-14);
  font-variant-numeric: tabular-nums; color: var(--ink-dim); min-width: 4rem; text-align: right;
}

#mbReport .pip-val[data-count] { font-size: 0; }
#mbReport .pip-val[data-count]::before {
  content: attr(data-count);
  font-family: var(--font-mono); font-size: var(--fs-14);
  font-variant-numeric: tabular-nums; color: var(--ink-dim);
}

#mbReport .curve .cc {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  align-items: end;
  justify-items: center;
}
#mbReport .curve .b {
  background: var(--flare);
  border-radius: var(--r-sm) var(--r-sm) 0 0;
  min-height: 2px;
}
#mbReport .curve .cv,
#mbReport .curve .cl {
  font-family: var(--font-mono); font-size: 10px;
  font-variant-numeric: tabular-nums; color: var(--ink-muted);
}
#mbReport .curve .cv { color: var(--ink-dim); }

#mbReport .mb-new-deck {
  display: inline-flex; align-items: center; gap: var(--s-2);
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-14);
  text-transform: uppercase; letter-spacing: var(--track-caps);
  color: var(--flare); background: var(--flare-tint);
  border: 1px solid var(--flare-line); border-radius: var(--r-md);
  padding: var(--s-2) var(--s-4); cursor: pointer;
  transition: background var(--dur-fast) var(--ease);
}
#mbReport .mb-new-deck:hover { background: rgba(255, 176, 32, 0.22); }

#mbReport .asum-t {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-18);
  text-transform: uppercase; letter-spacing: var(--track-caps); color: var(--ink);
}

#mbReport .asum-d { font-family: var(--font-mono); font-size: var(--fs-12); color: var(--ink-muted); }

#mbReport .mbv-facts,
#mbReport .mb-prob .mb-mv,
#mbReport .mb-tip-dist,
#mbReport .mb-tempo-turns            { color: var(--ink-muted); }
#mbReport .mb-whatif,
#mbReport .mb-tip,
#mbReport .mb-landlist .ll-row       { color: var(--ink-dim); }
#mbReport .mb-whatif b,
#mbReport .mb-whatif strong,
#mbReport .mb-tip b,
#mbReport .mb-tip-dist b,
#mbReport .mb-tempo-turns b,
#mbReport .mb-prob .mb-cn,
#mbReport .acc .asum-t               { color: var(--ink); }
#mbReport .acc .chev,
#mbReport .mb-landlist .ll-q         { color: var(--flare); }

#mbReport .acc                       { background: linear-gradient(180deg, var(--raised), var(--panel) 60%); }
#mbReport .acc > summary:hover       { background: var(--flare-tint); }
#mbReport .acc[open] > summary       { background: var(--raised); }
#mbReport .acc .asum-ic              { background: var(--raised); }
#mbReport .mb-whatif                 { background: var(--raised); }

#mbReport .cast-good                 { background: var(--b1-tint); }
#mbReport .cast-ok                   { background: var(--b3-tint); }
#mbReport .cast-bad                  { background: var(--b5-tint); }

#resultsPanel .results-header { border-bottom: 1px solid var(--line); padding-bottom: var(--s-3); }
#resultsPanel .results-header > h2,
#resultsPanel .results-header > .results-title {
  font-family: var(--font-display); font-weight: 800; font-size: var(--fs-28);
  text-transform: uppercase; letter-spacing: var(--track-caps); color: var(--ink);
  margin: 0; line-height: 1;
}

@media (max-width: 480px) {
  #mbReport .stats-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #mbReport .stat-card { min-width: 0; }
  #mbReport .stat-card .sv { font-size: var(--fs-18); }
}

@media (max-width: 480px) {
  #mbReport .acc > summary { flex-wrap: wrap; row-gap: var(--s-1); }
  #mbReport .asum-d { flex: 0 0 100%; margin-left: 0; white-space: nowrap; }
}

@media (max-width: 480px) {
  #mbReport .tile h3 { flex-wrap: wrap; row-gap: var(--s-1); }
  #mbReport .clickthru { flex: 0 0 100%; margin-left: 0; }
}

@media (max-width: 480px) {
  #mbReport .pip-val { min-width: 3.25rem; }
}

#mbReport .mbv-fact { white-space: nowrap; }
@media (max-width: 480px) {
  #mbReport .mbv-facts { column-gap: var(--s-5); }
}

#mbReport .sv-ramp-list {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--s-2) var(--s-4);
  align-items: baseline;
  margin-top: var(--s-3);
  padding-top: var(--s-3);
  border-top: 1px solid var(--line);
}
#mbReport .sv-ramp-row { display: contents; }
#mbReport .sv-ramp-label {
  font-family: var(--font-mono); font-size: 10px;
  letter-spacing: var(--track-caps); text-transform: uppercase;
  color: var(--ink-muted); white-space: nowrap;
}
#mbReport .sv-ramp-cards {
  display: flex; flex-wrap: wrap; gap: var(--s-1) var(--s-3);
  font-size: var(--fs-12); color: var(--ink-dim);
}

#mbReport .sv-ramp-card { cursor: help; }
#mbReport .sv-ramp-card:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 2px; }

@media (max-width: 430px) {
  #mbReport .sv-ramp-list { grid-template-columns: minmax(0, 1fr); gap: var(--s-1); }
  #mbReport .sv-ramp-row { display: block; margin-bottom: var(--s-2); }
  #mbReport .sv-ramp-label { display: block; margin-bottom: 2px; }
}

#mbReport .mb-bento { align-items: stretch; }
#mbReport .mb-bento > .tile[class*="span"] {
  max-height: min(60vh, 420px);
  min-height: 0;
  overflow-y: scroll;
  scrollbar-gutter: stable;
  overflow-anchor: none;

}

@media (max-width: 860px) {
  #mbReport .mb-bento > .tile[class*="span"] {
    max-height: none;

    overflow: hidden;

    scrollbar-gutter: auto;
  }
}

#mbReport .mb-bento > .tile[class*="span"],
#mbReport .mb-bento > .acc .acc-body {
  scrollbar-color: var(--flare) rgba(255, 255, 255, .07);
  scrollbar-width: thin;
}
#mbReport .mb-bento > .tile[class*="span"]::-webkit-scrollbar,
#mbReport .mb-bento > .acc .acc-body::-webkit-scrollbar { width: 10px; }
#mbReport .mb-bento > .tile[class*="span"]::-webkit-scrollbar-track,
#mbReport .mb-bento > .acc .acc-body::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, .07); border-radius: var(--r-pill);
}
#mbReport .mb-bento > .tile[class*="span"]::-webkit-scrollbar-thumb,
#mbReport .mb-bento > .acc .acc-body::-webkit-scrollbar-thumb {
  background: var(--flare); border-radius: var(--r-pill);
  border: 2px solid transparent; background-clip: padding-box;
}

#mbReport .mb-bento > .tile.mb-yourbase {
  border-color: rgba(255, 176, 32, .45);
}

#mbReport .optimizer-land-row { flex-wrap: nowrap; align-items: baseline; }
#mbReport .optimizer-land-reason {
  flex: 1 1 0; min-width: 0; margin-left: var(--s-4);
}

#mbReport .mb-bento > .acc .acc-body {
  max-height: min(60vh, 420px);
  overflow-y: scroll;
  scrollbar-gutter: stable;
  overflow-anchor: none;

}

@media (max-width: 860px) {

  #mbReport .mb-bento > .acc .acc-body {
    max-height: none; overflow: hidden; scrollbar-gutter: auto;
  }
}

html body.mb-island.mb-active #faqSection,
html body.mb-island.mb-active .info-box,
html body.mb-island.mb-active .seo-footer-text {
  display: block;
  max-width: var(--measure, 1280px);
  margin-left: auto;
  margin-right: auto;
}