:root {
  --ink: #f4f1e8;
  --muted: #989b9a;
  --faint: #616866;
  --bg: #090c0c;
  --panel: #111615;
  --panel-2: #151c1a;
  --line: #27302e;
  --acid: #c8f25e;
  --acid-soft: rgba(200, 242, 94, .12);
  --cyan: #68e4e8;
  --cyan-soft: rgba(104, 228, 232, .1);
  --red: #ff7b78;
  --amber: #f2c96b;
  --radius: 16px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: var(--bg);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: radial-gradient(circle at 72% -10%, rgba(72, 120, 92, .18), transparent 36rem), var(--bg); }
button, select { font: inherit; }
a { color: inherit; }
.skip-link { position: fixed; top: -4rem; left: 1rem; z-index: 30; background: var(--acid); color: #111; padding: .7rem 1rem; border-radius: 8px; }
.skip-link:focus { top: 1rem; }
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

.topbar { height: 72px; padding: 0 clamp(1rem, 4vw, 4rem); display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: rgba(9, 12, 12, .86); backdrop-filter: blur(18px); position: sticky; top: 0; z-index: 20; }
.brand { display: flex; gap: .8rem; align-items: center; }
.brand-mark { display: flex; align-items: end; gap: 3px; width: 28px; height: 26px; }
.brand-mark i { display: block; width: 6px; background: var(--acid); border-radius: 1px; transform: skew(-8deg); }
.brand-mark i:nth-child(1) { height: 10px; }.brand-mark i:nth-child(2) { height: 18px; }.brand-mark i:nth-child(3) { height: 26px; }
.brand strong { display: block; letter-spacing: .01em; }.brand div span { display: block; color: var(--muted); font-size: .71rem; text-transform: uppercase; letter-spacing: .14em; margin-top: 2px; }
.pulsepup-mark { display: block; width: 32px; height: 32px; }
.topbar-status { display: flex; align-items: center; gap: .9rem; color: var(--muted); font-size: .8rem; }
.topbar-explained,.status-with-help { display: inline-flex; align-items: center; gap: .2rem; }
.mode-pill, .status-chip { border: 1px solid var(--line); border-radius: 99px; padding: .35rem .65rem; text-transform: uppercase; font-size: .68rem; letter-spacing: .1em; }
.mode-pill { color: var(--acid); background: var(--acid-soft); border-color: rgba(200, 242, 94, .28); }
.icon-button { width: 36px; height: 36px; border: 1px solid var(--line); border-radius: 50%; color: var(--ink); background: transparent; cursor: pointer; transition: .2s ease; }
.icon-button:hover { border-color: var(--acid); color: var(--acid); transform: rotate(20deg); }

main { max-width: 1640px; margin: 0 auto; padding: 0 clamp(1rem, 4vw, 4rem) 5rem; }
.intro { min-height: 360px; padding: 5rem 0 3.5rem; display: grid; grid-template-columns: minmax(0, 1fr) 340px; align-items: end; gap: 3rem; border-bottom: 1px solid var(--line); }
.eyebrow { color: var(--acid); font: 600 .69rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; text-transform: uppercase; letter-spacing: .17em; margin: 0 0 .75rem; }
h1 { font: 500 clamp(2.6rem, 6vw, 6.5rem)/.94 Georgia, "Times New Roman", serif; letter-spacing: -.055em; margin: 0; max-width: 1050px; }
h1 span { color: #8e9894; }
.intro-copy { color: var(--muted); max-width: 660px; font-size: 1rem; line-height: 1.65; margin: 1.8rem 0 0; }
.legend-card { border-left: 1px solid var(--line); padding: 1.1rem 0 1.1rem 2rem; }
.legend-card p { color: var(--muted); font: 600 .66rem ui-monospace, monospace; text-transform: uppercase; letter-spacing: .12em; margin: 0 0 .4rem; }
.legend-card strong { display: block; font-size: 1.12rem; }.legend-card strong.cyan { color: var(--cyan); }
.legend-card span { color: var(--faint); font-size: .78rem; display: block; margin-top: .35rem; }.legend-card hr { border: 0; border-top: 1px solid var(--line); margin: 1.25rem 0; }

.summary-grid { display: grid; grid-template-columns: repeat(5, 1fr); border-bottom: 1px solid var(--line); }
.metric-card { padding: 2rem 1.5rem; border-right: 1px solid var(--line); min-height: 145px; }
.metric-card:first-child { padding-left: 0; }.metric-card:last-child { border-right: 0; }
.metric-card span { display: block; color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; }
.metric-card strong { display: block; color: var(--ink); font: 500 2.65rem/1 ui-monospace, monospace; margin: .9rem 0 .45rem; }
.metric-card:nth-child(2) strong { color: var(--acid); }.metric-card small { color: var(--faint); }
.state-counts { display: flex; flex-wrap: wrap; gap: .55rem; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.state-count { display: inline-flex; align-items: center; gap: .42rem; border: 1px solid var(--line); border-radius: 99px; padding: .38rem .62rem; color: var(--muted); font-size: .66rem; letter-spacing: .04em; }
.state-count i { width: 6px; height: 6px; border-radius: 50%; background: var(--muted); }
.state-count b { font-weight: 500; }.state-count strong { color: var(--ink); font-family: ui-monospace, monospace; }
.state-count.state-HEALTHY_TREND i,.state-count.state-EARLY_BREAKOUT i { background: var(--acid); }.state-count.state-EXTENDED_TREND i { background: var(--amber); }.state-count.state-CORRECTION i,.state-count.state-FAILED_TREND i { background: var(--red); }.state-count.state-BASE_FORMATION i { background: var(--cyan); }
.skeleton strong { animation: pulse 1.6s ease-in-out infinite; }
@keyframes pulse { 50% { opacity: .32; } }

.term-help { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; margin: -.2rem -.12rem -.2rem .12rem; padding: 0; border: 1px solid #46504d; border-radius: 50%; color: var(--muted); background: transparent; font: 700 .61rem/1 ui-monospace, monospace; vertical-align: .08rem; cursor: help; transition: border-color .15s ease, color .15s ease, background .15s ease; }
.term-help:hover,.term-help:focus-visible { color: var(--acid); border-color: var(--acid); background: var(--acid-soft); outline: none; }
.label-with-help { display: inline-flex; align-items: center; gap: .12rem; }
.metric-card .label-with-help { display: inline-flex; }
[data-help-key]:not(button),[data-help-title]:not(button) { cursor: help; }
.status-chip .term-help,.state-evidence-chip .term-help,.state-label .term-help,.state-support .term-help,.evidence-result .term-help,.mandatory-badge .term-help,.state-count .term-help { width: 1.12rem; height: 1.12rem; margin-left: .2rem; font-size: .48rem; }

.guide-panel { margin-top: 1.35rem; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: linear-gradient(135deg, #121816, #101412); }
.guide-panel details > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.35rem 1.5rem; cursor: pointer; border-bottom: 1px solid transparent; }
.guide-panel details > summary::-webkit-details-marker { display: none; }
.guide-panel details[open] > summary { border-bottom-color: var(--line); }
.guide-panel details > summary::after { content: "+"; display: grid; place-items: center; flex: 0 0 auto; width: 1.9rem; height: 1.9rem; border: 1px solid var(--line); border-radius: 50%; color: var(--acid); font-size: 1.25rem; line-height: 1; }
.guide-panel details[open] > summary::after { content: "−"; }
.guide-summary-copy { display: block; }
.guide-panel summary .eyebrow { display: block; margin-bottom: .35rem; }
.guide-title { display: block; font: 500 1.25rem/1.2 Georgia, serif; letter-spacing: -.01em; }
.guide-summary-hint { margin-left: auto; color: var(--faint); font-size: .68rem; }
.guide-body { padding: 1.45rem 1.5rem 1.65rem; }
.guide-intro { max-width: 960px; margin: 0 0 1.25rem; color: #c4cac6; font-size: .86rem; line-height: 1.6; }
.guide-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; }
.guide-card { min-width: 0; padding: 1rem; border: 1px solid var(--line); border-radius: 10px; background: #0d1211; }
.guide-card h3 { margin: 0; font-size: .83rem; font-weight: 650; }
.guide-card p { margin: .55rem 0 .65rem; color: #aeb6b2; font-size: .73rem; line-height: 1.5; }
.guide-card small { display: block; color: var(--faint); font-size: .67rem; line-height: 1.45; }
.worked-example { margin-top: 1rem; padding: 1.2rem; border: 1px solid rgba(200,242,94,.25); border-radius: 12px; background: linear-gradient(120deg, rgba(200,242,94,.08), rgba(104,228,232,.025)); }
.worked-example-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; }
.worked-example-heading .eyebrow { margin: 0; }
.worked-example-heading h3 { margin: 0; font: 500 1rem/1.3 ui-monospace, monospace; color: var(--acid); }
.worked-components { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .55rem; margin-top: 1rem; }
.worked-component { display: grid; grid-template-columns: 1fr auto; gap: .2rem .5rem; padding: .65rem .75rem; border: 1px solid var(--line); border-radius: 8px; background: rgba(9,12,12,.55); }
.worked-component b { grid-column: 1 / -1; color: var(--muted); font-size: .62rem; text-transform: uppercase; letter-spacing: .07em; }
.worked-component strong { font: 600 1rem ui-monospace, monospace; }
.worked-component small { align-self: center; color: var(--faint); }
.worked-equation { margin: .95rem 0 .4rem; color: #d2d7d3; font: 500 .75rem/1.55 ui-monospace, monospace; }
.worked-meaning { margin: 0; color: var(--muted); font-size: .74rem; line-height: 1.5; }
.illustrative-note { display: block; margin-top: .55rem; color: var(--amber); font-size: .66rem; }
.guide-subhead { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin: 1.5rem 0 .75rem; }
.guide-subhead h3 { margin: 0; font: 500 1rem Georgia, serif; }
.guide-subhead p { margin: 0; color: var(--faint); font-size: .68rem; }
.state-guide-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .7rem; }
.state-guide-card { position: relative; overflow: hidden; padding: .9rem; border: 1px solid var(--line); border-radius: 10px; background: #0d1211; }
.state-guide-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--muted); }
.state-guide-card.state-HEALTHY_TREND::before,.state-guide-card.state-EARLY_BREAKOUT::before { background: var(--acid); }
.state-guide-card.state-EXTENDED_TREND::before { background: var(--amber); }
.state-guide-card.state-CORRECTION::before,.state-guide-card.state-FAILED_TREND::before { background: var(--red); }
.state-guide-card.state-BASE_FORMATION::before { background: var(--cyan); }
.state-guide-heading { display: flex; align-items: center; gap: .5rem; }
.state-order { display: grid; place-items: center; width: 1.3rem; height: 1.3rem; border: 1px solid var(--line); border-radius: 50%; color: var(--faint); font: 600 .57rem ui-monospace, monospace; }
.state-guide-card h4 { margin: 0; font-size: .78rem; }
.state-guide-card p { margin: .55rem 0; color: #aeb6b2; font-size: .7rem; line-height: 1.48; }
.state-guide-card small { color: var(--faint); font-size: .64rem; line-height: 1.42; }
.state-rule { display: block; margin-top: .55rem; color: #cbd2ce; font-size: .63rem; font-weight: 550; line-height: 1.48; }
.state-rule.confirmation { color: #9fc4c2; }
.guide-note { margin: 1rem 0 0; color: #82908b; font-size: .7rem; line-height: 1.5; }

.workspace { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(500px, 1fr); align-items: start; gap: 1rem; margin-top: 2.5rem; }
.panel { background: var(--panel); }
.rankings-panel,.detail-panel { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); }
.rankings-panel { position: sticky; top: 88px; }
.panel-header { padding: 1.35rem 1.5rem 1.2rem; display: flex; align-items: end; justify-content: space-between; gap: 1rem; border-bottom: 1px solid var(--line); }
.panel-header.compact { align-items: center; }.panel-header .eyebrow { margin-bottom: .4rem; }
h2 { margin: 0; font: 500 1.25rem/1.2 Georgia, serif; letter-spacing: -.01em; }
.filters { display: flex; align-items: end; gap: .6rem; }
.filters label { display: grid; gap: .3rem; color: var(--faint); font: 600 .58rem ui-monospace, monospace; text-transform: uppercase; letter-spacing: .07em; }
.filters label > span { display: inline-flex; align-items: center; }
select,input[type="search"] { min-height: 2.15rem; color: var(--ink); background: #0d1211; border: 1px solid var(--line); border-radius: 8px; padding: .55rem .7rem; font-size: .76rem; }
select { padding-right: 2rem; }
input[type="search"] { width: 11rem; }
input[type="search"]::placeholder { color: #69736f; }
select:focus-visible,input[type="search"]:focus-visible { outline: 2px solid var(--acid); outline-offset: 2px; }
.table-wrap { max-height: calc(100vh - 245px); overflow: auto; }
table { width: 100%; border-collapse: collapse; font-size: .8rem; }
th { position: sticky; top: 0; z-index: 2; color: var(--faint); background: #111615; font: 600 .62rem ui-monospace, monospace; text-transform: uppercase; letter-spacing: .08em; text-align: right; padding: .85rem .8rem; border-bottom: 1px solid var(--line); white-space: nowrap; }
th:nth-child(1), th:nth-child(2), th:nth-child(3) { text-align: left; }
td { text-align: right; padding: .9rem .8rem; border-bottom: 1px solid rgba(39, 48, 46, .7); font-variant-numeric: tabular-nums; white-space: nowrap; }
td:nth-child(1), td:nth-child(2), td:nth-child(3) { text-align: left; }
tbody tr { cursor: pointer; transition: background .15s ease; } tbody tr:hover, tbody tr.selected { background: var(--acid-soft); }
tbody tr:focus-visible { outline: 2px solid var(--acid); outline-offset: -2px; }
.rank-number { color: var(--faint); font-family: ui-monospace, monospace; }
.symbol-button { display: block; min-width: 0; padding: 0; border: 0; color: var(--ink); background: transparent; text-align: left; cursor: pointer; border-radius: 5px; }
.symbol-button strong { display: block; width: max-content; border-bottom: 1px dotted #66706d; font-size: .92rem; transition: color .15s ease, border-color .15s ease; }
.symbol-button small { display: block; color: var(--faint); margin-top: .2rem; max-width: 15ch; overflow: hidden; text-overflow: ellipsis; }
.symbol-button:hover strong,.symbol-button:focus-visible strong { color: var(--acid); border-color: var(--acid); }
.symbol-button:focus-visible { outline: 2px solid var(--acid); outline-offset: 4px; }
.score-cell { color: var(--acid); font-weight: 700; }.component-cell { color: #bdc4c1; }.rank-up { color: var(--acid); }.rank-down { color: var(--red); }.rank-flat { color: var(--faint); }
.state-label { display: inline-flex; align-items: center; gap: .4rem; font-size: .65rem; letter-spacing: .06em; }.state-label::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--muted); }.state-HEALTHY_TREND::before,.state-EARLY_BREAKOUT::before { background: var(--acid); }.state-EXTENDED_TREND::before { background: var(--amber); }.state-CORRECTION::before,.state-FAILED_TREND::before { background: var(--red); }.state-BASE_FORMATION::before { background: var(--cyan); }
.state-support { display: block; width: max-content; margin-top: .32rem; font: 600 .48rem ui-monospace, monospace; letter-spacing: .06em; }
.state-support.supported { color: var(--acid); }.state-support.mixed { color: var(--amber); }.state-support.unavailable { color: var(--faint); }
.loading-cell { color: var(--muted); text-align: center !important; padding: 4rem; cursor: default; }
.panel-foot { display: flex; justify-content: space-between; gap: 1rem; padding: .8rem 1.5rem; color: var(--faint); font-size: .67rem; }

.detail-panel { min-height: 600px; }.empty-detail { min-height: 600px; display: grid; place-content: center; text-align: center; color: var(--faint); padding: 2rem; }.empty-detail span { font-size: 2rem; }.detail-head { padding: 1.7rem; border-bottom: 1px solid var(--line); }.detail-symbol { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; }.detail-symbol h2 { font: 500 2.3rem ui-monospace, monospace; }.detail-symbol .big-score { color: var(--acid); font: 500 2.5rem ui-monospace, monospace; }.company { color: var(--muted); margin: .5rem 0 1.2rem; }.detail-narrative { line-height: 1.55; color: #c3c8c5; font-size: .85rem; margin: 1rem 0 0; }.detail-section { padding: 1.35rem 1.7rem; border-bottom: 1px solid var(--line); }.detail-section h3 { color: var(--muted); font: 600 .65rem ui-monospace, monospace; text-transform: uppercase; letter-spacing: .12em; margin: 0 0 1rem; }.score-bars { display: grid; gap: .8rem; }.score-bar-row { display: grid; grid-template-columns: 88px 1fr 38px; align-items: center; gap: .65rem; font-size: .72rem; color: var(--muted); }.bar-track { height: 5px; background: #242a28; border-radius: 9px; overflow: hidden; }.bar-fill { height: 100%; background: var(--acid); border-radius: inherit; }.score-bar-row output { color: var(--ink); text-align: right; font-family: ui-monospace, monospace; }.feature-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }.feature-cell { background: #0d1211; border: 1px solid var(--line); border-radius: 9px; padding: .75rem; }.feature-cell span { color: var(--faint); display: block; font-size: .63rem; text-transform: uppercase; letter-spacing: .07em; }.feature-cell strong { display: block; margin-top: .38rem; font: 500 .9rem ui-monospace, monospace; }
.detail-section-heading { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-bottom: .75rem; }
.detail-section-heading h3 { margin: 0; }
.history-expand-button { min-height: 2rem; padding: .38rem .6rem; border: 1px solid rgba(104,228,232,.35); border-radius: 7px; color: var(--cyan); background: var(--cyan-soft); font: 600 .57rem ui-monospace, monospace; cursor: pointer; }
.history-expand-button:hover,.history-expand-button:focus-visible { color: #101414; background: var(--cyan); outline: 2px solid rgba(104,228,232,.3); outline-offset: 2px; }
.detail-history-description { margin: 0 0 .75rem; color: var(--muted); font-size: .67rem; line-height: 1.5; }
.detail-history-content { display: grid; gap: .6rem; }
.detail-history-loading,.detail-history-failure { padding: 1rem; border: 1px solid var(--line); border-radius: 9px; color: var(--muted); background: #0d1211; font-size: .7rem; line-height: 1.5; }
.detail-history-failure { color: var(--amber); }.detail-history-failure strong,.detail-history-failure p,.detail-history-failure small,.detail-history-failure code { display: block; }.detail-history-failure p { margin: .45rem 0; }.detail-history-failure small { color: #c7b681; }
.detail-history-plot { position: relative; height: 300px; min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 9px; background: #0b100f; }
.detail-history-plot svg { display: block; width: 100%; height: 100%; }
.detail-history-audit { margin: 0; color: #8b9792; font: 500 .58rem/1.5 ui-monospace, monospace; }
.score-equation { margin: 1rem 0; padding: .7rem; border: 1px solid rgba(200,242,94,.2); border-radius: 8px; color: #d0d7d2; background: rgba(200,242,94,.04); font: 500 .63rem/1.55 ui-monospace, monospace; }
.score-input-groups { display: grid; gap: .6rem; }
.score-input-group { padding: .75rem; border: 1px solid var(--line); border-radius: 9px; background: #0d1211; }
.score-input-group h4 { margin: 0 0 .55rem; color: var(--cyan); font-size: .66rem; }
.score-input-list { display: grid; gap: .35rem; margin: 0; }
.score-input-list div { display: grid; grid-template-columns: minmax(110px,.8fr) minmax(0,1.2fr); align-items: start; gap: .55rem; }
.score-input-list dt { color: var(--faint); font-size: .57rem; line-height: 1.35; }.score-input-list dd { min-width: 0; margin: 0; overflow-wrap: anywhere; color: #cdd4d0; text-align: right; font: 500 .58rem/1.4 ui-monospace, monospace; }
.detail-state-status { display: flex; flex-wrap: wrap; align-items: center; gap: .55rem; }
.state-evidence-section { background: linear-gradient(150deg, rgba(104,228,232,.055), transparent 68%); }
.state-evidence-status-line { display: flex; align-items: center; justify-content: space-between; gap: .7rem; margin-bottom: .8rem; }
.state-evidence-chip { display: inline-flex; align-items: center; min-height: 22px; padding: .24rem .48rem; border: 1px solid var(--line); border-radius: 999px; font: 650 .52rem ui-monospace, monospace; letter-spacing: .06em; }
.state-evidence-chip.supported { color: var(--acid); border-color: rgba(200,242,94,.35); background: var(--acid-soft); }
.state-evidence-chip.mixed { color: var(--amber); border-color: rgba(242,201,107,.35); background: rgba(242,201,107,.08); }
.state-evidence-chip.unavailable { color: var(--faint); background: rgba(97,104,102,.08); }
.state-evidence-asof { color: var(--faint); font: 500 .58rem ui-monospace, monospace; }
.state-evidence-summary { margin: 0; color: #d0d8d4; font-size: .78rem; line-height: 1.5; }
.evidence-support-rule { margin-top: .8rem; padding: .75rem; border: 1px solid rgba(200,242,94,.2); border-radius: 9px; background: rgba(200,242,94,.035); }
.evidence-support-rule strong { color: var(--acid); font-size: .68rem; }.evidence-support-rule p { margin: .35rem 0 0; color: #b9c2bd; font-size: .62rem; line-height: 1.5; }
.evidence-groups { display: grid; gap: .8rem; margin-top: 1rem; }
.evidence-group { overflow: hidden; border: 1px solid rgba(104,228,232,.16); border-radius: 10px; background: rgba(9,12,12,.52); }
.evidence-group-head { display: flex; align-items: center; justify-content: space-between; gap: .7rem; padding: .62rem .72rem; border-bottom: 1px solid var(--line); }
.evidence-group-head h4 { margin: 0; color: var(--cyan); font: 600 .65rem ui-monospace, monospace; text-transform: uppercase; letter-spacing: .06em; }
.evidence-group-head span { color: var(--faint); font: 600 .55rem ui-monospace, monospace; }
.evidence-finding { display: grid; grid-template-columns: 42px minmax(0,1fr); gap: .65rem; align-items: start; padding: .68rem .72rem; border-bottom: 1px solid rgba(39,48,46,.65); }
.evidence-finding:last-child { border-bottom: 0; }
.evidence-result { margin-top: .08rem; font: 700 .51rem ui-monospace, monospace; letter-spacing: .06em; }
.evidence-finding.pass .evidence-result { color: var(--acid); }.evidence-finding.fail .evidence-result { color: var(--red); }
.evidence-copy { min-width: 0; }.evidence-copy strong { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; min-width: 0; overflow-wrap: anywhere; color: #d8dfdc; font-size: .69rem; }.evidence-copy span { display: block; min-width: 0; margin-top: .22rem; overflow-wrap: anywhere; white-space: normal; color: #bec7c3; font: 500 .68rem ui-monospace, monospace; }.evidence-copy small { display: block; min-width: 0; margin-top: .3rem; overflow-wrap: anywhere; white-space: normal; color: var(--faint); font-size: .57rem; line-height: 1.4; }
.mandatory-badge { display: inline-flex !important; align-items: center; width: max-content; margin: 0 !important; padding: .16rem .3rem; border: 1px solid rgba(242,201,107,.32); border-radius: 99px; color: var(--amber) !important; font: 650 .45rem ui-monospace, monospace !important; letter-spacing: .05em; }
.evidence-why { color: #aab9b3 !important; }.evidence-source { color: #73817c !important; }
.state-evidence-context { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .55rem; margin-top: .9rem; }
.regime-scope-note { margin: .55rem 0 0; color: #80908a; font-size: .59rem; line-height: 1.5; }
.forecast-boundary { margin: .8rem 0 0; padding: .65rem .72rem; border: 1px solid var(--line); border-radius: 8px; font-size: .63rem; line-height: 1.45; }
.forecast-boundary strong { display: block; }.forecast-boundary p { margin: .35rem 0 0; }
.forecast-boundary.excluded { color: var(--amber); background: rgba(242,201,107,.05); }.forecast-boundary.published { color: var(--cyan); background: var(--cyan-soft); }

.lower-grid { display: grid; grid-template-columns: 1fr 1fr 1.1fr; gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; margin-top: 1.2rem; }
.breadth-content, .rotation-list, .live-content { padding: 1.4rem 1.5rem; min-height: 265px; }.breadth-stat { display: grid; grid-template-columns: 105px 1fr 38px; gap: .7rem; align-items: center; margin-bottom: 1.05rem; color: var(--muted); font-size: .73rem; }.breadth-track { height: 7px; background: #262c2a; border-radius: 10px; overflow: hidden; }.breadth-fill { height: 100%; background: var(--acid); }.breadth-stat output { text-align: right; color: var(--ink); font: 500 .8rem ui-monospace, monospace; }.breadth-split { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; border-top: 1px solid var(--line); padding-top: 1.2rem; }.breadth-split div { padding: .75rem; background: #0d1211; border-radius: 8px; }.breadth-split span { display: block; color: var(--faint); font-size: .63rem; text-transform: uppercase; }.breadth-split strong { display: block; font: 500 1.25rem ui-monospace, monospace; margin-top: .3rem; }
.rank-heatmap { display: grid; grid-template-columns: repeat(auto-fit, minmax(42px, 1fr)); gap: 4px; padding-bottom: 1rem; margin-bottom: .35rem; border-bottom: 1px solid var(--line); }.heat-cell { min-width: 0; padding: .45rem .3rem; border-radius: 6px; text-align: center; background: rgba(97,104,102,var(--heat)); }.heat-cell.up { background: rgba(200,242,94,var(--heat)); color: #101411; }.heat-cell.down { background: rgba(255,123,120,var(--heat)); color: #160b0b; }.heat-cell strong,.heat-cell span { display: block; font: 600 .58rem ui-monospace, monospace; }.heat-cell span { margin-top: .18rem; opacity: .75; }
.rotation-row { display: grid; grid-template-columns: 62px 54px minmax(120px,1fr) 48px; gap: .7rem; align-items: center; padding: .7rem 0; border-bottom: 1px solid var(--line); font-size: .74rem; }.rotation-row:last-child { border: 0; }.rotation-rank { color: var(--faint); font-family: ui-monospace, monospace; }.rotation-rank.unranked { font-size: .56rem; letter-spacing: .03em; }.rotation-row strong { letter-spacing: .03em; }.rotation-row small { color: var(--faint); text-align: right; white-space: normal; }.direction { text-align: right; font: 600 .67rem ui-monospace, monospace; }
.live-panel { background: linear-gradient(150deg, var(--panel), #101b1b); }.live-panel .panel-header { border-bottom-color: rgba(104, 228, 232, .18); }.live-panel .eyebrow { color: var(--cyan); }.live-kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: .7rem; }.live-kpi { border: 1px solid rgba(104, 228, 232, .14); background: var(--cyan-soft); border-radius: 9px; padding: .75rem; }.live-kpi span { display: block; color: #779a99; font-size: .62rem; text-transform: uppercase; }.live-kpi strong { display: block; margin-top: .35rem; font: 500 .9rem ui-monospace, monospace; }.live-reasons { margin: 1rem 0 0; padding-left: 1.15rem; color: #aab7b4; font-size: .74rem; line-height: 1.5; }.architecture-note { margin: 0; padding: .9rem 1.5rem; color: #6f8582; font-size: .66rem; border-top: 1px solid rgba(104, 228, 232, .13); line-height: 1.45; }
.status-chip.good { color: var(--acid); border-color: rgba(200,242,94,.35); background: var(--acid-soft); }.status-chip.warn { color: var(--amber); border-color: rgba(242,201,107,.35); background: rgba(242,201,107,.08); }.status-chip.bad { color: var(--red); border-color: rgba(255,123,120,.35); background: rgba(255,123,120,.08); }.status-chip.live { color: var(--cyan); border-color: rgba(104,228,232,.35); background: var(--cyan-soft); }.status-chip.neutral { color: var(--muted); }

.automation-panel { margin-top: 1.2rem; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; background: linear-gradient(145deg, var(--panel), #101918); }
.automation-panel .eyebrow { color: var(--cyan); }
.automation-content { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 1px; min-height: 130px; background: var(--line); }
.automation-overview,.automation-tasks { min-width: 0; padding: 1.15rem 1.5rem; background: var(--panel); }
.automation-overview { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; }
.automation-metric { min-width: 0; padding: .7rem .8rem; border: 1px solid var(--line); border-radius: 9px; background: rgba(9,12,12,.55); }
.automation-metric span { display: block; color: var(--faint); font-size: .61rem; text-transform: uppercase; letter-spacing: .07em; }
.automation-metric strong { display: block; overflow-wrap: anywhere; margin-top: .35rem; font: 500 .75rem/1.4 ui-monospace, monospace; color: #cbd3cf; }
.automation-tasks { display: grid; gap: .65rem; }
.automation-task { display: grid; grid-template-columns: 10px minmax(130px, .75fr) minmax(0, 1.5fr); align-items: center; gap: .65rem; min-width: 0; padding: .75rem .8rem; border: 1px solid var(--line); border-radius: 9px; background: rgba(9,12,12,.5); }
.automation-task .diagnostic-dot { align-self: start; margin-top: .28rem; }
.automation-task-name strong { display: block; font-size: .76rem; }
.automation-task-name small { display: block; margin-top: .22rem; color: var(--faint); font-size: .61rem; line-height: 1.35; }
.automation-task-detail { min-width: 0; color: var(--muted); font-size: .68rem; line-height: 1.45; }
.automation-task-detail strong { color: var(--ink); font: 600 .64rem ui-monospace, monospace; text-transform: uppercase; letter-spacing: .06em; }
.automation-task-detail small { display: block; overflow-wrap: anywhere; margin-top: .22rem; color: var(--faint); }
.automation-empty { grid-column: 1 / -1; padding: 1.5rem; background: var(--panel); color: var(--muted); font-size: .76rem; }

.diagnostics-panel { margin-top: 1.2rem; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }.diagnostics-grid { padding: 1.25rem 1.5rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: .8rem; }.diagnostic-item { border: 1px solid var(--line); border-radius: 10px; padding: .9rem; }.diagnostic-item header { display: flex; align-items: center; gap: .45rem; }.diagnostic-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--muted); }.diagnostic-dot.ok { background: var(--acid); }.diagnostic-dot.warning { background: var(--amber); }.diagnostic-dot.error { background: var(--red); }.diagnostic-item strong { text-transform: capitalize; font-size: .8rem; }.diagnostic-item p { color: var(--muted); font-size: .71rem; line-height: 1.45; margin: .65rem 0 0; }.diagnostic-item time { display: block; color: var(--faint); font-size: .62rem; margin-top: .7rem; }
.muted { color: var(--muted); font-size: .8rem; }.error-box { color: var(--red); padding: 2rem; text-align: center; }

footer { max-width: 1640px; margin: 0 auto; padding: 1.5rem clamp(1rem, 4vw, 4rem); border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; justify-content: space-between; gap: .7rem 1.2rem; color: var(--faint); font-size: .7rem; }
.toast { position: fixed; right: 1.5rem; bottom: 1.5rem; background: #202725; border: 1px solid var(--line); padding: .8rem 1rem; border-radius: 9px; color: var(--ink); font-size: .75rem; transform: translateY(130%); opacity: 0; transition: .25s ease; z-index: 40; }.toast.show { transform: translateY(0); opacity: 1; }

.help-tooltip { position: fixed; z-index: 120; width: 310px; max-width: calc(100vw - 24px); padding: .85rem .9rem; border: 1px solid #46514d; border-radius: 9px; background: #202725; box-shadow: 0 16px 45px rgba(0,0,0,.38); opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-4px); transition: opacity .12s ease, transform .12s ease, visibility .12s; }
.help-tooltip.show { opacity: 1; visibility: visible; transform: translateY(0); }
.help-tooltip strong { display: block; color: var(--acid); font-size: .78rem; }
.help-tooltip p { margin: .4rem 0 .5rem; color: #d0d5d2; font-size: .72rem; line-height: 1.48; }
.help-tooltip small { display: block; color: #929c98; font-size: .66rem; line-height: 1.42; }

body.chart-modal-open { overflow: hidden; }
.state-preview.chart-modal { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 10px; background: rgba(4,7,7,.78); backdrop-filter: blur(8px); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .14s ease, visibility .14s; }
.state-preview.chart-modal.show { opacity: 1; visibility: visible; pointer-events: auto; }
.chart-modal-surface { position: relative; display: flex; width: min(90vw, 1600px); height: min(90vh, 1000px); min-width: 0; min-height: 0; padding: 1rem; overflow: hidden; border: 1px solid #46514d; border-radius: 15px; background: #111615; box-shadow: 0 30px 90px rgba(0,0,0,.72); }
.chart-modal-content { display: flex; flex: 1; flex-direction: column; gap: .55rem; min-width: 0; min-height: 0; }
.chart-modal-close { position: absolute; top: .7rem; right: .72rem; z-index: 8; display: grid; place-items: center; width: 2.1rem; height: 2.1rem; padding: 0; border: 1px solid #4b5552; border-radius: 50%; color: var(--ink); background: rgba(9,12,12,.94); cursor: pointer; font-size: 1.25rem; line-height: 1; }
.chart-modal-close:hover,.chart-modal-close:focus-visible { color: var(--acid); border-color: var(--acid); outline: 2px solid rgba(200,242,94,.24); outline-offset: 2px; }
.state-preview-kicker { margin: 0; color: var(--cyan); font: 600 .58rem ui-monospace, monospace; text-transform: uppercase; letter-spacing: .14em; }
.state-preview-kicker.actual { color: var(--acid); }
.state-preview-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 2rem; padding-right: 2.7rem; }
.state-preview-identity { display: flex; align-items: center; gap: .7rem; min-width: 0; }
.state-preview-symbol { font: 650 1.35rem ui-monospace, monospace; }
.state-preview-score { color: var(--acid); font: 600 1.3rem ui-monospace, monospace; }
.state-preview-chart { position: relative; display: flex; flex: 1; min-width: 0; min-height: 240px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: linear-gradient(180deg, rgba(104,228,232,.035), rgba(9,12,12,.55)); }
.state-preview-chart.interactive { flex: 1; min-height: 0; }
.state-preview-chart svg { display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; }
.chart-interactive { cursor: crosshair; touch-action: none; }
.chart-interactive:focus-visible { outline: 2px solid var(--acid); outline-offset: -3px; }
.preview-grid-line { stroke: #25302d; stroke-width: 1; vector-effect: non-scaling-stroke; }
.preview-axis-tick { fill: #7b8581; font: 11px ui-monospace, monospace; }
.preview-date-tick { fill: #909a96; }
.preview-line { fill: none; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.preview-line.price { stroke: var(--ink); stroke-width: 2.4; }
.preview-line.sma-fast { stroke: var(--acid); stroke-width: 1.35; }
.preview-line.sma-medium { stroke: var(--cyan); stroke-width: 1.25; stroke-dasharray: 5 3; }
.preview-line.sma-long { stroke: #9c82ee; stroke-width: 1.2; stroke-dasharray: 2 4; }
.preview-reference { stroke: var(--amber); stroke-width: 1; stroke-dasharray: 5 4; vector-effect: non-scaling-stroke; }
.preview-reference-label { fill: var(--amber); font: 10px ui-monospace, monospace; letter-spacing: .03em; }
.preview-volume { fill: rgba(104,228,232,.25); }
.preview-volume.actual { fill: rgba(104,228,232,.2); }
.preview-candle-range { stroke: rgba(244,241,232,.42); stroke-width: .7; vector-effect: non-scaling-stroke; }
.preview-candle { stroke-width: .5; vector-effect: non-scaling-stroke; }
.preview-candle.up { fill: rgba(200,242,94,.48); stroke: var(--acid); }
.preview-candle.down { fill: rgba(255,123,120,.4); stroke: var(--red); }
.preview-latest { fill: var(--acid); stroke: #101411; stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.chart-crosshair-x,.chart-crosshair-y { stroke: rgba(244,241,232,.78); stroke-width: 1; stroke-dasharray: 4 3; vector-effect: non-scaling-stroke; }
.chart-crosshair-spot { fill: var(--acid); stroke: #0d1211; stroke-width: 2; vector-effect: non-scaling-stroke; }
.chart-axis-label rect { fill: #e7ece7; stroke: #111615; stroke-width: 1; vector-effect: non-scaling-stroke; }
.chart-axis-label text { fill: #111615; font: 600 11px ui-monospace, monospace; }
.chart-axis-label-x,.chart-axis-label-y { pointer-events: none; }
.chart-value-tooltip { position: absolute; z-index: 5; width: min(242px, calc(100% - 16px)); padding: .72rem .78rem; border: 1px solid #59645f; border-radius: 8px; color: var(--ink); background: rgba(18,24,22,.97); box-shadow: 0 12px 32px rgba(0,0,0,.42); opacity: 0; visibility: hidden; pointer-events: none; }
.chart-value-tooltip.show { opacity: 1; visibility: visible; }
.chart-value-date { display: block; margin-bottom: .48rem; color: var(--acid); font: 650 .72rem ui-monospace, monospace; }
.chart-value-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .32rem .72rem; margin: 0; }
.chart-value-grid div { display: flex; align-items: baseline; justify-content: space-between; gap: .35rem; min-width: 0; }
.chart-value-grid dt { color: #8e9995; font-size: .55rem; text-transform: uppercase; letter-spacing: .04em; }
.chart-value-grid dd { margin: 0; color: #e2e7e3; font: 550 .61rem ui-monospace, monospace; }
.chart-yahoo-link { position: absolute; top: .6rem; right: .65rem; z-index: 6; display: inline-flex; align-items: center; min-height: 1.9rem; padding: .35rem .58rem; border: 1px solid rgba(104,228,232,.35); border-radius: 7px; color: var(--cyan); background: rgba(9,15,15,.9); font: 600 .6rem ui-monospace, monospace; text-decoration: none; }
.chart-yahoo-link:hover,.chart-yahoo-link:focus-visible { color: #101414; background: var(--cyan); outline: 2px solid rgba(104,228,232,.3); outline-offset: 2px; }
.static-snapshot-badge { cursor: default; }
.chart-modal-meta { display: grid; grid-template-columns: minmax(220px,.8fr) minmax(300px,1fr) minmax(360px,1.4fr); flex: 0 0 auto; align-items: start; gap: .7rem; width: 100%; max-width: none; margin: 0; padding: .6rem 0 0; overflow: visible; border-top: 1px solid var(--line); color: inherit; }
.state-preview-legend { display: flex; flex-wrap: wrap; gap: .38rem .7rem; margin: 0; color: var(--faint); font-size: .56rem; }
.state-preview-legend span { display: inline-flex; align-items: center; gap: .28rem; white-space: nowrap; }
.state-preview-legend i { display: inline-block; width: 13px; height: 2px; background: var(--ink); }
.state-preview-legend .legend-fast { background: var(--acid); }
.state-preview-legend .legend-medium { background: var(--cyan); }
.state-preview-legend .legend-long { background: #9c82ee; }
.state-preview-legend .legend-volume { height: 7px; background: rgba(104,228,232,.32); }
.chart-modal-explanation { min-width: 0; }
.state-preview-copy { margin: 0 0 .2rem; color: #c4cbc7; font-size: .62rem; line-height: 1.35; }
.state-preview-note { display: block; color: var(--amber); font-size: .59rem; line-height: 1.35; }
.state-preview-note.actual { color: #84908c; }
.state-preview-provenance { display: block; margin: .12rem 0 .2rem; color: var(--acid); font-size: .57rem; line-height: 1.35; }
.state-preview-loading,.state-preview-unavailable { display: grid; flex: 1; place-items: center; min-height: 180px; padding: 1rem; border-radius: 9px; background: rgba(9,12,12,.45); color: var(--muted); font-size: .76rem; line-height: 1.5; text-align: center; }
.state-preview-unavailable { align-content: center; gap: .55rem; max-width: 760px; margin: auto; }.state-preview-unavailable strong { color: var(--amber); font-size: 1rem; }.state-preview-unavailable p { max-width: 620px; margin: 0; color: #c5cbc7; }.state-preview-unavailable small { max-width: 620px; color: #a99056; }.history-reason-code { display: block; width: max-content; max-width: 100%; margin: .25rem auto 0; padding: .25rem .42rem; border: 1px solid var(--line); border-radius: 5px; color: #8e9994; background: #0a0e0d; font: 500 .58rem ui-monospace, monospace; overflow-wrap: anywhere; }
.state-preview-loading { color: var(--cyan); }
.state-preview-calculation { display: grid; grid-template-columns: repeat(2, minmax(76px, 1fr)); gap: .3rem; margin: 0; }
.state-preview-calculation span { min-width: 0; padding: .32rem .4rem; border: 1px solid var(--line); border-radius: 6px; background: rgba(9,12,12,.48); }
.state-preview-calculation small { display: block; color: var(--faint); font-size: .47rem; text-transform: uppercase; }
.state-preview-calculation strong { display: block; margin-top: .14rem; color: var(--ink); font: 550 .62rem ui-monospace, monospace; }

@media (max-width: 1120px) {
  .summary-grid { grid-template-columns: repeat(3, 1fr); }.guide-grid,.state-guide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.workspace { grid-template-columns: 1fr; }.rankings-panel { position: static; }.table-wrap { max-height: none; }.detail-panel,.empty-detail { min-height: 380px; }.lower-grid { grid-template-columns: 1fr 1fr; }.live-panel { grid-column: 1 / -1; }.automation-content { grid-template-columns: 1fr; }.diagnostics-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .topbar { height: 62px; }.topbar-status > .topbar-explained:first-child { display: none; }.topbar-explained .term-help { display: none; }.intro { grid-template-columns: 1fr; min-height: auto; padding: 3.5rem 0 2.5rem; }.legend-card { border-left: 0; border-top: 1px solid var(--line); padding: 1.5rem 0 0; }.summary-grid { grid-template-columns: repeat(2, 1fr); }.metric-card { border-bottom: 1px solid var(--line); }.metric-card:first-child { padding-left: 1.5rem; }.guide-summary-hint { display: none; }.guide-grid,.state-guide-grid { grid-template-columns: 1fr; }.worked-example-heading,.guide-subhead { align-items: flex-start; flex-direction: column; }.worked-components { grid-template-columns: repeat(2, minmax(0, 1fr)); }.filters { width: 100%; flex-wrap: wrap; }.filters label { flex: 1 1 8rem; }.filters select,.filters input[type="search"] { width: 100%; }.panel-header { align-items: flex-start; flex-direction: column; }.lower-grid { grid-template-columns: 1fr; }.live-panel { grid-column: auto; }.automation-overview { grid-template-columns: 1fr; }.automation-task { grid-template-columns: 10px minmax(0, 1fr); }.automation-task-detail { grid-column: 2; }.diagnostics-grid { grid-template-columns: 1fr; }.panel-foot { flex-direction: column; }.feature-grid { grid-template-columns: 1fr 1fr; }.detail-section-heading { align-items: flex-start; flex-direction: column; }.detail-history-plot { height: 250px; }.score-input-list div { grid-template-columns: 1fr; }.score-input-list dd { text-align: left; }.state-evidence-status-line { align-items: flex-start; flex-direction: column; } footer { flex-direction: column; gap: .5rem; }
  .chart-modal-surface { width: calc(100vw - 20px); height: min(88vh, 760px); padding: .75rem; }
  .chart-modal-content { gap: .4rem; }
  .state-preview-head { padding-right: 2.4rem; }
  .state-preview-symbol { font-size: 1.08rem; }
  .state-preview-chart { min-height: 220px; }
  .chart-modal-meta { grid-template-columns: 1fr; align-items: stretch; }
  .state-preview-calculation { grid-template-columns: repeat(2, minmax(68px, 1fr)); overflow: visible; }
  .chart-value-tooltip { width: min(226px, calc(100% - 16px)); }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { animation-duration: .01ms !important; scroll-behavior: auto !important; transition-duration: .01ms !important; } }