/* Toto-Rex house style, September 2026: corporate blue-grey, elegant and a little playful: a roadside billboard out front, an office inside. Newsreader for display, Hanken Grotesk for text; slate ink on a pale sky by day, slate night after dark, butter-tape accents. Loaded last on every page, so it re-skins the shared design tokens without touching page code. */
@font-face{font-family:"Newsreader";font-style:normal;font-weight:200 900;font-display:swap;size-adjust:94%;src:url(fonts/Newsreader-400-normal.woff2) format("woff2")}
@font-face{font-family:"Newsreader";font-style:italic;font-weight:200 900;font-display:swap;size-adjust:94%;src:url(fonts/Newsreader-400-italic.woff2) format("woff2")}
@font-face{font-family:"Hanken Grotesk";font-style:normal;font-weight:100 900;font-display:swap;size-adjust:90%;src:url(fonts/HankenGrotesk-400-600-normal.woff2) format("woff2")}

:root:root{--khaki:#222C37;--white:#1E2731;--navy:#1C2530;--card:#29333F;--card-2:#2F3A47;--card-3:#26303B;--night:#1A222C;--ink:#EEF2F6;--ink-soft:#D3DAE2;--muted:#A7B2BE;--faint:#8A96A3;--rose:#E7A0C4;--rose-bg:#3A2B37;--rose-deep:#F0B6D2;--olive:#EFD98B;--olive-deep:#E6CD78;--cognac:#3A4654;--cognac-deep:#E6CD78;--serenity:#243241;--serenity-deep:#9CCBDD;--brass:#E6CD78;--gold:#EFD98B;--peacock:#9CCBDD;--magenta:#E7A0C4;--mustard:#EFD98B;--line:rgba(211,218,226,.20);--line-2:rgba(211,218,226,.10);--line-3:rgba(239,217,139,.30);--line-d:rgba(239,217,139,.16);--display:"Newsreader",Georgia,"Times New Roman",serif;--body:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;--emerald:#A8C8B4;--emerald-deep:#EFD98B;--emerald-tint:#25303B;--teal:#222C37;--trx-tape:#EFD98B;--trx-tape-ink:#1D2733}
:root:root[data-theme="light"]{--khaki:#E8EDF2;--white:#F5F7FA;--navy:#DCE3EA;--card:#FFFFFF;--card-2:#F2F5F8;--card-3:#EDF1F5;--night:#DCE3EA;--ink:#1D2733;--ink-soft:#394656;--muted:#566373;--faint:#6A7684;--emerald:#3F6452;--emerald-deep:#3E5A78;--emerald-tint:#E1E8EE;--rose:#9A3E6E;--rose-bg:#F3E7ED;--rose-deep:#8A2F60;--olive:#6E5A17;--olive-deep:#5E4C12;--cognac:#C9D2DB;--cognac-deep:#6E5A17;--serenity:#E3EAF0;--serenity-deep:#2F6F86;--brass:#3E5A78;--gold:#3E5A78;--peacock:#2F6F86;--magenta:#9A3E6E;--mustard:#7A5F12;--teal:#E8EDF2;--line:rgba(29,39,51,.18);--line-2:rgba(29,39,51,.09);--line-3:rgba(29,39,51,.22);--line-d:rgba(29,39,51,.14)}
html body{font-family:var(--body);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
:root[data-theme="light"] body{background:linear-gradient(180deg,#b3c1cf 0,#dce3ea 560px,#e8edf2 1200px) #e8edf2}
::selection{background:#EFD98B;color:#1D2733}
html body :focus-visible{outline:2px solid var(--gold);outline-offset:2px}
html body a{text-decoration-thickness:1px;text-underline-offset:3px}
/* butter tape: section labels read like a strip of tape on a billboard */
html body .eyebrow{width:fit-content;max-width:100%;background:var(--trx-tape);color:var(--trx-tape-ink);padding:2px 9px;border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;line-height:2.1;letter-spacing:.16em}
/* heroes: three street lamps over a sky (day) or a slate night */
html[data-theme="light"] body .hero{background:radial-gradient(ellipse 20% 46% at 18% 0,rgba(255,236,170,.34),transparent 72%),radial-gradient(ellipse 20% 46% at 50% 0,rgba(255,236,170,.28),transparent 72%),radial-gradient(ellipse 20% 46% at 82% 0,rgba(255,236,170,.34),transparent 72%),linear-gradient(180deg,#8c9eb2 0%,#b3c1cf 46%,#dce3ea 100%)}
html:not([data-theme="light"]) body .hero{background:radial-gradient(ellipse 20% 46% at 18% 0,rgba(255,236,170,.14),transparent 72%),radial-gradient(ellipse 20% 46% at 50% 0,rgba(255,236,170,.11),transparent 72%),radial-gradient(ellipse 20% 46% at 82% 0,rgba(255,236,170,.14),transparent 72%),linear-gradient(180deg,#1c2530 0%,#232d38 100%)}
/* one short rule under every section title, as on the billboard */
html body .shead h2::after,html body .sec-h::after{content:"";display:block;width:56px;height:2px;background:currentColor;margin-top:14px;opacity:.8}
html body .btn{border-radius:3px;letter-spacing:.08em}
html body .cookie{border-radius:4px;box-shadow:0 24px 50px -30px rgba(16,24,34,.55)}
html body .cookie .cbtns button:not(.btn),html body .cookie button.ck-forget{font:inherit;font-size:14px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:transparent;color:var(--ink);border:1px solid var(--line-3,var(--line));padding:10px 16px;border-radius:3px;cursor:pointer}
html body #trx-corner-btn{background:#1D2733;color:#EFD98B;border:1px solid #EFD98B;box-shadow:0 12px 26px -14px rgba(16,24,34,.65)}
/* the road: a dashed lane marking above every footer */
html body footer::before{content:"";display:block;height:4px;max-width:1180px;margin:0 auto 24px;background:repeating-linear-gradient(90deg,var(--muted) 0 44px,transparent 44px 92px);opacity:.5}
@media (prefers-reduced-motion:reduce){html body .eyebrow{transition:none}}
/* page fixes: surfaces that were painted in the old emerald by hand */
html[data-theme="light"] body .mast{background:rgba(245,247,250,.94);color:var(--ink)}
html[data-theme="light"] body .controls{background:rgba(232,237,242,.96)}
html:not([data-theme="light"]) body .mast{background:rgba(26,34,44,.94)}
html:not([data-theme="light"]) body .controls{background:rgba(34,44,55,.96)}
html body .catbtn.on,html body .lbtn.on{color:var(--night);background:var(--gold);border-color:var(--gold)}
html[data-theme="light"] body .catbtn.on,html[data-theme="light"] body .lbtn.on{color:#FFFFFF}
html body .lbtn{white-space:nowrap}
html body .bar-xp{white-space:nowrap}
html body .bar-brand b{white-space:nowrap}
@media(max-width:1100px){html body .bar-brand span{display:none}}
html body .dateline .editions a[aria-current],html body .editions a[aria-current],html body .dateline a[aria-current]{color:var(--ink);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
/* light hovers */
html[data-theme="light"] body .dateline a:hover,html[data-theme="light"] body .langbtn:hover,html[data-theme="light"] body p a:hover,html[data-theme="light"] body li a:hover,html[data-theme="light"] body td a:hover{color:var(--ink)}
/* verifier fixes */
html body button,html body input,html body select,html body textarea{font-family:inherit}
html body .cookie .btn-light{font:inherit;font-size:14px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;background:transparent;color:var(--ink);border:1px solid var(--line-3,var(--line));padding:10px 16px;border-radius:3px;cursor:pointer}
html body .cookie .btn-light:hover{border-color:var(--ink)}
/* badges and active controls that paint dark text on the accent: the accent is slate by day, so the text turns white */
html[data-theme="light"] body .btn-em,html[data-theme="light"] body .btn-ghost:hover,html[data-theme="light"] body .gfolder .fo2,html[data-theme="light"] body .fo2,html[data-theme="light"] body .feat-band .fl2,html[data-theme="light"] body .st-bind,html[data-theme="light"] body .st.st-bind,html[data-theme="light"] body .disp2 .seg button.on,html[data-theme="light"] body .disp2 .tbtn.on,html[data-theme="light"] body .tab.on,html[data-theme="light"] body .item.open .plus,html[data-theme="light"] body .freetag,html[data-theme="light"] body .totop,html[data-theme="light"] body .pgbtn.on,html[data-theme="light"] body .langbtn.on,html[data-theme="light"] body .sortbtn.on,html[data-theme="light"] body .xw-win-x,html[data-theme="light"] body .dotd-lbl,html[data-theme="light"] body .na-page .x:hover,html[data-theme="light"] body .catbtn.on,html[data-theme="light"] body .lbtn.on{color:#FFFFFF}

/* ================= THE BILLBOARD: the front top section of every edition =================
   An old-school roadside hoarding in corporate blue-grey: a bolted steel frame, three gooseneck lamps that light
   after dark, pasted poster sheets, a pinstripe picture panel, a catwalk rail with the owner's plate, braced steel
   legs, an office skyline behind and the road in front. On load the face turns in like a tri-vision sign and the
   lane line drives past twice. Reduced motion: nothing turns, nothing drives. */
html body section.hero.bb-hero{--bb-steel:#27323E;--bb-steel-2:#35424F;--bb-bolt:#95A2AF;--bb-paper:#F4F6F8;--bb-ink:#1D2733;--bb-blue:#3E5A78;--bb-blue-2:#2E4A66;--bb-tape:#EFD98B;--bb-city:rgba(46,74,102,.19);--bb-road:44px;padding:0;margin:0;background:none;text-align:start;overflow:hidden}
html:not([data-theme="light"]) body section.hero.bb-hero{--bb-paper:#DCE2E8;--bb-city:rgba(3,7,11,.55)}
html body .bb-hero .wrap{max-width:1180px;display:block}
html body .bb-scene{position:relative;padding-top:clamp(34px,5vw,72px);background:linear-gradient(180deg,#9AACBF 0%,#BBC8D5 52%,#D6DEE6 100%)}
html:not([data-theme="light"]) body .bb-scene{background:linear-gradient(180deg,#10161D 0%,#18212A 55%,#212B36 100%)}
html body .bb-scene::before{content:"";position:absolute;left:0;right:0;bottom:var(--bb-road);height:clamp(110px,15vw,210px);pointer-events:none;background:linear-gradient(var(--bb-city),var(--bb-city)) 1% 100%/4% 46% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 5.5% 100%/3% 62% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 9% 100%/5% 38% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 15% 100%/3.5% 74% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 19% 100%/6% 52% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 26% 100%/4% 86% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 31% 100%/5% 58% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 37% 100%/3% 40% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 58% 100%/4% 44% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 63% 100%/5% 64% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 68.5% 100%/3% 92% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 72% 100%/6% 48% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 79% 100%/4% 70% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 84% 100%/5% 56% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 90% 100%/3.5% 80% no-repeat,linear-gradient(var(--bb-city),var(--bb-city)) 95% 100%/5% 44% no-repeat}
html body .bb-scene::after{content:"";position:absolute;left:0;right:0;top:0;height:62%;pointer-events:none;opacity:0;background:radial-gradient(1.4px 1.4px at 6% 14%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 13% 32%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 21% 9%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 29% 24%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 37% 12%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 44% 30%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 52% 8%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 61% 20%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 68% 34%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 74% 11%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 81% 26%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 88% 15%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 94% 31%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 48% 42%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 17% 46%,rgba(255,255,255,.85),transparent 70%),radial-gradient(1.4px 1.4px at 84% 44%,rgba(255,255,255,.85),transparent 70%)}
html:not([data-theme="light"]) body .bb-scene::after{opacity:.8}
html body .bb-wrap{position:relative;z-index:1}
html body .bb{position:relative;max-width:1120px;margin:0 auto;padding-top:58px}
html body .bb-lamps{position:absolute;top:0;left:7%;right:7%;height:58px;display:flex;justify-content:space-between;pointer-events:none;z-index:4}
html body .bb-lamps i{position:relative;width:74px;height:58px}
html body .bb-lamps i::before{content:"";position:absolute;left:50%;bottom:0;width:5px;height:44px;margin-left:-2.5px;background:linear-gradient(90deg,#1E2731,var(--bb-steel-2),#1E2731);border-radius:2px 2px 0 0}
html body .bb-lamps i::after{content:"";position:absolute;left:50%;top:2px;width:64px;height:17px;margin-left:-32px;background:linear-gradient(180deg,#46535F,#27323E);border-radius:14px 14px 3px 3px;box-shadow:0 5px 0 -1px #B7C1CB}
html:not([data-theme="light"]) body .bb-lamps i::after{box-shadow:0 5px 0 -1px #FFF4C9,0 12px 34px 6px rgba(255,236,170,.6);animation:bbLamp 1.3s steps(1,end) .9s both}
@keyframes bbLamp{0%{box-shadow:0 5px 0 -1px #6F7B87}20%{box-shadow:0 5px 0 -1px #FFF4C9,0 10px 30px 4px rgba(255,236,170,.6)}28%{box-shadow:0 5px 0 -1px #6F7B87}40%,100%{box-shadow:0 5px 0 -1px #FFF4C9,0 12px 34px 6px rgba(255,236,170,.6)}}
html body .bb-board{position:relative;padding:14px;background:linear-gradient(180deg,var(--bb-steel-2),var(--bb-steel));border-radius:6px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 2px 0 #151C24,0 44px 70px -40px rgba(8,14,22,.75)}
html body .bb-board::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:1;background:radial-gradient(circle,var(--bb-bolt) 0 1.7px,transparent 2.3px) 10px 0/44px 14px repeat-x,radial-gradient(circle,var(--bb-bolt) 0 1.7px,transparent 2.3px) 10px 100%/44px 14px repeat-x}
html body .bb-face{position:relative;z-index:0;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);min-height:clamp(330px,36vw,470px);background:var(--bb-paper);border-radius:2px;overflow:hidden;isolation:isolate}
html body .bb-face::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 calc(20% - 1px),rgba(29,39,51,.07) calc(20% - 1px) 20%),repeating-linear-gradient(180deg,transparent 0 calc(50% - 1px),rgba(29,39,51,.05) calc(50% - 1px) 50%),linear-gradient(180deg,rgba(255,255,255,.6),rgba(255,255,255,0) 35%,rgba(29,39,51,.06))}
html body .bb-face::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;background:radial-gradient(ellipse 24% 85% at 12% -12%,rgba(255,244,210,.95),transparent 70%),radial-gradient(ellipse 24% 85% at 50% -12%,rgba(255,244,210,.9),transparent 70%),radial-gradient(ellipse 24% 85% at 88% -12%,rgba(255,244,210,.95),transparent 70%),linear-gradient(180deg,transparent 50%,rgba(12,18,26,.14))}
html:not([data-theme="light"]) body .bb-face::after{opacity:1;animation:bbGlow 1.3s steps(1,end) .9s both}
@keyframes bbGlow{0%{opacity:0}20%{opacity:1}28%{opacity:.12}40%,100%{opacity:1}}
html body .bb-copy{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:clamp(28px,4.4vw,60px) clamp(22px,4.2vw,58px);color:var(--bb-ink);min-width:0}
html body .bb-hero .bb-copy .eyebrow{margin:0 0 20px;transform:rotate(-1.4deg);transform-origin:0 50%;background:var(--bb-tape);color:var(--bb-ink);box-shadow:0 1px 1px rgba(29,39,51,.18);font-size:12.5px}
html body .bb-hero .bb-copy h1{margin:0;font-family:var(--display);font-weight:600;font-size:clamp(2.35rem,4.9vw,4.35rem);line-height:1.02;letter-spacing:-.012em;color:var(--bb-ink);max-width:15ch;text-align:start;text-wrap:balance}
html body .bb-hero .bb-copy h1 .l2{color:var(--bb-blue);font-style:italic;font-weight:500}
html body .bb-hero .bb-copy .kick{margin:24px 0 0;padding-top:16px;border-top:2px solid var(--bb-ink);font-family:var(--display);font-style:italic;font-size:clamp(1.12rem,1.55vw,1.4rem);line-height:1.35;color:var(--bb-blue-2);max-width:32ch;text-align:start}
html body .bb-hero .bb-copy .attrib{margin:8px 0 0;font-family:var(--body);font-style:normal;font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--bb-ink)}
html body .bb-pic{position:relative;display:grid;place-items:center;padding:clamp(22px,3vw,40px);background:var(--bb-blue-2);min-width:0;margin:0}
html body .bb-pic::before{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,rgba(255,255,255,.075) 0 1px,transparent 1px 13px),linear-gradient(180deg,rgba(255,255,255,.08),rgba(0,0,0,.2))}
html body .bb-photo{position:relative;margin:0;padding:10px 10px 12px;background:#FBFCFD;box-shadow:0 22px 34px -18px rgba(0,0,0,.6);transform:rotate(2.2deg);max-width:100%}
html body .bb-photo::before,html body .bb-photo::after{content:"";position:absolute;top:-9px;width:68px;height:20px;background:rgba(239,217,139,.9);box-shadow:0 1px 1px rgba(0,0,0,.14)}
html body .bb-photo::before{left:-18px;transform:rotate(-32deg)}
html body .bb-photo::after{right:-18px;transform:rotate(30deg)}
html body .bb-photo img{display:block;width:clamp(150px,17vw,232px);height:auto;aspect-ratio:1;border:0;border-radius:0;box-shadow:none}
html body .bb-photo video{display:block;width:min(100%,400px);height:auto;aspect-ratio:1800/1080;object-fit:cover;border:0;border-radius:0;box-shadow:none;filter:none;background:#1D2733}
html body .bb-slats{position:absolute;inset:14px;z-index:3;display:flex;pointer-events:none;perspective:1400px}
html body .bb-slats i{flex:1 1 0;background:linear-gradient(90deg,#3B4857 0%,#2D3845 50%,#232D38 100%);box-shadow:inset -1px 0 0 rgba(0,0,0,.28),inset 1px 0 0 rgba(255,255,255,.05);backface-visibility:hidden;animation:bbTurn .78s cubic-bezier(.55,0,.25,1) calc(.25s + var(--i) * 55ms) both}
@keyframes bbTurn{from{transform:rotateY(0)}to{transform:rotateY(-90deg);visibility:hidden}}
html body .bb-rail{position:relative;z-index:2;min-height:34px;margin:-6px 1.5% 0;display:flex;justify-content:flex-end;align-items:flex-start}
html body .bb-rail::before{content:"";position:absolute;left:0;right:0;top:0;height:34px;pointer-events:none;background:linear-gradient(#3A4755,#2A3441) 0 0/100% 4px no-repeat,linear-gradient(#2A3441,#1F2832) 0 100%/100% 8px no-repeat,repeating-linear-gradient(90deg,#2F3B48 0 3px,transparent 3px 28px) 0 4px/100% 22px no-repeat}
html body .bb-hero .bb-plate{position:relative;margin:12px 4% 0 0;padding:5px 12px;background:#1D2733;color:#E7ECF1;border:1px solid #56667A;border-radius:2px;font-family:var(--body);font-size:12.5px;font-style:normal;letter-spacing:.04em;line-height:1.35;text-align:start;max-width:62%;box-shadow:0 6px 12px -8px rgba(0,0,0,.6)}
html body .bb-legs{position:relative;display:flex;justify-content:space-between;height:clamp(58px,8vw,112px);padding:0 14%}
html body .bb-legs i{position:relative;z-index:1;width:18px;background:linear-gradient(90deg,#1B232C 0 20%,#3A4755 20% 80%,#1B232C 80%)}
html body .bb-legs::before{content:"";position:absolute;left:14%;right:14%;top:8%;bottom:10%;background:linear-gradient(to top right,transparent calc(50% - 1.5px),rgba(58,71,85,.9) calc(50% - 1.5px) calc(50% + 1.5px),transparent calc(50% + 1.5px)),linear-gradient(to bottom right,transparent calc(50% - 1.5px),rgba(58,71,85,.9) calc(50% - 1.5px) calc(50% + 1.5px),transparent calc(50% + 1.5px))}
html body .bb-road{position:relative;z-index:1;height:var(--bb-road);background:linear-gradient(180deg,#36424F,#2A3440);box-shadow:inset 0 3px 0 #8F9CA9,inset 0 -1px 0 rgba(0,0,0,.25)}
html body .bb-road::before{content:"";position:absolute;left:0;right:0;top:50%;height:4px;margin-top:-1px;background:repeating-linear-gradient(90deg,#EFD98B 0 48px,transparent 48px 100px);opacity:.92}
@media (prefers-reduced-motion:no-preference){html body .bb-road::before{animation:bbDrive 1.6s linear .3s 2}}
@keyframes bbDrive{to{background-position:-100px 0}}
html body .bb-below{padding:clamp(30px,4vw,48px) 24px clamp(44px,5vw,64px);max-width:900px}
html body .bb-below .lede{margin:0;font-size:clamp(17px,1.5vw,20px)}
html body .bb-below .ctas{margin-top:24px}
html body .bb-below .mini{margin-top:26px}
@media(max-width:820px){html body .bb-face{grid-template-columns:1fr;min-height:0}html body .bb-pic{padding:24px 18px 28px}html body .bb-photo img{width:150px}html body .bb-lamps i:nth-child(2),html body .bb-legs i:nth-child(2){display:none}html body .bb-legs{padding:0 18%;height:56px}html body .bb-legs::before{left:18%;right:18%}html body .bb-board{padding:10px}html body .bb-slats{inset:10px}html body .bb-hero .bb-plate{max-width:84%;font-size:12px}html body .bb{padding-top:52px}html body section.hero.bb-hero{--bb-road:36px}}
@media(max-width:480px){html body .bb-hero .bb-copy h1{font-size:clamp(2rem,9.4vw,2.5rem)}html body .bb-lamps{left:10%;right:10%}html body .bb-lamps i{width:60px}html body .bb-lamps i::after{width:52px;margin-left:-26px}html body .bb-copy{padding:26px 20px 28px}}
@media (prefers-reduced-motion:reduce){html body .bb-slats{display:none}html body .bb-lamps i::after,html body .bb-face::after{animation:none!important}}
@media print{html body .bb-lamps,html body .bb-slats,html body .bb-legs,html body .bb-road,html body .bb-rail::before,html body .bb-scene::before,html body .bb-scene::after{display:none}html body .bb-scene{background:none}}

/* ================= THE OFFICE: everything below the billboard =================
   Stationery, not gadgets: square-cornered paper cards on a blue-grey desk, enamel push-buttons that press in,
   section numbers on motorway-junction plates (the road runs through the office), label-maker tape for badges,
   and a second sheet peeking out behind the featured pieces. */
html body .btn{font-family:var(--body);font-weight:600;letter-spacing:.05em;border-radius:3px;transition:transform .12s ease,box-shadow .12s ease,background-color .15s ease,color .15s ease}
html[data-theme="light"] body .btn-em{background:#2E4A66;color:#FFFFFF;border:1px solid #1D2733;box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 3px 0 #1D2733,0 12px 18px -12px rgba(16,24,34,.55)}
html[data-theme="light"] body .btn-em:hover{background:#365777;color:#FFFFFF}
html[data-theme="light"] body .btn-ghost{background:rgba(255,255,255,.8);color:#1D2733;border:1px solid #1D2733;box-shadow:0 3px 0 #1D2733}
html[data-theme="light"] body .btn-ghost:hover{background:#FFFFFF;color:#1D2733}
html:not([data-theme="light"]) body .btn-em{background:#EFD98B;color:#1D2733;border:1px solid #EFD98B;box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 3px 0 #9E8B45}
html:not([data-theme="light"]) body .btn-em:hover{background:#F4E3A6;color:#1D2733}
html:not([data-theme="light"]) body .btn-ghost{background:rgba(255,255,255,.03);color:#EEF2F6;border:1px solid rgba(238,242,246,.5);box-shadow:0 3px 0 rgba(0,0,0,.4)}
html:not([data-theme="light"]) body .btn-ghost:hover{background:rgba(255,255,255,.08);color:#FFFFFF}
html body .btn:active{transform:translateY(3px);box-shadow:none}
@media (prefers-reduced-motion:reduce){html body .btn{transition:none}html body .btn:active{transform:none}}
/* section numbers: motorway-junction plates */
html body .shead .snum{align-self:start;display:inline-flex;align-items:center;justify-content:center;min-width:2.5em;margin-top:.15em;padding:.42em .56em .38em;background:#2E4A66;color:#FFFFFF;border-radius:7px;outline:2px solid #FFFFFF;outline-offset:-6px;box-shadow:0 2px 0 #1D2733,0 10px 18px -12px rgba(16,24,34,.6);font-family:var(--body);font-size:clamp(1.05rem,1.5vw,1.3rem);font-weight:700;font-style:normal;letter-spacing:.03em;line-height:1}
html:not([data-theme="light"]) body .shead .snum{background:#3E5A78;outline-color:#EEF2F6;color:#FFFFFF}
html body #news .shead .snum{color:#FFFFFF}
/* paper: square corners, a desk shadow by day */
html body :is(.cmp-card,.vcard,.ocard,.watch,.essay,.tcard,.ncard,.fcard2,.ecard,.dict,.course,.creds,.talk,.cbox,.wform,.tcat,.jb-card,.na-card,.clsrm,.tri-panel,.app-card,.app-wcard,.ccard,.stat,.fc-card,.sumbox,.feat-band){border-radius:4px}
html[data-theme="light"] body :is(.cmp-card,.vcard,.ocard,.watch,.essay,.tcard,.ncard,.fcard2,.ecard,.dict,.course,.creds,.talk,.cbox,.wform,.tcat,.jb-card,.na-card,.clsrm,.tri-panel,.app-card,.app-wcard,.ccard,.stat,.fc-card,.sumbox,.feat-band){box-shadow:0 1px 0 rgba(29,39,51,.05),0 16px 30px -24px rgba(16,24,34,.5)}
html[data-theme="light"] body :is(.feat-band,.dict,.creds){box-shadow:5px 5px 0 -1px #F7F9FB,5px 5px 0 0 rgba(29,39,51,.16),0 18px 32px -24px rgba(16,24,34,.5)}
/* label-maker tape for counts and badges */
html body .hero-sub .chips .chip{background:#1D2733;color:#EEF2F6;border:0;border-radius:0;padding:8px 18px;font-size:14.5px;letter-spacing:.04em;text-shadow:0 1px 0 rgba(0,0,0,.55);clip-path:polygon(7px 0,calc(100% - 7px) 0,100% 50%,calc(100% - 7px) 100%,7px 100%,0 50%)}
html body .hero-sub .chips .chip b{color:#EFD98B}
html body .gfolder .fo2{border-radius:0;padding:4px 12px;background:#1D2733;color:#EEF2F6;clip-path:polygon(5px 0,calc(100% - 5px) 0,100% 50%,calc(100% - 5px) 100%,5px 100%,0 50%)}
/* file folders on the shelf */
html[data-theme="light"] body .gfolder,html[data-theme="light"] body .gfolder::before{background:#F3F6F9}
html body .gfolder{border-radius:4px 4px 3px 3px}
html body .gfolder.on{box-shadow:0 -3px 0 #2E4A66 inset,0 18px 28px -22px rgba(16,24,34,.55)}
html[data-theme="light"] body .gfolder.on,html[data-theme="light"] body .gfolder.on::before{background:#FFFFFF}
/* the masthead: a ruled letterhead */
html[data-theme="light"] body .mast{box-shadow:0 1px 0 rgba(29,39,51,.14),0 3px 0 rgba(245,247,250,.94),0 4px 0 rgba(29,39,51,.10)}

/* ================= LETTERS ON THE DESK: legal pages, library, archive =================
   Each document is a sheet of company letter paper on the desk; the top bar is the letterhead; the key notice is a
   memo slip held on with a strip of tape. */
html body .bar{position:relative;background:var(--card);border-bottom:1px solid var(--line);box-shadow:0 1px 0 var(--card),0 3px 0 var(--line-2)}
html body .bar .home{font-family:var(--display);color:var(--ink);letter-spacing:.01em}
html body .bar .home span{color:var(--gold)}
html body .bar .back{color:var(--ink-soft);font-family:var(--body);font-size:13px;font-weight:600;letter-spacing:.1em}
html body .bar .back:hover{color:var(--ink)}
html body main.doc{position:relative;max-width:900px;margin:clamp(20px,4vw,44px) auto clamp(40px,6vw,72px);padding:clamp(30px,5vw,60px) clamp(22px,5.4vw,66px) clamp(40px,5vw,64px);background:var(--card);border:1px solid var(--line);border-radius:3px;box-shadow:6px 6px 0 -1px var(--card-2),6px 6px 0 0 var(--line),0 30px 50px -36px rgba(16,24,34,.55)}
html body main.doc::before{content:"";position:absolute;left:clamp(22px,5.4vw,66px);right:clamp(22px,5.4vw,66px);top:clamp(16px,2.6vw,28px);height:2px;background:linear-gradient(90deg,var(--ink) 0 56px,var(--line) 56px)}
html body .doc h1{font-family:var(--display);color:var(--ink);letter-spacing:-.01em}
html body .doc h2{font-family:var(--display);border-top:1px solid var(--line);color:var(--ink)}
html body .doc h3{color:var(--gold)}
html body .doc li::before{border-radius:0;width:6px;height:6px;background:var(--gold)}
html body .doc th{color:var(--ink);background:var(--card-2);border-bottom:2px solid var(--ink)}
html body .doc .callout{position:relative;border:1px solid var(--line);border-left:1px solid var(--line);border-radius:2px;background:var(--card-2);box-shadow:0 12px 22px -18px rgba(16,24,34,.5);padding:22px 24px 20px;margin:30px 0 26px}
html body .doc .callout::before{content:"";position:absolute;top:-10px;left:28px;width:92px;height:20px;background:rgba(239,217,139,.9);transform:rotate(-2deg);box-shadow:0 1px 1px rgba(0,0,0,.12)}
html body .doc .eyebrow{color:var(--trx-tape-ink)}
html body .foot{border-top:1px solid var(--line)}
@media(max-width:560px){html body main.doc{margin:14px 10px 36px;box-shadow:0 18px 30px -24px rgba(16,24,34,.5)}}
@media print{html body main.doc{box-shadow:none;border:0;margin:0;padding:0}html body main.doc::before,html body .doc .callout::before{display:none}}

/* classroom language buttons were hand-painted in the old gold */
html body .cr-langs .langbtn{font:600 11px/1 var(--body);letter-spacing:.08em;border:1px solid var(--line);color:inherit;border-radius:3px}
html[data-theme="light"] body .cr-langs .langbtn.on{background:#2E4A66;color:#FFFFFF;border-color:#2E4A66}
html:not([data-theme="light"]) body .cr-langs .langbtn.on{background:#EFD98B;color:#1D2733;border-color:#EFD98B}

/* billboard type in Chinese, Japanese and Korean: taller line boxes, never a fake italic */
html body .bb-hero .bb-copy .eyebrow{text-wrap:balance;max-width:min(100%,46ch)}
html:is(:lang(zh),:lang(ja),:lang(ko)) body .bb-hero .bb-copy h1{line-height:1.22;letter-spacing:0}
html:is(:lang(zh),:lang(ja),:lang(ko)) body .bb-hero .bb-copy h1 .l2,html:is(:lang(zh),:lang(ja),:lang(ko)) body .bb-hero .bb-copy .kick{font-style:normal}
html:is(:lang(zh),:lang(ja),:lang(ko)) body .bb-hero .bb-copy .eyebrow{letter-spacing:.06em}
html:is(:lang(zh),:lang(ja),:lang(ko)) body .hero h1 .l2,html:is(:lang(zh),:lang(ja),:lang(ko)) body .kick,html:is(:lang(zh),:lang(ja),:lang(ko)) body .soon-note{font-style:normal}
html body .hero-sub .chips .chip{height:auto;line-height:1.4;white-space:normal;text-align:start}
html body .bb-hero .bb-copy .eyebrow{max-width:100%;letter-spacing:.12em;font-size:12px}
html body .bb-below .ctas{display:flex;flex-wrap:wrap;gap:12px}
html body .bb-below .ctas .btn{white-space:nowrap;flex:0 0 auto}
html body .bb-below .mini{display:block}
html body .bb-below .mini .soon-note{max-width:none}
@media(max-width:480px){html body .bb-below .ctas .btn{white-space:normal;flex:1 1 100%;text-align:center}}

/* ================= OFFICE PAPER: the vintage cream surfaces become cool office stock =================
   (crossword, notepad, chess board paper, featured "of the day" cards, notes reader, film frames) */
html body :is(.xw,.np,.chs-paper,#aotd,#cotd,#eotd,#films .creds){background:radial-gradient(900px 420px at 16% -6%,rgba(62,90,120,.07),transparent 60%),linear-gradient(180deg,#F8FAFC 0%,#EEF2F6 100%);color:#1D2733;border-color:rgba(29,39,51,.18)}
html body .xw-zh{background:rgba(248,250,252,.95)}
html body .xw-cell{background:#FFFFFF;border-color:rgba(29,39,51,.35)}
html body .xw-cell.hl{background:#DCE6EF}
html body .xw-cell.pre{background:#E6ECF2}
html body .np-roll::before{background:linear-gradient(180deg,rgba(238,242,246,0),#E6ECF2 80%)}
html body .np-curl{background:linear-gradient(180deg,#F8FAFC 0%,#DDE4EB 38%,#9AA7B4 75%,#7C8A98 100%)}
html body .np-curl::before,html body .np-curl::after{background:radial-gradient(circle at 38% 38%,#F8FAFC 0 18%,#DDE4EB 40%,#6F7C89 78%,#4F5B67 100%)}
html body .np-textbox{background:rgba(255,255,255,.97)}
html body .np-tools button.on{background:#E3EAF1}
html body .chs-toast-in{background:rgba(238,242,246,.97)}
html body .chs-sq.lt{background:#E6ECF2}
html body .chs-name-row input{background:rgba(255,255,255,.7)}
html body .f-frame::before{background:linear-gradient(180deg,rgba(246,248,250,.96),rgba(206,215,224,.9))}
html body .f-frame::after{background:linear-gradient(180deg,rgba(232,237,242,.92),rgba(196,206,216,.86))}
html body .na-sec{background-color:#EEF2F6}
html body :is(.na-card,.na-page,.na-sec .dotd,.na-sec .method,.na-sec .sortbtn:not(.on)){background:#FFFFFF}
html body .na-sec #na-feat>*{background:#FFFFFF}
html body .na-scope{background:#F4F6F8}
/* the paper surfaces' brown ink and badges become slate and corporate blue */
html body :is(.xw,#films .creds,#aotd,#cotd,#eotd,.np){border-color:rgba(29,39,51,.22)}
html body :is(.xw-kick,.xw-dateline,.xw-sub,.xw-len,.np-kick,.np-dateline,.np-note,#films .creds .cq-attr,#films .creds .cfoot,#eotd .eotd-note){color:#566373}
html body :is(.xw-sub a,.xw-num,.xw-hint,.xw-given,#films .creds .clbl,#films .creds li .cdt,#aotd .dotd-src,#cotd .dotd-src,#eotd .dotd-src,#aotd a.read,#cotd a.read,#eotd a.read,.np-go,.np-tag,.np-src,.np-lead h4 a:hover,.np-item h5 a:hover){color:#2E4A66;border-color:currentColor}
html body .xw-hint:hover:not(:disabled){color:#1D2733;border-color:#1D2733}
html body .xw-cell{border-color:rgba(29,39,51,.42)}
html body .xw-cell.hl{border-color:#2E4A66}
html body :is(.xw-cell input,.xw-cell.pre input,.xw-zh){color:#1D2733}
html body :is(.np-textbox){border-color:rgba(29,39,51,.3)}
html body :is(#aotd .dotd-lbl,#cotd .dotd-lbl,#eotd .dotd-lbl,.np-lead-k,.np-btn,.np-tools,.np-textitem-ctrls,.chs-seg button.on,.chs-btn.primary,.chs-clock-btn.on){background:#1D2733;color:#FFFFFF;border-color:#1D2733}
html body :is(.xw .xw-btn:hover,.np-btn:hover,.np-tools button:hover,.np-textitem-ctrls button:hover,.chs-btn.primary:hover){background:#2E4A66;color:#FFFFFF}
html body .chs-board{background:#1D2733}
/* notes filters: the active button stays readable */
html body .na-sec .sortbtn{white-space:nowrap}
html body .na-sec .sortbtn.on{background:#2E4A66;color:#FFFFFF;border-color:#2E4A66}
/* chess club and remaining paper labels in slate */
html body .chs-sq.dk{background:#9FB1C2}
html body .chs-sq.lt{background:#EEF2F6}
html body .chs-pc.b{color:#1D2733}
html body .chs-paper :is(.chs-kick,.chs-status,.role,.lbl,.chs-clock-lbl){color:#566373}
html body .chs-paper :is(.chs-status,.chs-clock,.chs-clock-solo,.chs-name-row input){border-color:rgba(29,39,51,.3)}
html body .chs-paper img{border-color:rgba(29,39,51,.3)}
html body .chs-vid-circle{border-color:#2E4A66}
/* CJK: never a synthetic italic (English islands keep theirs) */
html:is(:lang(zh),:lang(ja),:lang(ko)) body *:not([lang|="en"]):not([lang|="en"] *){font-style:normal !important}
/* Glossary masthead title on one line */
html body .mast .ttl{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* the weekly summary is a letter on the desk too */
html body main.wk-wrap{position:relative;max-width:900px;margin:clamp(20px,4vw,44px) auto clamp(40px,6vw,72px);padding:clamp(28px,5vw,56px) clamp(22px,5.4vw,66px);background:var(--card);border:1px solid var(--line);border-radius:3px;box-shadow:6px 6px 0 -1px var(--card-2),6px 6px 0 0 var(--line),0 30px 50px -36px rgba(16,24,34,.55)}
@media(max-width:560px){html body main.wk-wrap{margin:14px 10px 36px;box-shadow:0 18px 30px -24px rgba(16,24,34,.5)}}
/* the globe caption on phones: smaller name, no collision with the drag hint */
@media(max-width:640px){html body .tg-cap-name{font-size:clamp(20px,6.2vw,26px);line-height:1.1}html body .tg-cap-sig{font-size:14px}html body .tg-pill{white-space:nowrap;font-size:10px}html body .tg-hint{font-size:12px;top:12px;left:14px}}
@media(max-width:420px){html body .tg-hint{display:none}}

/* ===== Edition colours (28 Sep 2026): each edition wears its colour on the signposts; backgrounds stay neutral ===== */
html[data-edition]{--ed:#2B4A70}
html[data-edition="uk"]{--ed:#7E1A3A;--ed-day:#7E1A3A;--ed-tint:#F3D5DE;--ed-tint-day:#F3D5DE;--ed-tint-ink:#5E1029}
html[data-edition="us"]{--ed:#6A3DB8;--ed-day:#6A3DB8;--ed-tint:#E4DAFA;--ed-tint-day:#E4DAFA;--ed-tint-ink:#3E2475}
html[data-edition="asia"]{--ed:#0E6E7E;--ed-day:#0E6E7E;--ed-tint:#D2EEF1;--ed-tint-day:#D2EEF1;--ed-tint-ink:#0A4F5A}
html:not([data-theme="light"])[data-edition="global"]{--ed:#E8D48A}
html:not([data-theme="light"])[data-edition="uk"]{--ed:#F08DAA;--ed-tint:#F08DAA;--ed-tint-ink:#2A0A14}
html:not([data-theme="light"])[data-edition="us"]{--ed:#B9A5FF;--ed-tint:#B9A5FF;--ed-tint-ink:#1F1440}
html:not([data-theme="light"])[data-edition="asia"]{--ed:#6DD3E0;--ed-tint:#6DD3E0;--ed-tint-ink:#07343B}
html:is([data-edition="uk"],[data-edition="us"],[data-edition="asia"]) body{--gold:var(--ed);--trx-tape:var(--ed-tint);--trx-tape-ink:var(--ed-tint-ink);--bb-blue:var(--ed-day);--bb-blue-2:var(--ed-day);--bb-tape:var(--ed-tint-day)}
html:is([data-edition="uk"],[data-edition="us"],[data-edition="asia"]) body .shead .snum{background:var(--ed-day)}
html[data-edition] body .mast{box-shadow:inset 0 -3px 0 var(--ed)}
html[data-edition] body .mast>.wrap{padding-top:10px}
html body :is(.editions,.dateline) a:is([href*="global/"],[href*="eu_uk/"],[href*="usa/"],[href*="asia/"])::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-inline-end:6px;vertical-align:1px;background:var(--dot)}
html body :is(.editions,.dateline) a[href*="global/"]{--dot:#2B4A70}html body :is(.editions,.dateline) a[href*="eu_uk/"]{--dot:#7E1A3A}html body :is(.editions,.dateline) a[href*="usa/"]{--dot:#6A3DB8}html body :is(.editions,.dateline) a[href*="asia/"]{--dot:#1A8A9A}
html:not([data-theme="light"]) body :is(.editions,.dateline) a[href*="global/"]{--dot:#E8D48A}html:not([data-theme="light"]) body :is(.editions,.dateline) a[href*="eu_uk/"]{--dot:#F08DAA}html:not([data-theme="light"]) body :is(.editions,.dateline) a[href*="usa/"]{--dot:#B9A5FF}html:not([data-theme="light"]) body :is(.editions,.dateline) a[href*="asia/"]{--dot:#6DD3E0}
/* ===== 02 Five ways to govern: one row per model, labels once (28 Sep 2026) ===== */
html body #compare .wrap{container:cmpw/inline-size}
html body #compare .cmp{gap:12px}
html body #compare .cmp-head{display:none}
html body #compare .cmp-card{border:1px solid var(--line);border-top:3px solid var(--cx);padding:18px 20px}
html body #compare .cmp-no{width:auto;height:auto;border:0;background:none;border-radius:0;font-size:28px;font-weight:500;line-height:1;color:var(--cx);font-variant-numeric:lining-nums}
html body #compare .cmp-hd{align-items:flex-start;gap:14px}
html body #compare .cmp-model{font-size:1.22rem}
html body #compare .cmp-body{margin-top:14px;padding-top:12px;gap:12px}
html body #compare .cmp-f p{font-size:15.5px;line-height:1.55}
html body #compare .cmp-tl{margin-top:12px}
html body #compare .cmp-tl p{font-size:14.5px}
@container cmpw (min-width:640px){
html body #compare .cmp-card{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px}
html body #compare .cmp-hd{grid-column:1/-1}
html body #compare .cmp-body{display:contents}
html body #compare :is(.cmp-f,.cmp-tl){margin-top:14px;padding:12px 0 0;border-top:1px solid var(--line-2);background:none;border-radius:0}}
@container cmpw (min-width:1000px){
html body #compare .cmp{display:block;background:var(--card);border:1px solid var(--line);border-radius:4px;overflow:hidden}
html[data-theme="light"] body #compare .cmp{box-shadow:0 1px 0 rgba(29,39,51,.05),0 16px 30px -24px rgba(16,24,34,.5)}
html body #compare :is(.cmp-head,.cmp-card){display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1.15fr) minmax(0,1fr);column-gap:28px;padding:0 24px}
html body #compare .cmp-head{padding-top:12px;padding-bottom:10px;background:var(--card-2);border-bottom:1px solid var(--line)}
html body #compare .cmp-head span{font:700 11.5px/1.3 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--brass)}
html body #compare .cmp-card{border:0;border-top:1px solid var(--line);border-radius:0;box-shadow:none;background:transparent;padding-top:20px;padding-bottom:20px}
html body #compare .cmp-head+.cmp-card{border-top:0}
html body #compare .cmp-card:hover{background:var(--card-2)}
html body #compare .cmp-hd{grid-column:auto}
html body #compare :is(.cmp-f,.cmp-tl){margin:0;padding:0;border:0}
html body #compare :is(.cmp-f,.cmp-tl)>.cmp-fl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}}
html:is([data-edition="uk"],[data-edition="us"],[data-edition="asia"]) body section.hero.bb-hero{--bb-blue:var(--ed-day);--bb-blue-2:var(--ed-day);--bb-tape:var(--ed-tint-day)}
html:is([data-edition="uk"],[data-edition="us"],[data-edition="asia"])[data-theme="light"] body .btn-em{background:var(--ed-day);color:#FFFFFF;border-color:color-mix(in srgb,var(--ed-day) 70%,#000)}
html:is([data-edition="uk"],[data-edition="us"],[data-edition="asia"])[data-theme="light"] body .btn-em:hover{background:color-mix(in srgb,var(--ed-day) 86%,#fff);color:#FFFFFF}
html:is([data-edition="uk"],[data-edition="us"],[data-edition="asia"]):not([data-theme="light"]) body .btn-em{background:var(--ed);color:#14202B;border-color:var(--ed)}
html:is([data-edition="uk"],[data-edition="us"],[data-edition="asia"]):not([data-theme="light"]) body .btn-em:hover{background:color-mix(in srgb,var(--ed) 82%,#fff);color:#14202B}
html:is([data-edition="uk"],[data-edition="us"],[data-edition="asia"]) body{--brass:var(--ed)}
html body :is(.editions,.dateline) a:is([href*="global/"],[href*="eu_uk/"],[href*="usa/"],[href*="asia/"]):not([aria-current]){color:var(--ink-soft)}
html body :is(.editions,.dateline) a:is([href*="global/"],[href*="eu_uk/"],[href*="usa/"],[href*="asia/"]):not([aria-current]):hover{color:var(--ink)}
html body section.bb-hero .bb-copy .eyebrow{font-size:clamp(12.5px,1.1vw,15.5px);letter-spacing:.09em;line-height:1.4;padding:.45em .75em}
/* ===== Traffic under the billboards (28 Sep 2026); decorative, hidden for reduced motion ===== */
html body .bb-traffic{position:absolute;left:0;right:0;bottom:0;height:calc(100% + 34px);overflow:hidden;pointer-events:none;z-index:2}
html body .bb-car{position:absolute;left:0;bottom:var(--lane,7px);z-index:2;width:62px;height:15px;border-radius:7px 10px 4px 4px;background:linear-gradient(90deg,#D9303F 0 3px,transparent 3px calc(100% - 4px),#FFF1C2 calc(100% - 4px)) var(--car,#C9D1DA);animation:bb-drive var(--dur,13s) linear var(--delay,0s) infinite;will-change:transform}
html body .bb-car::before{content:"";position:absolute;left:14px;right:16px;top:-10px;height:11px;border-radius:9px 12px 0 0;background:linear-gradient(90deg,var(--car,#C9D1DA) 0 13%,rgba(188,212,232,.92) 13% 47%,var(--car,#C9D1DA) 47% 53%,rgba(188,212,232,.92) 53% 86%,var(--car,#C9D1DA) 86%)}
html body .bb-car::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:12px;background:radial-gradient(circle at 14px 6px,#10151B 0 4.6px,#6B7682 4.6px 5.6px,transparent 6.2px),radial-gradient(circle at calc(100% - 15px) 6px,#10151B 0 4.6px,#6B7682 4.6px 5.6px,transparent 6.2px)}
html body .bb-car.van{width:84px;height:25px;border-radius:5px 9px 4px 4px}
html body .bb-car.van::before{left:8px;right:12px;top:4px;height:8px;border-radius:2px;background:repeating-linear-gradient(90deg,rgba(188,212,232,.92) 0 14px,transparent 14px 18px)}
html body .bb-car.back{--lane:22px;z-index:1;animation-name:bb-drive-back;filter:saturate(.85) brightness(.92)}
html body .bb-car.c1{--car:#C9D1DA;--dur:13s;--delay:-2s}html body .bb-car.c2{--car:#EEF1F4;--dur:13s;--delay:-8.5s}html body .bb-car.c3{--car:#B42336;--dur:17s;--delay:-4s}html body .bb-car.c4{--car:#2B4A70;--dur:17s;--delay:-12.5s}
html[data-edition="uk"] body .bb-car.c3{--car:#1B1F24}html[data-edition="us"] body .bb-car.c3{--car:#E9B824}html[data-edition="asia"] body .bb-car.c3{--car:#F4F6F8}
html:not([data-theme="light"]) body .bb-car{box-shadow:26px 1px 16px -5px rgba(255,236,170,.55)}
@keyframes bb-drive{from{transform:translateX(-110px)}to{transform:translateX(calc(var(--tw,1400px) + 110px))}}
@keyframes bb-drive-back{from{transform:translateX(calc(var(--tw,1400px) + 110px)) scale(-.82,.82)}to{transform:translateX(-110px) scale(-.82,.82)}}
@media (prefers-reduced-motion:reduce){html body .bb-traffic{display:none}}

/* ===== Billboard: confident pose on the board; the coffee loop beside the intro (28 Sep 2026) ===== */
html body .bb-photo img.bb-conf{display:block;width:min(100%,400px);height:auto;aspect-ratio:1800/1080;object-fit:cover;border:0;border-radius:0;box-shadow:none;filter:none;}
html body .bb-photo img.bb-conf{object-fit:cover;object-position:50% 14%}
html body .bb-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(190px,280px);gap:clamp(18px,3vw,36px);align-items:center}
html body .bb-sip{position:relative;margin:0;background:#FBFCFD;padding:8px 8px 20px;transform:rotate(1.6deg);box-shadow:0 22px 34px -18px rgba(0,0,0,.5)}
html body .bb-sip::before,html body .bb-sip::after{content:"";position:absolute;top:-8px;width:54px;height:16px;background:rgba(239,217,139,.9);box-shadow:0 1px 1px rgba(0,0,0,.14)}
html body .bb-sip::before{left:-12px;transform:rotate(-32deg)}html body .bb-sip::after{right:-12px;transform:rotate(32deg)}
html body .bb-sip video{display:block;width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;background:#1D2733}
@media(max-width:720px){html body .bb-intro{grid-template-columns:1fr}html body .bb-sip{width:min(280px,78%);justify-self:center}}
/* ===== The lamps are on, day and night ===== */
html body .bb-lamps i .bb-beam{position:absolute;left:50%;top:18px;width:190px;height:150px;margin-left:-95px;pointer-events:none;background:linear-gradient(180deg,rgba(255,238,178,.6),rgba(255,238,178,.18) 55%,rgba(255,238,178,0));clip-path:polygon(40% 0,60% 0,100% 100%,0 100%);opacity:.8}
html:not([data-theme="light"]) body .bb-lamps i .bb-beam{opacity:1;background:linear-gradient(180deg,rgba(255,236,170,.72),rgba(255,236,170,.22) 55%,rgba(255,236,170,0))}
html[data-theme="light"] body .bb-lamps i::after{box-shadow:0 5px 0 -1px #FFEBB0,0 10px 24px 3px rgba(255,226,140,.42)}
html[data-theme="light"] body .bb-face::after{opacity:.5}
@media(max-width:640px){html body .bb-lamps i .bb-beam{width:130px;height:110px;margin-left:-65px}}
html body .bb-photo img.bb-conf{aspect-ratio:1/1;width:min(100%,330px);object-position:50% 0%}

/* ===== Certificate of study: locked paid option (28 Sep 2026); TRX_CERT_OPEN=true reopens it ===== */
html body .has-lock::before{content:"";display:inline-block;width:.95em;height:.95em;margin-inline-end:.42em;vertical-align:-.12em;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E") no-repeat center/contain}
html body .paid-tag{display:inline-block;margin:6px 0 0;font:700 10.5px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;padding:5px 7px;border-radius:3px;background:var(--trx-tape);color:var(--trx-tape-ink)}
html body .cert-lock-panel{max-width:640px;margin:10px auto;padding:28px 28px 22px;background:var(--card);border:1px solid var(--line);border-radius:4px;text-align:center}
html body .cert-lock-panel h1{font-family:var(--display);font-weight:500;font-size:clamp(24px,3vw,32px);line-height:1.15;margin:14px 0 10px;color:var(--ink)}
html body .cert-lock-panel p{color:var(--ink-soft);max-width:52ch;margin:0 auto 16px;text-wrap:pretty}
html body .cert-lock-panel .cert-actions{display:flex;justify-content:center;gap:10px}
html body .cert-paid-note{font-size:14.5px;color:var(--ink-soft);margin:8px 0 0}

/* ===== The character stands on the board itself, cut out, cropped by the board edge (28 Sep 2026) ===== */
html body section.bb-hero .bb-pic{position:relative;background:none;overflow:hidden;min-height:clamp(260px,40vw,500px)}
html body section.bb-hero .bb-pic::before,html body section.bb-hero .bb-pic::after{display:none}
html body section.bb-hero .bb-figure{position:absolute;bottom:0;left:50%;transform:translateX(-50%);height:100%;width:auto;max-width:none;display:block;filter:drop-shadow(0 12px 18px rgba(16,24,34,.22));pointer-events:none}
html body .an-role{font-size:.6em;letter-spacing:.1em;text-transform:uppercase;opacity:.82;margin-top:3px}
html body .cert-soon{font-weight:700;color:var(--ink);font-size:13.5px;margin:10px 0 0}

/* ===== The moving confident pose fills the board behind the copy (desktop); the still cut-out on phones and for reduced motion ===== */
html body section.bb-hero .bb-face{position:relative;overflow:hidden;isolation:isolate}
html body section.bb-hero .bb-video{position:absolute;right:0;top:-8%;width:112%;height:auto;max-width:none;z-index:0;mix-blend-mode:multiply;pointer-events:none;background:none}
html body section.bb-hero .bb-copy{position:relative;z-index:1}
@media(min-width:760px){html body section.bb-hero .bb-figure{display:none}}
@media(max-width:759px){html body section.bb-hero .bb-video{display:none}}
@media(prefers-reduced-motion:reduce){html body section.bb-hero .bb-video{display:none}html body section.bb-hero .bb-figure{display:block}}
/* the coffee loop by the intro: a clean landscape frame, no tape, no tilt */
html body .bb-intro{grid-template-columns:minmax(0,1fr) minmax(220px,380px)}
html body .bb-sip{transform:none;padding:6px;background:var(--card);border:1px solid var(--line);border-radius:4px;box-shadow:0 18px 30px -22px rgba(16,24,34,.55)}
html body .bb-sip::before,html body .bb-sip::after{display:none}
html body .bb-sip video{aspect-ratio:auto;border-radius:2px}
@media(max-width:720px){html body .bb-sip{width:min(420px,100%)}}
html body section.bb-hero .bb-copy h1{text-wrap:balance}
html:is([lang^="zh"],[lang="ja"],[lang="ko"]) body section.bb-hero .bb-copy h1{word-break:keep-all;overflow-wrap:anywhere}

/* ===== Billboard video: loaded by script only where it shows (>=760px, motion allowed); 1080p for wide or high-density screens, 720p otherwise; the still stays until the video has a frame ===== */
html body section.bb-hero .bb-video{opacity:0;transition:opacity .5s ease}
html body section.bb-hero.bb-live .bb-video{opacity:1}
@media(min-width:760px){html body section.bb-hero .bb-figure{display:block;transition:opacity .3s ease}html body section.bb-hero.bb-live .bb-figure{opacity:0}}
@media(prefers-reduced-motion:reduce){html body section.bb-hero.bb-live .bb-figure{opacity:1}}
/* US & Canada: the character sits centred in his own frame, so his video fills the right-hand panel (like the still), not the whole board */
html body section.bb-hero .bb-pic .bb-video-pic{position:absolute;left:50%;right:auto;top:auto;bottom:0;transform:translateX(-50%);height:100%;width:auto;max-width:none;z-index:0}

/* ===== Anchors land below the sticky header; the newsletter flags itself on arrival (28 Sep 2026) ===== */
html body [id]{scroll-margin-top:96px}
@keyframes trx-target{0%{box-shadow:inset 0 0 0 3px var(--ed,#2B4A70)}100%{box-shadow:inset 0 0 0 3px transparent}}
html body #newsletter:target{animation:trx-target 2.2s ease-out 1}
@media(prefers-reduced-motion:reduce){html body #newsletter:target{animation:none;box-shadow:inset 0 0 0 3px var(--ed,#2B4A70)}}
/* ===== Billboard tape hugs its text (width set by trx-theme.js); lines balanced ===== */
html body section.bb-hero .bb-copy .eyebrow{text-wrap:balance;max-width:100%}
/* ===== High contrast on every edition (the Global edition keeps its own rules) ===== */
html[data-contrast="high"][data-theme="light"]:not([data-edition="global"]) body{--ink:#000000;--ink-soft:#10161D;--muted:#1D2733;--faint:#2A3542;--line:#4A5563;--line-2:#6B7682;--line-3:#8994A0}
html[data-contrast="high"]:not([data-theme="light"]):not([data-edition="global"]) body{--ink:#FFFFFF;--ink-soft:#F4F7FA;--muted:#E3E8EE;--faint:#CCD4DD;--line:#A7B2BD;--line-2:#7D8894;--line-3:#5F6A76}
html[data-contrast="high"]:not([data-edition="global"]) body :is(p,li,td,dd,figcaption) a{text-decoration:underline;text-underline-offset:2px}
html[data-contrast="high"] body .disp-hc{background:var(--ink);color:var(--khaki,#fff);border-color:var(--ink)}

/* ===== Global dateline in the regional layout: brand + tools on row 1, editions + Study Corner on row 2 (28 Sep 2026) ===== */
html body .dateline .wrap.gdl{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:20px;row-gap:8px;height:auto;min-height:0;padding-top:9px;padding-bottom:9px}
html body .gdl-brand{grid-column:1;grid-row:1;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}
html body .gdl-tools{grid-column:2;grid-row:1;display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap}
html body .gdl-tools .disp2{display:flex;align-items:center;gap:8px;margin:0}
html body .gdl-vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html body .gdl-eds{grid-column:1;grid-row:2;display:flex;flex-wrap:wrap;gap:6px 22px;margin:0}
html body .gdl-right{grid-column:2;grid-row:2;justify-self:end}
html body .gdl-eds a,html body .dateline a.gdl-right{font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--ink-soft);padding-bottom:3px;border-bottom:2px solid transparent}
html body .dateline a.gdl-right{color:var(--ed,#2B4A70)}
html body .gdl-eds a[aria-current]{color:var(--ink);border-bottom-color:currentColor}
html body .gdl-eds a:hover,html body .dateline a.gdl-right:hover{color:var(--ink)}
html body .gdl .tbtn,html body .gdl .tbtn.on{background:transparent;color:var(--ink-soft);border:1px solid var(--line);border-radius:3px;padding:4px 10px;font-size:11.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;box-shadow:none}
html body .gdl .tbtn:hover{color:var(--ink);border-color:var(--ink-soft)}
html[data-contrast="high"] body .gdl #gcontrast{background:var(--ink);color:var(--card);border-color:var(--ink)}
html body .gdl .seg,html body .gdl .trx-fs{border:1px solid var(--line);border-radius:3px;background:transparent;box-shadow:none}
@media(max-width:760px){html body .dateline .wrap.gdl{grid-template-columns:minmax(0,1fr)}html body .gdl-tools{grid-column:1;grid-row:2;justify-content:flex-start}html body .gdl-eds{grid-row:3}html body .gdl-right{grid-column:1;grid-row:4;justify-self:start}}
html body .dateline .wrap.gdl>span.gdl-brand{display:block;white-space:normal}
/* Global dateline: flex rows like the regional editions (row 2 spans the full width) */
html body .dateline .wrap.gdl{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;column-gap:20px;row-gap:8px}
html body .dateline .wrap.gdl::before{content:"";order:2;flex-basis:100%;height:0}
html body .dateline .wrap.gdl>.gdl-brand{order:0;flex:0 1 auto}
html body .dateline .wrap.gdl>.gdl-tools{order:1;flex:0 1 auto;margin-left:auto}
html body .dateline .wrap.gdl>.gdl-eds{order:3;flex:1 1 auto}
html body .dateline .wrap.gdl>a.gdl-right{order:4;margin-left:auto}
html[data-theme] body .dateline .gdl .disp2 .tbtn,html[data-theme] body .dateline .gdl .disp2 .tbtn.on{background:transparent;color:var(--ink-soft);border:1px solid var(--line)}
html[data-contrast="high"][data-theme] body .dateline .gdl .disp2 #gcontrast{background:var(--ink);color:var(--card);border-color:var(--ink)}
html body .dateline .gdl .langsel{border-color:var(--ed,#2B4A70);min-width:180px}
@media(max-width:760px){html body .dateline .wrap.gdl>.gdl-tools,html body .dateline .wrap.gdl>a.gdl-right{margin-left:0}}
/* US & Asia characters: anchored to the board's bottom-right, not clipped by the panel; the Asia clip has a white strip under the desk, so it drops by that much */
html body section.bb-hero .bb-face .bb-video.bb-video-side{position:absolute;left:auto;top:auto;right:-18%;bottom:0;width:75%;height:auto;max-width:none;transform:none;z-index:0}

/* US & Canada: he faces right, so he stands on the left and the headline sits on the right (two-column widths only) */
@media(min-width:761px){
html[data-edition="us"] body section.bb-hero .bb-face{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr)}
html[data-edition="us"] body section.bb-hero .bb-pic{grid-column:1;grid-row:1}
html[data-edition="us"] body section.bb-hero .bb-copy{grid-column:2;grid-row:1}
html[data-edition="us"] body section.bb-hero .bb-face .bb-video.bb-video-side{left:-12%;right:auto;width:70%}
}
html body section.bb-hero .bb-video{aspect-ratio:16/9}
/* US clip: from 1s the shot has a grey studio wall and a desk that runs off both edges; fade the sides and top into the board and lift the grey to white */
html[data-edition="us"] body section.bb-hero .bb-face .bb-video.bb-video-side{-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 17%,#000 80%,transparent 99%),linear-gradient(to bottom,transparent 0%,#000 12%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent 0%,#000 17%,#000 80%,transparent 99%),linear-gradient(to bottom,transparent 0%,#000 12%);mask-composite:intersect;filter:brightness(1.05)}
@media(min-width:761px){html[data-edition="us"] body section.bb-hero .bb-face .bb-video.bb-video-side{left:-8%;width:66%}}
/* Asia: she sits centre stage, the headline to her left, the quote to her right, the tape across the top */


/* Asia board, rebalanced: a larger figure, narrower text columns, headline and quote sized to sit whole */

/* US clip v2 (standing, near-white background, no desk): soft side fades only, a hairline top fade */
html[data-edition="us"] body section.bb-hero .bb-face .bb-video.bb-video-side{-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 17%,#000 80%,transparent 99%),linear-gradient(to bottom,transparent 0%,#000 4%);mask-image:linear-gradient(to right,transparent 0%,#000 17%,#000 80%,transparent 99%),linear-gradient(to bottom,transparent 0%,#000 4%)}
@media(min-width:761px){html[data-edition="us"] body section.bb-hero .bb-face .bb-video.bb-video-side{left:-15.7%;width:76%}}
/* Asia clip v2 (standing, warm off-white background, no desk): side fades, lifted toward white, no desk offset; sized so her hair clears the tape */
html[data-edition="asia"] body section.bb-hero .bb-face .bb-video.bb-video-side{-webkit-mask-image:linear-gradient(to right,transparent 0%,#000 17%,#000 80%,transparent 99%),linear-gradient(to bottom,transparent 0%,#000 4%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent 0%,#000 17%,#000 80%,transparent 99%),linear-gradient(to bottom,transparent 0%,#000 4%);mask-composite:intersect;filter:brightness(1.05)}

/* Asia board: text sized by the board's own width and set close to her, like the other editions' scale */



/* Asia board: the same two-column layout and type as the other editions (headline left, 69.6px at 1459px); she stands on the right and her wave points toward the headline */
@media(min-width:761px){html[data-edition="asia"] body section.bb-hero .bb-face .bb-video.bb-video-side{left:auto;right:-16%;width:74%;transform:none}}
/* "Introducing Toto-Rex" above the intro on the US & Canada and Asia editions */
html body .bb-intro .bb-intro-k{margin:0 0 10px;font:700 12.5px/1.2 var(--body);letter-spacing:.16em;text-transform:uppercase;color:var(--ed,var(--ink))}
/* Glossary tape label: brass-on-gold in dark mode was 1.12:1; tape ink instead */
html:not([data-theme="light"]) body .head .eyebrow{color:#2A2410}
/* Global board: the Hawaiian-shirt clip (toy plane held up on the left of the frame). The figure sits on the right so the plane flies clear of the headline; no side fade, so the plane is never dimmed */
@media(min-width:761px){html[data-edition="global"] body section.bb-hero .bb-face .bb-video.bb-video-side,html[data-edition="global"] body section.bb-hero .bb-face .bb-video{left:auto;right:-12%;width:66%;transform:none;-webkit-mask-image:none;mask-image:none}}
@media(min-width:761px){html[data-edition="global"] body section.bb-hero .bb-face .bb-video.bb-video-side,html[data-edition="global"] body section.bb-hero .bb-face .bb-video{top:auto;bottom:-4%;width:70%}}
html[data-edition="global"] body section.bb-hero .bb-face canvas.bb-key,html[data-edition="global"] body section.bb-hero .bb-face .bb-video{mix-blend-mode:multiply}

/* Global character, larger: plane stays ~100px clear of the headline */
@media(min-width:1100px){html[data-edition="global"] body section.bb-hero .bb-face .bb-video.bb-video-side,html[data-edition="global"] body section.bb-hero .bb-face .bb-video,html[data-edition="global"] body section.bb-hero .bb-face canvas.bb-key{width:82%;right:-17%;left:auto;bottom:-9%;top:auto}}
