:root {
  color-scheme: light;
  --paper: #f1f2ec;
  --paper-raised: #f9faf6;
  --ink: #22271f;
  --muted: #697066;
  --line: #c9cec4;
  --line-light: #dfe3db;
  --forecast: #2d493a;
  --observation: #b5682f;
  --source: #5f7f82;
  --market: #75658e;
  --update: #997927;
  --resolution: #365f6a;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { min-width: 320px; min-height: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button:focus-visible, input:focus-visible, select:focus-visible, a:focus-visible { outline: 2px solid #56725f; outline-offset: 2px; }
.app-shell { min-height: 100vh; }
.app-shell[data-view="graph"] { height: 100dvh; overflow: hidden; }

.site-header {
  position: sticky;
  z-index: 20;
  top: 0;
  display: flex;
  min-height: 3.7rem;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .72rem 1.25rem;
  border-bottom: 1px solid var(--line);
  background: rgba(241, 242, 236, .96);
  backdrop-filter: blur(12px);
}
.site-identity { display: flex; min-width: 0; align-items: center; gap: .72rem; color: #3c433a; font-size: .68rem; letter-spacing: .07em; text-transform: uppercase; }
.brand { display: inline-flex; flex: none; align-items: center; gap: .45rem; color: var(--ink); font-weight: 740; text-decoration: none; }
.brand-mark { position: relative; width: 18px; height: 12px; }
.brand-mark i { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: var(--ink); }
.brand-mark i:nth-child(1) { left: 0; top: 4px; }
.brand-mark i:nth-child(2) { left: 8px; top: 0; }
.brand-mark i:nth-child(3) { right: 0; bottom: 0; }
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; z-index: -1; height: 1px; background: #8a9186; transform-origin: left center; }
.brand-mark::before { left: 3px; top: 5px; width: 9px; transform: rotate(-27deg); }
.brand-mark::after { left: 10px; top: 3px; width: 8px; transform: rotate(35deg); }
.site-name { flex: none; padding-left: .72rem; border-left: 1px solid #b7bdb3; font-weight: 680; }
.site-counts, .site-snapshot { min-width: 0; overflow: hidden; color: #777f74; letter-spacing: .01em; text-overflow: ellipsis; text-transform: none; white-space: nowrap; }
.site-snapshot { flex: none; padding-left: .72rem; border-left: 1px solid #c4c9c0; }

.view-switch, .register-mode, .graph-mode, .graph-controls { display: flex; overflow: hidden; border: 1px solid #c3c9bf; border-radius: 5px; background: rgba(249, 250, 246, .9); }
.view-switch { flex: none; }
.view-switch button, .register-mode button, .graph-mode button, .graph-controls button {
  border: 0;
  border-right: 1px solid #d3d7cf;
  background: transparent;
  color: #626a5f;
  cursor: pointer;
}
.view-switch button:last-child, .register-mode button:last-child, .graph-mode button:last-child, .graph-controls button:last-child { border-right: 0; }
.view-switch button { padding: .42rem .7rem; font-size: .65rem; }
.view-switch button.active, .register-mode button.active, .graph-mode button.active { background: #dfe5dc; color: #263127; font-weight: 720; }
.view-switch button:hover, .register-mode button:hover, .graph-mode button:hover, .graph-controls button:hover { background: #fff; color: #1f251e; }

.register-view { padding: 2.7rem 1.3rem 5rem; }
.register-inner { width: min(74rem, 100%); margin: 0 auto; }
.register-intro { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(20rem, .65fr); gap: 2.2rem; align-items: end; padding-bottom: 2rem; border-bottom: 1px solid var(--line); }
.section-eyebrow { margin: 0 0 .62rem; color: #6b7368; font-size: .62rem; font-weight: 750; letter-spacing: .11em; text-transform: uppercase; }
.intro-copy h1 { max-width: 14ch; margin: 0; font-family: Georgia, "Times New Roman", serif; font-size: clamp(2.3rem, 5.5vw, 4.85rem); font-weight: 500; letter-spacing: -.045em; line-height: .96; }
.intro-copy > p:last-child { max-width: 45rem; margin: 1.1rem 0 0; color: #535b50; font-family: Georgia, "Times New Roman", serif; font-size: 1.03rem; line-height: 1.5; }
.score-summary { align-self: stretch; padding: 1.05rem 1.1rem; border: 1px solid #bec6ba; background: rgba(249, 250, 246, .65); }
.score-values { display: grid; grid-template-columns: repeat(3, 1fr); gap: .7rem; }
.score-values span { display: flex; flex-direction: column; gap: .18rem; color: #70786d; font-size: .6rem; line-height: 1.25; }
.score-values strong { color: #283128; font-family: Georgia, "Times New Roman", serif; font-size: 1.55rem; font-weight: 550; }
.score-summary > p:last-child { margin: 1rem 0 0; padding-top: .8rem; border-top: 1px solid #d9ded5; color: #5c6559; font-size: .67rem; line-height: 1.48; }

.register-toolbar { display: grid; grid-template-columns: minmax(14rem, 1fr) auto auto; gap: .8rem; align-items: center; padding: 1.4rem 0 1rem; }
.register-search, .graph-search { display: flex; align-items: center; height: 2.45rem; padding: 0 .7rem; border: 1px solid #bdc5b9; border-radius: 5px; background: rgba(249, 250, 246, .92); color: #71786e; }
.register-search input, .graph-search input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: .74rem; }
.register-search input::placeholder, .graph-search input::placeholder { color: #858c82; }
.register-search > span, .graph-search > span { margin-right: .45rem; font-size: 1rem; }
.register-search kbd, .graph-search kbd { padding: .08rem .28rem; border: 1px solid #d0d5cc; border-radius: 3px; color: #878e84; font-family: inherit; font-size: .56rem; }
.register-mode button { padding: .48rem .62rem; font-size: .62rem; }
.register-sort { display: flex; height: 2.45rem; align-items: center; gap: .45rem; padding: 0 .55rem 0 .7rem; border: 1px solid #bdc5b9; border-radius: 5px; background: rgba(249, 250, 246, .92); color: #757d72; font-size: .61rem; }
.register-sort select { border: 0; outline: 0; background: transparent; color: #30382f; cursor: pointer; font-size: .66rem; }
.register-status-row { display: flex; justify-content: space-between; gap: 1rem; padding: 0 0 .8rem; color: #757d72; font-size: .61rem; }
.register-status-row p { margin: 0; }
.register-status-row p:last-child { text-align: right; }

.forecast-register { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .95rem; }
.forecast-card { min-width: 0; border: 1px solid #c3cac0; background: rgba(249, 250, 246, .72); transition: border-color .14s ease, background .14s ease, transform .14s ease; }
.forecast-card:hover { border-color: #89978b; background: #fafbf8; transform: translateY(-1px); }
.forecast-card.selected { border-color: #435e4b; box-shadow: inset 0 0 0 1px #435e4b; }
.forecast-card-button { width: 100%; min-height: 100%; padding: 1.02rem 1.05rem .95rem; border: 0; background: transparent; color: inherit; cursor: pointer; text-align: left; }
.card-topline { display: flex; min-height: 1.45rem; align-items: flex-start; justify-content: space-between; gap: .8rem; }
.card-tags { display: flex; flex-wrap: wrap; gap: .35rem; }
.status-tag, .review-tag { display: inline-flex; align-items: center; min-height: 1.35rem; padding: .16rem .42rem; border: 1px solid #c6cdc2; border-radius: 99px; color: #5d665a; font-size: .54rem; font-weight: 740; letter-spacing: .08em; text-transform: uppercase; }
.status-tag.active { border-color: #9dad9f; background: #e5ece3; color: #31503d; }
.status-tag.resolved { border-color: #b7c3c7; background: #e7edef; color: #365660; }
.review-tag { border-color: #cdbd8b; background: #f2ecd8; color: #6b5719; }
.card-freshness { color: #7a8277; font-size: .57rem; line-height: 1.35; text-align: right; }
.forecast-question { min-height: 3.2em; margin: .72rem 0 .75rem; font-family: Georgia, "Times New Roman", serif; font-size: 1.15rem; font-weight: 550; letter-spacing: -.012em; line-height: 1.18; }
.probability-block { display: flex; align-items: flex-end; gap: .85rem; padding: .72rem 0 .78rem; border-top: 1px solid #dce1d8; border-bottom: 1px solid #dce1d8; }
.probability-value { color: var(--forecast); font-family: Georgia, "Times New Roman", serif; font-size: 2.35rem; font-weight: 550; letter-spacing: -.045em; line-height: .9; }
.probability-meta { display: flex; flex-direction: column; gap: .2rem; padding-bottom: .02rem; color: #747c71; font-size: .58rem; }
.movement { font-weight: 690; }
.movement.up { color: #42624b; }
.movement.down { color: #855a42; }
.movement.flat { color: #747c71; }
.forecast-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 1rem; }
.forecast-fact { min-width: 0; padding: .66rem 0 .6rem; border-bottom: 1px solid #e1e4dd; }
.fact-label, .fact-value, .fact-note { display: block; overflow-wrap: anywhere; }
.fact-label { margin-bottom: .22rem; color: #7a8277; font-size: .55rem; letter-spacing: .035em; text-transform: uppercase; }
.fact-value { color: #353c33; font-size: .67rem; font-weight: 680; line-height: 1.35; }
.fact-note { margin-top: .16rem; color: #747c71; font-size: .57rem; line-height: 1.35; }
.card-footer { display: flex; align-items: center; justify-content: space-between; gap: .8rem; padding-top: .78rem; color: #747c71; font-size: .57rem; }
.criteria-cue { max-width: 75%; }
.inspect-cue { flex: none; color: #385f50; font-weight: 720; }
.register-empty { margin: 1rem 0 0; padding: 2rem; border: 1px solid var(--line); color: #6e766b; text-align: center; }

.graph-view { height: calc(100dvh - 3.7rem); min-height: 32rem; }
.graph-stage { position: relative; width: 100%; height: 100%; overflow: hidden; isolation: isolate; }
#graph-canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; cursor: grab; touch-action: none; outline: none; }
#graph-canvas.dragging { cursor: grabbing; }
#graph-canvas:focus-visible { box-shadow: inset 0 0 0 2px #56725f; }
.graph-search { position: absolute; z-index: 5; top: 1rem; right: 1.05rem; width: min(17.5rem, calc(100vw - 2rem)); box-shadow: 0 2px 12px rgba(44, 52, 41, .05); }
.graph-mode { position: absolute; z-index: 4; top: 3.9rem; right: 1.05rem; }
.graph-mode button { padding: .35rem .62rem; font-size: .62rem; }
.graph-legend, .graph-instruction, .graph-controls { position: absolute; z-index: 4; bottom: 1.05rem; }
.graph-legend { left: 1.25rem; display: flex; align-items: center; gap: .68rem; color: #656d62; font-size: .59rem; }
.graph-legend span { display: inline-flex; align-items: center; gap: .3rem; }
.graph-legend i { display: inline-block; width: 7px; height: 7px; border-radius: 50%; }
.graph-legend .forecast { width: 9px; height: 9px; background: var(--forecast); }
.graph-legend .observation { border-radius: 1px; background: var(--observation); transform: rotate(45deg); }
.graph-legend .source { background: var(--source); }
.graph-legend .market { background: var(--market); }
.graph-legend .update { background: var(--update); }
.graph-legend .resolution { border-radius: 1px; background: var(--resolution); }
.graph-instruction { left: 50%; transform: translateX(-50%); color: #858d82; font-size: .6rem; white-space: nowrap; }
.graph-controls { right: 1.05rem; }
.graph-controls button { height: 2rem; min-width: 2rem; padding: 0 .58rem; font-size: .69rem; }
.graph-tooltip { position: absolute; z-index: 7; width: min(22rem, calc(100vw - 2rem)); padding: .58rem .66rem; border: 1px solid #c7cdc2; border-radius: 4px; background: rgba(251, 252, 249, .98); box-shadow: 0 8px 26px rgba(36, 43, 33, .12); pointer-events: none; color: #30362d; font-family: Georgia, "Times New Roman", serif; font-size: .78rem; line-height: 1.36; }
.graph-tooltip small { display: block; margin-bottom: .22rem; color: #767e73; font-family: Inter, ui-sans-serif, system-ui, sans-serif; font-size: .53rem; font-weight: 730; letter-spacing: .09em; text-transform: uppercase; }

.node-detail { position: fixed; z-index: 30; top: 4.7rem; right: 1.05rem; width: min(25rem, calc(100vw - 2rem)); max-height: calc(100dvh - 5.8rem); overflow: auto; padding: 1.08rem 1.12rem 1.12rem; border: 1px solid #aeb8aa; border-radius: 5px; background: rgba(249, 250, 246, .985); box-shadow: 0 14px 40px rgba(38, 46, 35, .16); }
.detail-close { position: absolute; top: .42rem; right: .46rem; width: 1.7rem; height: 1.7rem; border: 0; background: transparent; color: #747c71; cursor: pointer; font-size: 1.08rem; }
.detail-eyebrow { margin: 0 2rem .55rem 0; color: #727a6f; font-size: .56rem; font-weight: 740; letter-spacing: .1em; text-transform: uppercase; }
.node-detail h2 { margin: 0 1.2rem .66rem 0; font-family: Georgia, "Times New Roman", serif; font-size: 1.25rem; font-weight: 560; line-height: 1.16; }
.detail-summary { margin: 0 0 .84rem; color: #41483e; font-family: Georgia, "Times New Roman", serif; font-size: .87rem; line-height: 1.48; }
.node-detail dl { margin: 0 0 .7rem; }
.detail-row { display: grid; grid-template-columns: minmax(6rem, .42fr) minmax(0, 1fr); gap: .65rem; padding: .4rem 0; border-top: 1px solid #e0e3dc; font-size: .64rem; line-height: 1.45; }
.detail-row.long { display: block; }
.detail-row dt { color: #787f75; }
.detail-row dd { margin: 0; color: #363c33; overflow-wrap: anywhere; }
.detail-row.long dd { margin-top: .23rem; font-family: Georgia, "Times New Roman", serif; font-size: .76rem; }
.node-detail a { color: #385f62; font-size: .67rem; font-weight: 680; text-decoration: none; }
.node-detail a:hover { text-decoration: underline; }

.loading-state { position: fixed; z-index: 50; inset: 0; display: grid; place-content: center; justify-items: center; gap: .7rem; background: var(--paper); color: #687066; font-size: .66rem; letter-spacing: .035em; transition: opacity .3s ease, visibility .3s ease; }
.loading-state.ready { visibility: hidden; opacity: 0; }
.loading-state span { width: 8px; height: 8px; border-radius: 50%; background: var(--forecast); animation: breathe 1.1s ease-in-out infinite alternate; }
.loading-state p { margin: 0; }
.error-state { position: fixed; z-index: 60; inset: 1rem auto auto 50%; max-width: 38rem; margin: 0; padding: .8rem 1rem; transform: translateX(-50%); border: 1px solid #bca9a0; background: #fbf5f1; color: #603d32; font-size: .72rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
noscript { position: fixed; z-index: 70; inset: 1rem; padding: 1rem; background: var(--paper-raised); }

@keyframes breathe { to { opacity: .24; transform: scale(.7); } }
@media (max-width: 1080px) {
  .site-snapshot { display: none; }
  .register-intro { grid-template-columns: minmax(0, 1fr) minmax(18rem, .75fr); }
  .register-toolbar { grid-template-columns: 1fr auto; }
  .register-sort { grid-column: 2; }
  .register-mode { grid-row: 2; grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 820px) {
  .site-counts { display: none; }
  .register-intro { grid-template-columns: 1fr; align-items: start; }
  .score-summary { max-width: 36rem; }
  .forecast-register { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .site-header { min-height: 3.45rem; padding: .62rem .72rem; }
  .site-name { display: none; }
  .view-switch button { padding: .38rem .5rem; font-size: .59rem; }
  .register-view { padding: 1.7rem .72rem 4rem; }
  .intro-copy h1 { font-size: clamp(2.4rem, 14vw, 3.6rem); }
  .intro-copy > p:last-child { font-size: .95rem; }
  .score-values { gap: .45rem; }
  .score-values strong { font-size: 1.28rem; }
  .register-toolbar { display: flex; flex-wrap: wrap; gap: .6rem; padding-top: 1rem; }
  .register-search { width: 100%; }
  .register-search kbd { display: none; }
  .register-mode { order: 3; width: 100%; overflow-x: auto; justify-content: flex-start; }
  .register-mode button { flex: 1 0 auto; }
  .register-sort { margin-left: auto; }
  .register-status-row { display: block; }
  .register-status-row p:last-child { margin-top: .38rem; text-align: left; }
  .forecast-card-button { padding: .9rem .86rem .82rem; }
  .forecast-question { min-height: 0; font-size: 1.08rem; }
  .probability-value { font-size: 2.1rem; }
  .forecast-facts { column-gap: .7rem; }
  .criteria-cue { display: none; }
  .card-footer { justify-content: flex-end; }
  .graph-view { height: calc(100dvh - 3.45rem); min-height: 26rem; }
  .graph-search { top: .62rem; right: .62rem; width: 12rem; }
  .graph-search kbd { display: none; }
  .graph-mode { top: 3.45rem; right: .62rem; }
  .graph-legend { display: none; }
  .graph-instruction { left: .72rem; bottom: .8rem; transform: none; font-size: .58rem; }
  .graph-controls { right: .62rem; bottom: .62rem; }
  .node-detail { top: auto; right: .62rem; bottom: .62rem; left: .62rem; width: auto; max-height: 65dvh; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }