/* base.css — reset, type defaults, utilities, keyframes (docs/05-design.md §4.2, §4.5) */
*{box-sizing:border-box}
html,body{margin:0}
html{background:var(--bg);-webkit-text-size-adjust:none;text-size-adjust:none;scroll-padding-top:calc(var(--hdr) + 20px)}
body{background:var(--bg);color:var(--text);font:400 15px/1.6 var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;min-height:100vh;display:flex;flex-direction:column}
main{flex:1 0 auto}
h1,h2,h3,h4,p,ol,ul,dl,dd,dt,figure{margin:0;padding:0}
ol,ul{list-style:none}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer}
button:disabled{cursor:not-allowed}
img,svg{display:block}
[hidden]{display:none!important}
::selection{background:rgba(244,183,40,.3)}
sub{font-size:.62em;vertical-align:-.28em;line-height:0;margin:0 .04em}
:focus{outline:none}
:focus-visible{outline:1px solid var(--line-3);outline-offset:2px}
a:focus-visible,button:focus-visible{outline:1px dashed var(--g50);outline-offset:2px;border-radius:4px}

.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.tnum{font-variant-numeric:tabular-nums}
.dim{color:var(--text-3)}
.dim2{color:var(--text-2)}
.faint{color:var(--text-4)}
.up{color:var(--up)}.down{color:var(--down)}.gold{color:var(--gold)}
.nowrap{white-space:nowrap}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 var(--gut)}
/* stale values after a failed refresh: kept visible, dimmed (05-design §4.8 Error) */
body.is-stale [data-live]{color:var(--text-4)!important;transition:color .3s}

/* flash a value that just changed (number flash 1.2 s) */
.flash{animation:flash 1.2s var(--ease)}
.fl{display:inline-block;animation:digit .7s var(--ease)}

@keyframes blink{0%,62%{opacity:1}63%,100%{opacity:.16}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(244,183,40,.55)}70%{box-shadow:0 0 0 6px rgba(244,183,40,0)}100%{box-shadow:0 0 0 0 rgba(244,183,40,0)}}
@keyframes ring{0%{box-shadow:0 0 0 0 rgba(244,183,40,.45)}70%{box-shadow:0 0 0 8px rgba(244,183,40,0)}100%{box-shadow:0 0 0 0 rgba(244,183,40,0)}}
@keyframes digit{0%{transform:translateY(40%);opacity:0;color:var(--gold)}55%{color:var(--gold)}100%{transform:none;opacity:1}}
@keyframes flash{0%{color:var(--gold)}100%{}}
@keyframes rowflash{0%{background-color:rgba(244,183,40,.09)}100%{background-color:rgba(244,183,40,0)}}
@keyframes barflash{0%{opacity:1}100%{opacity:0}}
@keyframes shimmer{to{transform:translateX(100%)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes fadein{from{opacity:0}to{opacity:1}}
@keyframes sheetin{from{transform:translateY(24px);opacity:0}to{transform:none;opacity:1}}

@media (max-width:760px){
  body{font-size:14.5px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important}
  .flash,.fl{animation:none}
}