/* Radial Economics brand layer (UI pass 2, 16 Oct 2026, Erik's go): the design system "Radial Economics" applied to the whole site.
   Loaded after css/base.css and css/tokens.css (generated from docs/brand/tokens.json; colours live there, not here).
   Rules: paper and ink, navy marks what matters, no bright accent; Cormorant Garamond for headings, figures and eyebrows,
   Inter for text, tables and UI with tabular figures; square corners, hairline rules instead of boxes and shadows.
   Data colours (technology map, percentile shades, zone scales, --acc) are NOT brand colours and stay as they are.
   Source of the layouts: the "Radial Economics website prototypes" design canvas (Home, Brief, Signals, Phone). */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/inter-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url(../fonts/inter-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url(../fonts/inter-latin-600-normal.woff2) format("woff2")}

body{font:15px/1.6 var(--re-sans);background:var(--re-surface-100);color:var(--re-ink);font-variant-numeric:normal}
/* tabular figures only where numbers line up (tables, figures); in Inter they also widen the hyphen, which looks wrong in prose */
table,.ptab,.hfv,.hero,.big,.pst,.hgrl{font-variant-numeric:tabular-nums}
td:first-child,th:first-child,.ptab .l,.hgz,.hfl{font-variant-numeric:normal}
a{color:var(--re-navy)}a:hover{color:var(--re-ink)}
:focus-visible{outline:2px solid var(--re-navy);outline-offset:2px}

/* ---- frame: tagline strip, masthead, page margins ---- */
#strip{background:var(--re-surface-200);border-bottom:1px solid var(--re-line);font-size:12px;line-height:16px;color:var(--re-muted);padding:8px clamp(16px,3vw,48px)}
#strip>span{display:block;max-width:calc(1600px - 2 * clamp(16px,3vw,48px));margin:0 auto}
body:not([data-tab="map"]) main{max-width:1600px;margin:0 auto}
main{padding:0 clamp(16px,3vw,48px) 0;gap:0 24px;min-height:auto}
#mast{gap:28px;padding:18px 0 0;margin-bottom:24px;border-bottom:1px solid var(--re-line)}
#mbrand{all:unset;cursor:pointer;line-height:0;flex:none;padding-bottom:16px}#mbrand img{height:34px;width:auto}
#mbrand:focus-visible{outline:2px solid var(--re-navy);outline-offset:4px}
#mast #tabs{gap:0 26px;align-items:flex-end}
#mast #tabs>button[data-t]{font:500 13.5px/18px var(--re-sans);letter-spacing:.01em;color:var(--re-muted);padding:12px 0 17px;border-bottom:1px solid transparent}
#mast #tabs>button[data-t]:hover{color:var(--re-ink)}
#mast #tabs>button[data-t].on{color:var(--re-ink);border-bottom-color:var(--re-navy)}
#mast #csw{margin-left:auto;align-self:center;padding-bottom:14px}
body[data-tab="home"] #csw,body[data-tab="nws"] #csw{visibility:hidden}
body[data-tab="map"] main{padding-bottom:16px}

/* ---- square corners and hairlines everywhere (inputs keep a 2 px hint) ---- */
button,.card,.seg,.seg button,#dash,#mkt,#sys,#flg,#nws,#dat,main>aside,#stage,.dw,#flg .fxp,#nws .fc,#nws .nb,#note,#tip,#dtip,#attr,#mobar,#mosel,#bmlist,#bmbtn,#zc button,.feednote,.note-est,#dat .chip{border-radius:0}
select,input,textarea,#nws textarea{border-radius:2px}
select,button{font-family:var(--re-sans)}
button:hover,button.on{border-color:var(--re-navy)}
.seg{border-color:var(--re-line)}.seg button.on{background:var(--re-navy-deep);color:#F5F1EA}
.seg.big button{font-family:var(--re-sans)}

/* ---- the data pages: flat paper, no boxes ---- */
#dash,#mkt,#sys,#flg,#nws,#dat,#home{background:transparent;border:0;padding:8px 0 48px;min-height:60vh}
main>aside{background:var(--re-surface-100);border:0;border-left:1px solid var(--re-line);padding:4px 0 16px 20px}
#stage{border:1px solid var(--re-line)}
.card{border-color:var(--re-line);padding:12px 12px 8px}.card:hover,.card.on{border-color:var(--re-navy)}
.feednote{border-left:1px solid var(--re-navy);padding-left:12px;font-size:13px}
.note-est{border-left:1px solid var(--uc)}
h1{font:600 30px/1.15 var(--re-serif)}
h2{font:600 22px/1.25 var(--re-serif);letter-spacing:0}
.big{font:600 44px/1 var(--re-serif)}
table{font-size:13px}td{border-bottom:1px solid var(--re-line)}
.dt th,#ftab th{color:var(--re-muted);font-weight:500}
.lnk{all:unset;cursor:pointer;color:var(--re-navy);font-size:13px;font-weight:500;padding:8px 0}.lnk:hover{color:var(--re-ink);text-decoration:underline;text-underline-offset:3px}
.lnk:focus-visible{outline:2px solid var(--re-navy);outline-offset:2px}
#toOff{border-top:1px solid var(--re-line);border-bottom:1px solid var(--re-line);padding:10px 0;display:block}
#dash>#toMap{align-self:flex-start;padding:0}

/* page headings shared by the data pages */
.eye{font:600 13px/16px var(--re-serif);letter-spacing:.2em;text-transform:uppercase;color:var(--re-muted)}
.pgh{margin:0;font:600 clamp(30px,3.6vw,44px)/1.1 var(--re-serif)}
.pgh2{display:flex;flex-direction:column;gap:10px;margin:0 0 8px;max-width:900px}
.pmut{color:var(--re-muted);margin:0}.pmut.small{font-size:12.5px;line-height:18px}
#flg .flh{font:600 22px/1.25 var(--re-serif);margin:20px 0 4px}#flg .flh .mut{font:400 12.5px var(--re-sans)}
#flg .fxp{border-left:1px solid var(--re-navy);background:var(--re-surface-100)}
#flg tr.fsr:hover td,#flg tr.fsr.on td{background:var(--re-surface-200)}

/* ---- publication pages: Home and Daily brief ---- */
.pub{width:100%;display:flex;flex-direction:column;gap:0}
.pcrumb{font-size:13px;color:var(--re-muted);margin:0 0 28px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.psel select{width:auto;padding:6px 10px;font-size:13px;background:transparent;border:1px solid var(--re-line);color:var(--re-ink)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pgrid{display:flex;flex-wrap:wrap;gap:48px 64px;align-items:flex-start}
.part{flex:999 1 560px;min-width:0;max-width:780px;display:flex;flex-direction:column;gap:20px}
.pside{flex:1 1 260px;min-width:0;display:flex;flex-direction:column;gap:36px;border:0;padding:0;background:none;position:static;max-height:none;overflow:visible}
.ph1{margin:0;font:600 clamp(38px,5vw,62px)/1.06 var(--re-serif);letter-spacing:-.01em;text-wrap:balance}
.pdek{margin:0;font-size:19px;line-height:30px;color:var(--re-muted);max-width:40em}
.pmeta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 24px;padding:14px 0;border-top:1px solid var(--re-line);border-bottom:1px solid var(--re-line);font-size:13px;color:var(--re-muted)}
.pst{display:inline-flex;align-items:center;gap:8px;font-weight:500;color:var(--re-muted);text-decoration:none}.pst.ok{color:var(--re-navy)}
.pshare{margin-left:auto;display:flex;gap:16px;align-items:center}.pshare a{color:var(--re-muted)}
.plink{all:unset;cursor:pointer;color:var(--re-muted);text-decoration:underline;text-underline-offset:3px}
.pbody{display:flex;flex-direction:column;gap:14px}
.pbody p{margin:0;font-size:17px;line-height:29px;max-width:40em}
.pbody h2{margin:22px 0 0;font:600 30px/1.2 var(--re-serif)}
.pbody h3{margin:16px 0 -6px;font:600 24px/1.25 var(--re-serif)}
.pbody b{font-weight:600}
.pnote{font-size:14px!important;line-height:22px!important;color:var(--re-muted)}
.pfoot{display:flex;flex-direction:column;gap:8px;margin-top:6px}.pfoot p{font-size:12.5px!important;line-height:19px!important;color:var(--re-muted)}
.ptw{overflow-x:auto;max-width:100%}
.pcap{margin:18px 0 -6px;font:600 13px/16px var(--re-serif);letter-spacing:.2em;text-transform:uppercase;color:var(--re-muted)}
.ptab{width:100%;border-collapse:collapse;font-size:13.5px;line-height:20px}
.ptab th{font-weight:500;font-size:12px;line-height:16px;color:var(--re-muted);text-align:right;padding:8px 12px;border-bottom:1px solid var(--re-ink);white-space:nowrap;vertical-align:bottom}
.ptab td{text-align:right;padding:9px 12px;border-bottom:1px solid var(--re-line);white-space:nowrap}
.ptab th:first-child,.ptab td:first-child{padding-left:0}.ptab th:last-child,.ptab td:last-child{padding-right:0}
.ptab .l{text-align:left}.ptab td.l{white-space:normal}.ptab .b{font-weight:600}.ptab .m{color:var(--re-muted)}.ptab .ok{color:var(--re-navy);font-weight:500}
.pbtn{display:inline-flex;align-items:center;gap:12px;width:auto;padding:13px 22px;font:500 14px/18px var(--re-sans);color:var(--re-ink);background:transparent;border:1px solid var(--re-ink);text-decoration:none;cursor:pointer;align-self:flex-start}
.pbtn:hover{background:var(--re-surface-200);color:var(--re-ink)}
.pbtn.pri{background:var(--re-navy-deep);border-color:var(--re-navy-deep);color:#F5F1EA}.pbtn.pri:hover{background:var(--re-ink);border-color:var(--re-ink)}
.pchk{margin-top:28px;background:var(--re-surface-200);padding:28px 32px;display:flex;flex-direction:column;gap:14px}
.pchk h2{margin:0;font:600 26px/1.2 var(--re-serif)}.pchkh{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px}.pchkh .pmut{font-size:12px}
.pchk .ptab td,.pchk .ptab th{font-size:12.5px}
.pmore summary{cursor:pointer;color:var(--re-navy);font-size:13px;font-weight:500;padding:8px 0}
.pblock{display:flex;flex-direction:column;border-top:1px solid var(--re-ink);padding-top:14px}
.pblock .eye{margin-bottom:6px}
.pblock>a{padding:10px 0;border-bottom:1px solid var(--re-line);color:var(--re-ink);text-decoration:none;font-size:14px;line-height:20px}
.pblock>a:hover{color:var(--re-navy)}.pblock>a.sub{padding-left:16px;font-size:13.5px;color:var(--re-muted)}
.pprev{display:flex;flex-direction:column;gap:4px}.pprev .pd{font:600 12px/16px var(--re-serif);letter-spacing:.16em;text-transform:uppercase;color:var(--re-muted)}.pprev .pt{font:600 19px/24px var(--re-serif)}
.nwrev{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;background:var(--re-surface-200);padding:10px 14px;font-size:13px;margin-bottom:20px}
.nwrev button{width:auto;padding:6px 12px;font-size:12.5px;background:transparent}
#nws .nwrev{margin-bottom:6px}

/* home */
.home{gap:64px}
.hlead{display:flex;flex-wrap:wrap;gap:48px 64px;align-items:flex-start;padding-top:24px}
.hl1{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:22px}
.hx{font-size:clamp(40px,5.2vw,68px);max-width:14em}
.pcta{display:flex;flex-wrap:wrap;gap:14px;padding-top:4px}
.hfig{flex:1 1 320px;min-width:0;border:0;border-top:1px solid var(--re-ink);padding:14px 0 0;background:none;position:static;max-height:none;overflow:visible;display:flex;flex-direction:column;gap:0}
.hfig .eye{padding-bottom:12px}
.hf{display:flex;flex-direction:column;gap:2px;padding:16px 0;border-top:1px solid var(--re-line);color:var(--re-ink);text-decoration:none}
.hf:hover .hfv{color:var(--re-ink)}
.hfl{font-size:13px;line-height:18px;font-weight:500}
.hfv{font:600 42px/46px var(--re-serif);color:var(--re-navy)}.hfu{font:400 13px var(--re-sans);color:var(--re-muted);margin-left:8px}
.hfn{font-size:12px;line-height:16px;color:var(--re-muted)}
.hsec{display:flex;flex-direction:column;gap:16px;border-top:1px solid var(--re-ink);padding-top:28px}
.hsec h2,.hband h2{margin:6px 0 0;font:600 32px/38px var(--re-serif)}
.hsech{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px}.hsech>a{font-size:13px;font-weight:500;padding:8px 0}
.ptab.sig td{font-size:14px;padding-top:14px;padding-bottom:14px}.ptab.sig td.l a{color:var(--re-ink);font-weight:600;text-decoration:none}
.ptab.sig tr[data-href]{cursor:pointer}.ptab.sig tr[data-href]:hover td{background:var(--re-surface-200)}
.rkw{display:inline-flex;align-items:center;gap:12px}.rkw b{color:var(--re-navy);font-weight:600;font-size:13px}
.rk{position:relative;width:140px;height:12px;display:inline-block;flex:none}
.rk0{position:absolute;left:0;right:0;top:5px;height:2px;background:var(--re-line)}
.rkb{position:absolute;left:10%;width:80%;top:3px;height:6px;background:var(--re-beige)}
.rkm{position:absolute;top:0;width:2px;height:12px;background:var(--re-navy)}
.hband{background:var(--re-surface-200);margin:0 calc(-1 * clamp(16px,3vw,48px));padding:56px clamp(16px,3vw,48px)}
.hbandi{display:flex;flex-wrap:wrap;gap:40px 56px}
.hbt{flex:1 1 280px;min-width:0;display:flex;flex-direction:column;gap:14px}.hbt p{margin:0;color:var(--re-muted)}.hbt>a{font-size:13px;font-weight:500}
.hbg{flex:999 1 560px;min-width:0;overflow-x:auto}
.hgr{min-width:520px;display:flex;flex-direction:column;gap:3px}
.hgrr{display:grid;gap:3px;align-items:center}
.hgrh span{font-size:11px;line-height:14px;color:var(--re-muted);text-align:center}
.hgz{font-size:13px;line-height:18px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hgc{height:26px;background:var(--re-navy);display:block}
.hgrl{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding-top:14px;font-size:12px;color:var(--re-muted)}
.hgrg{width:160px;height:8px;background:linear-gradient(90deg,color-mix(in srgb,var(--re-navy) 8%,transparent),var(--re-navy))}
.hgrl .pmut{margin-left:auto}
.h3c{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:32px 48px;padding-top:8px}
.h3c>div{border-top:1px solid var(--re-line);padding-top:16px;display:flex;flex-direction:column;gap:8px}
.h3c h3{margin:0;font:600 22px/28px var(--re-serif)}.h3c p{margin:0;color:var(--re-muted)}

/* ---- footer ---- */
#sitefoot{display:flex;flex-wrap:wrap;gap:32px 48px;justify-content:space-between;border-top:1px solid var(--re-line);margin-top:24px;padding:40px 0 48px;font-size:13px;line-height:20px}
body[data-tab="map"] #sitefoot{display:none}
.sf1{flex:1 1 260px;display:flex;flex-direction:column;gap:14px}.sf1 p{margin:0;color:var(--re-muted);max-width:22em}.sfm{width:40px;height:40px}
.sf2{display:flex;flex-wrap:wrap;gap:40px}.sf2>div{display:flex;flex-direction:column;gap:4px}.sf2 .eye{font-size:12px;margin-bottom:4px}
.sf2 a{color:var(--re-ink);text-decoration:none}.sf2 a:hover{color:var(--re-navy);text-decoration:underline}
#footd{flex:1 1 100%;padding:0}#footd summary{cursor:pointer;color:var(--re-muted);font-size:12.5px}#foot2{font-size:12px;margin-top:6px;max-width:900px}
.sf3{flex:1 1 100%;border-top:1px solid var(--re-line);padding-top:14px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;font-size:12px;line-height:16px;color:var(--re-muted)}

/* ---- phone ---- */
@media(max-width:800px){
 #strip{font-size:11px;padding:6px 16px}
 #mast{gap:18px;padding-top:12px;margin-bottom:16px}
 #mbrand{padding-bottom:12px}#mbrand img{height:26px}
 #mast #tabs{gap:0 20px}
 #mast #tabs>button[data-t]{padding:10px 0 13px}
 main>aside{border-left:0;border-top:1px solid var(--re-line);padding:16px 0}
 .home{gap:44px}
 .hlead{padding-top:8px;gap:32px}
 .hfig{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:16px}
 .hfig .eye{grid-column:1/-1}
 .hfv{font-size:32px;line-height:36px}
 .pmeta{gap:6px 16px}.pshare{margin-left:0}
 .pchk{padding:22px 16px}
 .pbody p{font-size:16px;line-height:27px}
 .hgrl .pmut{margin-left:0}
}
/* home signals table as stacked rows on a phone: country and value, then signal and rank */
@media(max-width:640px){
 .ptab.sig thead{display:none}
 .ptab.sig tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:12px 0;border-bottom:1px solid var(--re-line)}
 .ptab.sig td{border:0;padding:0!important;font-size:14px}
 .ptab.sig td:nth-child(1){grid-column:1;grid-row:1}.ptab.sig td:nth-child(3){grid-column:2;grid-row:1}
 .ptab.sig td:nth-child(2){grid-column:1;grid-row:2;color:var(--re-muted);font-size:13px}.ptab.sig td:nth-child(4){grid-column:2;grid-row:2;text-align:right}
 .ptab.sig td:nth-child(5),.ptab.sig .rk{display:none}
}

/* Markets: time-range buttons on the price chart and the heatmap (24 h ... All, Tomorrow); sort buttons on their own row */
#mkt .card h3{flex-wrap:wrap;gap:8px 16px;align-items:center}
#mkt .card h3 .seg{flex-wrap:wrap}
#mkt .hmsort{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px;margin:2px 0 6px}
