*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body,h1,h2,h3,h4,h5,p,ul,ol,figure,blockquote,dl,dd{margin:0}
ul[class],ol[class]{list-style:none;padding:0}
img,svg,picture,video{max-width:100%;display:block}
button,input,select,textarea{font:inherit;color:inherit}
main{display:block}

:root{
--ink:#071C16;
--carbon:#0E1412;
--flare:#FF5A2A;
--steel:#B7C3C0;
--paper:#F4F1E8;
--turf:#1C6B4A;
--signal:#F3C43D;
--line:#66736F;
--panel:#2E3B3A;
--font-head:'Noto Sans SC','Source Han Sans SC','PingFang SC',sans-serif;
--font-body:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif;
--font-mono:'IBM Plex Mono','JetBrains Mono','SFMono-Regular',Consolas,monospace;
--hairline:1px solid rgba(102,115,111,.42);
--hairline-strong:1px solid rgba(102,115,111,.72);
--r-pill:999px;
--r-lg:28px;
--r-md:18px;
--pad-x:clamp(20px,4vw,56px);
--maxw:1440px;
--ease:cubic-bezier(.22,.61,.36,1);
}

body{
min-height:100vh;
background-color:var(--ink);
background-image:
radial-gradient(120% 70% at 10% -10%, rgba(28,107,74,.32), transparent 55%),
radial-gradient(90% 60% at 96% 4%, rgba(255,90,42,.13), transparent 52%);
background-repeat:no-repeat;
color:var(--paper);
font-family:var(--font-body);
font-size:16px;
line-height:1.75;
letter-spacing:.01em;
-webkit-font-smoothing:antialiased;
text-rendering:optimizeLegibility;
}

h1,h2,h3,h4{font-family:var(--font-head);font-weight:800;line-height:1.18;letter-spacing:-.02em;color:var(--paper)}
h1{font-size:clamp(36px,5.4vw,68px);font-weight:900}
h2{font-size:clamp(26px,3.2vw,40px)}
h3{font-size:clamp(19px,2vw,24px);font-weight:700}
h4{font-size:clamp(16px,1.6vw,18px);font-weight:700}
p{max-width:68ch}
a{color:inherit}
strong,b{font-weight:700;color:var(--paper)}
small{font-size:13px}

:focus-visible{outline:2px solid var(--steel);outline-offset:3px}

/* ---------- skip link ---------- */
.skip-link{
position:fixed;top:10px;left:10px;z-index:200;
display:inline-block;
padding:11px 20px;
border-radius:var(--r-pill);
background:var(--flare);
color:var(--ink);
font-weight:700;
font-size:14px;
text-decoration:none;
transform:translateY(-180%);
transition:transform .18s var(--ease);
}
.skip-link:focus,.skip-link:focus-visible{transform:translateY(0);outline:2px solid var(--paper);outline-offset:2px}

/* ---------- header ---------- */
.site-header{
position:sticky;top:0;z-index:60;
background:var(--carbon);
border-bottom:var(--hairline);
}
.site-header::after{
content:"";display:block;height:1px;
background:linear-gradient(90deg,transparent,rgba(255,90,42,.55),transparent);
}
.header-rail{
max-width:var(--maxw);
margin:0 auto;
padding:0 var(--pad-x);
min-height:76px;
display:grid;
grid-template-columns:auto minmax(0,1fr) auto;
align-items:center;
column-gap:clamp(16px,3vw,44px);
}

.brand{
display:inline-flex;align-items:center;gap:10px;
color:var(--paper);
text-decoration:none;
font-family:var(--font-head);
font-weight:800;
font-size:clamp(17px,1.5vw,20px);
letter-spacing:-.02em;
white-space:nowrap;
transition:color .18s var(--ease);
}
.brand:hover{color:var(--flare)}
.brand-mark{
position:relative;flex:none;
width:26px;height:26px;
border-radius:9px;
border:2px solid var(--flare);
display:grid;place-items:center;
transition:transform .22s var(--ease);
}
.brand-mark::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--flare)}
.brand:hover .brand-mark{transform:rotate(-8deg)}
.brand-text{display:inline-block}
.brand-round{
display:inline-flex;align-items:center;gap:6px;
margin-left:4px;
padding:3px 9px;
border-radius:var(--r-pill);
border:1px solid rgba(255,90,42,.42);
background:rgba(255,90,42,.08);
font-family:var(--font-mono);
font-size:11px;
font-weight:500;
letter-spacing:.08em;
line-height:1.4;
color:var(--flare);
}
.brand-dot{width:6px;height:6px;border-radius:50%;background:var(--flare);box-shadow:0 0 0 3px rgba(255,90,42,.18);flex:none}

.header-ticker{
display:flex;align-items:center;gap:14px;
min-width:0;overflow:hidden;white-space:nowrap;
font-family:var(--font-mono);
font-size:11px;
letter-spacing:.1em;
color:var(--steel);
}
.ticker-line{flex:1 1 auto;min-width:16px;height:1px;background:rgba(102,115,111,.55)}
.ticker-item{display:inline-flex;align-items:center;gap:6px;flex:none}
.ticker-item::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--line);flex:none}
.ticker-item--football::before{background:var(--turf)}
.ticker-item--basketball::before{background:var(--steel)}

.nav-toggle{
display:none;
align-items:center;gap:9px;
justify-self:end;
padding:9px 16px;
border-radius:var(--r-pill);
border:1px solid rgba(183,195,192,.38);
background:transparent;
color:var(--paper);
font-family:var(--font-mono);
font-size:11px;
letter-spacing:.12em;
cursor:pointer;
transition:border-color .18s var(--ease),color .18s var(--ease);
}
.nav-toggle:hover{border-color:var(--flare);color:var(--flare)}
.bars{display:grid;gap:4px;width:16px}
.bars span{display:block;height:2px;border-radius:2px;background:currentColor;transition:transform .22s var(--ease),opacity .16s var(--ease)}
.nav-toggle[aria-expanded="true"] .bars span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle[aria-expanded="true"] .bars span:nth-child(2){opacity:0}
.nav-toggle[aria-expanded="true"] .bars span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.site-nav{grid-column:3;justify-self:end}
.site-nav ul{display:flex;align-items:center;gap:2px;list-style:none;margin:0;padding:0}
.site-nav a{
display:block;
padding:9px 13px;
border-radius:var(--r-pill);
color:var(--steel);
text-decoration:none;
font-size:14px;
font-weight:500;
white-space:nowrap;
transition:color .18s var(--ease),background-color .18s var(--ease);
}
.site-nav a:hover{color:var(--flare);background:rgba(255,90,42,.1)}
.site-nav a[aria-current="page"]{background:var(--flare);color:var(--ink);font-weight:700}
.site-nav a[aria-current="page"]:hover{background:var(--flare);color:var(--ink)}

/* ---------- footer ---------- */
.site-footer{
margin-top:clamp(64px,9vw,128px);
background:var(--carbon);
border-top:var(--hairline);
color:var(--steel);
}
.footer-inner{max-width:var(--maxw);margin:0 auto;padding:0 var(--pad-x)}
.footer-grid{
display:grid;
grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) minmax(0,1fr);
gap:clamp(28px,4vw,56px);
padding:clamp(44px,5.5vw,72px) 0 clamp(32px,4vw,48px);
border-bottom:var(--hairline);
}
.brand--footer{font-size:19px}
.footer-note{margin-top:16px;font-size:14px;line-height:1.8;color:var(--steel);max-width:32ch}
.footer-meta{margin-top:14px;font-family:var(--font-mono);font-size:11px;letter-spacing:.1em;color:var(--line)}
.footer-heading{
font-family:var(--font-mono);
font-size:11px;
font-weight:500;
letter-spacing:.16em;
color:var(--steel);
margin:0 0 14px;
padding-bottom:10px;
border-bottom:var(--hairline);
}
.footer-nav ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.footer-nav a{color:var(--paper);text-decoration:none;font-size:14.5px;transition:color .18s var(--ease)}
.footer-nav a:hover{color:var(--flare)}
.footer-nav a[aria-current="page"]{color:var(--flare)}
.footer-contact{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.6fr);
gap:14px clamp(20px,4vw,48px);
padding:clamp(26px,3.4vw,40px) 0;
border-bottom:var(--hairline);
}
.contact-item{display:flex;flex-direction:column;gap:6px;min-width:0}
.contact-key{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;color:var(--line)}
.contact-val{font-size:14.5px;line-height:1.6;color:var(--paper);word-break:break-word;max-width:100%}
.contact-val--mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.06em}
.footer-base{
display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
gap:10px 28px;
padding:22px 0 30px;
font-family:var(--font-mono);
font-size:11.5px;
letter-spacing:.08em;
color:var(--line);
}
.footer-copy{color:var(--steel)}
.footer-icp{color:var(--line)}

/* ---------- layout containers ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad-x)}
.wrap--mid{max-width:1180px}
.wrap--narrow{max-width:900px}

.grid{display:grid;gap:clamp(20px,3vw,36px)}
.grid--12{grid-template-columns:repeat(12,minmax(0,1fr))}
.span-3{grid-column:span 3}
.span-4{grid-column:span 4}
.span-5{grid-column:span 5}
.span-6{grid-column:span 6}
.span-7{grid-column:span 7}
.span-8{grid-column:span 8}
.span-9{grid-column:span 9}
.span-12{grid-column:span 12}

/* ---------- buttons ---------- */
.btn{
display:inline-flex;align-items:center;justify-content:center;gap:10px;
padding:13px 26px;
border-radius:var(--r-pill);
border:1px solid transparent;
font-family:var(--font-head);
font-size:15px;
font-weight:700;
letter-spacing:.01em;
line-height:1.3;
text-decoration:none;
cursor:pointer;
transition:background-color .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease),transform .2s var(--ease);
}
.btn--flare{background:var(--flare);color:var(--ink)}
.btn--flare:hover{background:#FF7748;transform:translateY(-1px)}
.btn--ghost{background:transparent;border-color:rgba(183,195,192,.45);color:var(--paper)}
.btn--ghost:hover{border-color:var(--flare);color:var(--flare);transform:translateY(-1px)}
.btn--quiet{background:transparent;border-color:transparent;color:var(--steel);padding-inline:4px}
.btn--quiet:hover{color:var(--flare)}

/* ---------- breadcrumbs ---------- */
.crumbs{padding:clamp(18px,2.6vw,30px) 0 0}
.crumbs ol{
display:flex;flex-wrap:wrap;align-items:center;gap:8px;
list-style:none;margin:0;padding:0;
font-family:var(--font-mono);
font-size:11.5px;
letter-spacing:.08em;
color:var(--steel);
}
.crumbs li{display:inline-flex;align-items:center;gap:8px}
.crumbs li + li::before{content:"/";color:var(--line)}
.crumbs a{color:var(--steel);text-decoration:none;transition:color .18s var(--ease)}
.crumbs a:hover{color:var(--flare)}
.crumbs [aria-current="page"]{color:var(--paper)}

/* ---------- chapter head ---------- */
.chapter-head{
display:flex;align-items:baseline;flex-wrap:wrap;gap:10px 16px;
padding-bottom:16px;
margin-bottom:clamp(24px,3vw,36px);
border-bottom:var(--hairline);
}
.chapter-index{
font-family:var(--font-mono);
font-size:12px;
letter-spacing:.16em;
color:var(--flare);
flex:none;
}
.chapter-title{
font-family:var(--font-head);
font-size:clamp(22px,2.6vw,32px);
font-weight:800;
letter-spacing:-.02em;
line-height:1.2;
margin:0;
color:var(--paper);
}

/* ---------- type utilities ---------- */
.eyebrow{
display:inline-flex;align-items:center;gap:10px;
font-family:var(--font-mono);
font-size:11.5px;
letter-spacing:.16em;
color:var(--steel);
}
.eyebrow::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--flare);flex:none}
.lead{font-size:clamp(16px,1.5vw,18.5px);line-height:1.85;color:var(--steel);max-width:62ch}
.rule{height:1px;border:0;background:rgba(102,115,111,.42);margin:clamp(32px,5vw,56px) 0}
.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.06em}
.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-weight:700;letter-spacing:-.01em}
.txt-flare{color:var(--flare)}
.txt-steel{color:var(--steel)}

/* ---------- round chips ---------- */
.round-chip{
display:inline-flex;align-items:center;gap:8px;
padding:6px 14px;
border-radius:var(--r-pill);
border:1px solid rgba(255,90,42,.5);
background:rgba(255,90,42,.08);
color:var(--flare);
font-family:var(--font-mono);
font-size:11.5px;
letter-spacing:.08em;
line-height:1.5;
text-decoration:none;
}
.round-chip--muted{border-color:rgba(183,195,192,.35);background:transparent;color:var(--steel)}

/* ---------- round rail ---------- */
.round-rail{
list-style:none;margin:0;padding:0;
display:grid;gap:0;
border-left:var(--hairline);
}
.round-rail a{
position:relative;
display:block;
padding:10px 0 10px 18px;
font-family:var(--font-mono);
font-size:12px;
letter-spacing:.08em;
color:var(--steel);
text-decoration:none;
transition:color .18s var(--ease);
}
.round-rail a::before{
content:"";
position:absolute;left:-4px;top:50%;
width:7px;height:7px;margin-top:-3.5px;
border-radius:50%;
background:var(--line);
transition:background-color .18s var(--ease),box-shadow .18s var(--ease);
}
.round-rail a:hover{color:var(--flare)}
.round-rail a[aria-current]{color:var(--flare)}
.round-rail a[aria-current]::before{background:var(--flare);box-shadow:0 0 0 4px rgba(255,90,42,.16)}

/* ---------- data table ---------- */
.data-table{width:100%;border-collapse:collapse;font-size:15px;color:var(--paper)}
.data-table caption{
caption-side:top;
text-align:left;
padding-bottom:12px;
font-family:var(--font-mono);
font-size:11.5px;
letter-spacing:.1em;
color:var(--steel);
}
.data-table th{
padding:12px 14px;
background:var(--panel);
color:var(--steel);
font-family:var(--font-mono);
font-size:11px;
font-weight:500;
letter-spacing:.1em;
text-align:left;
border-bottom:var(--hairline-strong);
white-space:nowrap;
}
.data-table td{padding:16px 14px;border-bottom:var(--hairline);vertical-align:top}
.data-table tbody tr{transition:background-color .18s var(--ease)}
.data-table tbody tr:hover{background:rgba(255,90,42,.07)}
.data-table .num{font-size:clamp(18px,2vw,24px);color:var(--flare)}

/* ---------- fold ---------- */
.fold{border-bottom:var(--hairline)}
.fold summary{
position:relative;
list-style:none;
cursor:pointer;
padding:16px 34px 16px 0;
font-family:var(--font-head);
font-size:16px;
font-weight:700;
color:var(--paper);
transition:color .18s var(--ease);
}
.fold summary::-webkit-details-marker{display:none}
.fold summary:hover{color:var(--flare)}
.fold summary::after{
content:"+";
position:absolute;right:4px;top:50%;
transform:translateY(-50%);
font-family:var(--font-mono);
font-size:18px;
font-weight:400;
color:var(--flare);
}
.fold[open] summary::after{content:"\2212"}
.fold > *:not(summary){padding-bottom:16px;color:var(--steel)}

/* ---------- chips ---------- */
.chip-row{display:flex;flex-wrap:wrap;gap:10px}
.chip{
display:inline-flex;align-items:center;gap:8px;
padding:8px 16px;
border-radius:var(--r-pill);
border:1px solid rgba(102,115,111,.55);
background:transparent;
color:var(--steel);
font-size:13.5px;
font-weight:500;
line-height:1.5;
text-decoration:none;
cursor:pointer;
transition:color .18s var(--ease),border-color .18s var(--ease),background-color .18s var(--ease);
}
.chip:hover{color:var(--flare);border-color:rgba(255,90,42,.55);background:rgba(255,90,42,.08)}
.chip[aria-pressed="true"],.chip.is-active{background:var(--flare);border-color:var(--flare);color:var(--ink);font-weight:700}

/* ---------- image frame ---------- */
.img-frame{
position:relative;
display:block;
overflow:hidden;
margin:0;
border-radius:var(--r-lg);
border:1px solid rgba(102,115,111,.45);
aspect-ratio:16/9;
background:
linear-gradient(135deg, rgba(255,90,42,.12), transparent 55%),
repeating-linear-gradient(45deg, rgba(183,195,192,.07) 0 1px, transparent 1px 26px),
linear-gradient(160deg,#0E1412,#071C16);
}
.img-frame > img,
.img-frame > picture,
.img-frame > picture > img{
display:block;width:100%;height:100%;
}
.img-frame > picture > img,
.img-frame > img{object-fit:cover}
.img-frame figcaption{
position:absolute;left:0;right:0;bottom:0;
padding:12px 18px;
font-family:var(--font-mono);
font-size:11px;
letter-spacing:.08em;
color:var(--paper);
background:linear-gradient(transparent,rgba(7,28,22,.88));
}
.img-frame--wide{aspect-ratio:21/9}
.img-frame--tall{aspect-ratio:3/4}
.img-frame--square{aspect-ratio:1/1}

/* ---------- responsive ---------- */
@media (max-width:1120px){
.header-ticker{display:none}
.site-nav a{padding:9px 10px;font-size:13.5px}
}

@media (max-width:980px){
.header-rail{
grid-template-columns:minmax(0,1fr) auto;
min-height:66px;
column-gap:12px;
padding-block:10px;
}
.nav-toggle{display:inline-flex}
.site-nav{
grid-column:1 / -1;
justify-self:stretch;
display:none;
margin-top:10px;
padding-top:6px;
border-top:var(--hairline);
}
.site-nav[data-open="true"]{display:block}
.site-nav ul{flex-direction:column;align-items:stretch;gap:0}
.site-nav li + li{border-top:var(--hairline)}
.site-nav a{padding:14px 6px;border-radius:0;font-size:16px}
.site-nav a:hover{background:transparent;color:var(--flare)}
.site-nav a[aria-current="page"]{
position:relative;
background:transparent;
color:var(--flare);
font-weight:700;
padding-left:20px;
}
.site-nav a[aria-current="page"]::before{
content:"";
position:absolute;left:2px;top:50%;
width:7px;height:7px;margin-top:-3.5px;
border-radius:50%;
background:var(--flare);
}
.site-nav a[aria-current="page"]:hover{background:transparent;color:var(--flare)}

.grid--12{grid-template-columns:repeat(6,minmax(0,1fr))}
.span-3,.span-4,.span-5{grid-column:span 3}
.span-6,.span-7,.span-8,.span-9,.span-12{grid-column:span 6}

.footer-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.footer-brand{grid-column:1 / -1}
.footer-contact{grid-template-columns:minmax(0,1fr)}
}

@media (max-width:560px){
.brand-round{display:none}
.grid--12{grid-template-columns:minmax(0,1fr)}
.span-3,.span-4,.span-5,.span-6,.span-7,.span-8,.span-9,.span-12{grid-column:1 / -1}
.footer-grid{grid-template-columns:minmax(0,1fr)}
.footer-base{flex-direction:column;align-items:flex-start;gap:8px}
.data-table th,.data-table td{padding:12px 10px}
}

@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}
*,*::before,*::after{
animation-duration:.001ms !important;
animation-iteration-count:1 !important;
transition-duration:.001ms !important;
}
}
