html{scroll-padding-top:env(safe-area-inset-top,0px)}:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}body{margin:0}img{max-width:100%}[hidden]{display:none!important}
/* Layout: broadsheet front page — blackletter nameplate between double rules, dateline bar, lead story beside a ruled "most read" column, then stories set in ruled newspaper columns */
:root{
  --bg:#FFFFFF; --surface:#FFFFFF; --ink:#141414; --muted:#5A5A5A; --line:#E2E2E2; --rule:#141414;
  --hot:#D7141A; --chip:#F3F3F3;
  --brand:#D7141A; --brand-deep:#A10E13; --nav:#111111; --on-brand:#FFFFFF; --flash:#FFD400;
  --c-celebs:#E6007E; --c-naija:#00994D; --c-politics:#1F4FD8; --c-viral:#FF6A00; --c-world:#7B2FD0; --c-sport:#00A3A3; --c-music:#C27C0E; --c-creators:#0F8FC7; --c-elections:#B3122E;
  --nameplate:"UnifrakturMaguntia", "Old English Text MT", Georgia, serif;
  --display:"Libre Caslon Text", Georgia, "Times New Roman", serif;
  --body:"Newsreader", Georgia, "Times New Roman", serif;
  --label:"Libre Franklin", "Franklin Gothic Medium", Arial, sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#121212; --surface:#1C1C1C; --ink:#F2F2F2; --muted:#A8A8A8; --line:#2E2E2E; --rule:#F2F2F2;
  --hot:#FF4D52; --chip:#262626; --nav:#000000;
  --c-celebs:#FF3FA4; --c-naija:#22C46E; --c-politics:#5B82FF; --c-viral:#FF8A33; --c-world:#A66BFF; --c-sport:#1FCFCF; --c-music:#F0A830; --c-creators:#3CB8F0; --c-elections:#FF4D63; color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#121212; --surface:#1C1C1C; --ink:#F2F2F2; --muted:#A8A8A8; --line:#2E2E2E; --rule:#F2F2F2;
  --hot:#FF4D52; --chip:#262626; --nav:#000000;
  --c-celebs:#FF3FA4; --c-naija:#22C46E; --c-politics:#5B82FF; --c-viral:#FF8A33; --c-world:#A66BFF; --c-sport:#1FCFCF; --c-music:#F0A830; --c-creators:#3CB8F0; --c-elections:#FF4D63; color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.5}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--nav)}
.wrap{max-width:1180px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--hot);outline-offset:2px}

/* nameplate */
.mast{background:#008751;color:var(--on-brand);background-image:linear-gradient(180deg,#00A05E 0%,#006B3F 100%)}
.mast .wrap{padding-block:18px 0;text-align:center}
.ears{display:flex;justify-content:space-between;gap:12px;font-family:var(--label);font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:var(--on-brand);opacity:.85}
.logo{font-family:var(--display);font-weight:700;font-size:clamp(38px,7.5vw,78px);line-height:1.05;margin:6px 0 12px;letter-spacing:-.01em}
.mast .logo{margin-bottom:2px}
.sublogo{font-family:var(--label);font-weight:700;text-transform:uppercase;letter-spacing:.32em;font-size:clamp(12px,2.2vw,16px);color:var(--flash);margin:0 0 12px;padding-left:.32em}
.dateline{border-top:2px solid var(--on-brand);color:var(--on-brand);display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 16px;padding-block:6px;font-family:var(--label);font-size:12px;text-transform:uppercase;letter-spacing:.08em}
@media (max-width:560px){.ears span:last-child{display:none}.dateline{justify-content:center}}

/* briefs strip (was ticker) */
.ticker{background:var(--nav);color:#F2F2F2;overflow:hidden;white-space:nowrap;font-family:var(--body);font-size:15px;font-style:italic}
.ticker .wrap{display:flex;gap:14px;align-items:center;padding-block:7px}
.ticker b{font-family:var(--label);font-style:normal;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.1em;background:var(--flash);color:#141414;padding:3px 8px;flex:none}
.track{overflow:hidden;flex:1;min-width:0;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.track-inner{display:inline-block;animation:roll 140s linear infinite}
.track-inner span{margin-right:28px}
.track-inner span::after{content:"·";margin-left:28px;font-style:normal;color:var(--flash)}
@keyframes roll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.track-inner{animation:none}}

/* front page */
.top{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:0;padding-block:24px 0}
.lead{padding-right:28px;padding-bottom:20px}
.side{padding-left:24px;border-left:1px solid var(--line)}
@media (max-width:820px){.top{grid-template-columns:minmax(0,1fr)}.lead{padding-right:0;border-bottom:1px solid var(--rule)}.side{padding-left:0;border-left:0;padding-top:16px}}
.kicker{display:inline-block;font-family:var(--label);font-size:11px;text-transform:uppercase;letter-spacing:.12em;background:var(--brand);color:var(--on-brand);font-weight:700;padding:4px 9px}
.lead h2{font-family:var(--display);font-weight:700;font-size:clamp(34px,5vw,56px);line-height:1.04;margin:8px 0 12px;text-wrap:balance;letter-spacing:-.01em}
.lead p{font-size:19px;max-width:62ch;margin:0 0 12px}
.lead p::first-letter{font-family:var(--display);font-weight:700;float:left;font-size:3.3em;line-height:.85;padding:4px 8px 0 0;color:var(--brand)}
.lead .src{font-family:var(--label);font-size:12px}
.lead .more{display:flex;flex-direction:column;gap:0;margin-top:16px;border-top:1px solid var(--line)}
.lead .more span{font-family:var(--display);font-style:italic;padding:8px 0;border-bottom:1px solid var(--line)}

.side h3{font-family:var(--label);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.12em;margin:0 0 4px;padding:8px 10px;background:var(--nav);color:#FFFFFF;border-left:6px solid var(--brand)}
.hot-list{list-style:none;margin:0;padding:0;counter-reset:h}
.hot-list li{counter-increment:h;display:grid;grid-template-columns:30px 1fr;gap:6px;padding:11px 0;border-bottom:1px solid var(--line)}
.hot-list li::before{content:counter(h);font-family:var(--display);font-weight:700;font-size:26px;line-height:1;color:var(--brand)}
.hot-list a{font-family:var(--display);text-decoration:none;font-weight:700;font-size:17px;line-height:1.25}
.hot-list .hl{font-family:var(--display);font-weight:700;font-size:17px;line-height:1.25}
.hot-list small{display:block;font-family:var(--label);font-size:10.5px;color:var(--muted);margin-top:4px;text-transform:uppercase;letter-spacing:.08em}

/* section bar */
.controls{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:var(--nav);margin-top:22px;border-bottom:4px solid var(--brand)}
.controls .wrap{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;padding-block:8px}
.tabs{display:flex;gap:0 2px;flex-wrap:wrap;flex:1;min-width:0}
.tabs button{font:600 12px var(--label);text-transform:uppercase;letter-spacing:.08em;border:0;background:transparent;color:#D6D6D6;padding:7px 11px;cursor:pointer}
.tabs button[aria-pressed="true"]{color:#FFFFFF;background:var(--brand)}
.tabs button:hover{color:#FFFFFF}
.search{flex:0 1 220px;min-width:0}
.search input{width:100%;font:italic 15px var(--body);padding:6px 2px;border:0;border:0;background:#262626;color:#FFFFFF;border-radius:3px;padding:7px 10px;font-style:italic}
.srcrow{display:flex;gap:4px 14px;flex-wrap:wrap;width:100%;align-items:center}
.srcrow > span{font-family:var(--label);font-size:10.5px;font-weight:700;text-transform:uppercase;color:var(--flash);letter-spacing:.1em}
.srcrow button{font:500 13px var(--body);font-style:italic;border:0;background:transparent;color:#BDBDBD;padding:2px 0;cursor:pointer;border-bottom:2px solid transparent}
.srcrow button[aria-pressed="true"]{color:#FFFFFF;border-bottom-color:var(--flash)}
.srcrow button:hover{color:#FFFFFF}

/* stories in ruled columns */
.river{columns:3 280px;column-gap:40px;column-rule:1px solid var(--line);padding-block:20px 40px}
.card{--cc:var(--brand);break-inside:avoid;padding:12px 0 18px;margin:0 0 18px;border-top:5px solid var(--cc);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.card .meta{display:flex;justify-content:space-between;gap:8px;align-items:baseline;flex-wrap:wrap}
.cat{font-family:var(--label);font-size:10.5px;text-transform:uppercase;letter-spacing:.12em;font-weight:700;background:var(--cc);color:#FFFFFF;padding:3px 8px}
.card[data-c="celebs"]{--cc:var(--c-celebs)}.card[data-c="naija"]{--cc:var(--c-naija)}.card[data-c="politics"]{--cc:var(--c-politics)}.card[data-c="viral"]{--cc:var(--c-viral)}.card[data-c="world"]{--cc:var(--c-world)}.card[data-c="sport"]{--cc:var(--c-sport)}.card[data-c="music"]{--cc:var(--c-music)}.card[data-c="creators"]{--cc:var(--c-creators)}.card[data-c="elections"]{--cc:var(--c-elections)}
.status{font-family:var(--label);font-size:10.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.status.multi{color:var(--ink)}
.status.multi::before{content:"✓ "}
.card h4{font-family:var(--display);font-weight:700;font-size:22px;line-height:1.15;margin:2px 0 0;text-wrap:balance}
.card p{margin:0;font-size:16px}
.card .pidgin{font-family:var(--display);font-style:italic;color:var(--ink);font-size:15px;background:var(--chip);border-left:4px solid var(--flash);padding:6px 10px}
.card .pidgin::before{content:"“"}.card .pidgin::after{content:"”"}
.card .src{display:flex;flex-wrap:wrap;gap:2px 14px;font-family:var(--label);font-size:12px}
.card .src a{font-weight:700;text-decoration:none;color:var(--cc)}
.card .src a:hover{text-decoration:underline}
.ph{margin:4px 0 2px}
.ph img{display:block;width:100%;height:auto;max-width:100%;aspect-ratio:3/2;object-fit:cover;object-position:50% 25%;background:var(--chip)}
.ph figcaption{font-family:var(--label);font-size:10.5px;color:var(--muted);margin-top:4px;letter-spacing:.02em}
.lead .ph img{aspect-ratio:16/9}
.empty{text-align:center;color:var(--muted);padding:40px 0;font-style:italic}

footer{padding-block:0 34px;font-size:15px;color:var(--muted)}
footer{background:var(--nav);color:#BDBDBD;padding-top:0;border-top:4px solid var(--brand)}
footer .wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px 32px;padding-top:22px}
footer h5{font-family:var(--label);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--flash);margin:0 0 6px}
footer ul{margin:0;padding-left:18px}
/* site chrome added for static hosting */
.topnav{background:var(--nav);border-bottom:1px solid #222}
.topnav .wrap{display:flex;gap:4px 18px;flex-wrap:wrap;padding-block:6px;font-family:var(--label);font-size:11px;text-transform:uppercase;letter-spacing:.1em}
.topnav a{color:#D6D6D6;text-decoration:none}
.topnav a:hover{color:#fff}
.mast a{color:inherit;text-decoration:none}
footer a{color:#FFFFFF}
.footlinks{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:6px 18px;border-top:1px solid #2E2E2E;padding-top:14px;font-family:var(--label);font-size:12px}
.footlinks a{color:#D6D6D6;text-decoration:none}
.page{max-width:760px;padding-block:28px 48px}
.page h2{font-family:var(--display);font-size:clamp(30px,5vw,44px);line-height:1.1;margin:0 0 14px}
.page h3{font-family:var(--label);font-size:13px;text-transform:uppercase;letter-spacing:.1em;margin:28px 0 8px;color:var(--brand)}
.page p,.page li{font-size:18px;max-width:65ch}
.page .muted{color:var(--muted);font-size:15px}
.card[hidden]{display:none!important}