:root {
  color-scheme: dark;
  --page: #080706;
  --surface: #15110e;
  --surface-raised: #201711;
  --ink: #fff7ed;
  --muted: #aa9d91;
  --line: #352820;
  --mint: #ff7a18;
  --gold: #ffb15c;
  --violet: #d94b12;
  --display: "Arial Narrow", "Roboto Condensed", Impact, sans-serif;
  --body: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--page); color: var(--ink); font: 16px/1.55 var(--body); }
a { color: inherit; }
.shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.site-header { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 28px; border-bottom: 1px solid var(--line); }
.brand { display: inline-flex; align-items: center; gap: 11px; font-weight: 820; text-decoration: none; letter-spacing: -.02em; }
.brand-mark { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--mint); color: #1e0900; font-size: .73rem; letter-spacing: -.04em; box-shadow: 0 0 32px #ff7a1833; }
nav { display: flex; gap: 30px; margin-left: auto; }
nav a { color: #c6c6cc; font-size: .88rem; text-decoration: none; }
nav a:hover { color: var(--ink); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 24px; min-height: 50px; padding: 0 20px; border: 1px solid transparent; border-radius: 12px; font-size: .88rem; font-weight: 760; text-decoration: none; }
.button-small { min-height: 38px; padding-inline: 15px; font-size: .76rem; }
.button-ghost { border-color: var(--line); background: #ffffff08; }
.button-primary { background: var(--mint); color: #1e0900; box-shadow: 0 14px 34px #ff7a1826; }
.button-primary:hover { background: #ff963f; }
.hero { display: grid; grid-template-columns: minmax(0, .92fr) minmax(480px, 1.08fr); gap: clamp(44px, 7vw, 96px); align-items: center; min-height: 720px; padding-block: 86px; }
.eyebrow { margin: 0 0 18px; color: var(--mint); font-size: .71rem; font-weight: 850; letter-spacing: .18em; text-transform: uppercase; }
h1, h2 { font-family: var(--display); font-weight: 900; text-transform: uppercase; letter-spacing: -.045em; }
h1 { max-width: 690px; margin: 0; font-size: clamp(3.7rem, 6.7vw, 7rem); line-height: .88; }
h1 em { color: var(--mint); font-style: normal; }
.hero-lede { max-width: 630px; margin: 28px 0 0; color: #b9bac2; font-size: clamp(1rem, 1.4vw, 1.18rem); }
.hero-actions { display: flex; align-items: center; gap: 20px; margin-top: 34px; }
.hero-actions > span { max-width: 190px; color: var(--muted); font-size: .75rem; }
.report-preview { position: relative; padding: 26px; overflow: hidden; border: 1px solid #363a45; border-radius: 24px; background: linear-gradient(145deg, #1c1f28, #111319); box-shadow: 0 38px 90px #0008; }
.report-preview::before { position: absolute; content: ""; width: 280px; height: 280px; top: -180px; right: -80px; border-radius: 50%; background: var(--mint); filter: blur(90px); opacity: .22; }
.preview-topline, .preview-title, .chart-labels, .chart-turns { display: flex; align-items: center; justify-content: space-between; }
.preview-topline { padding-bottom: 20px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .13em; }
.status { display: flex; align-items: center; gap: 7px; }
.status i { width: 7px; height: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 12px var(--mint); }
.preview-title { padding: 24px 0; }
.preview-title div { display: grid; gap: 3px; }
.preview-title span, .preview-metrics span { color: var(--muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .11em; }
.preview-title strong { font-size: 1.15rem; }
.turn-pill { padding: 7px 10px; border: 1px solid var(--line); border-radius: 999px; }
.preview-metrics { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.preview-metrics article { display: grid; padding: 18px; border: 1px solid var(--line); border-radius: 15px; background: #ffffff05; }
.preview-metrics strong { margin: 6px 0 0; font-size: 2.1rem; letter-spacing: -.06em; }
.preview-metrics small { color: var(--muted); }
.mini-chart { margin-top: 12px; padding: 18px; border: 1px solid var(--line); border-radius: 15px; background: #0c0e13; }
.chart-labels { font-size: .72rem; font-weight: 700; }
.chart-labels span:last-child { color: var(--muted); font-weight: 500; }
.mini-chart svg { display: block; width: 100%; margin-top: 7px; }
.chart-grid line { stroke: #292d35; stroke-width: 1; }
.chart-area { fill: url(#none); fill: #ff7a1814; }
.chart-line { fill: none; stroke: var(--mint); stroke-width: 4; stroke-linecap: round; }
.chart-dots circle { fill: var(--page); stroke: var(--mint); stroke-width: 3; }
.chart-turns { color: var(--muted); font-size: .68rem; }
.signal-strip { border-block: 1px solid var(--line); background: #111319; }
.signal-strip .shell { min-height: 64px; display: flex; align-items: center; justify-content: space-between; gap: 20px; color: #b8b9c0; font-size: .73rem; font-weight: 720; letter-spacing: .05em; text-transform: uppercase; }
.signal-strip i { width: 4px; height: 4px; border-radius: 50%; background: var(--mint); }
.section { padding-block: 110px; }
.section-heading { display: grid; grid-template-columns: 1fr 1.2fr; column-gap: 70px; align-items: end; margin-bottom: 42px; }
.section-heading .eyebrow { grid-column: 1 / -1; }
h2 { max-width: 680px; margin: 0; font-size: clamp(2.8rem, 5vw, 5rem); line-height: .94; }
.section-heading > p:last-child { max-width: 510px; margin: 0; color: var(--muted); }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.feature-card { min-height: 300px; padding: 26px; border: 1px solid var(--line); border-radius: 19px; background: var(--surface); }
.feature-number { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; font-size: .72rem; font-weight: 800; }
.feature-mint .feature-number { background: #ff7a181c; color: var(--mint); }
.feature-gold .feature-number { background: #ffb15c1c; color: var(--gold); }
.feature-violet .feature-number { background: #d94b121f; color: #ff7847; }
.feature-card h3 { margin: 80px 0 12px; font-size: 1.25rem; }
.feature-card p { margin: 0; color: var(--muted); }
.workflow-section { padding-block: 110px; border-block: 1px solid var(--line); background: radial-gradient(circle at 10% 100%, #431707 0, transparent 30rem), var(--surface); }
.workflow-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; }
.workflow-list { margin: 0; padding: 0; list-style: none; }
.workflow-list li { display: grid; grid-template-columns: 50px 1fr; gap: 20px; padding: 25px 0; border-top: 1px solid var(--line); }
.workflow-list li:last-child { border-bottom: 1px solid var(--line); }
.workflow-list li > span { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--mint); color: #1e0900; font-size: .75rem; font-weight: 900; }
.workflow-list strong { font-size: 1.05rem; }
.workflow-list p { margin: 3px 0 0; color: var(--muted); }
.site-footer { min-height: 130px; display: flex; align-items: center; gap: 30px; color: var(--muted); font-size: .8rem; }
.site-footer p { margin-left: auto; }
.auth-body { min-height: 100vh; background: radial-gradient(circle at 8% 100%, #431707 0, transparent 34rem), var(--page); }
.auth-shell { min-height: calc(100vh - 82px); display: grid; grid-template-columns: 1fr minmax(380px, 480px); gap: 90px; align-items: center; padding-block: 70px; }
.auth-intro h1, .empty-app h1 { max-width: 720px; font-size: clamp(4rem, 8vw, 7.4rem); }
.auth-intro > p:last-child, .empty-app > p:last-child { max-width: 570px; color: var(--muted); font-size: 1.05rem; }
.auth-card { padding: 32px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(145deg, #1c1511, #0f0d0b); box-shadow: 0 34px 80px #0007; }
.auth-card h2 { font-size: 3rem; }
.auth-card form { display: grid; margin-top: 28px; }
.auth-card label { margin: 16px 0 7px; color: #d4c9bf; font-size: .76rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.auth-card input { width: 100%; min-height: 52px; padding: 0 14px; border: 1px solid var(--line); border-radius: 11px; outline: none; background: #080706; color: var(--ink); font: inherit; }
.auth-card input:focus { border-color: var(--mint); box-shadow: 0 0 0 3px #ff7a181c; }
.auth-card form .button { width: 100%; margin-top: 8px; cursor: pointer; }
.form-error { min-height: 24px; margin: 10px 0 0; color: #ff8b68; font-size: .8rem; }
.dev-note { margin: 20px 0 0; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: .75rem; }
.user-menu { display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: .78rem; }
.user-menu form { margin: 0; }
.app-navigation { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.app-navigation a { padding: 8px 11px; border-radius: 9px; color: var(--muted); font-size: .78rem; font-weight: 750; text-decoration: none; }
.app-navigation a:hover, .app-navigation a:focus-visible { color: var(--ink); background: #ffffff08; outline: none; }
.app-navigation a[aria-current="page"] { color: var(--gold); background: #ff7a1814; }
.onboarding-nav-target { box-shadow: inset 0 0 0 1px #ffb15c66; }
.onboarding { margin-bottom: 54px; padding: 26px; border: 1px solid #ff7a1866; border-radius: 20px; background: linear-gradient(135deg, #ff7a1814, #15110e 58%); box-shadow: 0 24px 60px #0004; }
.onboarding-heading { display: flex; align-items: end; justify-content: space-between; gap: 32px; }
.onboarding-heading h2 { font-family: var(--body); font-size: clamp(1.8rem, 4vw, 2.8rem); text-transform: none; letter-spacing: -.045em; }
.onboarding-heading p:last-child { max-width: 650px; margin: 10px 0 0; color: var(--muted); }
.onboarding-action { flex: 0 0 auto; }
.onboarding-steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 24px 0 0; padding: 0; list-style: none; }
.onboarding-steps li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: #08070699; }
.onboarding-step-number { display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--line); border-radius: 50%; color: var(--muted); font-size: .75rem; font-weight: 850; }
.onboarding-steps small, .onboarding-steps strong, .onboarding-steps p { display: block; }
.onboarding-steps small { color: var(--muted); font-size: .59rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.onboarding-steps strong { margin-top: 2px; font-size: .9rem; }
.onboarding-steps p { margin: 4px 0 0; color: var(--muted); font-size: .69rem; line-height: 1.4; }
.onboarding-steps .is-active { border-color: var(--gold); background: #ff7a1817; }
.onboarding-steps .is-active .onboarding-step-number { border-color: var(--gold); background: var(--gold); color: #1e0900; }
.onboarding-steps .is-complete .onboarding-step-number { border-color: #ff7a1866; color: var(--gold); }
.onboarding-steps .is-upcoming { opacity: .66; }
.onboarding-target { position: relative; border-color: var(--gold) !important; box-shadow: 0 0 0 3px #ff7a1826, 0 18px 44px #0005 !important; }
.boardstate-onboarding { padding-top: 34px; }
.boardstate-onboarding .onboarding { margin-bottom: 0; }
.import-onboarding { grid-column: 1 / -1; }
.import-onboarding .onboarding { margin-bottom: -42px; }
.empty-app { min-height: calc(100vh - 82px); display: flex; flex-direction: column; justify-content: center; padding-block: 70px; }
.dashboard { min-height: calc(100vh - 82px); padding-block: 76px 110px; }
.dashboard-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 80px; }
.dashboard-heading h1 { font-size: clamp(4rem, 8vw, 7.4rem); }
.dashboard-heading p:last-child { max-width: 560px; margin: 18px 0 0; color: var(--muted); }
.dashboard-heading .button:disabled { cursor: not-allowed; filter: grayscale(.35); opacity: .6; }
.collection-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.collection-heading h2 { font-family: var(--body); font-size: 1.15rem; text-transform: none; letter-spacing: -.02em; }
.collection-heading span { color: var(--muted); font-size: .78rem; }
.deck-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.deck-card { position: relative; display: flex; flex-direction: column; min-height: 500px; padding: 24px; overflow: hidden; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(145deg, #1a130f, #0f0d0b); box-shadow: 0 24px 60px #0004; }
.deck-card::before { position: absolute; content: ""; width: 230px; height: 230px; top: -150px; right: -100px; border-radius: 50%; background: var(--mint); filter: blur(72px); opacity: .18; }
.deck-card-topline, .deck-card-footer { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: .69rem; font-weight: 720; letter-spacing: .07em; text-transform: uppercase; }
.ready-status { display: flex; align-items: center; gap: 7px; color: var(--gold); }
.ready-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 10px var(--mint); }
.deck-commanders { display: flex; margin: 46px 0 24px; }
.deck-commanders span { display: grid; place-items: center; width: 58px; height: 58px; border: 3px solid var(--surface); border-radius: 50%; background: #ff7a18; color: #1e0900; font: 900 1.15rem var(--display); }
.deck-commanders span + span { margin-left: -14px; background: #b84914; color: var(--ink); }
.deck-card h2 { max-width: 330px; font-family: var(--body); font-size: 1.65rem; line-height: 1.05; text-transform: none; letter-spacing: -.045em; }
.deck-card h2 a { text-decoration: none; }
.deck-card > p { min-height: 48px; margin: 10px 0 24px; color: var(--muted); font-size: .78rem; }
.deck-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0; padding: 18px 0; border-block: 1px solid var(--line); }
.deck-stats div { display: grid; gap: 4px; }
.deck-stats dt { color: var(--muted); font-size: .65rem; letter-spacing: .08em; text-transform: uppercase; }
.deck-stats dd { margin: 0; font-size: 1.3rem; font-weight: 800; }
.deck-stats dd small { display: block; margin-top: 2px; color: var(--muted); font-size: .65rem; font-weight: 700; }
.deck-card-footer { margin-top: 18px; }
.deck-arrow { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 10px; color: var(--ink); font-size: 1rem; }
.simulation-control, .simulation-result { margin-top: auto; padding-top: 18px; }
.comparison-report-link { display: flex; align-items: center; justify-content: space-between; min-height: 48px; margin-top: auto; padding: 0 16px; border: 1px solid #ffb15c66; border-radius: 12px; background: #ffb15c12; color: var(--ink); font-size: .82rem; font-weight: 780; text-decoration: none; }
.comparison-report-link:hover { background: #ffb15c20; border-color: var(--gold); }
.comparison-report-link + .simulation-control, .comparison-report-link + .simulation-result { margin-top: 0; }
.simulation-options { display: grid; gap: 10px; }
.mulligan-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; min-width: 0; margin: 0; padding: 10px; border: 1px solid var(--line); border-radius: 12px; }
.mulligan-options legend { padding-inline: 5px; color: var(--gold); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mulligan-options label { display: grid; grid-template-columns: 16px 1fr; gap: 7px; align-items: start; cursor: pointer; }
.mulligan-options input { margin: 3px 0 0; accent-color: var(--mint); }
.mulligan-options strong, .mulligan-options small { display: block; }
.mulligan-options strong { font-size: .72rem; }
.mulligan-options small { margin-top: 2px; color: var(--muted); font-size: .64rem; line-height: 1.3; }
.simulation-run-buttons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.simulation-run-buttons.onboarding-target { padding: 10px; border: 1px solid var(--gold); border-radius: 14px; scroll-margin-top: 18px; }
.metric-recommendations { display: grid; gap: 8px; min-width: 0; margin: 0; padding: 12px; border: 1px solid var(--line); border-radius: 12px; }
.metric-recommendations legend { padding-inline: 5px; color: var(--gold); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.metric-search { display: grid; gap: 4px; }
.metric-search span { color: var(--muted); font-size: .64rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.metric-search input { width: 100%; min-width: 0; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface-2); color: var(--ink); font: inherit; font-size: .72rem; }
.metric-search input:focus { border-color: var(--mint); outline: 2px solid #63d6b433; }
.metric-recommendation { display: grid; grid-template-columns: 16px 1fr; gap: 8px; align-items: start; color: #ded4cc; cursor: pointer; }
.metric-recommendation[hidden] { display: none; }
.metric-recommendation input { margin: 3px 0 0; accent-color: var(--mint); }
.metric-recommendation > span { min-width: 0; }
.metric-recommendation strong, .metric-recommendation em { display: block; font-size: .72rem; }
.metric-recommendation small { display: inline-block; margin-left: 6px; color: var(--gold); font-size: .62rem; font-style: normal; text-transform: uppercase; }
.metric-recommendation em { margin-top: 2px; color: var(--muted); font-style: normal; line-height: 1.35; }
.metric-recommendation.is-unavailable { cursor: not-allowed; opacity: .6; }
.metric-recommendations-empty { margin: 0; padding: 11px; border: 1px dashed var(--line); border-radius: 11px; color: var(--muted); font-size: .7rem; }
.metric-search-empty { margin: 0; color: var(--muted); font-size: .7rem; }
.run-button { width: 100%; min-height: 44px; padding-inline: 10px; border-color: #ff7a1855; background: #ff7a1814; color: var(--ink); cursor: pointer; }
.run-button:hover { background: #ff7a1824; }
.simulation-preparing { display: none; gap: 5px; color: var(--gold); }
.simulation-preparing > span { display: flex; align-items: center; gap: 8px; font-size: .75rem; }
.simulation-preparing small { color: var(--muted); font-size: .68rem; }
.simulation-options.htmx-request .simulation-preparing { display: grid; }
.simulation-options.htmx-request .simulation-run-buttons { display: none; }
.simulation-result > span { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; color: var(--muted); font-size: .75rem; }
.simulation-report-ready { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; font-size: .75rem; }
.simulation-report-ready span { color: var(--muted); }
.simulation-report-ready a { color: var(--gold); font-weight: 750; text-decoration: none; white-space: nowrap; }
.deck-card[data-onboarding-report-deck] { scroll-margin-block-start: 96px; scroll-margin-block-end: 150px; }
.simulation-report-ready .onboarding-report-target { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 9px 11px; border: 1px solid var(--gold); border-radius: 10px; background: #ff7a1824; box-shadow: 0 0 0 3px #ff7a1826, 0 10px 28px #0005; color: var(--ink); white-space: normal; }
.simulation-report-ready .onboarding-report-target:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.deck-card[data-onboarding-report-reveal] { animation: onboarding-report-ready-pulse 1.6s ease-in-out 2; }
@keyframes onboarding-report-ready-pulse { 50% { border-color: var(--gold); box-shadow: 0 0 0 5px #ff7a1833, 0 26px 64px #0006; } }
.simulation-status-copy { display: grid; gap: 5px; color: var(--gold); }
.simulation-status-copy > span { display: flex; align-items: center; gap: 8px; font-size: .75rem; }
.simulation-status-copy small { color: var(--muted); font-size: .68rem; font-variant-numeric: tabular-nums; }
.simulation-running i, .simulation-preparing i { width: 8px; height: 8px; border: 2px solid #ff7a1855; border-top-color: var(--mint); border-radius: 50%; animation: spin .8s linear infinite; }
.simulation-access-links { display: flex; gap: 14px; margin: 10px 0; font-size: .72rem; }
.simulation-access-links a { color: var(--ink); font-weight: 750; text-decoration: none; }
.simulation-access-links a:hover { color: var(--gold); }
.simulation-failed > span { color: #ff8b68; }
@keyframes spin { to { transform: rotate(360deg); } }
.feature-flags { min-height: calc(100vh - 82px); padding-block: 76px 110px; }
.feature-flags-heading { margin-bottom: 42px; }
.feature-flags-heading h1 { font-size: clamp(4rem, 8vw, 7.4rem); }
.feature-flags-heading p:last-child { max-width: 620px; margin: 18px 0 0; color: var(--muted); }
.feature-flag-list { display: grid; gap: 18px; }
.feature-flag-card { display: grid; gap: 28px; padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(145deg, #1a130f, #0f0d0b); }
.feature-flag-heading { display: flex; align-items: start; justify-content: space-between; gap: 30px; }
.feature-flag-heading h2 { font-family: var(--body); font-size: 1.8rem; text-transform: none; letter-spacing: -.04em; }
.feature-flag-heading p:last-child { max-width: 650px; margin: 8px 0 0; color: var(--muted); }
.feature-flag-status { flex: 0 0 auto; padding: 7px 11px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: .7rem; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.feature-flag-status.status-admin, .feature-flag-status.status-all { border-color: #ff7a1866; background: #ff7a1814; color: var(--gold); }
.feature-flag-card fieldset { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin: 0; padding: 0; border: 0; }
.feature-flag-card legend { margin-bottom: 10px; color: var(--muted); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.feature-flag-option { display: grid; grid-template-columns: 18px 1fr; gap: 10px; padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: #ffffff05; cursor: pointer; }
.feature-flag-option:has(input:checked) { border-color: var(--mint); background: #ff7a1810; }
.feature-flag-option input { margin: 4px 0 0; accent-color: var(--mint); }
.feature-flag-option strong, .feature-flag-option small { display: block; }
.feature-flag-option small { margin-top: 3px; color: var(--muted); font-size: .72rem; }
.feature-flag-card > .button { justify-self: start; cursor: pointer; }
.feature-flag-notice { margin: -20px 0 24px; padding: 12px 16px; border: 1px solid #ff7a1855; border-radius: 12px; background: #ff7a1810; color: var(--gold); }
.import-shell { display: grid; grid-template-columns: .75fr 1.25fr; gap: 90px; align-items: start; padding-block: 76px 110px; }
.import-intro { position: sticky; top: 48px; }
.import-intro h1 { font-size: clamp(4rem, 8vw, 7rem); }
.import-intro > p:last-child { max-width: 470px; color: var(--muted); }
.import-form { padding: 30px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(145deg, #1a130f, #0f0d0b); }
.field-group { display: grid; gap: 7px; margin-bottom: 22px; }
.field-group label { color: #d4c9bf; font-size: .76rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.field-group input, .field-group textarea { width: 100%; padding: 13px 14px; border: 1px solid var(--line); border-radius: 11px; outline: none; resize: vertical; background: #080706; color: var(--ink); font: inherit; }
.field-group input { min-height: 50px; }
.field-group input:focus, .field-group textarea:focus { border-color: var(--mint); box-shadow: 0 0 0 3px #ff7a181c; }
.field-group small { color: var(--muted); font-size: .72rem; }
.file-field input { padding: 10px; color: var(--muted); }
.file-field input::file-selector-button { margin-right: 12px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface-raised); color: var(--ink); cursor: pointer; }
.file-divider { display: flex; align-items: center; gap: 12px; margin: -3px 0 18px; color: var(--muted); font-size: .7rem; text-transform: uppercase; }
.file-divider::before, .file-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.import-form > .button { width: 100%; cursor: pointer; }
.deck-detail { padding-block: 70px 110px; }
.deck-detail-heading, .detail-section-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.deck-detail-heading h1 { max-width: 850px; font-size: clamp(3.5rem, 7vw, 6.5rem); }
.deck-detail-heading p:last-child, .empty-state { color: var(--muted); }
.deck-detail-heading button { cursor: pointer; }
.detail-summary { display: grid; grid-template-columns: repeat(4, 1fr); margin: 58px 0 20px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.detail-summary > div { display: grid; align-content: space-between; gap: 18px; min-height: 116px; padding: 22px; }
.detail-summary > div:not(:nth-child(4n + 1)) { border-left: 1px solid var(--line); }
.detail-summary > div:nth-child(n + 5) { border-top: 1px solid var(--line); }
.detail-summary span { color: var(--muted); font-size: .68rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.detail-summary strong { font-size: 1.7rem; }
.detail-summary .land-count small { color: var(--muted); font-size: .72rem; font-weight: 700; white-space: nowrap; }
.coverage-summary-primary.onboarding-target { z-index: 1; background: linear-gradient(145deg, #2a190f, #17100c); box-shadow: inset 0 0 0 1px #ff7a1855; }
.coverage-onboarding-explainer { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 28px; align-items: center; margin: -4px 0 20px; padding: 16px 18px; border: 1px solid #ff7a1855; border-radius: 14px; background: linear-gradient(145deg, #18100c, #0d0b09); }
.coverage-onboarding-copy { display: grid; gap: 4px; }
.coverage-onboarding-explainer p { margin: 0; color: var(--muted); font-size: .73rem; line-height: 1.5; }
.coverage-onboarding-explainer p b { color: var(--ink); font-size: .79rem; }
.coverage-onboarding-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 18px; }
.coverage-onboarding-explainer a { width: fit-content; color: var(--gold); font-size: .75rem; font-weight: 800; text-decoration: none; }
.coverage-onboarding-explainer a:hover, .coverage-onboarding-explainer a:focus-visible { color: var(--ink); text-decoration: underline; }
.readiness-panel { display: grid; grid-template-columns: .7fr 1.3fr; gap: 40px; padding: 28px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(145deg, #1a130f, #0f0d0b); }
.readiness-panel.is-ready { border-color: #ff7a1866; }
.readiness-panel h2, .detail-section h2 { font-family: var(--body); font-size: 1.5rem; line-height: 1.1; text-transform: none; letter-spacing: -.035em; }
.readiness-panel ul { margin: 0; padding-left: 20px; color: var(--muted); }
.modeling-guide { display: grid; gap: 22px; margin-top: 18px; padding: 28px; border: 1px solid #ff7a1840; border-radius: 18px; background: linear-gradient(145deg, #17110e, #0d0c0b); }
.modeling-guide-heading { display: grid; grid-template-columns: minmax(0, .8fr) minmax(320px, 1.2fr); gap: 42px; align-items: end; }
.modeling-guide-heading h2 { margin: 0; font-family: var(--body); font-size: 1.5rem; line-height: 1.1; letter-spacing: -.035em; text-transform: none; }
.modeling-guide-heading > p { margin: 0; color: var(--muted); font-size: .8rem; line-height: 1.55; }
.modeling-guide-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.modeling-guide-grid article { padding: 16px; border: 1px solid var(--line); border-radius: 13px; background: #08070699; }
.modeling-guide-grid strong { color: var(--gold); font-size: .78rem; }
.modeling-guide-grid p { margin: 6px 0 0; color: var(--muted); font-size: .72rem; line-height: 1.5; }
.modeling-priority-guidance { margin: 0; padding: 14px 16px; border-left: 3px solid var(--gold); background: #ff7a180d; color: var(--muted); font-size: .76rem; line-height: 1.5; }
.modeling-priority-guidance strong { color: var(--ink); }
.report-overlay-cta { display: flex; align-items: center; justify-content: space-between; gap: 40px; margin-top: 24px; padding: 26px 28px; border: 1px solid #79d6c566; border-radius: 18px; background: linear-gradient(135deg, #13302b, #12100e 68%); }
.report-overlay-cta .eyebrow { margin-bottom: 5px; color: #79d6c5; }
.report-overlay-cta h2 { font-family: var(--body); font-size: 1.5rem; line-height: 1.1; text-transform: none; letter-spacing: -.035em; }
.report-overlay-cta p:last-child { max-width: 650px; margin: 8px 0 0; color: var(--muted); font-size: .8rem; }
.report-overlay-cta .button { flex: none; }
.detail-section { margin-top: 70px; }
.detail-section-heading { margin-bottom: 20px; }
.detail-section-heading > span { max-width: 330px; color: var(--muted); font-size: .75rem; }
.coverage-browser { display: grid; grid-template-columns: minmax(260px, 360px) 1fr; gap: 28px; align-items: start; }
.card-preview { position: sticky; top: 24px; }
.card-preview::before { position: absolute; z-index: 1; content: ""; inset: 0; border-radius: 14px; background: #08070699; opacity: 0; pointer-events: none; transition: opacity .18s ease; }
.card-preview::after { position: absolute; z-index: 2; content: ""; width: 30px; height: 30px; top: calc(50% - 18px); left: calc(50% - 18px); border: 3px solid #ffb15c4d; border-top-color: var(--mint); border-radius: 50%; opacity: 0; pointer-events: none; }
.card-preview img { display: block; width: 100%; height: auto; border-radius: 14px; background: var(--surface-raised); box-shadow: 0 22px 60px #0008; transition: filter .18s ease, opacity .18s ease; }
.card-preview.is-loading::before, .card-preview.is-loading::after { opacity: 1; }
.card-preview.is-loading::after { animation: spin .8s linear infinite; }
.card-preview.is-loading img { filter: saturate(.65); opacity: .62; }
.card-preview.has-error::before { opacity: 1; }
.card-preview.has-error::after { content: "Image unavailable"; width: auto; height: auto; top: 50%; left: 50%; padding: 7px 10px; border: 1px solid #ff8b6866; border-radius: 8px; background: #080706dd; color: #ffb19c; font-size: .7rem; transform: translate(-50%, -50%); opacity: 1; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) {
  .card-preview.is-loading::after { animation: none; }
}
.coverage-groups { display: grid; gap: 14px; }
.coverage-group { padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.coverage-heading { display: flex; align-items: start; justify-content: space-between; gap: 20px; }
.coverage-heading .eyebrow { margin-bottom: 5px; }
.coverage-heading strong { font-size: 1.4rem; }
.coverage-heading > span { color: var(--gold); font-size: 1.25rem; font-weight: 800; }
.coverage-group > p { color: var(--muted); font-size: .78rem; }
.coverage-group ul, .run-list { margin: 0; padding: 0; list-style: none; }
.coverage-group li { display: grid; padding: 9px 0; border-top: 1px solid var(--line); font-size: .85rem; }
.coverage-group li small { color: #d89175; }
.coverage-card { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 8px; width: 100%; padding: 10px 4px; border: 0; background: transparent; color: var(--ink); font: inherit; text-align: left; cursor: pointer; list-style: none; }
.coverage-card::-webkit-details-marker { display: none; }
.coverage-card::after { grid-column: 3; grid-row: 1; content: "+"; color: var(--muted); font-size: 1rem; line-height: 1; }
.coverage-card-disclosure[open] > .coverage-card::after { content: "−"; color: var(--gold); }
.coverage-card:hover, .coverage-card:focus-visible { color: var(--gold); outline: none; background: #ffffff05; }
.coverage-card-count { color: var(--muted); text-align: center; }
.coverage-card-name { min-width: 0; overflow-wrap: anywhere; }
.coverage-card small { grid-column: 2 / 4; color: #d89175; }
.coverage-card .coverage-readiness-status { color: var(--mint); font-weight: 750; }
.coverage-card .coverage-queue-status { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; color: var(--muted); }
.coverage-queue-status strong { padding: 3px 7px; border: 1px solid #d8917570; border-radius: 999px; color: #f1af91; font-size: .64rem; letter-spacing: .05em; text-transform: uppercase; }
.coverage-assessment-form { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; margin: 2px 4px 10px 40px; padding: 10px 12px; border: 1px solid #ff7a1840; border-radius: 10px; background: #ff7a180a; }
.coverage-assessment-form span { color: var(--muted); font-size: .72rem; }
.coverage-card-onboarding-target { scroll-margin-top: 24px; border-radius: 12px; }
.coverage-card-onboarding-target:target { padding-inline: 10px; background: #ff7a180a; box-shadow: inset 0 0 0 1px #ff7a1855; }
.coverage-priority-tour { position: relative; display: none; gap: 6px; margin: 4px 4px 14px 40px; padding: 16px; border: 1px solid #ff7a1870; border-radius: 12px; background: linear-gradient(145deg, #24150e, #100d0a); }
.coverage-card-onboarding-target:target .coverage-priority-tour { display: grid; }
.coverage-priority-tour::after { position: absolute; bottom: -8px; left: 23px; width: 14px; height: 14px; border-right: 1px solid #ff7a1870; border-bottom: 1px solid #ff7a1870; content: ""; background: #100d0a; transform: rotate(45deg); }
.coverage-priority-tour .eyebrow { margin: 0; }
.coverage-priority-tour > strong { color: var(--ink); font-size: .88rem; }
.coverage-priority-tour > p:not(.eyebrow) { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.55; }
.coverage-priority-tour .coverage-priority-simulation-link { width: fit-content; margin-top: 4px; color: var(--gold); font-size: .75rem; font-weight: 800; text-decoration: none; }
.coverage-priority-tour .coverage-priority-simulation-link:hover, .coverage-priority-tour .coverage-priority-simulation-link:focus-visible { color: var(--ink); text-decoration: underline; }
.coverage-priority-form { display: grid; grid-template-columns: auto minmax(160px, 1fr); align-items: center; gap: 10px; margin: 0 4px 10px 40px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: #080706; }
.coverage-priority-form label { display: inline-flex; align-items: center; gap: 8px; color: var(--ink); font-size: .76rem; font-weight: 800; cursor: pointer; }
.coverage-priority-form input { width: 18px; height: 18px; margin: 0; accent-color: var(--gold); cursor: pointer; }
.coverage-priority-form input:focus-visible { outline: 3px solid #ff7a1845; outline-offset: 3px; }
.coverage-priority-form small { color: var(--muted); font-size: .7rem; line-height: 1.4; }
.coverage-priority-form .coverage-priority-feedback { color: var(--mint); font-weight: 750; }
.coverage-priority-form.onboarding-target { border-color: #ff7a1890; box-shadow: 0 0 0 3px #ff7a1815; }
.coverage-card-definition { margin: 4px 4px 10px 40px; }
.coverage-card-definition-loading, .coverage-card-definition-empty { margin: 0; padding: 16px; border: 1px solid var(--line); border-radius: 12px; color: var(--muted); font-size: .75rem; }
.coverage-card-definition-content { display: grid; gap: 14px; min-width: 0; padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: #080706; }
.coverage-card-definition-content h3 { margin: 3px 0 0; font-family: var(--body); font-size: 1.1rem; line-height: 1.2; letter-spacing: -.02em; }
.coverage-card-definition-content > div > p:last-child { margin: 5px 0 0; color: var(--muted); font-size: .7rem; }
.coverage-card-definition-content pre { max-height: 440px; margin: 0; padding: 16px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; outline: none; background: #050403; color: #e8ded4; font: .7rem/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; tab-size: 2; }
.coverage-card-definition-content pre:focus-visible { border-color: var(--mint); box-shadow: 0 0 0 3px #ff7a181c; }
.detail-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 34px; }
.raw-deck-list { max-height: 520px; padding: 20px; overflow: auto; border: 1px solid var(--line); border-radius: 14px; background: #080706; color: #d9cec5; font: .8rem/1.65 ui-monospace, monospace; white-space: pre-wrap; }
.run-list li { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 16px 0; border-top: 1px solid var(--line); }
.run-list li > div { display: grid; gap: 3px; }
.run-list li > div:last-child { justify-items: end; }
.run-list li span { color: var(--muted); font-size: .7rem; }
.run-list li a { color: var(--gold); font-size: .78rem; text-decoration: none; }
.run-status { font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.run-status.status-completed { color: var(--mint); }
.run-status.status-failed { color: #ff8b68; }
.snapshot-update form { max-width: 760px; padding: 26px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.snapshot-update form > .button { width: 100%; cursor: pointer; }
.snapshot-list { margin: 0; padding: 0; border-top: 1px solid var(--line); list-style: none; }
.snapshot-list li { display: grid; grid-template-columns: minmax(180px, .7fr) minmax(240px, 1.3fr) auto; gap: 24px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--line); }
.snapshot-list li > div { display: flex; align-items: center; gap: 10px; }
.snapshot-list li > div:nth-child(2) { align-items: flex-start; flex-direction: column; gap: 3px; }
.snapshot-list .snapshot-identity { flex-wrap: wrap; }
.snapshot-friendly-name { width: 100%; overflow-wrap: anywhere; }
.snapshot-list code { color: var(--gold); }
.snapshot-list span { color: var(--muted); font-size: .7rem; }
.snapshot-list a, .detail-section-heading > a { color: var(--gold); font-size: .76rem; text-decoration: none; }
.snapshot-list .snapshot-actions { align-items: flex-end; flex-direction: column; }
.snapshot-name-form { display: flex; gap: 8px; }
.snapshot-name-form input { width: 180px; min-height: 38px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; outline: none; background: #080706; color: var(--ink); font: inherit; }
.snapshot-name-form input:focus { border-color: var(--mint); box-shadow: 0 0 0 3px #ff7a181c; }
.snapshot-name-form .button { cursor: pointer; white-space: nowrap; }
.snapshot-actions form { margin: 0; }
.button-danger { border-color: #9d3a32; color: #ffb4a8; }
.button-danger:hover { border-color: #e76152; background: #6d211d; }
.snapshot-protected { max-width: 220px; text-align: right; }
.snapshot-current { padding: 4px 7px; border-radius: 999px; background: #ff7a1818; color: var(--mint) !important; font-weight: 800; text-transform: uppercase; }
.snapshot-comparison { padding-block: 78px 110px; }
.snapshot-comparison-heading h1 { font-size: clamp(4rem, 9vw, 7.5rem); }
.snapshot-comparison-heading > p:last-child { color: var(--muted); }
.snapshot-comparison-heading code { color: var(--gold); }
.snapshot-picker { display: grid; grid-template-columns: 1fr auto 1fr auto; gap: 18px; align-items: end; margin: 52px 0 24px; padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.snapshot-picker label { display: grid; gap: 7px; color: var(--muted); font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.snapshot-picker select { min-height: 46px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: #080706; color: var(--ink); font: inherit; }
.snapshot-change-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.snapshot-change-column { padding: 26px; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(145deg, #17110e, #0d0c0b); }
.snapshot-change-column.is-out { border-top-color: #ff8b68; }
.snapshot-change-column.is-in { border-top-color: var(--mint); }
.snapshot-change-column h2 { font-family: var(--body); font-size: 1.35rem; text-transform: none; }
.snapshot-change-list { margin: 20px 0 0; padding: 0; list-style: none; }
.snapshot-change-list li { display: grid; grid-template-columns: 1fr auto; gap: 2px 16px; padding: 12px 0; border-top: 1px solid var(--line); }
.snapshot-change-list strong { color: var(--gold); }
.snapshot-change-list small { grid-column: 1 / -1; color: var(--muted); }
.snapshot-report-readiness { display: grid; grid-template-columns: 1.2fr .8fr; gap: 60px; align-items: start; margin-top: 64px; padding-top: 52px; border-top: 1px solid var(--line); }
.snapshot-report-readiness h2 { font-size: clamp(2rem, 4vw, 3.5rem); }
.snapshot-report-readiness p:last-child { max-width: 680px; color: var(--muted); }
.snapshot-report-readiness dl { margin: 0; border: 1px solid var(--line); border-radius: 16px; }
.snapshot-report-readiness dl > div { display: flex; justify-content: space-between; gap: 16px; padding: 18px; }
.snapshot-report-readiness dl > div + div { border-top: 1px solid var(--line); }
.snapshot-report-readiness dt { color: var(--gold); font-family: ui-monospace, monospace; }
.snapshot-report-readiness dd { margin: 0; color: var(--muted); }
.snapshot-report-readiness .button { margin-top: 18px; }

.snapshot-report-comparison { padding-block: 78px 120px; }
.snapshot-overlay-heading h1 { max-width: 900px; font-size: clamp(4rem, 9vw, 7.5rem); }
.snapshot-overlay-heading > p:last-child { max-width: 720px; color: var(--muted); }
.snapshot-report-picker { display: grid; grid-template-columns: minmax(250px, .75fr) minmax(420px, 1.25fr); gap: 28px 46px; align-items: start; margin-top: 58px; padding: 28px; border: 1px solid var(--line); border-radius: 20px; background: var(--surface); }
.snapshot-report-picker h2 { font-size: clamp(2rem, 3vw, 3rem); }
.snapshot-report-picker > div > p:last-child { color: var(--muted); font-size: .8rem; }
.snapshot-report-picker fieldset { display: grid; gap: 8px; margin: 0; padding: 0; border: 0; }
.snapshot-report-picker legend { margin-bottom: 8px; color: var(--muted); font-size: .68rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.snapshot-report-picker fieldset label { display: flex; align-items: center; gap: 12px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 11px; background: #090706; cursor: pointer; }
.snapshot-report-picker fieldset label:has(input:checked) { border-color: #ff7a1866; background: #ff7a180c; }
.snapshot-report-picker input { width: 17px; height: 17px; margin: 0; accent-color: var(--mint); }
.snapshot-report-picker label span { display: grid; gap: 2px; }
.snapshot-report-picker label strong { overflow-wrap: anywhere; font-size: .78rem; }
.snapshot-report-picker code { color: var(--gold); font-size: .76rem; }
.snapshot-report-picker small { color: var(--muted); font-size: .66rem; }
.snapshot-report-picker > .button { grid-column: 2; justify-self: end; cursor: pointer; }
.snapshot-overlay-section { margin-top: 86px; padding-top: 70px; border-top: 1px solid var(--line); }
.snapshot-overlay-section-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, .6fr); gap: 52px; align-items: end; margin-bottom: 32px; }
.snapshot-overlay-section-heading h2 { font-size: clamp(2.5rem, 4.5vw, 4.5rem); }
.snapshot-overlay-section-heading > p { max-width: 520px; margin: 0; color: var(--muted); font-size: .82rem; }
.snapshot-overlay-snapshots, .snapshot-overlay-commander-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
.snapshot-overlay-snapshots > article, .snapshot-overlay-commander-grid > article { min-width: 0; padding: 22px; border: 1px solid var(--line); border-top: 3px solid var(--series-color); border-radius: 16px; background: linear-gradient(145deg, #19130f, #0e0c0b); }
.snapshot-overlay-snapshots header, .snapshot-overlay-commander-grid header { display: flex; align-items: center; gap: 10px; }
.snapshot-overlay-snapshots header i, .snapshot-overlay-commander-grid header i { flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--series-color); box-shadow: 0 0 14px var(--series-color); }
.snapshot-overlay-snapshots header div, .snapshot-overlay-commander-grid header div { display: grid; gap: 2px; min-width: 0; }
.snapshot-overlay-snapshots header strong, .snapshot-overlay-commander-grid header strong { overflow-wrap: anywhere; }
.snapshot-overlay-snapshots code, .snapshot-overlay-commander-grid code { color: var(--series-color); font-size: .8rem; font-weight: 780; }
.snapshot-overlay-snapshots header span, .snapshot-overlay-snapshots > article > p { color: var(--muted); font-size: .68rem; }
.snapshot-overlay-snapshots > article > p { margin: 13px 0; }
.snapshot-overlay-card-delta { min-height: 76px; padding-block: 4px 12px; border-block: 1px solid var(--line); }
.snapshot-overlay-change-list, .snapshot-overlay-full-list { margin: 0; padding: 0; list-style: none; }
.snapshot-overlay-change-list + .snapshot-overlay-change-list { border-top: 1px solid #35282099; }
.snapshot-overlay-change-list li, .snapshot-overlay-full-list li { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; font-size: .72rem; }
.snapshot-overlay-change-list .is-in { color: #79d6c5; }
.snapshot-overlay-change-list .is-out { color: #ff9d81; }
.snapshot-overlay-no-change, .snapshot-overlay-baseline { display: block; padding: 8px 0; color: var(--muted); font-size: .7rem; }
.snapshot-overlay-snapshots details { margin-top: 14px; }
.snapshot-overlay-snapshots summary { color: var(--muted); font-size: .7rem; cursor: pointer; }
.snapshot-overlay-full-list { max-height: 290px; margin-top: 9px; padding-right: 8px; overflow: auto; border-top: 1px solid var(--line); }
.snapshot-overlay-full-list strong { color: var(--gold); }
.snapshot-overlay-snapshots > article > a { display: inline-block; margin-top: 16px; color: var(--gold); font-size: .72rem; font-weight: 750; text-decoration: none; }
.snapshot-overlay-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 16px; }
.snapshot-overlay-table { width: 100%; border-collapse: collapse; background: var(--surface); }
.snapshot-overlay-table th, .snapshot-overlay-table td { padding: 15px 18px; border-bottom: 1px solid var(--line); text-align: center; }
.snapshot-overlay-table tr:last-child th, .snapshot-overlay-table tr:last-child td { border-bottom: 0; }
.snapshot-overlay-table th:first-child { text-align: left; }
.snapshot-overlay-table thead th { color: var(--muted); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.snapshot-overlay-table thead span { display: block; margin-bottom: 3px; overflow-wrap: anywhere; }
.snapshot-overlay-table thead code { color: var(--gold); text-transform: none; }
.snapshot-overlay-table tbody th { font-size: .82rem; }
.snapshot-overlay-table td { color: #ded4ca; font-variant-numeric: tabular-nums; }
.snapshot-overlay-commander-grid article dl { margin: 17px 0 0; }
.snapshot-overlay-commander-grid article dl > div { display: flex; justify-content: space-between; gap: 14px; padding: 10px 0; border-top: 1px solid var(--line); }
.snapshot-overlay-commander-grid dt { color: var(--muted); font-size: .7rem; }
.snapshot-overlay-commander-grid dd { margin: 0; font-weight: 800; font-variant-numeric: tabular-nums; }
.snapshot-overlay-warning { margin: 0 0 18px; padding: 13px 16px; border: 1px solid #ffb15c55; border-radius: 11px; background: #ffb15c0b; color: #ffd3a3; font-size: .76rem; }
.snapshot-overlay-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.snapshot-overlay-chart { min-width: 0; margin: 0; padding: 20px; border: 1px solid var(--line); border-radius: 17px; background: #0d0b0a; }
.snapshot-overlay-chart figcaption { display: grid; gap: 13px; }
.snapshot-overlay-chart figcaption h3 { margin: 0; font-size: 1rem; }
.snapshot-overlay-chart figcaption p { margin: 3px 0 0; color: var(--muted); font-size: .7rem; }
.snapshot-overlay-legend { display: flex; flex-wrap: wrap; gap: 7px 14px; }
.snapshot-overlay-legend span { display: flex; align-items: center; gap: 6px; font-size: .66rem; }
.snapshot-overlay-legend i { width: 8px; height: 8px; border-radius: 50%; background: var(--series-color); }
.snapshot-overlay-legend code { color: var(--series-color); }
.snapshot-overlay-legend strong { color: #ddd3ca; font-variant-numeric: tabular-nums; }
.snapshot-overlay-chart svg { display: block; width: 100%; margin-top: 14px; overflow: visible; }
.snapshot-overlay-grid-line, .snapshot-overlay-axis { stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.snapshot-overlay-zero-line { stroke: #8d8178; stroke-width: 1; vector-effect: non-scaling-stroke; }
.snapshot-overlay-axis-label { fill: var(--muted); font-size: 11px; }
.snapshot-overlay-line { fill: none; stroke: var(--series-color); stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.snapshot-overlay-point { fill: var(--page); stroke: var(--series-color); stroke-width: 2; vector-effect: non-scaling-stroke; }
.snapshot-overlay-end-label { fill: var(--series-color); font-size: 11px; font-weight: 780; }
.snapshot-overlay-empty { margin-top: 60px; padding: 60px; border: 1px dashed var(--line); border-radius: 18px; text-align: center; }
.snapshot-overlay-empty h2 { margin-inline: auto; font-size: clamp(2rem, 4vw, 3.5rem); }
.snapshot-overlay-empty p { color: var(--muted); }

.card-database { padding-block: 70px 110px; }
.card-database-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.card-database-heading h1 { font-size: clamp(3.8rem, 8vw, 7rem); }
.card-database-heading p:last-child { max-width: 650px; margin: 20px 0 0; color: var(--muted); }
.card-database-heading > span { color: var(--gold); font-size: .78rem; font-weight: 780; white-space: nowrap; }
.card-database-summaries { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: 58px 0 80px; }
.card-database-category-summary { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
.card-database-category-summary header { display: flex; align-items: end; justify-content: space-between; gap: 24px; padding: 24px; border-bottom: 1px solid var(--line); background: #ff7a180d; }
.card-database-category-summary header > div { min-width: 0; }
.card-database-category-summary header > div:last-child { text-align: right; }
.card-database-category-summary header p { margin: 0 0 7px; color: var(--muted); font-size: .68rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.card-database-category-summary header strong { color: var(--gold); font: 900 clamp(2rem, 4vw, 3.5rem)/.95 var(--display); letter-spacing: -.04em; }
.card-database-category-summary header > div:last-child strong { color: var(--text); font-size: clamp(1.45rem, 3vw, 2.3rem); }
.card-database-category-summary header span { color: var(--muted); font-size: .7rem; }
.card-database-category-summary dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
.card-database-category-summary dl div { min-width: 0; padding: 18px 20px; }
.card-database-category-summary dl div + div { border-left: 1px solid var(--line); }
.card-database-category-summary dt { color: var(--muted); font-size: .63rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.card-database-category-summary dd { margin: 6px 0 0; font: 850 1.25rem/1 var(--display); }
.card-catalog-categories { display: flex; gap: 8px; margin-bottom: 30px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.card-catalog-categories button { display: inline-flex; align-items: center; gap: 9px; min-height: 42px; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; background: transparent; color: var(--muted); font: inherit; font-size: .75rem; font-weight: 780; cursor: pointer; }
.card-catalog-categories button span { min-width: 28px; padding: 3px 7px; border-radius: 999px; background: #ffffff0b; color: inherit; font-size: .64rem; text-align: center; }
.card-catalog-categories button:hover, .card-catalog-categories button:focus-visible { border-color: var(--mint); color: var(--text); }
.card-catalog-categories button:focus-visible { outline: 2px solid var(--mint); outline-offset: 3px; }
.card-catalog-categories button[aria-pressed="true"] { border-color: #ff7a1866; background: #ff7a1814; color: var(--gold); }
.card-catalog-toolbar { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 16px; }
.card-catalog-toolbar h2 { font-family: var(--body); font-size: 1.45rem; line-height: 1.1; text-transform: none; letter-spacing: -.035em; }
.card-search-field { display: grid; gap: 7px; width: min(100%, 430px); }
.card-search-field label { color: #d4c9bf; font-size: .7rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.card-search-field input { width: 100%; min-height: 50px; padding: 0 14px; border: 1px solid var(--line); border-radius: 11px; outline: none; background: #080706; color: var(--ink); font: inherit; }
.card-search-field input:focus { border-color: var(--mint); box-shadow: 0 0 0 3px #ff7a181c; }
.card-search-field input::placeholder { color: #776b61; }
.card-search-status { min-height: 24px; margin: 0 0 12px; color: var(--muted); font-size: .75rem; }
.card-catalog-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.card-catalog-entry { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(145deg, #1a130f, #0f0d0b); }
.card-catalog-entry[hidden] { display: none; }
.card-catalog-card-link { display: block; color: inherit; text-decoration: none; }
.card-catalog-card-link:hover h2, .card-catalog-card-link:focus-visible h2 { color: var(--gold); }
.card-catalog-card-link:focus-visible { outline: 2px solid var(--mint); outline-offset: 7px; border-radius: 8px; }
.card-catalog-entry-heading { display: flex; align-items: start; justify-content: space-between; gap: 14px; }
.card-catalog-entry h2 { overflow-wrap: anywhere; font-family: var(--body); font-size: 1rem; line-height: 1.2; text-transform: none; letter-spacing: -.025em; }
.card-catalog-entry-heading p, .card-catalog-card-link > p { margin: 5px 0 0; color: var(--muted); font-size: .7rem; }
.card-catalog-card-link > p { min-height: 34px; margin-top: 18px; }
.card-catalog-view { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; color: var(--gold); font-size: .69rem; font-weight: 780; }
.card-status-badge { flex: none; padding: 5px 8px; border: 1px solid; border-radius: 999px; font-size: .61rem; font-weight: 820; white-space: nowrap; }
.status-fully-modelled .card-status-badge { border-color: #ff7a1855; background: #ff7a1814; color: var(--gold); }
.status-partially-modelled .card-status-badge { border-color: #ffb15c55; background: #ffb15c12; color: #ffc98d; }
.status-not-modelled .card-status-badge { border-color: #78685d; background: #ffffff07; color: #c1b4aa; }
.card-catalog-notes { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); color: #d89175; font-size: .7rem; }
.card-catalog-notes summary { cursor: pointer; font-weight: 750; }
.card-catalog-notes summary:focus-visible { outline: 2px solid var(--mint); outline-offset: 3px; }
.card-catalog-notes ul { margin: 10px 0 0; padding-left: 18px; }
.card-catalog-notes li + li { margin-top: 8px; }
.card-search-empty { padding: 40px; border: 1px dashed var(--line); border-radius: 16px; color: var(--muted); text-align: center; }

.card-detail { padding-block: 48px 110px; }
.card-detail-back { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 34px; color: var(--muted); font-size: .78rem; font-weight: 750; text-decoration: none; }
.card-detail-back:hover, .card-detail-back:focus-visible { color: var(--gold); }
.card-detail-layout { display: grid; grid-template-columns: minmax(270px, 360px) minmax(0, 1fr); gap: clamp(38px, 6vw, 78px); align-items: start; }
.card-detail-visual { position: sticky; top: 24px; margin: 0; }
.card-detail-visual img { display: block; width: 100%; height: auto; border-radius: 18px; background: var(--surface-raised); box-shadow: 0 28px 70px #0009; }
.card-detail-visual p { margin: 14px 0 0; color: var(--muted); font-size: .68rem; text-align: center; }
.card-detail-content { min-width: 0; }
.card-detail-heading { padding-bottom: 34px; border-bottom: 1px solid var(--line); }
.card-detail-title { display: flex; align-items: start; justify-content: space-between; gap: 24px; }
.card-detail-title h1 { max-width: 760px; font-size: clamp(3.4rem, 6vw, 6.2rem); overflow-wrap: anywhere; }
.card-detail-title > div > p, .card-detail-heading > p:last-child { color: var(--muted); }
.card-detail-title > div > p { margin: 14px 0 0; font-size: .78rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.card-detail-title > .card-status-badge { margin-top: 8px; }
.card-detail-heading > p:last-child { max-width: 610px; margin: 24px 0 0; }
.card-detail-unsupported { margin-top: 28px; padding: 24px; border: 1px solid #ffb15c55; border-radius: 16px; background: #ffb15c0b; }
.card-detail-unsupported h2, .card-dsl-panel h2 { font-family: var(--body); font-size: 1.35rem; line-height: 1.1; text-transform: none; letter-spacing: -.025em; }
.card-detail-unsupported ul { margin: 16px 0 0; padding-left: 20px; color: #d89175; font-size: .8rem; }
.card-dsl-panel { margin-top: 48px; }
.card-dsl-panel > div > p:last-child { margin: 8px 0 20px; color: var(--muted); font-size: .76rem; }
.card-dsl-panel > div code { color: var(--gold); }
.card-dsl-panel pre { max-height: 72vh; margin: 0; padding: 24px; overflow: auto; border: 1px solid var(--line); border-radius: 16px; outline: none; background: #050403; color: #e8ded4; font: .76rem/1.65 ui-monospace, SFMono-Regular, Consolas, monospace; tab-size: 2; }
.card-dsl-panel pre:focus-visible { border-color: var(--mint); box-shadow: 0 0 0 3px #ff7a181c; }

.comparison-report-body {
  --report-miles: #8bd5ff;
  --report-andy: var(--mint);
  background:
    radial-gradient(circle at 88% -8%, #4c1d0b 0, transparent 32rem),
    radial-gradient(circle at -5% 38%, #0c3144 0, transparent 28rem),
    var(--page);
}
.comparison-hero { padding-block: 96px 86px; }
.comparison-hero h1 { max-width: 940px; }
.comparison-hero h1 em { color: var(--mint); font-style: normal; }
.comparison-lede { max-width: 760px; margin: 28px 0 0; color: #c8beb5; font-size: clamp(1.05rem, 2vw, 1.3rem); }
.comparison-run-meta { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 32px; }
.comparison-run-meta span { padding: 7px 12px; border: 1px solid var(--line); border-radius: 999px; background: #ffffff08; color: var(--muted); font-size: .73rem; }
.comparison-method { display: grid; grid-template-columns: minmax(0, .9fr) minmax(480px, 1.1fr); gap: 70px; align-items: start; padding-block: 56px 78px; border-top: 1px solid var(--line); }
.comparison-method h2 { font-size: clamp(2.3rem, 4vw, 4rem); }
.comparison-method ol { margin: 0; padding: 0; list-style: none; }
.comparison-method li { display: grid; grid-template-columns: 44px 1fr; gap: 16px; padding: 18px 0; border-top: 1px solid var(--line); }
.comparison-method li:last-child { border-bottom: 1px solid var(--line); }
.comparison-method li > span { color: var(--gold); font-size: .72rem; font-weight: 850; letter-spacing: .08em; }
.comparison-method li strong { font-size: .94rem; }
.comparison-method li p { margin: 4px 0 0; color: var(--muted); font-size: .8rem; }
.comparison-changes, .comparison-snapshot, .comparison-development { padding-block: 78px; border-top: 1px solid var(--line); }
.comparison-section-heading { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .7fr); gap: 50px; align-items: end; margin-bottom: 34px; }
.comparison-section-heading h2 { max-width: 780px; }
.comparison-section-heading > p { max-width: 500px; margin: 0; color: var(--muted); }
.comparison-change-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 24px; border-block: 1px solid var(--line); }
.comparison-change-summary div { display: grid; gap: 2px; padding: 18px 20px; }
.comparison-change-summary div + div { border-left: 1px solid var(--line); }
.comparison-change-summary strong { font: 900 2.1rem/1 var(--display); }
.comparison-change-summary span { color: var(--muted); font-size: .72rem; }
.comparison-change-browser { display: grid; grid-template-columns: minmax(210px, 260px) minmax(0, 1fr); gap: 24px; align-items: start; }
.comparison-card-preview { display: grid; gap: 14px; padding: 12px; border: 1px solid var(--line); border-radius: 18px; background: #0d0b0a; }
.comparison-card-preview-button { display: block; min-width: 0; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.comparison-card-preview-button:focus-visible { outline: 2px solid var(--mint); outline-offset: 4px; border-radius: 14px; }
.comparison-card-preview div { display: grid; gap: 3px; padding: 2px 4px 5px; }
.comparison-card-preview span, .comparison-card-preview small { color: var(--muted); font-size: .68rem; }
.comparison-card-preview strong { overflow-wrap: anywhere; font-size: .82rem; }
.comparison-change-groups { display: grid; gap: 18px; }
.comparison-change-group { padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(145deg, #17110e, #0d0c0b); }
.comparison-change-group > header { display: flex; align-items: end; justify-content: space-between; gap: 28px; padding-bottom: 20px; }
.comparison-change-group > header .eyebrow { margin-bottom: 5px; }
.comparison-change-group > header h3 { margin: 0; font-size: 1.2rem; }
.comparison-change-group > header > strong { color: var(--gold); font-size: .82rem; }
.comparison-change-lists { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.comparison-change-column { min-width: 0; padding-top: 18px; }
.comparison-change-column + .comparison-change-column { padding-left: 28px; border-left: 1px solid var(--line); }
.comparison-change-column:first-child { padding-right: 28px; }
.comparison-change-column h4 { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; color: var(--muted); font-size: .69rem; letter-spacing: .12em; text-transform: uppercase; }
.comparison-change-column h4 span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; font-size: .9rem; }
.comparison-change-column.out h4 span { background: #ff8b6817; color: #ff9d81; }
.comparison-change-column.in h4 span { background: #ff7a181c; color: var(--mint); }
.comparison-change-column ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; margin: 0; padding: 0; list-style: none; }
.comparison-change-column li { border-top: 1px solid #35282099; }
.comparison-change-card { display: flex; justify-content: space-between; gap: 12px; width: 100%; padding: 8px 0; border: 0; background: transparent; color: #d7cec7; font: inherit; font-size: .78rem; text-align: left; cursor: pointer; }
.comparison-change-card:hover, .comparison-change-card:focus-visible, .comparison-change-card[aria-pressed="true"] { color: var(--gold); }
.comparison-change-card:focus-visible { outline: 2px solid var(--mint); outline-offset: 3px; }
.comparison-change-card strong { color: var(--gold); font-variant-numeric: tabular-nums; }
.comparison-table-wrap { overflow-x: auto; }
.comparison-table { width: 100%; border-collapse: collapse; }
.comparison-table th, .comparison-table td { padding: 18px 14px; border-bottom: 1px solid var(--line); text-align: right; vertical-align: top; }
.comparison-table thead th { color: var(--muted); font-size: .67rem; letter-spacing: .1em; text-transform: uppercase; }
.comparison-table th:first-child, .comparison-table td:last-child { text-align: left; }
.comparison-table tbody th { font-size: .92rem; }
.comparison-table tbody td { font-variant-numeric: tabular-nums; }
.comparison-table tbody td:last-child { max-width: 280px; color: var(--muted); font-size: .8rem; font-variant-numeric: normal; }
.comparison-table .comparison-delta { color: var(--mint); font-weight: 800; }
.comparison-table .comparison-delta.is-cost { color: var(--gold); }
.comparison-legend { display: flex; flex-wrap: wrap; justify-content: end; gap: 18px; color: var(--muted); font-size: .78rem; }
.comparison-legend span { display: inline-flex; align-items: center; gap: 8px; }
.comparison-legend i { width: 28px; height: 0; border-top: 3px solid; }
.comparison-legend i.miles { border-color: var(--report-miles); }
.comparison-legend i.andy { border-color: var(--report-andy); border-top-style: dashed; }
.comparison-chart-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.comparison-chart-grid > :last-child:nth-child(odd) { grid-column: 1 / -1; }
.comparison-chart { margin: 0; padding: 22px; border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(145deg, #17110e, #0d0c0b); }
.comparison-chart figcaption { display: flex; align-items: start; justify-content: space-between; gap: 18px; }
.comparison-chart figcaption h3 { margin: 0; font-size: 1rem; }
.comparison-chart figcaption p { margin: 3px 0 0; color: var(--muted); font-size: .72rem; }
.comparison-chart figcaption > strong { color: var(--gold); font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.comparison-chart svg { display: block; width: 100%; margin-top: 12px; overflow: visible; }
.comparison-grid-line, .comparison-axis { stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }
.comparison-zero-line { stroke: #8d8178; stroke-width: 1; vector-effect: non-scaling-stroke; }
.comparison-axis-label { fill: var(--muted); font-size: 11px; }
.comparison-line { fill: none; stroke-width: 4; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.comparison-line.miles { stroke: var(--report-miles); }
.comparison-line.andy { stroke: var(--report-andy); stroke-dasharray: 9 6; }
.comparison-point { stroke-width: 2; vector-effect: non-scaling-stroke; }
.comparison-point.miles { fill: var(--page); stroke: var(--report-miles); }
.comparison-point.andy { fill: var(--report-andy); stroke: var(--report-andy); }
.comparison-end-label { fill: var(--ink); font-size: 11px; font-weight: 750; }
.comparison-commander { display: grid; grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr); gap: 70px; align-items: center; margin-block: 38px 90px; padding: 36px; border: 1px solid #ff7a1855; border-radius: 22px; background: linear-gradient(135deg, #25150d, #11100f 68%); }
.comparison-commander h2 { font-size: clamp(2.3rem, 4vw, 4rem); }
.comparison-commander > div:first-child > p:last-child { max-width: 610px; margin: 22px 0 0; color: var(--muted); }
.comparison-commander-values { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.comparison-commander-values article { padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: #ffffff06; }
.comparison-commander-values span, .comparison-commander-values small { display: block; color: var(--muted); font-size: .72rem; }
.comparison-commander-values strong { display: block; margin: 13px 0 6px; font: 900 3.2rem/.9 var(--display); letter-spacing: -.04em; }

.card-modeling { padding-block: 74px 110px; }
.card-modeling-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; }
.card-modeling-heading h1 { margin: 5px 0 12px; }
.card-modeling-heading p:last-child { max-width: 720px; color: var(--muted); }
.modeling-queue-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.modeling-priorities { margin-bottom: 24px; padding: 30px; border: 1px solid #ff7a1870; border-radius: 24px; background: linear-gradient(145deg, #21140e, var(--panel)); }
.modeling-priority-list { display: grid; gap: 14px; margin: 26px 0 0; padding: 0; list-style: none; counter-reset: priority; }
.modeling-priority-card { display: grid; grid-template-columns: 42px 122px minmax(0, 1fr); align-items: start; gap: 16px; padding: 18px; border: 1px solid var(--line); border-radius: 15px; background: #05040370; }
.modeling-priority-rank { display: grid; place-items: center; width: 42px; height: 42px; border: 1px solid #ff7a1870; border-radius: 50%; color: var(--orange); font: 900 1.25rem/1 var(--display); }
.modeling-priority-image { display: block; width: 122px; height: auto; border-radius: 8px; background: #15110e; box-shadow: 0 12px 28px #0008; }
.modeling-priority-content { min-width: 0; }
.modeling-priority-title { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.modeling-priority-title h3 { margin: 0; overflow-wrap: anywhere; font-size: 1.05rem; }
.modeling-priority-actions { display: flex; align-items: center; justify-content: flex-end; flex: none; flex-wrap: wrap; gap: 8px; }
.modeling-priority-status { padding: 4px 8px; border: 1px solid #ff7a1855; border-radius: 999px; color: var(--orange); font-size: .66rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.modeling-priority-codex-link { min-height: 30px; padding-inline: 11px; }
.modeling-priority-content > p { margin: 8px 0 12px; color: var(--muted); font-size: .78rem; }
.modeling-priority-contexts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.modeling-priority-contexts li { display: grid; gap: 3px; min-width: 0; padding: 10px; border-radius: 9px; background: #ffffff06; }
.modeling-priority-contexts strong, .modeling-priority-contexts span, .modeling-priority-contexts small { min-width: 0; overflow-wrap: anywhere; }
.modeling-priority-contexts strong { color: var(--ink); font-size: .76rem; }
.modeling-priority-contexts span, .modeling-priority-contexts small { color: var(--muted); font-size: .67rem; }
.modeling-queue { padding: 30px; border: 1px solid var(--line); border-radius: 24px; background: var(--panel); }
.modeling-queue-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.modeling-queue-heading h2 { margin: 5px 0 10px; font-size: 2rem; }
.modeling-queue-heading p:last-child { max-width: 520px; color: var(--muted); }
.modeling-queue-heading > strong { color: var(--orange); font: 900 3rem/1 var(--display); }
.modeling-queue ul { display: grid; gap: 12px; margin: 26px 0 0; padding: 0; list-style: none; }
.modeling-queue-card { padding: 18px; border: 1px solid var(--line); border-radius: 15px; background: #ffffff05; }
.modeling-queue-card > div { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.modeling-queue-card h3 { margin: 0; font-size: 1rem; }
.modeling-queue-card span, .modeling-queue-card small { color: var(--muted); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; }
.modeling-queue-card p { margin: 10px 0; color: var(--muted); font-size: .84rem; }
.modeling-queue-card details { margin-top: 14px; }
.modeling-queue-card summary { color: var(--orange); cursor: pointer; font-size: .78rem; font-weight: 800; }
.modeling-queue-card pre { max-height: 420px; overflow: auto; margin: 12px 0 0; padding: 14px; border-radius: 10px; background: #0008; color: var(--text); font-size: .68rem; white-space: pre-wrap; }
.modeling-queue-empty { margin: 28px 0 0; color: var(--muted); }
.simulation-metrics { min-height: calc(100vh - 82px); padding-block: 76px 110px; }
.simulation-metrics-heading { margin-bottom: 42px; }
.simulation-metrics-heading h1 { font-size: clamp(4rem, 8vw, 7.4rem); }
.simulation-metrics-heading p:last-child { max-width: 760px; margin: 18px 0 0; color: var(--muted); }
.simulation-metrics-groups { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-bottom: 30px; }
.simulation-metrics-groups > p { max-width: 580px; margin: 0; color: var(--muted); font-size: .78rem; line-height: 1.6; }
.simulation-metrics-groups > p strong { color: var(--ink); }
.simulation-metrics-group-tabs { display: flex; gap: 8px; margin-top: 10px; }
.simulation-metrics-group-tabs a { padding: 10px 15px; border: 1px solid var(--line); border-radius: 999px; background: var(--panel); color: var(--muted); font-size: .76rem; font-weight: 800; text-decoration: none; white-space: nowrap; }
.simulation-metrics-group-tabs a:hover { border-color: #ff7a1866; color: var(--ink); }
.simulation-metrics-group-tabs a:focus-visible { outline: 2px solid var(--mint); outline-offset: 3px; }
.simulation-metrics-group-tabs a[aria-current="page"] { border-color: var(--mint); background: var(--mint); color: #17100a; }
.simulation-metric-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin-bottom: 30px; }
.simulation-metric-cards article { display: flex; min-height: 160px; flex-direction: column; justify-content: space-between; padding: 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--panel); }
.simulation-metric-cards span, .simulation-metric-cards small { color: var(--muted); font-size: .68rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.simulation-metric-cards strong { color: var(--orange); font: 900 clamp(2rem, 4vw, 3.6rem)/1 var(--display); font-variant-numeric: tabular-nums; }
.simulation-coverage-summary { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(240px, .8fr); gap: 26px 36px; margin-bottom: 30px; padding: 30px; border: 1px solid var(--line); border-radius: 24px; background: linear-gradient(135deg, #ffffff08, #83f5c912); }
.simulation-coverage-copy h2 { margin: 5px 0 12px; font-size: clamp(2rem, 4vw, 3.2rem); }
.simulation-coverage-copy > p:last-child, .simulation-coverage-definition { margin: 0; color: var(--muted); font-size: .82rem; line-height: 1.65; }
.simulation-coverage-headlines { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.simulation-coverage-headline { display: flex; flex-direction: column; justify-content: center; }
.simulation-coverage-headline strong { color: var(--mint); font: 900 clamp(2.8rem, 6vw, 5rem)/.95 var(--display); font-variant-numeric: tabular-nums; }
.simulation-coverage-headline span { margin-top: 8px; color: var(--ink); font-size: .78rem; font-weight: 800; text-transform: uppercase; }
.simulation-coverage-headline small { margin-top: 8px; color: var(--muted); line-height: 1.45; }
.simulation-coverage-headline-historical { padding-left: 18px; border-left: 1px solid var(--line); }
.simulation-coverage-headline-historical strong { color: var(--orange); font-size: clamp(2.1rem, 4vw, 3.6rem); }
.simulation-coverage-progress { position: relative; grid-column: 1 / -1; height: 14px; overflow: visible; border: 1px solid var(--line); border-radius: 999px; background: #ffffff0a; }
.simulation-coverage-progress-fill { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--orange), var(--mint)); }
.simulation-coverage-target { position: absolute; top: -7px; bottom: -7px; left: 90%; width: 2px; border-radius: 2px; background: var(--ink); box-shadow: 0 0 0 3px #17100a; }
.simulation-coverage-scale { display: flex; grid-column: 1 / -1; justify-content: space-between; margin-top: -18px; color: var(--muted); font-size: .68rem; }
.simulation-coverage-scale strong { color: var(--ink); }
.simulation-coverage-definition { max-width: 980px; margin: -8px 0 22px; }
.simulation-coverage-table td:last-child { min-width: 260px; text-align: left; }
.simulation-metrics-panel { margin-top: 24px; padding: 30px; border: 1px solid var(--line); border-radius: 24px; background: var(--panel); }
.simulation-metrics-panel-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.simulation-metrics-panel-heading h2 { margin-top: 5px; font-size: 2rem; }
.simulation-metrics-panel-heading > span { color: var(--muted); font-size: .72rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.simulation-metrics-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 16px; }
.simulation-metrics-table { width: 100%; border-collapse: collapse; background: #ffffff03; }
.simulation-metrics-table th, .simulation-metrics-table td { padding: 15px 18px; border-bottom: 1px solid var(--line); text-align: right; vertical-align: middle; }
.simulation-metrics-table tr:last-child th, .simulation-metrics-table tr:last-child td { border-bottom: 0; }
.simulation-metrics-table th:first-child, .simulation-metrics-table td:nth-child(2) { text-align: left; }
.simulation-metrics-table thead th { color: var(--muted); font-size: .67rem; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.simulation-metrics-table tbody th { min-width: 190px; font-size: .88rem; }
.simulation-metrics-table tbody td { font-size: .86rem; font-variant-numeric: tabular-nums; }
.simulation-metrics-table tbody strong { color: var(--orange); font-size: 1rem; }
.simulation-metrics-table tbody span, .simulation-metrics-table tbody small { display: block; }
.simulation-metrics-table tbody small { margin-top: 3px; color: var(--muted); font-size: .68rem; font-weight: 500; }
.simulation-metrics-empty { margin: 0; color: var(--muted); }
.simulation-game-failure-error { color: var(--text) !important; }
.simulation-game-failure-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 16px 0; }
.simulation-game-failure-facts div { min-width: 0; }
.simulation-game-failure-facts dt { margin-bottom: 4px; color: var(--muted); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; }
.simulation-game-failure-facts dd { overflow-wrap: anywhere; margin: 0; font-size: .8rem; }

/* Read-only playtest board */
.playtester-body { background: #0a0908; }
.playtester-main { padding-bottom: 64px; }
.playtester-heading { display: flex; align-items: end; justify-content: space-between; gap: 28px; padding-block: 54px 34px; }
.playtester-heading h1 { max-width: none; font-size: clamp(3.2rem, 7vw, 6.2rem); }
.playtester-heading > div > p:not(.eyebrow) { max-width: 670px; margin: 20px 0 0; color: var(--muted); }
.playtester-report-link { display: inline-block; margin-top: 14px; color: var(--gold); font-size: 0.7rem; font-weight: 760; text-decoration: none; }
.playtester-report-link:hover { text-decoration: underline; }
.playtester-controls { display: grid; flex: 0 0 auto; gap: 9px; justify-items: end; }
.playtester-quality { display: grid; grid-template-columns: repeat(3, minmax(105px, 1fr)); gap: 6px; flex: 0 0 auto; }
.playtester-quality a { display: flex; align-items: center; gap: 9px; padding: 12px 15px; border: 1px solid var(--line); border-radius: 11px; background: #ffffff05; color: var(--muted); font-size: 0.75rem; font-weight: 780; text-decoration: none; }
.playtester-quality i { width: 7px; height: 7px; border-radius: 50%; background: #75675d; }
.playtester-quality a:first-child i { background: #79d98e; }
.playtester-quality a:nth-child(2) i { background: #ffb15c; }
.playtester-quality a:last-child i { background: #ff735e; }
.playtester-quality a[aria-current="page"] { border-color: #ff7a1870; background: #ff7a1814; color: var(--ink); box-shadow: 0 10px 30px #0005; }
.playtester-cycle { display: flex; align-items: center; gap: 10px; }
.playtester-cycle > span { color: var(--muted); font-size: .72rem; font-variant-numeric: tabular-nums; }
.playtester-cycle > span strong { color: var(--ink); }
.playtester-cycle a { display: flex; align-items: center; gap: 7px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 9px; background: #ffffff05; color: var(--gold); font-size: .68rem; font-weight: 780; text-decoration: none; }
.playtester-cycle a:hover { border-color: #ff7a1870; background: #ff7a1814; }
.playtester-cycle svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.playtester-metrics { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); margin-bottom: 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }
.playtester-metrics > div { min-width: 0; padding: 14px 16px; }
.playtester-metrics > div + div { border-left: 1px solid var(--line); }
.playtester-metrics span { display: block; color: var(--muted); font-size: 0.62rem; font-weight: 760; letter-spacing: 0.08em; text-transform: uppercase; }
.playtester-metrics strong { display: block; margin-top: 3px; font-size: 1.15rem; font-variant-numeric: tabular-nums; }
.playtester-seed { margin-bottom: 18px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 15px; background: var(--surface); }
.playtester-seed summary { cursor: pointer; font-size: .78rem; font-weight: 760; }
.playtester-seed code { display: block; margin-top: 10px; color: var(--gold); font-size: .68rem; line-height: 1.5; overflow-wrap: anywhere; white-space: normal; }
.playtester-seed code a { color: inherit; }
.playtest-opening { margin-bottom: 18px; padding: 22px 24px 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; background: linear-gradient(135deg, #1b1410, #0e0c0b); }
.playtest-opening > header { display: flex; align-items: end; justify-content: space-between; gap: 36px; }
.playtest-opening .eyebrow { margin-bottom: 5px; }
.playtest-opening h2 { font-size: clamp(1.8rem, 3vw, 2.7rem); }
.playtest-mulligan-summary { display: grid; max-width: 440px; gap: 3px; text-align: right; }
.playtest-mulligan-summary strong { color: var(--gold); font-size: 0.82rem; }
.playtest-mulligan-summary span { color: var(--muted); font-size: 0.66rem; }
.playtest-rejected-hands { margin-top: 18px; padding-top: 16px; border-top: 1px solid #ffffff12; }
.playtest-rejected-hands > header, .playtest-kept-hand-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; color: #d8cec7; }
.playtest-rejected-hands > header h3, .playtest-kept-hand-heading strong { margin: 0; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase; }
.playtest-rejected-hands > header span, .playtest-kept-hand-heading span { color: var(--muted); font-size: 0.62rem; }
.playtest-rejected-hands > div { display: grid; gap: 10px; margin-top: 10px; }
.playtest-rejected-hand { display: grid; grid-template-columns: 105px minmax(0, 1fr); gap: 12px; padding: 10px; border: 1px solid #3a302a; border-radius: 11px; background: #09080799; }
.playtest-rejected-hand > header { display: grid; align-content: start; gap: 3px; padding: 5px 2px; }
.playtest-rejected-hand > header strong { color: var(--gold); font-size: 0.7rem; }
.playtest-rejected-hand > header span { color: var(--muted); font-size: 0.58rem; line-height: 1.4; }
.playtest-rejected-hand > div { display: flex; align-items: start; gap: 9px; padding-bottom: 5px; overflow-x: auto; }
.playtest-rejected-hand .playtest-card { flex-basis: 84px; width: 84px; }
.playtest-rejected-hands-unavailable { margin-top: 18px; padding: 12px 14px; border: 1px dashed #554940; border-radius: 10px; color: var(--muted); font-size: 0.66rem; }
.mulligan-feedback { grid-column: 1 / -1; margin-top: 4px; border-top: 1px solid #ffffff10; color: #d8cec7; }
.mulligan-feedback > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 2px 4px; cursor: pointer; color: #e6a86a; font-size: 0.66rem; font-weight: 700; list-style-position: inside; }
.mulligan-feedback > summary strong { padding: 3px 7px; border: 1px solid #77c7a455; border-radius: 999px; color: #8bd8b5; font-size: 0.54rem; letter-spacing: 0.04em; text-transform: uppercase; }
.mulligan-feedback > form { display: grid; gap: 12px; margin-top: 8px; padding: 13px; border: 1px solid #4b3b2e; border-radius: 10px; background: #130f0c; }
.mulligan-feedback > form > p { margin: 0; color: var(--muted); font-size: 0.65rem; }
.mulligan-feedback fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.mulligan-feedback legend { margin-bottom: 8px; color: #d8cec7; font-size: 0.63rem; font-weight: 700; }
.mulligan-feedback legend span { margin-left: 5px; color: var(--muted); font-size: 0.55rem; font-weight: 400; }
.mulligan-feedback fieldset > div { display: flex; flex-wrap: wrap; gap: 7px; overflow: visible; }
.mulligan-feedback fieldset label { position: relative; cursor: pointer; }
.mulligan-feedback fieldset input { position: absolute; opacity: 0; pointer-events: none; }
.mulligan-feedback fieldset label span { display: block; padding: 6px 9px; border: 1px solid #514337; border-radius: 999px; color: #cbbdb4; font-size: 0.58rem; }
.mulligan-feedback fieldset input:checked + span { border-color: #e6a86a; background: #e6a86a1f; color: #ffd1a0; }
.mulligan-feedback fieldset input:focus-visible + span { outline: 2px solid #8bd5ff; outline-offset: 2px; }
.mulligan-feedback-reason { display: grid; gap: 6px; }
.mulligan-feedback-reason > span { font-size: 0.62rem; font-weight: 700; }
.mulligan-feedback textarea { box-sizing: border-box; width: 100%; resize: vertical; padding: 9px 10px; border: 1px solid #514337; border-radius: 8px; background: #090807; color: var(--ink); font: inherit; font-size: 0.64rem; line-height: 1.5; }
.mulligan-feedback textarea:focus { border-color: #e6a86a; outline: none; }
.mulligan-feedback footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.mulligan-feedback footer small { max-width: 470px; color: var(--muted); font-size: 0.55rem; line-height: 1.45; }
.mulligan-feedback-actions { display: flex; flex: none; align-items: center; gap: 8px; }
.mulligan-feedback button { flex: none; padding: 8px 11px; border: 1px solid #e6a86a; border-radius: 8px; background: #e6a86a; color: #160f09; cursor: pointer; font: inherit; font-size: 0.6rem; font-weight: 800; }
.mulligan-feedback.is-reviewed > summary { color: #8bd8b5; }
.mulligan-feedback-unavailable { margin: 12px 4px 0; color: var(--muted); font-size: 0.62rem; }
.play-feedback { margin-top: 8px; border-top: 1px solid #ffffff10; color: #d8cec7; }
.play-feedback > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 2px 2px; cursor: pointer; color: #e6a86a; font-size: 0.58rem; font-weight: 700; list-style-position: inside; }
.play-feedback > summary strong { padding: 3px 7px; border: 1px solid #77c7a455; border-radius: 999px; color: #8bd8b5; font-size: 0.5rem; letter-spacing: 0.04em; text-transform: uppercase; }
.play-feedback > form { display: grid; gap: 11px; margin-top: 7px; padding: 11px; border: 1px solid #4b3b2e; border-radius: 9px; background: #130f0c; }
.play-feedback fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.play-feedback legend { margin-bottom: 8px; color: #d8cec7; font-size: 0.59rem; font-weight: 700; }
.play-feedback legend span { margin-left: 5px; color: var(--muted); font-size: 0.51rem; font-weight: 400; }
.play-feedback fieldset > div { display: flex; flex-wrap: wrap; gap: 6px; overflow: visible; }
.play-feedback fieldset label { position: relative; cursor: pointer; }
.play-feedback fieldset input { position: absolute; opacity: 0; pointer-events: none; }
.play-feedback fieldset label span { display: block; padding: 5px 8px; border: 1px solid #514337; border-radius: 999px; color: #cbbdb4; font-size: 0.53rem; }
.play-feedback fieldset input:checked + span { border-color: #e6a86a; background: #e6a86a1f; color: #ffd1a0; }
.play-feedback fieldset input:focus-visible + span { outline: 2px solid #8bd5ff; outline-offset: 2px; }
.play-feedback-reason { display: grid; gap: 6px; }
.play-feedback-reason > span { font-size: 0.57rem; font-weight: 700; }
.play-feedback textarea { box-sizing: border-box; width: 100%; resize: vertical; padding: 8px 9px; border: 1px solid #514337; border-radius: 8px; background: #090807; color: var(--ink); font: inherit; font-size: 0.58rem; line-height: 1.5; }
.play-feedback textarea:focus { border-color: #e6a86a; outline: none; }
.play-feedback footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.play-feedback footer small { color: var(--muted); font-size: 0.5rem; line-height: 1.45; }
.play-feedback-actions { display: flex; flex: none; align-items: center; gap: 7px; }
.play-feedback button { flex: none; padding: 7px 9px; border: 1px solid #e6a86a; border-radius: 8px; background: #e6a86a; color: #160f09; cursor: pointer; font: inherit; font-size: 0.54rem; font-weight: 800; }
.play-feedback button.play-feedback-remove { border-color: #6a5c51; background: transparent; color: #cbbdb4; }
.play-feedback.is-reviewed > summary { color: #8bd8b5; }
.feedback-saving { display: none; color: #f4bc72; font-size: 0.56rem; font-weight: 700; white-space: nowrap; }
.feedback-saving.htmx-request { display: inline-flex; }
.mulligan-feedback button:disabled, .play-feedback button:disabled { cursor: wait; opacity: 0.62; }
.playtest-kept-hand-heading { margin-top: 18px; }
.playtest-opening-hand-layout { display: flex; align-items: end; gap: 30px; margin-top: 18px; padding: 5px 5px 10px; overflow-x: auto; }
.playtest-opening-cards { display: flex; align-items: start; gap: 12px; }
.playtest-opening-cards .playtest-card { flex-basis: 102px; width: 102px; }
.playtest-bottomed-cards { display: grid; flex: 0 0 auto; gap: 8px; padding-left: 22px; border-left: 1px solid #ff7a1855; }
.playtest-bottomed-cards > strong { color: var(--gold); font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; }
.playtest-bottomed-cards > div { display: flex; align-items: start; gap: 12px; }
.playtest-bottomed-cards .playtest-card { flex-basis: 102px; width: 102px; }
.playtest-card.is-bottomed img { border-color: #ff8b38; filter: saturate(0.7) brightness(0.82); box-shadow: 0 0 0 3px #ff7a1833, 0 10px 22px #000a; }
.playtest-card.is-bottomed:hover img { box-shadow: 0 0 0 3px #ff7a1855, 0 17px 28px #000d; }
.playtest-card.is-bottomed figcaption { color: var(--gold); }
.playtest-bottomed-cards-unavailable { align-self: stretch; min-width: 170px; }
.playtest-bottomed-cards-unavailable p { margin: 0; color: var(--muted); font-size: 0.62rem; }
.playtest-table { width: min(1820px, calc(100% - 24px)); margin-inline: auto; overflow: hidden; border: 1px solid #3b322c; border-radius: 19px; background: #121110; box-shadow: 0 34px 90px #0009; }
.playtest-tabletop { display: grid; grid-template-columns: minmax(0, 1fr) 280px; min-height: 690px; background-color: #151412; background-image: linear-gradient(#ffffff08 1px, transparent 1px), linear-gradient(90deg, #ffffff08 1px, transparent 1px), radial-gradient(circle at 50% 10%, #48261455, transparent 48rem); background-size: 32px 32px, 32px 32px, auto; }
.playtest-battlefield { min-width: 0; padding: 22px 26px 28px; }
.playtest-zone-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; color: #ddd4cd; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; }
.playtest-zone-heading strong { color: var(--muted); font-size: 0.64rem; font-weight: 650; }
.playtest-battlefield-group { min-height: 190px; padding-block: 15px; border-top: 1px solid #ffffff0a; }
.playtest-battlefield-group:first-of-type { margin-top: 12px; }
.playtest-battlefield-group h3, .playtest-pile h3, .playtest-command-zone h3 { margin: 0 0 9px; color: #9b9188; font-size: 0.62rem; font-weight: 760; letter-spacing: 0.08em; text-transform: uppercase; }
.playtest-battlefield-group h3 span, .playtest-pile h3 span, .playtest-command-zone h3 span { color: #655c55; }
.playtest-card-row { display: flex; align-items: start; flex-wrap: wrap; gap: 12px; min-height: 150px; }
.playtest-card { position: relative; flex: 0 0 108px; width: 108px; margin: 0; transition: z-index 0.1s; }
.playtest-card:hover { z-index: 10; }
.playtest-card img { display: block; width: 100%; height: auto; aspect-ratio: 244 / 340; border: 1px solid #5f5751; border-radius: 8px; object-fit: cover; background: #211e1b; box-shadow: 0 10px 22px #000a; transition: transform 0.16s ease, box-shadow 0.16s ease; }
.playtest-card:hover img { transform: translateY(-5px) scale(1.06); box-shadow: 0 17px 28px #000d; }
.playtest-card.is-tapped img { transform: rotate(90deg) scale(0.72); }
.playtest-card.is-tapped:hover img { transform: rotate(90deg) scale(0.78); }
.playtest-card.is-token img { border-color: #ffb15c88; }
.playtest-card figcaption { margin-top: 6px; overflow: hidden; color: #b9aea6; font-size: 0.57rem; line-height: 1.25; text-align: center; text-overflow: ellipsis; white-space: nowrap; }
.playtest-card-counter { position: absolute; top: 6px; right: 6px; z-index: 2; padding: 3px 6px; border: 1px solid #fff5; border-radius: 999px; background: #090807e8; color: #fff; font-size: 0.52rem; font-weight: 850; box-shadow: 0 3px 8px #000b; }
.playtest-empty-zone { margin: 50px auto; color: #716861; font-size: 0.72rem; }
.playtest-side-zones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; gap: 10px; padding: 20px 14px; border-left: 1px solid #4b4038; background: #0c0b0ae8; }
.playtest-pile, .playtest-command-zone { min-width: 0; padding: 10px; border: 1px solid #302a26; border-radius: 11px; background: #ffffff04; }
.playtest-pile-cards { position: relative; min-height: 158px; }
.playtest-pile .playtest-card { position: absolute; inset: 0 auto auto 50%; width: 96px; transform: translateX(-50%); }
.playtest-pile .playtest-card figcaption { display: none; }
.playtest-pile-card-1 { margin: 4px 0 0 -7px; transform: translateX(-50%) rotate(-4deg) !important; }
.playtest-pile-card-2 { margin: 2px 0 0 4px; transform: translateX(-50%) rotate(3deg) !important; }
.playtest-pile-card-3 { z-index: 3; }
.playtest-pile .playtest-card:hover img { transform: none; }
.playtest-pile-expandable { padding: 0; overflow: hidden; }
.playtest-pile-expandable > summary { display: block; padding: 10px; cursor: pointer; list-style: none; }
.playtest-pile-expandable > summary::-webkit-details-marker { display: none; }
.playtest-pile-expandable > summary h3 { display: flex; align-items: center; gap: 4px; }
.playtest-pile-expandable > summary h3 small { margin-left: auto; color: var(--gold); font-size: 0.52rem; font-weight: 720; letter-spacing: 0.04em; text-transform: none; }
.playtest-pile-expandable > summary h3 small i { font-style: normal; }
.playtest-pile-expandable > summary h3 small b { display: none; }
.playtest-pile-expandable[open] { grid-column: 1 / -1; }
.playtest-pile-expandable[open] > summary .playtest-pile-cards { display: none; }
.playtest-pile-expandable[open] > summary h3 small i { display: none; }
.playtest-pile-expandable[open] > summary h3 small b { display: inline; }
.playtest-pile-expanded { padding: 10px; border-top: 1px solid #302a26; background: #090807; }
.playtest-pile-expanded > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; color: #c8bdb5; font-size: 0.62rem; }
.playtest-pile-expanded > header span { color: var(--muted); }
.playtest-pile-expanded > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.playtest-pile-expanded .playtest-card { position: static; inset: auto; width: 100%; transform: none; }
.playtest-pile-expanded .playtest-card figcaption { display: block; white-space: normal; }
.playtest-pile-expanded .playtest-card:hover img { transform: translateY(-3px) scale(1.02); }
.playtest-card-back { position: absolute; top: 0; left: 50%; display: grid; place-items: center; width: 96px; aspect-ratio: 244 / 340; overflow: hidden; transform: translateX(-50%); border: 5px solid #17100c; border-radius: 9px; background: radial-gradient(circle, #f37d21 0 4%, #33170b 5% 24%, transparent 25%), repeating-radial-gradient( ellipse at center, #9b4417 0 7px, #31160d 8px 14px ); box-shadow: 0 10px 24px #000c, 5px 5px 0 #231c17, 9px 9px 0 #100e0c; }
.playtest-card-back::after { position: absolute; content: ""; inset: 8px; border: 1px solid #ffb15c99; border-radius: 50%; }
.playtest-card-back span { z-index: 1; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #100c09; color: var(--gold); font-family: var(--display); font-size: 1.25rem; font-weight: 900; box-shadow: 0 0 0 2px #e7772b; }
.playtest-card-back i { position: absolute; inset: 18px; border: 1px solid #ffb15c55; border-radius: 50%; }
.playtest-empty-pile { display: grid; place-items: center; width: 96px; aspect-ratio: 244 / 340; margin-inline: auto; border: 1px dashed #534940; border-radius: 8px; color: #675e57; font-size: 0.62rem; }
.playtest-command-zone { grid-column: 1 / -1; }
.playtest-command-zone > div { display: flex; gap: 8px; }
.playtest-command-zone .playtest-card { flex-basis: 92px; width: 92px; }
.playtest-command-zone .playtest-card figcaption { white-space: normal; }
.playtest-hand { min-height: 270px; padding: 17px 25px 24px; border-top: 1px solid #4b4038; background: linear-gradient(180deg, #11100f, #090807); }
.playtest-hand-cards { display: flex; align-items: start; gap: 13px; margin-top: 16px; padding: 8px 12px 13px; overflow-x: auto; }
.playtest-hand .playtest-card { flex-basis: 122px; width: 122px; }
.playtest-game-report { margin-top: 70px; }
.playtest-report-heading { display: flex; align-items: end; justify-content: space-between; gap: 42px; margin-bottom: 24px; }
.playtest-report-heading h2 { margin-top: 5px; font-size: clamp(2.4rem, 5vw, 4.4rem); }
.playtest-report-heading > div > p:last-child { max-width: 660px; margin: 14px 0 0; color: var(--muted); }
.playtest-report-heading dl { display: grid; grid-template-columns: repeat(4, minmax(92px, 1fr)); min-width: min(100%, 470px); margin: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); }
.playtest-report-heading dl div { padding: 13px 15px; }
.playtest-report-heading dl div + div { border-left: 1px solid var(--line); }
.playtest-report-heading dt { color: var(--muted); font-size: .56rem; font-weight: 780; letter-spacing: .08em; text-transform: uppercase; }
.playtest-report-heading dd { margin: 5px 0 0; color: var(--ink); font-size: 1.25rem; font-weight: 850; font-variant-numeric: tabular-nums; }
.playtest-report-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.playtest-turn-chart { min-width: 0; margin: 0; padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(145deg, #171411, #0e0d0c); }
.playtest-turn-chart > header { display: flex; align-items: start; justify-content: space-between; gap: 24px; }
.playtest-turn-chart > header > div:first-child > span { color: var(--orange); font-size: .59rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.playtest-turn-chart h3 { margin: 6px 0 4px; font-size: 1.3rem; }
.playtest-turn-chart p { max-width: 390px; margin: 0; color: var(--muted); font-size: .68rem; line-height: 1.55; }
.playtest-chart-legend { display: flex; flex-wrap: wrap; justify-content: end; gap: 8px 13px; color: var(--muted); font-size: .6rem; white-space: nowrap; }
.playtest-chart-legend span { display: flex; align-items: center; gap: 6px; }
.playtest-chart-legend i { width: 7px; height: 7px; border-radius: 2px; background: var(--series-color); }
.playtest-chart-body { display: grid; grid-template-columns: 30px minmax(0, 1fr); min-height: 260px; margin-top: 24px; padding-top: 20px; border-top: 1px solid #ffffff0a; }
.playtest-chart-y-axis { position: relative; height: 200px; margin-top: 22px; color: #857b73; font-size: .55rem; font-variant-numeric: tabular-nums; }
.playtest-chart-y-axis span { position: absolute; right: 7px; transform: translateY(50%); }
.playtest-turn-bars { position: relative; display: grid; grid-template-columns: repeat(6, minmax(42px, 1fr)); gap: clamp(8px, 2vw, 20px); min-width: 0; padding-inline: 12px; }
.playtest-chart-grid { position: absolute; inset: 22px 12px 20px; z-index: 0; }
.playtest-chart-grid i { position: absolute; right: 0; left: 0; border-top: 1px solid #ffffff0b; transform: translateY(50%); }
.playtest-turn-column { z-index: 1; display: grid; grid-template-rows: 22px 200px 20px; align-items: end; min-width: 0; text-align: center; }
.playtest-turn-column > strong { align-self: start; color: var(--ink); font-size: .72rem; font-variant-numeric: tabular-nums; }
.playtest-turn-column > span { align-self: end; color: var(--muted); font-size: .61rem; font-weight: 760; }
.playtest-turn-track { display: flex; flex-direction: column-reverse; align-self: end; width: min(44px, 78%); height: 200px; margin-inline: auto; overflow: hidden; border: 1px solid #ffffff0d; border-radius: 7px 7px 3px 3px; background: #0005; box-shadow: inset 0 0 16px #0007; }
.playtest-turn-track i { display: block; flex: 0 0 auto; min-height: 0; background: var(--series-color); }
.playtest-log { margin-top: 34px; }
.playtest-log > header { display: flex; align-items: end; justify-content: space-between; gap: 28px; margin-bottom: 16px; }
.playtest-log > header span { color: var(--orange); font-size: .59rem; font-weight: 800; letter-spacing: .09em; text-transform: uppercase; }
.playtest-log > header h2 { margin: 4px 0 0; font-size: clamp(1.8rem, 3vw, 2.7rem); }
.playtest-log > header p { max-width: 470px; margin: 0; color: var(--muted); font-size: .7rem; line-height: 1.55; text-align: right; }
.playtest-log-turns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.playtest-log-turn { min-width: 0; overflow: hidden; border: 1px solid #4a433d; border-radius: 9px; background: #11100f; }
.playtest-log-turn > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-bottom: 1px solid #403a35; background: #1a1816; }
.playtest-log-turn h3 { margin: 0; font-size: .8rem; }
.playtest-log-turn > header span { color: var(--muted); font-size: .55rem; }
.playtest-log-turn ol { margin: 0; padding: 0; list-style: none; }
.playtest-log-turn li { padding: 8px 11px; }
.playtest-log-turn li:nth-child(even) { background: #ffffff08; }
.playtest-log-turn li > span, .playtest-log-turn li > strong { display: block; }
.playtest-log-turn li > span { color: #c8c1bb; font-size: .59rem; }
.playtest-log-turn li > span small { margin-left: 5px; color: #847a72; font-size: .5rem; }
.playtest-log-turn li > strong { display: flex; flex-direction: column; gap: 1px; margin-top: 2px; color: var(--gold); font-size: .68rem; line-height: 1.35; }
.playtest-log-turn li > strong > span { display: block; }
.playtest-log-cause { display: block; margin-top: 3px; color: #9f9389; font-size: .53rem; line-height: 1.35; }
.playtest-opponent-turns { border-top: 1px solid #403a35; background: #0c0b0a; }
.playtest-opponent-turns > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 11px; color: #aaa098; cursor: pointer; font-size: .58rem; font-weight: 760; }
.playtest-opponent-turns > summary small { color: #7f756e; font-size: .5rem; font-weight: 500; }
.playtest-opponent-turns > div { border-top: 1px solid #332e2a; }
.playtest-opponent-turn + .playtest-opponent-turn { border-top: 1px solid #332e2a; }
.playtest-opponent-turn > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 11px 5px; }
.playtest-opponent-turn > header strong { color: #c8c1bb; font-size: .57rem; }
.playtest-opponent-turn > header span { color: #756c65; font-size: .49rem; }
.playtest-opponent-turn li { padding-left: 16px; }
.playtest-log-empty, .playtest-log-unavailable { margin: 0; padding: 18px 12px; color: var(--muted); font-size: .65rem; }
.playtest-log-unavailable { border: 1px dashed var(--line); border-radius: 9px; background: #ffffff03; }
.playtester-note { padding-block: 22px; color: var(--muted); font-size: 0.7rem; }
.playtester-note p { margin: 0; }
.playtester-note a { color: var(--gold); }

@media (max-width: 900px) {
  nav { display: none; }
  .app-site-header { flex-wrap: wrap; padding-block: 10px; }
  .deck-card[data-onboarding-report-deck] { scroll-margin-block-start: 142px; scroll-margin-block-end: 220px; }
  .app-site-header .app-navigation { display: flex; order: 3; width: 100%; margin: 0; padding-top: 8px; overflow-x: auto; border-top: 1px solid var(--line); white-space: nowrap; scrollbar-width: thin; }
  .hero { grid-template-columns: 1fr; min-height: auto; padding-block: 70px; }
  .report-preview { max-width: 680px; }
  .section-heading, .workflow-grid { grid-template-columns: 1fr; gap: 25px; }
  .auth-shell { grid-template-columns: 1fr; gap: 45px; }
  .import-shell { grid-template-columns: 1fr; gap: 45px; }
  .import-onboarding { grid-column: auto; }
  .import-onboarding .onboarding { margin-bottom: 0; }
  .import-intro { position: static; }
  .onboarding-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .modeling-guide-heading, .modeling-guide-grid { grid-template-columns: 1fr; }
  .section-heading > p:last-child { margin-top: 18px; }
  .feature-grid { grid-template-columns: 1fr; }
  .deck-grid { grid-template-columns: repeat(2, 1fr); }
  .card-database-summaries { grid-template-columns: 1fr; }
  .card-catalog-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .card-detail-layout { grid-template-columns: minmax(220px, 300px) minmax(0, 1fr); gap: 34px; }
  .detail-grid { grid-template-columns: 1fr; gap: 0; }
  .coverage-browser { grid-template-columns: minmax(220px, 300px) 1fr; }
  .feature-card { min-height: 230px; }
  .feature-card h3 { margin-top: 45px; }
  .signal-strip .shell { overflow-x: auto; justify-content: flex-start; white-space: nowrap; }
  .comparison-method, .comparison-section-heading, .comparison-commander { grid-template-columns: 1fr; gap: 28px; }
  .comparison-chart-grid { grid-template-columns: 1fr; }
  .comparison-chart-grid > :last-child:nth-child(odd) { grid-column: auto; }
  .comparison-legend { justify-content: start; }
  .comparison-change-column ul { grid-template-columns: 1fr; }
  .snapshot-report-picker, .snapshot-overlay-section-heading { grid-template-columns: 1fr; gap: 24px; }
  .snapshot-report-picker > .button { grid-column: auto; justify-self: start; }
  .snapshot-overlay-chart-grid { grid-template-columns: 1fr; }
  .simulation-metric-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .playtester-heading { align-items: flex-start; flex-direction: column; gap: 26px; }
  .playtester-controls { justify-items: start; width: 100%; }
  .playtester-quality { display: grid; }
  .playtester-metrics { grid-template-columns: repeat(3, 1fr); }
  .playtester-metrics > div:nth-child(4) { border-left: 0; border-top: 1px solid var(--line); }
  .playtester-metrics > div:nth-child(5), .playtester-metrics > div:nth-child(6) { border-top: 1px solid var(--line); }
  .playtest-opening > header { align-items: flex-start; flex-direction: column; gap: 12px; }
  .playtest-mulligan-summary { text-align: left; }
  .playtest-tabletop { grid-template-columns: minmax(0, 1fr) 240px; }
  .playtest-card { flex-basis: 96px; width: 96px; }
  .playtest-report-heading { align-items: flex-start; flex-direction: column; }
  .playtest-report-grid { grid-template-columns: 1fr; }
  .playtest-log-turns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  .deck-card[data-onboarding-report-reveal] { animation: none; }
}

@media (max-width: 560px) {
  .shell { width: min(100% - 26px, 1180px); }
  .site-header { min-height: 70px; }
  .site-header .button { display: none; }
  .site-header .user-menu .button { display: inline-flex; }
  .site-header .mobile-header-action { display: inline-flex; min-height: 36px; padding-inline: 11px; }
  h1 { font-size: clamp(3.25rem, 17vw, 5rem); }
  .hero { padding-block: 56px; }
  .hero-actions { align-items: flex-start; flex-direction: column; }
  .report-preview { padding: 16px; border-radius: 18px; }
  .preview-title { align-items: flex-start; gap: 16px; }
  .preview-metrics { grid-template-columns: 1fr; }
  .section, .workflow-section { padding-block: 76px; }
  .site-footer { align-items: flex-start; flex-direction: column; padding-block: 32px; }
  .site-footer p { margin: 0; }
  .auth-shell { padding-block: 48px; }
  .auth-card { padding: 22px; }
  .user-menu > span { display: none; }
  .onboarding { margin-bottom: 38px; padding: 20px; }
  .onboarding-heading { align-items: flex-start; flex-direction: column; gap: 20px; }
  .onboarding-heading .button { display: inline-flex; width: 100%; }
  .onboarding-steps { grid-template-columns: 1fr; }
  .onboarding-steps li { padding: 14px; }
  .dashboard { padding-block: 52px 80px; }
  .dashboard-heading { align-items: flex-start; flex-direction: column; margin-bottom: 55px; }
  .deck-grid { grid-template-columns: 1fr; }
  .card-database { padding-block: 50px 80px; }
  .card-database-heading, .card-catalog-toolbar { align-items: flex-start; flex-direction: column; }
  .card-database-heading > span { white-space: normal; }
  .card-database-summaries { margin: 42px 0 58px; }
  .card-database-category-summary header { align-items: flex-start; flex-direction: column; }
  .card-database-category-summary header > div:last-child { text-align: left; }
  .card-database-category-summary dl { grid-template-columns: 1fr; }
  .card-database-category-summary dl div + div { border-top: 1px solid var(--line); border-left: 0; }
  .card-catalog-categories { flex-wrap: wrap; }
  .card-catalog-list { grid-template-columns: 1fr; }
  .card-detail { padding-block: 34px 80px; }
  .card-detail-layout { grid-template-columns: 1fr; }
  .card-detail-visual { position: static; width: min(100%, 330px); }
  .card-detail-title { flex-direction: column; }
  .card-detail-title > .card-status-badge { margin-top: 0; }
  .card-dsl-panel pre { max-height: 66vh; padding: 16px; font-size: .7rem; }
  .import-shell { padding-block: 50px 80px; }
  .import-form { padding: 20px; }
  .deck-detail-heading, .detail-section-heading { align-items: flex-start; flex-direction: column; }
  .detail-summary, .coverage-browser { grid-template-columns: 1fr; }
  .card-preview { position: static; width: min(100%, 360px); }
  .coverage-priority-tour, .coverage-priority-form, .coverage-card-definition, .coverage-assessment-form { margin-left: 4px; }
  .coverage-priority-form { grid-template-columns: 1fr; }
  .detail-summary > div { min-height: 94px; }
  .detail-summary > div:not(:first-child) { border-top: 1px solid var(--line); }
  .detail-summary > div:not(:nth-child(4n + 1)) { border-left: 0; }
  .coverage-onboarding-explainer { grid-template-columns: 1fr; gap: 14px; }
  .coverage-onboarding-actions { justify-content: flex-start; }
  .readiness-panel { grid-template-columns: 1fr; gap: 20px; }
  .report-overlay-cta { align-items: flex-start; flex-direction: column; gap: 20px; padding: 22px; }
  .report-overlay-cta .button { width: 100%; }
  .snapshot-list li { grid-template-columns: 1fr; gap: 8px; }
  .snapshot-list .snapshot-actions { align-items: flex-start; }
  .snapshot-picker, .snapshot-change-grid, .snapshot-report-readiness { grid-template-columns: 1fr; }
  .snapshot-picker > span { display: none; }
  .snapshot-report-comparison { padding-block: 52px 86px; }
  .snapshot-report-picker { margin-top: 40px; padding: 20px; }
  .snapshot-report-picker > .button { width: 100%; }
  .snapshot-overlay-section { margin-top: 64px; padding-top: 52px; }
  .snapshot-overlay-snapshots, .snapshot-overlay-commander-grid { grid-template-columns: 1fr; }
  .snapshot-overlay-chart { padding: 13px; }
  .snapshot-overlay-legend { gap: 6px 10px; }
  .snapshot-overlay-table th, .snapshot-overlay-table td { padding: 12px; }
  .snapshot-overlay-empty { padding: 36px 20px; }
  .comparison-hero { padding-block: 62px; }
  .comparison-method, .comparison-changes, .comparison-snapshot, .comparison-development { padding-block: 58px; }
  .comparison-hero h1 { font-size: clamp(3rem, 14vw, 4.5rem); }
  .comparison-change-summary { grid-template-columns: 1fr; }
  .comparison-change-summary div + div { border-top: 1px solid var(--line); border-left: 0; }
  .comparison-change-group { padding: 18px; }
  .comparison-change-browser { grid-template-columns: 1fr; }
  .comparison-card-preview { position: sticky; top: 8px; z-index: 4; grid-template-columns: 72px minmax(0, 1fr); align-items: center; gap: 12px; width: 100%; padding: 8px; box-shadow: 0 14px 34px #000b; }
  .comparison-card-preview-button { width: 72px; }
  .comparison-card-preview img { width: 72px; border-radius: 7px; box-shadow: none; }
  .comparison-change-lists { grid-template-columns: 1fr; }
  .comparison-change-column:first-child { padding-right: 0; }
  .comparison-change-column + .comparison-change-column { margin-top: 18px; padding-left: 0; border-top: 1px solid var(--line); border-left: 0; }
  .comparison-table-wrap { overflow: visible; }
  .comparison-table, .comparison-table tbody, .comparison-table tr, .comparison-table th, .comparison-table td { display: block; width: 100%; }
  .comparison-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  .comparison-table tbody tr { padding: 18px 0; border-top: 1px solid var(--line); }
  .comparison-table tbody tr:last-child { border-bottom: 1px solid var(--line); }
  .comparison-table th, .comparison-table td { padding: 4px 0; border: 0; text-align: left; }
  .comparison-table tbody th { margin-bottom: 8px; font-size: 1rem; }
  .comparison-table tbody td { display: grid; grid-template-columns: minmax(112px, .85fr) 1fr; gap: 12px; max-width: none; font-size: .82rem; }
  .comparison-table tbody td::before { content: attr(data-label); color: var(--muted); font-size: .66rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
  .comparison-table tbody td:last-child { max-width: none; font-size: .8rem; }
  .comparison-chart { padding: 14px; }
  .comparison-chart figcaption { align-items: flex-start; flex-direction: column; gap: 6px; }
  .comparison-commander { margin-block: 20px 64px; padding: 22px; }
  .comparison-commander-values { grid-template-columns: 1fr; }
  .card-modeling-heading { align-items: flex-start; flex-direction: column; }
  .modeling-priorities { padding: 20px; }
  .modeling-priority-card { grid-template-columns: 34px 82px minmax(0, 1fr); gap: 12px; padding: 14px; }
  .modeling-priority-rank { width: 34px; height: 34px; }
  .modeling-priority-image { width: 82px; border-radius: 6px; }
  .modeling-priority-title { align-items: flex-start; flex-direction: column; gap: 8px; }
  .modeling-priority-actions { justify-content: flex-start; }
  .modeling-priority-contexts { grid-template-columns: 1fr; }
  .modeling-queue-grid { grid-template-columns: 1fr; }
  .simulation-metrics-groups { align-items: flex-start; flex-direction: column; gap: 18px; }
  .simulation-metrics-groups > div, .simulation-metrics-group-tabs { max-width: 100%; }
  .simulation-metrics-group-tabs { overflow-x: auto; padding: 3px; }
  .simulation-metric-cards { grid-template-columns: 1fr; }
  .simulation-coverage-summary { grid-template-columns: 1fr; padding: 22px; }
  .simulation-coverage-headlines { grid-template-columns: 1fr; }
  .simulation-coverage-headline-historical { padding: 18px 0 0; border-top: 1px solid var(--line); border-left: 0; }
  .simulation-coverage-progress, .simulation-coverage-scale { grid-column: 1; }
  .simulation-metrics-panel { padding: 20px; }
  .simulation-metrics-panel-heading { align-items: flex-start; flex-direction: column; }
  .simulation-metrics-table-wrap { overflow: visible; border: 0; }
  .simulation-metrics-table, .simulation-metrics-table tbody, .simulation-metrics-table tr, .simulation-metrics-table th, .simulation-metrics-table td { display: block; width: 100%; }
  .simulation-metrics-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
  .simulation-metrics-table tbody tr { padding: 16px 0; border-top: 1px solid var(--line); }
  .simulation-metrics-table tbody tr:last-child { border-bottom: 1px solid var(--line); }
  .simulation-metrics-table th, .simulation-metrics-table td { display: grid; grid-template-columns: minmax(120px, .8fr) 1fr; gap: 12px; padding: 4px 0; border: 0; text-align: left; }
  .simulation-metrics-table tbody th { display: block; margin-bottom: 8px; }
  .simulation-metrics-table tbody td::before { content: attr(data-label); color: var(--muted); font-size: .66rem; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
  .feature-flag-heading { flex-direction: column; }
  .feature-flag-card fieldset { grid-template-columns: 1fr; }
  .playtester-heading { padding-block: 38px 26px; }
  .playtester-heading h1 { font-size: clamp(3rem, 16vw, 4.4rem); }
  .playtester-quality { grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; }
  .playtester-metrics { grid-template-columns: repeat(2, 1fr); }
  .playtester-metrics > div:nth-child(odd) { border-left: 0; }
  .playtester-metrics > div:nth-child(n + 3) { border-top: 1px solid var(--line); }
  .playtester-metrics > div:nth-child(4), .playtester-metrics > div:nth-child(6) { border-left: 1px solid var(--line); }
  .playtest-table { width: 100%; border-inline: 0; border-radius: 0; }
  .playtest-opening { padding-inline: 16px; }
  .playtest-rejected-hand { grid-template-columns: 1fr; }
  .mulligan-feedback footer { align-items: stretch; flex-direction: column; }
  .mulligan-feedback button { width: 100%; }
  .play-feedback footer { align-items: stretch; flex-direction: column; }
  .play-feedback-actions { width: 100%; }
  .play-feedback button { width: 100%; }
  .play-feedback-actions button { flex: 1; width: auto; }
  .playtest-tabletop { display: block; }
  .playtest-battlefield { padding-inline: 13px; }
  .playtest-side-zones { grid-template-columns: minmax(0, 1fr); overflow-x: hidden; border-top: 1px solid #4b4038; border-left: 0; }
  .playtest-pile-expandable[open], .playtest-command-zone { grid-column: auto; min-width: 0; }
  .playtest-pile-expanded > div { grid-template-columns: minmax(0, 1fr); }
  .playtest-pile-expanded .playtest-card { min-width: 0; max-width: 100%; }
  .playtest-pile-expanded .playtest-card figcaption { overflow-wrap: anywhere; }
  .playtest-hand { padding-inline: 13px; }
  .playtest-game-report { margin-top: 52px; }
  .playtest-report-heading dl { grid-template-columns: repeat(2, 1fr); min-width: 100%; }
  .playtest-report-heading dl div:nth-child(3) { border-top: 1px solid var(--line); border-left: 0; }
  .playtest-report-heading dl div:nth-child(4) { border-top: 1px solid var(--line); }
  .playtest-turn-chart { padding: 18px 12px; }
  .playtest-turn-chart > header { flex-direction: column; gap: 13px; padding-inline: 4px; }
  .playtest-log > header { align-items: flex-start; flex-direction: column; gap: 8px; }
  .playtest-log > header p { text-align: left; }
  .playtest-log-turns { grid-template-columns: 1fr; }
  .playtest-chart-legend { justify-content: start; }
  .playtest-turn-bars { gap: 6px; padding-inline: 0; }
  .playtest-chart-grid { right: 0; left: 0; }
}