:root {
  color-scheme: dark;
  --bg: #08130f;
  --panel: #10231b;
  --panel-2: #153027;
  --line: #28483b;
  --text: #f4f2e8;
  --muted: #aebdb4;
  --mint: #78e6af;
  --gold: #e7c875;
  --red: #f39b94;
}
* { box-sizing: border-box; }
body { margin: 0; background: radial-gradient(circle at 85% 0%, #173b2d 0, var(--bg) 35%); color: var(--text); font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
.hero, main, footer { width: min(1440px, calc(100% - 40px)); margin-inline: auto; }
.hero { display: flex; justify-content: space-between; gap: 32px; align-items: end; padding: 54px 0 28px; border-bottom: 1px solid var(--line); }
h1 { font-family: Georgia, serif; font-size: clamp(2.5rem, 5vw, 5.4rem); line-height: .95; margin: 8px 0 18px; max-width: 850px; }
h2, h3, p { margin-top: 0; }
.eyebrow { color: var(--mint); letter-spacing: .16em; font-size: .72rem; font-weight: 800; margin-bottom: 8px; }
.lede { max-width: 760px; color: var(--muted); font-size: 1.05rem; line-height: 1.6; }
.hero-tools { display: grid; justify-items: end; gap: 12px; min-width: min(440px, 100%); }
.status { padding: 10px 14px; border: 1px solid var(--line); border-radius: 14px; color: var(--muted); text-align: right; }
.guide { position: relative; width: min(360px, 100%); }
.guide summary { cursor: pointer; list-style: none; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); color: var(--mint); padding: 11px 14px; font-weight: 800; text-align: center; }
.guide summary::-webkit-details-marker { display: none; }
.guide summary::after { content: " ▾"; }
.guide[open] summary::after { content: " ▴"; }
.guide-panel { position: absolute; z-index: 20; right: 0; top: calc(100% + 8px); width: min(560px, calc(100vw - 40px)); max-height: min(680px, 75vh); overflow-y: auto; padding: 20px; border: 1px solid var(--line); border-radius: 14px; background: #0b1b15; box-shadow: 0 22px 60px rgba(0,0,0,.45); }
.guide-panel h2 { margin-bottom: 14px; }
.guide-panel h3 { margin: 20px 0 10px; }
.guide-panel p { color: #d9e2dc; font-size: .86rem; line-height: 1.5; margin-bottom: 9px; }
.metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 24px 0; }
.metrics article, .filters, .results, .detail article { background: rgba(16,35,27,.92); border: 1px solid var(--line); border-radius: 16px; }
.metrics article { padding: 22px; }
.metrics span { display: block; font: 700 2rem Georgia, serif; color: var(--mint); }
.metrics span.blocked { color: var(--red); }
.metrics small { color: var(--muted); }
.workspace { display: grid; grid-template-columns: 250px minmax(0,1fr); gap: 18px; align-items: start; }
.filters { padding: 20px; position: sticky; top: 12px; }
.filters label, .results-heading label { display: grid; gap: 7px; color: var(--muted); font-size: .82rem; margin: 16px 0; }
input, select, button { width: 100%; border: 1px solid var(--line); border-radius: 9px; background: #0b1b15; color: var(--text); padding: 10px 12px; font: inherit; }
button { cursor: pointer; color: var(--mint); font-weight: 700; }
.note, .chart-caption { color: var(--muted); font-size: .78rem; line-height: 1.5; }
.results { overflow: hidden; }
.results-heading { display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 20px; }
.results-heading h2 { margin: 0; }
.results-heading label { margin: 0; min-width: 180px; }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { color: var(--muted); font-size: .72rem; letter-spacing: .08em; text-align: left; padding: 12px 16px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
td { padding: 15px 16px; border-bottom: 1px solid var(--line); vertical-align: middle; }
tbody tr { cursor: pointer; transition: background .15s; }
tbody tr:hover, tbody tr.selected { background: var(--panel-2); }
.stock-name strong, .stock-name small { display: block; }
.stock-name small, .muted { color: var(--muted); margin-top: 4px; }
.scores { min-width: 150px; font-size: .76rem; color: var(--muted); }
.scores b { color: var(--text); margin-right: 8px; }
.pill { display: inline-flex; padding: 5px 9px; border-radius: 999px; border: 1px solid var(--line); font-size: .74rem; white-space: nowrap; }
.pill.eligible { color: var(--mint); border-color: #347a58; }
.pill.watch { color: var(--gold); border-color: #756637; }
.pill.not-investable { color: #c2c8c4; border-color: #59635e; }
.pill.insufficient { color: #bdc8e8; border-color: #59698d; }
.pill.reject { color: var(--red); border-color: #7c4642; }
.detail { margin: 20px 0 42px; scroll-margin-top: 20px; }
.detail-title { display: flex; justify-content: space-between; align-items: start; gap: 20px; padding: 28px 2px 16px; }
.detail-title h2 { font: 700 clamp(1.8rem,4vw,3.2rem) Georgia,serif; margin: 0 0 8px; }
.detail-title p { color: var(--muted); }
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.detail article { padding: 22px; }
.thesis p, .detail li { color: #d9e2dc; line-height: 1.6; }
.decision, .evidence-note { padding: 12px 14px; border-radius: 10px; }
.decision { background: rgba(120,230,175,.08); border: 1px solid #347a58; }
.evidence-note { background: #0b1b15; color: var(--muted) !important; font-size: .84rem; }
dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; margin-bottom: 0; }
dt { color: var(--muted); font-size: .75rem; }
dd { margin: 2px 0 0; font-weight: 700; }
.fact { padding: 10px; background: #0b1b15; border-radius: 9px; }
.score-row { display: grid; grid-template-columns: 110px 1fr 46px; align-items: center; gap: 10px; margin: 13px 0; font-size: .84rem; }
.bar { height: 8px; background: #08130f; border-radius: 99px; overflow: hidden; }
.bar i { display: block; height: 100%; background: linear-gradient(90deg,var(--gold),var(--mint)); }
#price-chart { width: 100%; min-height: 220px; overflow: visible; }
.axis { stroke: var(--line); stroke-width: 1; }
.price-line { fill: none; stroke: var(--mint); stroke-width: 3; }
.area { fill: url(#area-fill); opacity: .5; }
footer { color: var(--muted); border-top: 1px solid var(--line); padding: 24px 0 40px; font-size: .8rem; }
@media (max-width: 860px) {
  .hero { display: block; } .hero-tools { justify-items: stretch; margin-top: 12px; min-width: 0; } .status { text-align: left; }
  .guide { width: 100%; } .guide-panel { left: 0; right: auto; }
  .metrics { grid-template-columns: repeat(2,1fr); }
  .workspace { grid-template-columns: 1fr; }
  .filters { position: static; }
  .detail-grid { grid-template-columns: 1fr; }
}
@media (max-width: 520px) { .hero, main, footer { width: min(100% - 22px,1440px); } .metrics { gap: 8px; } .metrics article { padding: 15px; } th,td { padding: 12px 10px; } }