/* Market Snapshot Generator: the controls, and the Letter-size sheet that is previewed and printed to PDF. */
.snap-page { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; min-width: 0; }

.snap-controls { display: flex; flex-wrap: wrap; align-items: end; gap: 16px 24px; padding: 14px 16px; border: 1px solid var(--ls-rule); border-radius: var(--ls-radius); background: var(--ls-card); }
.snap-field { display: grid; gap: 6px; min-width: 0; }
.snap-field > label, .snap-field > span { color: var(--ls-tertiary); font-size: 11px; }
#snap-market { width: min(380px, 100%); min-width: 300px; }
.snap-types { display: inline-flex; flex-wrap: wrap; padding: 3px; border: 1px solid var(--ls-rule); border-radius: 8px; background: var(--ls-stone); }
.snap-types button { padding: 7px 12px; border: 0; border-radius: 6px; background: transparent; color: var(--ls-secondary); font: inherit; font-size: 12.5px; cursor: pointer; }
.snap-types button[aria-checked="true"] { background: var(--ls-card); color: var(--ls-ink); box-shadow: 0 0 0 1px var(--ls-strong-rule); }
.snap-types button:focus-visible, .snap-actions button:focus-visible { outline: 2px solid var(--ls-accent); outline-offset: 1px; }
.snap-actions { display: flex; gap: 8px; margin-left: auto; }
.snap-primary { padding: 9px 16px; border: 0; border-radius: 8px; background: var(--ls-accent); color: #fff; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.snap-primary:disabled { opacity: .45; cursor: progress; }

.snap-stage { display: flex; align-items: flex-start; padding: 28px 16px; overflow-x: auto; border: 1px solid var(--ls-rule); border-radius: 12px; background: var(--ls-stone); }
.snap-status { margin: 24px 0; color: var(--ls-secondary); font-size: 14px; }
.snap-status.error { color: var(--ls-decline); }

/* The sheet is paper in every theme: fixed colors, Letter size at 96 px per inch. */
.snap-sheet {
  --ink: #0b1220; --soft: #475569; --faint: #7a8699; --rule: #e4e8ef; --wash: #f5f7fb; --accent: #2563eb; --up: #15803d; --down: #b91c1c;
  flex: none; display: flex; flex-direction: column; width: 816px; margin: 0 auto; height: 1056px; box-sizing: border-box; overflow: hidden;
  background: #fff; color: var(--ink); font-family: Inter, 'Helvetica Neue', Arial, sans-serif; font-size: 12px; line-height: 1.4;
  box-shadow: 0 1px 2px rgba(15, 23, 42, .12), 0 18px 48px rgba(15, 23, 42, .22);
}
.snap-sheet > * { flex: none; }
.snap-sheet h2, .snap-sheet h3, .snap-sheet p, .snap-sheet ul, .snap-sheet ol { margin: 0; padding: 0; }
.snap-sheet h3 { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid var(--rule); color: var(--faint); font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.snap-sheet h3 small { font-size: 10px; font-weight: 500; letter-spacing: .02em; text-transform: none; }
.snap-sheet sup { color: var(--accent); font-weight: 700; }

.snap-head { position: relative; overflow: hidden; padding: 22px 40px 18px; color: #fff; background: radial-gradient(120% 140% at 100% 0%, #1e5bd8 0%, rgba(30, 91, 216, 0) 55%), linear-gradient(135deg, #0a1730 0%, #0f2a5c 100%); }
.snap-head::after { content: ''; position: absolute; right: -60px; bottom: -90px; width: 260px; height: 260px; border: 1px solid rgba(255, 255, 255, .14); border-radius: 50%; box-shadow: 0 0 0 36px rgba(255, 255, 255, .04), 0 0 0 72px rgba(255, 255, 255, .03); }
.snap-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.snap-brand img { height: 22px; width: auto; }
.snap-brand span { padding-left: 12px; border-left: 1px solid rgba(255, 255, 255, .3); color: rgba(255, 255, 255, .72); font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.snap-kicker { color: #7dd3fc; font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.snap-name { margin: 4px 0 6px !important; max-width: 640px; font-size: 34px; font-weight: 700; line-height: 1.08; letter-spacing: -.025em; }
.snap-meta { color: rgba(255, 255, 255, .72); font-size: 12px; }

.snap-sheet > section, .snap-cols { padding: 0 40px; margin-top: 12px; }
.snap-sheet > .snap-balance { display: grid; grid-template-columns: 210px minmax(0, 1fr); align-items: center; gap: 28px; margin: 0; padding: 10px 40px; background: var(--wash); border-bottom: 1px solid var(--rule); }
.snap-balance h3 { margin-bottom: 4px; padding: 0; border: 0; }
.snap-balance-copy strong { display: block; font-size: 19px; font-weight: 700; letter-spacing: -.01em; }
.snap-balance-copy small { display: block; margin-top: 2px; color: var(--soft); font-size: 10.5px; }
.snap-meter { position: relative; height: 38px; }
.snap-meter-bar { position: absolute; left: 0; right: 0; top: 6px; height: 10px; border-radius: 5px; background: linear-gradient(90deg, #d97706 0%, #f4d9a8 38%, #e2e8f0 50%, #b6cdf6 62%, #2563eb 100%); }
.snap-meter-pin { position: absolute; top: 1px; width: 20px; height: 20px; margin-left: -10px; box-sizing: border-box; border: 3px solid var(--ink); border-radius: 50%; background: #fff; box-shadow: 0 2px 6px rgba(15, 23, 42, .3); }
.snap-meter-end { position: absolute; top: 25px; color: var(--faint); font-size: 10px; font-weight: 600; letter-spacing: .04em; }
.snap-meter-end.start { left: 0; } .snap-meter-end.mid { left: 50%; transform: translateX(-50%); } .snap-meter-end.end { right: 0; }

.snap-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.snap-tile { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding: 9px 11px 7px; border: 1px solid var(--rule); border-radius: 10px; background: #fff; }
.snap-label { overflow: hidden; color: var(--soft); font-size: 10.5px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.snap-value { font-size: 21px; font-weight: 700; letter-spacing: -.02em; font-variant-numeric: tabular-nums; line-height: 1.15; }
.snap-delta { min-height: 15px; font-size: 10.5px; }
.snap-spark { height: 20px; margin: 3px 0 2px; }
.snap-spark svg { display: block; width: 100%; height: 100%; }
.snap-period { color: var(--faint); font-size: 9.5px; }
.snap-sheet .d { display: inline-flex; align-items: baseline; gap: 3px; font-weight: 600; font-variant-numeric: tabular-nums; }
.snap-sheet .d i { font-size: 8px; font-style: normal; }
.snap-sheet .d small { color: var(--faint); font-size: 9.5px; font-weight: 500; }
.snap-sheet .d.up { color: var(--up); } .snap-sheet .d.down { color: var(--down); } .snap-sheet .d.flat { color: var(--faint); }

.snap-trend-chart { min-height: 130px; }

.snap-cols { margin-bottom: 12px; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 30px; align-items: start; }
.snap-context li { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; gap: 10px; padding: 5px 0; border-bottom: 1px solid var(--rule); list-style: none; }
.snap-context li:last-child { border-bottom: 0; }
.snap-context li > span { color: var(--soft); font-weight: 500; }
.snap-context li small { margin-left: 6px; color: var(--faint); font-size: 9.5px; font-weight: 400; }
.snap-context li strong { font-size: 13px; font-variant-numeric: tabular-nums; text-align: right; }
.snap-context li .d { min-width: 64px; justify-content: flex-end; font-size: 10.5px; }
.snap-stands ol { display: grid; gap: 12px; counter-reset: stand; list-style: none; }
.snap-stands li { position: relative; padding-left: 34px; counter-increment: stand; font-size: 12.5px; line-height: 1.5; }
.snap-stands li::before { content: counter(stand); position: absolute; left: 0; top: 1px; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--ink); color: #fff; font-size: 11px; font-weight: 700; }
.snap-pending { color: var(--faint); font-size: 12px; }

.snap-foot { margin-top: auto; padding: 8px 40px 12px; border-top: 1px solid var(--rule); color: var(--faint); font-size: 9.5px; line-height: 1.5; }
.snap-foot p + p { margin-top: 4px; }
.snap-foot a { color: var(--soft); }

@media print {
  @page { size: letter; margin: 0; }
  html, body { height: 11in !important; overflow: hidden !important; background: #fff !important; }
  body * { visibility: hidden !important; }
  .snap-sheet, .snap-sheet * { visibility: visible !important; }
  .snap-sheet { position: fixed; left: 0; top: 0; width: 8.5in; height: 11in; min-height: 0; box-shadow: none; }
  .snap-sheet, .snap-sheet * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
