/* Shared Board navigation. Keep these rules scoped: readers have their own theme. */
.board-header {
  box-sizing:border-box; height:56px; min-height:56px; width:100%; margin:0;
  padding:0 32px; display:flex; flex-wrap:nowrap; align-items:center; gap:32px;
  background:#fff; color:#1f2933; position:sticky; top:0; z-index:10;
  border:0; border-bottom:1px solid #dce0e4;
  font:14px/1.65 "Helvetica Neue",Helvetica,"PingFang SC","Microsoft YaHei",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.board-header * {box-sizing:border-box}
.board-header a {color:inherit; text-decoration:none; border:0; outline-offset:3px}
.board-header a:hover {color:#294c6a; border:0}
.board-header a:focus-visible {outline:2px solid #294c6a}
.board-header .brand {font-size:16px; font-weight:400; white-space:nowrap; letter-spacing:.04em; display:flex; align-items:center; gap:8px; flex:none}
.board-header .brand-symbol {width:31px; height:31px; color:#294c6a; flex:none}
.board-header .brand-accent {stroke:#ad4839}
.board-header .brand-copy {line-height:1.3}
.board-header .brand-copy small {display:block; font-size:8px; letter-spacing:.1em; color:#6c747d; margin-top:3px}
.board-header nav {display:flex; align-items:center; flex-wrap:nowrap; gap:24px; height:100%; min-height:0; min-width:0; width:auto; max-width:100%; margin:0; padding:0; white-space:nowrap; overflow-x:auto}
.board-header nav a {font-size:13px; font-weight:400; letter-spacing:normal; height:100%; display:flex; flex:none; align-items:center; position:relative; color:#5a626d; padding:0}
.board-header nav a:hover {color:#294c6a}
.board-header nav a.active {color:#1f2933}
.board-header nav a.active::after {content:""; position:absolute; bottom:0; height:2px; background:#ad4839; left:0; right:0}
.board-header > .meta {display:block; margin-left:auto; white-space:nowrap; font-size:11px; color:#6c747d; text-align:right; flex:none}
@media(max-width:1150px) {
  .board-header {padding:0 24px; gap:24px}
  .board-header > .meta {display:none}
  .board-header nav {gap:20px}
}
@media(max-width:900px) {
  .board-header {padding:0 18px; gap:20px}
  .board-header nav {gap:16px}
}
@media(max-width:800px) {
  .board-header {height:auto; display:block; padding:8px 16px 0}
  .board-header .brand {font-size:15px}
  .board-header nav {height:40px; width:100%; gap:24px; scrollbar-width:thin}
  .board-header nav a {font-size:12px}
}
/* A reader's sticky search bar sits below the global header. */
body.board-bundles {--board-header-height:56px}
body.board-bundles > main .toolbar {top:var(--board-header-height)}
@media(max-width:800px) {body.board-bundles {--board-header-height:84px}}
@media print {.board-header {display:none!important}}

/* Market signature: five candles form from their opening prices, once per route. */
.board-transition {
  position:fixed; inset:var(--board-header-height,56px) 0 0; z-index:9;
  display:grid; place-items:center; background:rgba(250,250,248,.98);
  opacity:0; transition:opacity 160ms ease; overscroll-behavior:contain;
  color:#294c6a; font:14px/1.6 "Helvetica Neue",Helvetica,"PingFang SC","Microsoft YaHei",sans-serif;
}
.board-transition[hidden] {display:none}
.board-transition.is-visible {opacity:1}
.board-transition-scene {width:240px; text-align:center; transform:translateY(-6vh)}
.board-market-mark {display:block; width:240px; height:140px; overflow:visible}
.board-market-grid {stroke:#294c6a; stroke-width:.6; opacity:.09; stroke-dasharray:2 5}
.board-market-axis {stroke:#294c6a; stroke-width:1; opacity:.22}
.board-candle {color:#ad4839}
.board-candle-down {color:#52756f}
.board-candle-wick {stroke:currentColor; stroke-width:1.3; transform-origin:0 var(--open)}
.board-candle-body {fill:currentColor; transform-origin:0 var(--open)}
.is-running .board-candle-wick {animation:board-wick-form 220ms cubic-bezier(.22,.7,.3,1) calc(var(--i) * 55ms) both}
.is-running .board-candle-body {animation:board-body-form 260ms cubic-bezier(.2,.7,.3,1) calc(40ms + var(--i) * 55ms) both}
.is-running .board-candle-live {animation:board-market-breathe 1800ms ease-in-out 650ms infinite}
.board-market-price {stroke:#ad4839; stroke-width:.8; stroke-dasharray:2 3}
.board-market-dot {fill:#ad4839}
.is-running .board-market-price,.is-running .board-market-dot {animation:board-price-in 180ms ease 380ms both}
.board-transition-caption {display:grid; gap:6px; margin-top:14px}
.board-transition-name {color:#294c6a; font-size:14px; font-weight:500; letter-spacing:.12em}
.board-transition-status {color:#8a9299; font-size:11px; font-weight:400; letter-spacing:.08em}
.is-running .board-transition-caption {animation:board-caption-in 220ms ease 70ms both}
.board-is-routing {overflow:hidden}
html:has(.board-header) {scrollbar-gutter:stable}
.board-header nav a {transition:color 160ms ease}
.board-header nav a.active::after {animation:board-nav-in 220ms cubic-bezier(.22,.7,.3,1) both}
.board-header a[aria-busy="true"] {color:#294c6a}
@keyframes board-wick-form {from {transform:scaleY(0); opacity:0} to {transform:scaleY(1); opacity:1}}
@keyframes board-body-form {from {transform:scaleY(.04); opacity:.35} to {transform:scaleY(1); opacity:1}}
@keyframes board-price-in {from {opacity:0} to {opacity:.7}}
@keyframes board-market-breathe {0%,100% {opacity:1} 50% {opacity:.48}}
@keyframes board-caption-in {from {opacity:0; transform:translateY(3px)} to {opacity:1; transform:translateY(0)}}
@keyframes board-nav-in {from {transform:scaleX(.35); opacity:.5} to {transform:scaleX(1); opacity:1}}
@media(max-width:800px) {.board-transition {inset-block-start:var(--board-header-height,84px)}}
@media(prefers-reduced-motion:reduce) {
  .board-transition,.board-header nav a {transition:none}
  .board-transition *,.board-header nav a.active::after {animation:none!important}
}
@media print {.board-transition {display:none!important}}