:root{
--void:#e8eaed;
--panel:#ffffff;
--panel-2:#f1f3f5;
--line:#d2d6db;
--rule:#8b929b;
--plum:#b6bcc4;
--crimson:#d83852;
--accent-row:#fdeef1;
--link:#bd2244;
--link-hi:#8e1533;
--ash:#5f666f;
--text:#1e2126;
--head:#0e1013;
--dark:#101215;
--dark-2:#1a1d21;
--dark-line:#2a2e34;
--dark-text:#cfd3d8;
--dark-ash:#8f959d;
--ui:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--display:"Helvetica Neue Condensed","Avenir Next Condensed","Arial Narrow","Roboto Condensed","Liberation Sans Narrow",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
}

*{box-sizing:border-box}

html,body{
margin:0;
padding:0;
max-width:100%;
overflow-x:hidden;
overscroll-behavior-x:none;
}

body{
background:var(--void);
color:var(--text);
font-family:var(--ui);
font-size:17px;
line-height:1.68;
letter-spacing:-0.003em;
-webkit-text-size-adjust:100%;
-webkit-font-smoothing:antialiased;
}

.wrap{
width:100%;
max-width:1140px;
margin:0 auto;
padding:0 22px;
}

a{color:var(--link);text-underline-offset:3px;text-decoration-thickness:1px}
a:hover{color:var(--link-hi)}
a:focus-visible,.btn:focus-visible,summary:focus-visible{outline:2px solid var(--rule);outline-offset:3px}

h1{
font-family:var(--display);
font-size:clamp(34px,5.8vw,60px);
line-height:1.02;
letter-spacing:0.002em;
font-weight:800;
text-transform:uppercase;
font-stretch:condensed;
color:var(--head);
margin:0 0 22px;
}

h2{
font-family:var(--display);
text-transform:uppercase;
font-stretch:condensed;
font-size:clamp(26px,3.6vw,38px);
line-height:1.08;
letter-spacing:0.004em;
font-weight:750;
color:var(--head);
margin:60px 0 18px;
padding-top:22px;
border-top:1px solid var(--line);
position:relative;
}
h2::before{
content:"";
position:absolute;
top:-1px;
left:0;
width:64px;
height:3px;
background:var(--rule);
}

h3{
font-size:clamp(18px,2.1vw,21px);
line-height:1.32;
letter-spacing:-0.012em;
font-weight:700;
color:var(--head);
margin:36px 0 11px;
}

p{margin:0 0 18px}
strong{color:var(--head)}

.topbar{
position:sticky;
top:0;
z-index:40;
border-bottom:1px solid var(--dark-line);
background:var(--dark);
}
.topbar-inner{
display:flex;
align-items:center;
gap:26px;
min-height:66px;
padding-top:0;
padding-bottom:0;
}
.brand{display:inline-flex;align-items:center;flex-shrink:0;text-decoration:none;padding-left:18px}
.topbar a:focus-visible{outline-color:#cfd3d8}
.brand img{width:34px;height:34px;display:block}

.nav-burger{display:none}
.nav-close{display:none}

.topnav{
display:flex;
align-items:center;
gap:30px;
margin-left:auto;
}
.topnav a{
font-size:13px;
font-weight:800;
letter-spacing:0.1em;
text-transform:uppercase;
color:var(--dark-text);
text-decoration:none;
white-space:nowrap;
padding:6px 0;
border-bottom:2px solid transparent;
}
.topnav a:hover{color:#fff;border-bottom-color:var(--rule)}

.btn-nav{
flex-shrink:0;
background:var(--crimson);
color:#ffffff;
font-size:12.5px;
font-weight:800;
letter-spacing:0.09em;
text-transform:uppercase;
text-decoration:none;
padding:13px 26px;
white-space:nowrap;
clip-path:polygon(9px 0,100% 0,calc(100% - 9px) 100%,0 100%);
}
.btn-nav:hover{background:#c22e46;color:#ffffff}

h2[id],h3[id],section[id]{scroll-margin-top:86px}
.hero{
position:relative;
display:grid;
grid-template-columns:minmax(0,1.2fr) minmax(0,0.8fr);
gap:48px;
align-items:center;
padding:56px 0 52px;
border-bottom:1px solid var(--line);
}
.hero::after{content:none}

.lede{font-size:18.5px;line-height:1.6;margin-bottom:22px;color:#343a42}

.byline{
font-size:12px;
font-weight:650;
letter-spacing:0.14em;
text-transform:uppercase;
color:var(--ash);
margin:0 0 24px;
}

.cta-row{margin:30px 0 0}

.btn{
display:inline-block;
background:var(--crimson);
color:#ffffff;
font-weight:800;
font-size:17px;
letter-spacing:0.005em;
text-decoration:none;
padding:19px 40px;
border-radius:3px;
box-shadow:0 10px 26px rgba(216,56,82,0.22);
}
.btn:hover{background:#c22e46;color:#ffffff;box-shadow:0 12px 30px rgba(216,56,82,0.26)}

.hero-art img,.shot img{
display:block;
width:100%;
height:auto;
border:1px solid var(--line);
border-radius:3px;
}

.shot{
max-width:420px;
margin:30px auto 36px;
}
.shot figcaption{
font-size:11.5px;
font-weight:650;
letter-spacing:0.14em;
text-transform:uppercase;
color:var(--ash);
border-left:3px solid var(--rule);
padding-left:11px;
margin-top:14px;
}

.toc{max-width:70ch;margin:34px auto 6px}
.toc details{
background:var(--panel);
border:1px solid var(--line);
}
.toc summary{
cursor:pointer;
padding:15px 18px;
font-weight:700;
font-size:13.5px;
letter-spacing:0.09em;
text-transform:uppercase;
color:var(--head);
list-style:none;
}
.toc summary::-webkit-details-marker{display:none}
.toc summary::after{content:" +";color:var(--rule)}
.toc details[open] summary::after{content:" –"}
.toc ol{
margin:0;
padding:0 18px 18px 40px;
font-size:15px;
line-height:1.6;
color:var(--ash);
}
.toc li{margin-bottom:8px}

.body{max-width:70ch;margin:0 auto;padding-bottom:8px}

.tbl{
margin:28px 0 32px;
overflow-x:auto;
overscroll-behavior-x:contain;
-webkit-overflow-scrolling:touch;
border:1px solid var(--line);
background:var(--panel);
}

table{
border-collapse:collapse;
width:100%;
min-width:540px;
font-size:15.5px;
line-height:1.55;
}

th{
text-align:left;
font-family:var(--display);
font-size:15px;
letter-spacing:0.06em;
text-transform:uppercase;
font-weight:800;
font-stretch:condensed;
padding:14px 17px;
background:var(--crimson);
color:#14060a;
border-bottom:0;
}

td{
padding:14px 17px;
border-top:1px solid var(--line);
vertical-align:top;
color:var(--text);
}

.book th.bid,.book th.ask{color:#14060a;box-shadow:none}
.book td:first-child{background:var(--panel);width:50%;border-left:0}
.book td:last-child{background:var(--panel);width:50%;border-left:1px solid var(--line)}
.book td.empty{background:var(--panel)}
.decide td:first-child{color:var(--head);font-weight:700;width:34%}

.steps{
margin:24px 0 28px;
padding-left:0;
list-style:none;
counter-reset:step;
}
.steps>li{
position:relative;
padding-left:56px;
margin-bottom:20px;
counter-increment:step;
}
.steps>li::before{
content:counter(step,decimal-leading-zero);
position:absolute;
left:0;
top:3px;
font-size:12.5px;
font-weight:700;
letter-spacing:0.04em;
color:var(--head);
border:1px solid var(--line);
background:var(--panel);
padding:4px 8px;
}

.faq h3{
margin-top:28px;
padding-top:22px;
border-top:1px solid var(--line);
}
.faq h3:first-child{border-top:0;padding-top:0;margin-top:16px}

.author{
display:grid;
grid-template-columns:136px minmax(0,1fr);
gap:26px;
align-items:start;
margin:56px 0 18px;
padding:28px;
background:var(--panel);
border:1px solid var(--line);
border-left:3px solid var(--rule);
}
.author img{width:136px;height:136px;display:block;border:1px solid var(--line);border-radius:3px}
.author p{font-size:16.5px;margin-bottom:13px}
.author-eyebrow{
font-size:11.5px;
font-weight:650;
letter-spacing:0.14em;
text-transform:uppercase;
color:var(--ash);
margin-bottom:7px !important;
}
.author-name{font-weight:700;font-size:19px !important;color:var(--head);margin-bottom:11px !important}
.author-dates{
font-size:12.5px;
letter-spacing:0.01em;
color:var(--ash);
margin-bottom:0 !important;
}

.foot{
margin-top:72px;
border-top:1px solid var(--dark-line);
background:var(--dark);
color:var(--dark-text);
padding:44px 0 40px;
}
.foot-inner{
display:flex;
flex-direction:column;
align-items:center;
text-align:center;
gap:22px;
}
.foot-brand{display:inline-flex;align-items:center;text-decoration:none;padding-left:18px}
.foot-brand img{width:30px;height:30px}
.foot-nav{
display:flex;
flex-wrap:wrap;
justify-content:center;
align-items:center;
gap:9px 0;
font-size:14px;
}
.foot-nav a{
color:var(--ash);
text-decoration:none;
padding:0 15px;
border-left:1px solid var(--line);
}
.foot-nav a:first-child{border-left:0}
.foot-nav a:hover{color:#f0798c}
.foot-note{
max-width:52ch;
margin:0;
font-size:13.5px;
line-height:1.6;
color:#7c828a;
}
.foot-copy{
margin:0;
padding-top:20px;
width:100%;
border-top:1px solid var(--dark-line);
font-size:12px;
letter-spacing:0.12em;
text-transform:uppercase;
color:#6d737b;
}

@media (max-width:860px){
.topbar{position:static}
.topbar-inner{gap:12px;min-height:58px;padding:0}
.btn-nav{margin-left:auto;padding:11px 16px;font-size:11px;letter-spacing:0.07em}

.nav-burger{
display:block;
position:relative;
width:38px;
height:38px;
flex-shrink:0;
border:1px solid var(--dark-line);
background:var(--dark-2);
}
.nav-burger span,
.nav-burger span::before,
.nav-burger span::after{
position:absolute;
left:9px;
width:18px;
height:2px;
background:#c8cdd4;
content:"";
}
.nav-burger span{top:18px}
.nav-burger span::before{left:0;top:-6px}
.nav-burger span::after{left:0;top:6px}

.topnav{
display:none;
position:absolute;
left:0;
right:0;
top:100%;
z-index:50;
flex-direction:column;
align-items:stretch;
gap:0;
margin:0;
background:var(--dark);
border-top:1px solid var(--dark-line);
border-bottom:1px solid var(--dark-line);
box-shadow:0 22px 44px rgba(0,0,0,0.6);
}
.topnav:target{display:flex}
.topnav{scroll-margin-top:200px}
.topbar{scroll-margin-top:0}
.topnav a{
padding:17px 22px;
font-size:13px;
letter-spacing:0.11em;
border-bottom:1px solid var(--dark-line);
border-top:0;
}
.topnav a:last-child{border-bottom:0}
.topnav a:hover{border-bottom-color:var(--dark-line)}

.nav-close{
display:block;
order:9;
text-align:center;
color:var(--dark-ash) !important;
font-size:11.5px !important;
letter-spacing:0.16em !important;
background:var(--dark-2);
}

.topbar{position:relative}
h2[id],h3[id]{scroll-margin-top:16px}
.hero::after{top:-60px;right:-30%;width:120%}
.hero{grid-template-columns:1fr;gap:24px;padding:34px 0 38px;align-items:center;text-align:center;justify-items:center}
.hero-art{order:2;width:100%;max-width:420px}
.hero-art img{max-width:100%}
.byline,.lede{text-align:center}
.body{max-width:none;text-align:center}
.body h2,.body h3{text-align:center}
.body h2::before{left:50%;transform:translateX(-50%)}
.tbl,.steps,.author{text-align:left}
.shot figcaption{text-align:center;border-left:0;border-top:3px solid var(--rule);padding:11px 0 0;display:inline-block}
.shot{text-align:center}
.steps>li{text-align:left}
.toc{text-align:left}
.author{grid-template-columns:1fr;gap:18px}
.author img{width:116px;height:116px}
body{font-size:16.5px}
.lede{font-size:17px}
h2{margin-top:46px}
}

@media (max-width:340px){
.wrap{padding:0 13px}
.hero{padding:18px 0 26px}
h1{font-size:26px;line-height:1.05;margin-bottom:13px}
.lede{font-size:15px;line-height:1.44;margin-bottom:14px}
.byline{font-size:10.5px;margin-bottom:14px}
.cta-row{margin-top:16px}
.btn{padding:15px 16px;font-size:15px}
}

@media (max-width:400px){
.hero{padding:26px 0 30px}
.lede{font-size:16.5px;line-height:1.55;margin-bottom:18px}
h1{font-size:clamp(29px,7.6vw,34px)}
.byline{margin-bottom:18px}
.cta-row{margin-top:22px}
}

@media (max-width:480px){
.wrap{padding:0 16px}
.topnav a{padding-left:16px;padding-right:16px}
.btn-nav{padding:11px 13px;font-size:10.5px}
.btn{display:block;text-align:center;padding:18px 20px}
.foot-nav a{padding:0 11px}
}

@media (prefers-reduced-motion:reduce){
*{animation:none !important;transition:none !important;scroll-behavior:auto !important}
}

.page-head{padding:52px 0 30px;border-bottom:1px solid var(--line);max-width:70ch;margin:0 auto}
.page-head h1{margin-bottom:14px}
.updated{
margin:0;
font-size:12px;
font-weight:650;
letter-spacing:0.14em;
text-transform:uppercase;
color:var(--ash);
}
.legal{padding-top:8px}
.legal h2{font-size:clamp(21px,2.7vw,27px)}
.legal>p:first-child{font-size:18.5px;color:#343a42}
.portrait{max-width:220px;margin:26px 0 32px}
.portrait img{display:block;width:100%;height:auto;border:1px solid var(--line);border-radius:3px}
.portrait figcaption{
margin-top:12px;
font-size:11.5px;
font-weight:650;
letter-spacing:0.14em;
text-transform:uppercase;
color:var(--ash);
border-left:3px solid var(--rule);
padding-left:11px;
}
@media (max-width:860px){
.page-head{text-align:center;padding:34px 0 24px}
.legal{text-align:center}
.legal h2,.legal h3{text-align:center}
.portrait{margin:26px auto 32px;text-align:center}
.portrait figcaption{border-left:0;border-top:3px solid var(--rule);padding:11px 0 0;display:inline-block}
}

.rank{min-width:680px;font-size:13px}
.rank th{font-size:12.5px;letter-spacing:0.05em;padding:10px 12px}
.rank td{font-size:13px;line-height:1.45;padding:10px 12px}
.rank td:first-child{font-weight:700;color:var(--head);white-space:nowrap}
.rank td:nth-child(2),.rank td:nth-child(3),.rank td:nth-child(4){white-space:nowrap}
tr.row-lead td{background:var(--accent-row)}
tr.row-lead td:first-child{box-shadow:inset 4px 0 0 var(--crimson)}
tr.row-lead td strong{color:var(--head)}

.author-method{
font-size:15px !important;
line-height:1.6;
padding:16px 18px;
margin-top:18px !important;
background:var(--panel-2);
border-left:3px solid var(--rule);
}
.author-method strong{display:block;margin-bottom:5px}
@media (max-width:860px){
.author-method{text-align:left;border-left:0;border-top:3px solid var(--rule)}
}