:root{
  --bg:      #121314;   
  --bg-2:    #0e0f10;
  --bg-3:    #191a1b;
  --line:    #2b2d2e;
  --line-2:  #393c3e;
  --text:    #e9e5d8;   
  --dim:     #c5bc8e;   
  --faint:   #696758;
}


.nav{display:none}

body{padding-top:64px}
@media (max-width:820px){ body{padding-top:56px} }


.page-head{border-bottom:1px solid var(--line);background:var(--bg)}
.hero{border-bottom:1px solid var(--line)}


.band{border-radius:0;clip-path:polygon(0 0,calc(100% - 22px) 0,100% 22px,100% 100%,0 100%)}


.screen,.shot,.step,.road__col,.dl-card,.dl-card__ic,.dl-card__meta,.notice,.scenario,
.point__ic,.promise__ic,.held,.held__ic,.priv-state,.priv-state__ic,.trackline,.cmp__head,
.sc-summary,.deal__vault,.slide__cap,.metalbar,.metalbar__seg,.panel--bracket,.skeleton,
.locked,.locked__icon,.checklist>li::before,.nav__links a{border-radius:0}


.screen,.dl-card,.road__col,.held,.priv-state,.sc-summary,.cmp__head,.scenario{
  clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}


.rank,.stat__val,.held__count,.num,[data-num],.big-num,.metric__val{
  font-family:var(--ff-num);font-variant-numeric:tabular-nums}


.table .num{font-family:var(--ff-num)}
.garage .grow .rank{font-family:var(--ff-num)}

.step::before,.flow__step::before,.checklist>li::before{font-family:var(--ff-num)}




.rank{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;
  border-radius:50%;border:2px solid var(--line-2);font-weight:700;font-size:13px;color:var(--dim)}

.rank--1{background:var(--gold);border-color:var(--gold);color:#3a2f14;
  box-shadow:inset 0 -3px 6px rgba(0,0,0,.25), inset 0 2px 3px rgba(255,255,255,.35)}
.rank--2{background:var(--silver);border-color:var(--silver);color:#33363b;
  box-shadow:inset 0 -3px 6px rgba(0,0,0,.22), inset 0 2px 3px rgba(255,255,255,.5)}
.rank--3{background:var(--bronze);border-color:var(--bronze);color:#38240f;
  box-shadow:inset 0 -3px 6px rgba(0,0,0,.28), inset 0 2px 3px rgba(255,255,255,.28)}


.lbrow.lb-lead{box-shadow:inset 2px 0 0 var(--gold);background:color-mix(in oklab,var(--gold) 4%,transparent)}


.panel,.scenario,.dl-card,.step,.road__col,.held,.priv-state,.sc-summary{
  transition:border-color .25s,transform .25s,filter .25s}
@media (hover:hover){
  .panel:hover,.scenario:hover,.dl-card:hover,.step:hover,.road__col:hover,.held:hover,
  .priv-state:hover,.sc-summary:hover{
    filter:drop-shadow(0 10px 22px rgba(0,0,0,.4))}
}
.panel:hover{border-color:var(--line-2)}


.footer{background:transparent;border-top:1px solid var(--line)}
.footer a{color:var(--dim)}
.footer a:hover{color:var(--per-br)}


::selection{background:var(--red);color:#fff}
.input:focus,.select:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(191,77,40,.28)}


.table--hover tbody tr:hover{background:var(--raise, #212324)}

.table tbody tr[aria-current=true]{box-shadow:inset 3px 0 0 var(--per)}
.table tbody tr[aria-current=true] td{background:color-mix(in oklab,var(--per) 5%,transparent)}

.table th{font-family:var(--ff-mono);font-size:12px;letter-spacing:.14em;color:var(--faint)}

.panel > .table td:first-child,.panel > .table th:first-child{padding-left:22px}
.panel > .table td:last-child,.panel > .table th:last-child{padding-right:22px}



@media (max-width:560px){
  
  .btn{white-space:normal;height:auto;min-height:46px;padding:12px 18px;max-width:100%;text-align:center}
  
  .segmented{display:flex;flex-wrap:wrap;max-width:100%}
  .field .segmented{height:auto;min-height:49px}
  .segmented button{flex:1 1 auto;min-width:0;white-space:normal;text-align:center}

  
  
  code{overflow-wrap:anywhere;word-break:break-word}
  .flow code,.faq__a code{white-space:normal;overflow-wrap:anywhere;word-break:break-word}
}

  
  tr.lbrow{cursor:pointer}
  tr.lbrow.noexpand{cursor:default}
  tr.lbrow .chev{display:inline-block;margin-left:8px;color:var(--faint);font-size:10px;
    transition:transform .2s ease}
  tr.lbrow[aria-expanded=true] .chev{transform:rotate(90deg)}
  tr.lbrow.noexpand .chev{display:none}
  tr.lbrow[aria-busy=true] .chev{opacity:.4}
  tr.lbdetail > td{padding:0 !important;background:var(--bg-2)}
  tr.lbdetail .xin{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
  tr.lbdetail .xcol{padding:14px 22px;border-right:1px solid var(--line)}
  tr.lbdetail .xcol:last-child{border-right:none}
  tr.lbdetail .xh{font-family:var(--ff-mono);font-size:12px;letter-spacing:.14em;color:var(--faint);
    text-transform:uppercase;margin-bottom:8px}
  tr.lbdetail .xrowl{display:flex;justify-content:space-between;gap:12px;font-size:13px;padding:3px 0}
  tr.lbdetail .xrowl .lt{font-family:var(--ff-num);font-variant-numeric:tabular-nums}
  tr.lbdetail .xrowl .best{color:var(--gold)}
  tr.lbdetail .xtag{font-family:var(--ff-mono);font-size:12px;color:var(--dim)}
  
  
  @media (max-width:560px){
    .panel > .table th:nth-child(6),.panel > .table td:nth-child(6){display:none}
    .panel > .table td:first-child,.panel > .table th:first-child{padding-left:12px}
    .panel > .table td:last-child,.panel > .table th:last-child{padding-right:12px}
    .table th,.table td{padding-left:8px;padding-right:8px}

    
    tr.lbdetail .xin{grid-template-columns:1fr}
    tr.lbdetail .xcol{padding:12px 14px;border-right:0}
    tr.lbdetail .xfoot{padding:8px 14px}
    tr.lbdetail .xrowl{font-size:12.5px}
  }
  tr.lbdetail .xfoot{padding:9px 22px;border-top:1px solid var(--line);
    font-family:var(--ff-mono);font-size:12px;color:var(--faint)}