:root{
  --ink:#10242b;
  --muted:#687a7e;
  --line:#dfe5e4;
  --paper:#f5f5f2;
  --teal:#147e7b;
  --mint:#dff2ee;
  --nav:#0e1f26;
  --aqua:#2ec4b6;
  --sand:#e8dfd0;
  --warm:#fbfaf7;
}

body{background:var(--paper)}
.rail{background:linear-gradient(180deg,#0e1f26 0%,#10272e 100%);border-right:1px solid rgba(255,255,255,.04)}
.brand{display:block;margin:0 10px 50px;font-size:0;letter-spacing:0;font-weight:400}
.brand-logo{display:block;width:154px;height:auto}
.brand span{display:block;margin-top:12px;max-width:170px;font-size:8.5px;line-height:1.45;letter-spacing:1.55px;text-transform:uppercase;color:#8ba3a6}
.rail-label{color:#6e888d}
nav a.active{background:#203c43}
nav a.active:after{background:var(--aqua)}
nav a:hover{background:#19353c}
.rail-emblem{display:block;width:34px;height:34px;margin-bottom:18px;opacity:.88}
.rail-bottom p{color:#a9bdc0}
.rail-bottom>span{color:#6e888d}
.top{background:rgba(255,255,255,.96)}
.demo{background:#e9f0ee;color:#506b6f}
.demo>span{color:#17675f}
.edition{letter-spacing:2.5px}
.eyebrow{color:var(--teal);letter-spacing:2.05px}
h1{color:var(--ink)}
button.primary,.tabs button.selected{background:var(--ink);border-color:var(--ink)}
.metric,.panel,.definition,.compare-picks label{border-color:var(--line)}
.metric:hover{box-shadow:0 6px 20px rgba(14,31,38,.06)}
.change,.panel-head a,.mini-panel a,button.link{color:var(--teal)}
.segments button.selected{background:#e3efed;color:var(--teal)}
.mini-panel{border-top-color:#78aaa3}
footer{background:var(--warm);border-top-color:var(--line)}
footer .footer-brand{display:flex;align-items:center;gap:10px;color:var(--ink)}
footer .footer-mark{width:25px;height:25px;background:var(--nav);border-radius:6px;padding:3px}
footer .footer-name{display:flex;flex-direction:column;gap:1px}
footer .footer-name b{font-size:15px;letter-spacing:2.5px;line-height:1}
footer .footer-name small{font-size:8px;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted);white-space:nowrap}
.brand-expansion-mobile{display:none}

@media(max-width:850px){
  .brand{margin:0;display:inline-flex;align-items:center;gap:13px;vertical-align:middle}
  .brand-logo{width:112px}
  .brand span{margin:0;max-width:150px;font-size:7.5px;letter-spacing:1.1px}
  .rail{padding-bottom:16px}
}

@media(max-width:520px){
  .brand{gap:10px}
  .brand-logo{width:102px}
  .brand span{font-size:6.8px;max-width:126px;line-height:1.35}
  footer .footer-brand{width:100%}
  footer .footer-name small{white-space:normal}
}