:root{--bg:#0e0e10;--panel:#191b1e;--paper:#f0eeea;--muted:#b1b0b1;--line:#323438;--red:#c4314b}body{background:var(--bg)}.wrap{width:min(1180px,calc(100% - 80px))}.library-theme .masthead{display:flex;flex-direction:column;gap:12px;padding:32px 0 24px}.library-brand{display:flex;align-items:center;gap:16px;line-height:1}.library-brand img{width:78px;height:78px}.library-brand small{display:block;font:bold 13px Arial;letter-spacing:7px;margin-bottom:8px}.library-brand strong{font:800 43px/.95 BarlowDisplay,Arial}.library-brand strong span{color:var(--red)}.masthead>p{margin:0;color:var(--muted);font-size:12px;letter-spacing:.4px}.library-nav{display:flex;justify-content:center;gap:38px;padding:14px 0}.library-nav>a,.library-nav>button{font:700 12px Arial;color:#d5d3d0}.library-nav button{border:0;background:none;cursor:pointer}.library-nav button span{margin-left:10px}.library-welcome{display:grid;grid-template-columns:1.3fr 1fr;align-items:center;gap:55px;padding:38px 0 36px}.library-welcome h1{font:700 29px/1.15 Arial;letter-spacing:-1px;margin:9px 0 12px}.library-welcome p{font-size:13px;line-height:1.65;color:var(--muted);max-width:500px;margin:0}.eyebrow{font-size:10px;letter-spacing:1.7px}.big-search label{display:block;font-size:12px;margin-bottom:9px;color:#c6c4c2}.big-search>div{display:flex;background:#202226;border:1px solid #4a4b4e}.big-search input{border:0;border-radius:0;padding:15px;flex:1;font-size:14px}.big-search button{border:0;background:var(--red);color:white;width:50px;font-size:24px}.minor-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.minor-heading h2{font:700 18px Arial}.minor-heading>span{font-size:10px;letter-spacing:1.5px;color:#9c9ca1}.topic-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:17px}.topic-tile{display:block;background:var(--panel);border:1px solid var(--line);transition:border-color .2s,transform .2s}.topic-tile:hover{border-color:#b87a86;transform:translateY(-3px);text-decoration:none}.topic-photo{aspect-ratio:16/10;overflow:hidden;background:#222}.topic-photo img{width:100%;height:100%;object-fit:cover}.topic-copy{padding:16px}.topic-count{font-size:9px;letter-spacing:1.3px;color:#c98190}.topic-copy h3{font:700 18px Arial;margin:7px 0}.topic-copy h3 span{float:right;font-size:16px;color:#aaa}.topic-copy p{font-size:12px;line-height:1.5;color:#aaa;margin:0}.selected-topic{border-bottom:3px solid var(--red)}.library-columns{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:48px;margin-top:48px}.feed-heading{display:flex;align-items:end;justify-content:space-between}.feed-heading h2{font:700 32px Arial;letter-spacing:-1px;margin:8px 0 0}.feed-count{font-size:12px;color:#aaa}.format-tabs{display:flex;gap:25px;border-bottom:1px solid var(--line);margin:20px 0 0}.format-tabs button{padding:0 0 13px;border:0;border-bottom:2px solid transparent;background:none;color:#b5b4b3;font-size:12px}.format-tabs button[aria-pressed=true]{color:#fff;border-bottom-color:var(--red)}.feed-story{display:grid;grid-template-columns:240px minmax(0,1fr);gap:24px;padding:26px 0;border-bottom:1px solid var(--line)}.feed-story .card-image img{width:100%;height:auto;aspect-ratio:16/11;margin:0;object-fit:cover}.feed-story h3{font:700 21px/1.25 Arial;letter-spacing:-.4px}.feed-story .eyebrow{font-size:9px;margin:0 0 8px}.feed-story p{font-size:13px;line-height:1.6;margin:10px 0;color:#aaa}.feed-story small{font-size:10px;color:#929397}.fresh-marker{display:inline-block;font-size:9px;font-weight:bold;letter-spacing:1px;background:#51212d;color:#f3c2cc;padding:3px 7px;margin-bottom:9px}.library-sidebar{border-left:1px solid var(--line);padding-left:27px}.side-about h2{font:700 25px Arial;letter-spacing:-.6px;margin:13px 0}.side-about p,.side-invite p{font-size:13px;color:#aaa;line-height:1.8}.side-about a,.side-invite a{font-size:12px;color:#eee;text-decoration:underline;text-underline-offset:5px}.side-index,.side-invite{margin-top:35px;padding-top:25px;border-top:1px solid var(--line)}.topic-index{margin-top:14px}.topic-index a{display:flex;justify-content:space-between;font-size:13px;padding:11px 0;border-bottom:1px solid #292b2f}.topic-index span{font-size:11px;color:#999}.side-invite h2{font:800 32px/1.05 BarlowDisplay;margin-top:14px}.active-topic button{margin-top:18px;background:#27292c;border:1px solid #53545a;padding:7px 12px;color:#ddd;font-size:12px}.newsletter{margin-top:50px;border-top:2px solid #6c303e;gap:70px;padding-block:34px}.newsletter h2{font:700 28px/1.2 Arial;letter-spacing:-.6px}.newsletter p{font-size:13px}.newsletter .button{font-size:12px}footer .library-brand img{width:47px;height:47px}footer .library-brand strong{font-size:27px}footer .library-brand small{font-size:9px;letter-spacing:4px;margin-bottom:5px}footer .footer-note{font-size:12px;color:#b2b2b8}footer small{font-size:10px}.article-header h1{font:700 clamp(31px,4vw,51px)/1.13 Arial;letter-spacing:-1.5px}.article-header .dek{font-size:18px}.article-layout{gap:40px;grid-template-columns:210px minmax(0,900px)}.article-body h2{font:700 29px/1.2 Arial;letter-spacing:-.6px}.article-body h3{font:700 23px/1.2 Arial}.article-layout .reading-panel{background:#e5e5e3;color:#111;border:0}.library-toc summary{font-size:12px;color:#bcbaba;cursor:pointer}.toc a{font-size:12px}.local-dialog{background:#191b1e;color:#f0eeea;border:1px solid #656569;width:min(560px,90vw);padding:28px}.local-dialog::backdrop{background:#000c}.local-dialog h2{font:700 25px Arial}.local-dialog input{width:100%;margin-top:20px}.close{float:right;background:none;color:#eee;border:0;font-size:27px}.results a{display:block;padding:16px 0;border-bottom:1px solid #383a3d;font-size:15px}.local-note{border:1px dashed #888;padding:14px;font-size:12px!important}.related h3{font:700 22px/1.25 Arial}.related .cards{gap:25px}
@media(max-width:1000px){.wrap{width:calc(100% - 40px)}.library-columns{grid-template-columns:minmax(0,1fr) 235px;gap:25px}.feed-story{grid-template-columns:180px minmax(0,1fr);gap:18px}.topic-copy{padding:12px}.topic-copy h3{font-size:16px}.library-nav{gap:25px}.article-layout{grid-template-columns:1fr}.toc{position:static}.library-toc:not([open])>*:not(summary){display:none}}
@media(max-width:700px){.wrap{width:calc(100% - 32px)}.masthead.library-theme{padding:20px 0}.library-theme .masthead{padding:24px 0 20px}.library-brand img{width:58px;height:58px}.library-brand strong{font-size:34px}.library-brand small{font-size:10px;letter-spacing:5px}.library-nav{gap:20px;justify-content:flex-start;flex-wrap:nowrap!important;overflow-x:auto;padding:13px 0}.library-nav>a{white-space:nowrap;font-size:11px}.library-nav>button{display:none}.library-welcome{grid-template-columns:1fr;gap:23px;padding:26px 0}.library-welcome h1{font-size:26px}.library-welcome p{font-size:13px}.minor-heading>span{display:none}.minor-heading h2{font-size:17px}.topic-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.topic-copy{padding:12px}.topic-copy p{font-size:11px}.topic-copy h3{font-size:16px}.topic-count{font-size:8px}.library-columns{grid-template-columns:1fr;margin-top:32px}.library-sidebar{border-left:0;padding:24px;background:var(--panel)}.feed-story{grid-template-columns:115px minmax(0,1fr);gap:15px;padding:22px 0}.feed-story h3{font-size:17px}.feed-story p{font-size:12px}.feed-story .card-image img{aspect-ratio:1/1.15}.feed-story .eyebrow{font-size:8px}.fresh-marker{font-size:8px}.format-tabs{gap:22px}.format-tabs button{font-size:11px}.feed-heading h2{font-size:29px}.newsletter{grid-template-columns:1fr;gap:12px;margin-top:32px}.newsletter h2{font-size:25px}.newsletter small{font-size:10px}footer .library-brand{width:100%;margin-bottom:10px}.article-header h1{font-size:34px}.article-header .dek{font-size:16px}.article-body h2{font-size:26px}.reading-panel{padding:22px}.related .cards{grid-template-columns:1fr}.toc [data-toc]{display:block}.toc a{margin:14px 0}}
@media(prefers-reduced-motion:reduce){.topic-tile{transition:none}}

@media(max-width:700px){.library-nav>button{display:block;white-space:nowrap;font-size:11px;flex-shrink:0}}
@media(max-width:700px){.library-theme .nav-shell .library-nav{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 12px;overflow:visible;text-align:center}.library-nav>a,.library-nav>button{font-size:11px;padding:0}}

/* Native Ghost controls and archive links. */
.search-label{display:block;font-size:12px;margin-bottom:9px;color:#c6c4c2}.big-search .search-launch{display:flex;justify-content:space-between;align-items:center;width:100%;background:#202226;color:#c6c4c2;border:1px solid #4a4b4e;font-size:14px;text-align:left;padding:0}.search-launch>span:first-child{padding:15px}.search-arrow{background:var(--red);color:white;padding:7px 17px;font-size:24px}.format-tabs{justify-content:flex-start}.format-tabs a{padding:0 0 13px;font-size:12px;color:#b5b4b3;border-bottom:2px solid transparent}.format-tabs a[aria-current=page]{color:#fff;border-color:var(--red)}.feed-story h3{font:700 21px/1.25 Arial;letter-spacing:-.4px}.feed-story p{font-size:13px;line-height:1.6}.feed-story small{font-size:10px}.feed-story .eyebrow{font-size:9px;margin-bottom:8px}.library-columns{align-items:start}.library-brand>span{display:block}.archive-library h1{font:700 36px/1.2 Arial;letter-spacing:-1px;text-transform:capitalize}.pagination{display:flex;justify-content:space-between;gap:20px;padding:28px 0;font-size:13px}div.no-image{max-width:100%}.library-toc{width:100%}.library-toc [data-toc]{display:block}.library-toc a{margin:14px 0}.toc a.active-section{color:#efa0af}footer .library-brand{flex-shrink:0}footer .nav-links{flex-wrap:wrap}.library-brand span{margin-left:0}body{font-family:Arial,Helvetica,sans-serif}
@media(max-width:700px){.feed-story h3{font-size:17px}.feed-story p{font-size:12px}.feed-story .eyebrow{font-size:8px}.format-tabs{gap:22px}.format-tabs a{font-size:11px}.library-nav{grid-template-columns:repeat(3,minmax(0,1fr))}.library-brand strong>span{display:inline}.archive-library h1{font-size:30px}}

/* Keep the channel prominent alongside the main categories. */
.library-nav .channel-nav{white-space:nowrap;color:#f0eeea}@media(max-width:700px){.library-nav .channel-nav{grid-column:1 / -1;grid-row:3;padding-top:12px;border-top:1px solid var(--line)}}

/* Brighter article summaries and metadata for comfortable reading. */
.card p,.feed-story p{color:#dedee2}.card small,.feed-story small{color:#bfc0c5}

/* Shared text hierarchy on dark surfaces. Article reading panels retain dark ink. */
:root{--muted:#c4c4ca;--text-secondary:#c4c4ca;--text-meta:#a9a9b0}
.library-welcome h1,.minor-heading h2,.topic-copy h3,.feed-heading h2,.card h3,.side-about h2,.side-invite h2,.newsletter h2,.article-header h1,.listing h1,.archive-library h1,.related h2,.about>h1{color:var(--paper)}
.library-welcome p,.topic-copy p,.card p,.feed-story p,.side-about p,.side-invite p,.newsletter p,.masthead>p,footer .footer-note,.article-header .dek,.listing>.dek,.story-feed>.dek,.eyebrow,.minor-heading>span,.search-label,.big-search label,.format-tabs a,.format-tabs button,.topic-index a,.toc a,.library-toc summary{color:var(--text-secondary)}
.card small,.feed-story small,.feed-count,.topic-count,.topic-index span,.newsletter small,footer small,.byline,.breadcrumb,.feature-photo figcaption{color:var(--text-meta)}
.format-tabs a[aria-current=page],.format-tabs button[aria-pressed=true]{color:var(--paper)}
.reading-panel .eyebrow{color:#505057}

/* Browse formats comfortably on narrow screens; curated handheld reading path. */
.format-tabs{flex-wrap:wrap;gap:14px 24px}.format-tabs a{white-space:nowrap}.handheld-reading{margin-top:32px;padding-top:24px;border-top:1px solid #adb5bd}.handheld-reading h2{font:700 25px/1.2 Arial;margin:10px 0 18px}.handheld-reading ul{list-style:none;padding:0;margin:0}.handheld-reading li{margin:16px 0}.handheld-reading a{color:#86243a;text-decoration:underline;text-underline-offset:3px;font-weight:bold}.handheld-reading li span{display:block;font-size:13px;color:#45454b;margin-top:4px}

/* 2026-09-24 admin: 6 nav links + channel + search share row 3 on phones */
@media(max-width:700px){.library-theme .nav-shell .library-nav .channel-nav{grid-column:1 / 3;grid-row:3}.library-theme .nav-shell .library-nav>button{grid-column:3;grid-row:3;padding-top:12px;border-top:1px solid var(--line);text-align:center}}

/* 2026-09-25 admin: newsletter sign-up (homepage hero + end of article) */
.signup-form>div{display:flex;background:#202226;border:1px solid #4a4b4e}
.signup-form input{border:0;border-radius:0;padding:15px;flex:1;min-width:0;font-size:14px;background:transparent;color:#f0eeea}
.signup-form input::placeholder{color:#9a9998}
.signup-form button{width:auto;padding:0 18px;font:700 13px Arial;white-space:nowrap;cursor:pointer}
.signup-form label{display:block;font-size:12px;margin-bottom:9px;color:#c6c4c2}
.signup-note{margin:8px 0 0;font-size:11px;color:var(--muted)}
.signup-msg{display:none;margin:8px 0 0;font-size:13px}
.signup-form.success .signup-ok{display:block;color:#9fd8a4}.signup-form.error .signup-err{display:block;color:#efa0af}
.signup-form.loading button{opacity:.6}
.article-signup{margin:40px 0 0;padding:26px;background:#17181b;color:#f0eeea;border-left:4px solid var(--red)}
.article-signup .eyebrow{display:block;margin-bottom:10px;color:#c6c4c2}
@media(max-width:700px){.signup-form>div{flex-direction:column}.signup-form button{padding:13px 18px}}
/* 2026-09-25 admin: collapsed phone menu */
.nav-toggle{display:none}
@media(max-width:700px){.nav-toggle{display:flex;justify-content:center;gap:8px;align-items:center;margin:0 auto;padding:13px 0;background:none;border:0;color:#f0eeea;font:700 13px Arial;letter-spacing:.5px;cursor:pointer}.library-theme .nav-shell .library-nav:not(.open){display:none}.library-theme .nav-shell .library-nav.open{padding-bottom:16px}}
/* 2026-09-25 admin: click-to-play video on the feature image */
.feature-photo.has-video{position:relative;cursor:pointer}
.video-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:84px;height:84px;border-radius:50%;border:0;background:var(--red);color:#fff;font-size:30px;padding-left:6px;box-shadow:0 6px 24px rgba(0,0,0,.45);cursor:pointer}
.video-play:hover{transform:translate(-50%,-50%) scale(1.06)}
.feature-photo .video-frame{position:relative;width:100%;max-width:960px;margin-inline:auto;aspect-ratio:16/9}
.feature-photo .video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.article-signup .signup-note,.article-signup label{color:#c6c4c2}
/* 2026-09-25 admin: medium widths - labels never break mid-word; whole items wrap to a second row if needed */
@media(min-width:701px) and (max-width:1100px){.library-theme .nav-shell .library-nav{flex-wrap:wrap;justify-content:center;gap:12px 24px}.library-theme .nav-shell .library-nav>a,.library-theme .nav-shell .library-nav>button{white-space:nowrap;flex-shrink:0}}

/* At a glance, look B (Victor chose it 2026-09-27): tinted card, labels in a left column on desktop.
   Boxes carry the same styling INLINE (article-drafts/site-review-content/at-a-glance/style_b.py) so newsletters match;
   these rules are the fallback, and the desktop grid below is the one thing only the website gets. */
.article-body .atn-glance{margin:28px 0 36px;padding:22px 24px;border:0;border-left:4px solid #c4314b;border-radius:0 8px 8px 0;background:#191b1e;color:#e5e2df}
.article-body .atn-glance .atn-glance-title{margin:0 0 14px;font:700 11px/1 Arial,Helvetica,sans-serif;letter-spacing:1.7px;text-transform:uppercase;color:#f07187}
.article-body .atn-glance dl{margin:0;padding:0;color:#e5e2df}
.article-body .atn-glance dt{float:none;width:auto;text-align:left;margin:12px 0 0;padding:0;font-weight:700;font-size:14px;line-height:1.5;color:#e5e2df}
.article-body .atn-glance dt:first-child{margin-top:0}
.article-body .atn-glance dd{margin:2px 0 0;padding:0;font-size:15px;line-height:1.5;color:#e5e2df}
.article-body .atn-glance :is(ul,ol){margin:0;padding-left:40px}
.article-body .atn-glance li{margin:0 0 4px;font-size:15px;line-height:1.5;color:#e5e2df}
@media(min-width:701px){.article-body .atn-glance dl{display:grid!important;grid-template-columns:120px minmax(0,1fr)!important;gap:12px 20px!important}.article-body .atn-glance dt,.article-body .atn-glance dd{margin:0!important}}
.article-layout>*,.about-grid>*,.article-body{min-width:0}
.article-layout .reading-panel{--atn-panel:#e5e5e3}
/* Wide data tables (handheld test results): cells never wrap, the table scrolls sideways inside the panel, and edge shadows show there is more */
.article-body table.atn-data-table{display:block;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border-collapse:collapse;background:linear-gradient(to right,var(--atn-panel,#dee2e6) 30%,transparent) left center/40px 100% no-repeat local,linear-gradient(to left,var(--atn-panel,#dee2e6) 30%,transparent) right center/40px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,rgba(0,0,0,.28),transparent) left center/14px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,rgba(0,0,0,.28),transparent) right center/14px 100% no-repeat scroll}
.article-body table.atn-data-table :is(th,td){white-space:nowrap;padding:9px 14px;text-align:left;vertical-align:top;border:0;border-bottom:1px solid #adb5bd;background:transparent;font-size:14px}
.article-body table.atn-data-table th{font-weight:700;border-bottom:2px solid #000}
.article-body table.atn-data-table td.num,.article-body table.atn-data-table th.num{text-align:right;font-variant-numeric:tabular-nums}
.article-body table.atn-data-table td.note{white-space:normal;min-width:220px}
/* Email-safe tables (2026-09-27): cell text is wrapped in <span class="atn-cell" style="color:#ffffff"> so it stays white in the dark
   newsletter (Ghost replaces every td style with a dark colour). On the website the span takes the panel text colour. See article-drafts/site-review-content/email_safe_tables.py */
.article-body .atn-cell{color:inherit!important}
/* 2026-09-27 (Victor chose option C): article column 740 -> 900px (edited in place above) and body line-height 1.85 -> 1.7
   (screen.css), so long articles scroll about 17-20% less at 87-95 characters per line. List items match the paragraphs. */
.article-body li{line-height:1.7}
/* 2026-09-27: plain pages (page.hbs) put reading-panel and article-body on ONE element, and a later rule zeroed its padding on
   desktop, so text ran to the panel edge. Posts are unaffected (their panel is a wrapper). Phones keep the 22px rule. */
@media(min-width:701px){.standalone .reading-panel.article-body{padding:40px}}
/* 2026-09-27 (Victor chose option 1): article pages use ONE centered 1200px column for the title block, feature photo/video and the
   reading panel, so every edge lines up under the centered masthead. At 1780px+ the contents list sits in the left margin (sticky);
   from 1001 to 1779px it sits above the panel, collapsed (theme.js opens it only at 1780px+). Phones unchanged. */
@media(min-width:1001px){
.article-header.wrap{width:min(1200px,calc(100% - 80px))}
.article-header.wrap{max-width:none}
.article-header .feature-photo img{max-height:none;height:auto}
.article-header .feature-photo,.article-header .feature-photo img,.article-header .feature-photo .video-frame{width:100%;max-width:100%}
.article-layout.wrap{width:calc(100% - 80px)}
.article-layout{grid-template-columns:minmax(0,1200px);justify-content:center;gap:24px}
.article-layout>.toc{position:static}
}
/* 2026-09-30 (Victor chose "1b"): on laptops (1001-1779px) the title and photo span the full width, and below them the
   contents list sits OPEN on the left, pinned while scrolling, beside the text (up to 1200px wide). 1780px+ keeps the centered
   column with the list in the margin. */
@media(min-width:1001px) and (max-width:1779px){
.article-header.wrap,.article-layout.wrap{width:min(1450px,calc(100% - 80px))}
.article-layout{grid-template-columns:210px minmax(0,1fr);gap:40px;justify-content:stretch}
.article-layout>.toc{grid-column:1;grid-row:1;position:sticky;top:24px;align-self:start;width:210px;max-height:calc(100vh - 48px);overflow:auto}
.article-layout>.reading-panel{grid-column:2;grid-row:1}
}
@media(min-width:1780px){
.article-layout{grid-template-columns:minmax(0,1fr) minmax(0,1200px) minmax(0,1fr);gap:40px;justify-content:stretch}
.article-layout>.toc{grid-column:1;grid-row:1;justify-self:end;width:210px;position:sticky}
.article-layout>.reading-panel{grid-column:2;grid-row:1}
}
/* 2026-09-30 (Victor): dark reading area. No grey panel: the text sits on the page black inside a 1px grey outline
   (#4a4b4e, the site's existing border grey), in the site palette. Applies to every reading panel (articles, pages, About).
   !important because many older panel rules (several palettes, some inline styles such as a black pull quote) must lose. */
:root{--rd-text:#e5e2df;--rd-head:#f0eeea;--rd-muted:#b1b0b1;--rd-link:#f07187;--rd-line:#323438;--rd-card:#191b1e}
.reading-panel,.article-layout .reading-panel,.about .reading-panel{background:transparent!important;border:1px solid #4a4b4e!important;box-shadow:none!important;color:var(--rd-text)!important;--atn-panel:#0e0e10!important}
.reading-panel :is(p,li,td,th,figcaption,strong,em,span,div,.atn-source-note){color:var(--rd-text)!important}
.reading-panel :is(h1,h2,h3,h4){color:var(--rd-head)!important}
.reading-panel a,.reading-panel a *{color:var(--rd-link)!important}
.reading-panel :is(th,td,hr,details,.atn-source-note){border-color:var(--rd-line)!important}
.article-body table.atn-data-table th{border-bottom-color:var(--rd-muted)!important}
.reading-panel .eyebrow{color:var(--rd-muted)!important}
.article-body .atn-glance{background:var(--rd-card)!important;color:var(--rd-text)!important}
.article-body .atn-glance :is(dl,dt,dd,li){color:var(--rd-text)!important}
.article-body .atn-glance .atn-glance-title{color:var(--rd-link)!important}
.reading-panel :is(.sample,.kg-bookmark-card){background:var(--rd-card)!important;color:var(--rd-text)!important;border-color:var(--rd-line)!important}
/* 2026-09-30 (Victor): article titles and summaries break into lines of similar length (no short trailing line). Left edge, font and size unchanged. */
.article-header h1,.article-header .dek{text-wrap:balance}
/* 2026-09-30 (Victor): contents list, red means "you are here". theme.js marks the chapter being read with .is-active. */
.toc summary{color:#f07187!important;font-weight:700}
.toc [data-toc] a{color:#b1b0b1!important}
.toc [data-toc] a:hover{color:#f0eeea!important}
.toc [data-toc] a.is-active{color:#f07187!important;font-weight:700;box-shadow:inset 2px 0 0 #c4314b;padding-left:10px}
/* 2026-09-30 (Victor): safety net. Internal "DRAFT NOTES FOR VICTOR" boxes never show on the website, even if one is published by
   mistake (it happened on the 8BitDo article). They still show in the Ghost editor. Email cannot be covered: delete the box before publishing. */
.atn-draft-note{display:none!important}

/* 2026-10-02 tables: no mid-word splits on phones. .article-body sets overflow-wrap:anywhere, which also shrinks table columns until words split ("Connectivit/y"). break-word only breaks a word that cannot fit at all. Tighter mobile cell padding (!important beats inline padding on older tables). */
.article-body :is(th,td){overflow-wrap:break-word}
@media (max-width:700px){.article-body table :is(th,td){padding:9px 7px!important}}

/* 2026-10-05 Victor: update sections stand out in the table of contents too (matches the red UPDATE heading). */
.toc [data-toc] a[href^="#update-"]{color:#f07187!important}


/* 2026-10-06 Victor: five rabbit-hole tiles (Everyday Tech added). Desktop 5 across; below 1000px two columns with
   Handheld Gaming (the biggest category) full width so no tile sits alone. */
.topic-tiles{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:1000px){.topic-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.topic-tiles>.topic-tile:first-child{grid-column:1/-1}.topic-tiles>.topic-tile:first-child .topic-photo{aspect-ratio:16/8}}

/* 2026-10-06 Victor, option 2: colour by FORMAT (FullCleared's idea, restrained). Small square + label only; red
   stays the brand/action colour. All four pass 4.5:1 on the dark cards. */
.fmt-news{--fmt:#6a9fd8}.fmt-first-impressions{--fmt:#d9a441}.fmt-reviews{--fmt:#4fb3a9}.fmt-perspectives{--fmt:#a08ad8}.fmt-guides{--fmt:#7fb069}
.eyebrow:is(.fmt-news,.fmt-first-impressions,.fmt-reviews,.fmt-perspectives,.fmt-guides){color:var(--fmt);font-weight:700}
:is(.eyebrow,.format-tabs a):is(.fmt-news,.fmt-first-impressions,.fmt-reviews,.fmt-perspectives,.fmt-guides)::before{content:"";display:inline-block;width:7px;height:7px;background:var(--fmt);margin-right:7px}

/* 2026-10-06 Victor: Ghost bookmark (link) cards were a white box with near-white text on this dark theme. */
.article-body .kg-bookmark-container{background:#191b1e!important;border:1px solid #353538!important;color:#f3eee8!important;text-decoration:none!important}
.article-body .kg-bookmark-title{color:#f3eee8!important;font-weight:700}
.article-body .kg-bookmark-description{color:#c4c4ca!important}
.article-body .kg-bookmark-metadata,.article-body .kg-bookmark-author,.article-body .kg-bookmark-publisher{color:#c98190!important}
.article-body .kg-bookmark-container:hover{border-color:#b87a86!important}
.article-body .kg-bookmark-card{border:0!important;box-shadow:none!important}

/* 2026-10-06 Victor: About page chapter headings in the brand red (same red as the UPDATE headings). */
.about .reading-panel h2{color:#c4314b!important}

/* 2026-10-10 Victor: sectioned homepage (partials/home-sections.hbs). Laptop: up to 12 per section; phones: 6. */
.m-lead{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:22px;margin:24px 0 44px}
.m-lead img,.m-mid img,.m-row img{display:block;width:100%;object-fit:cover;background:#222}
.m-lead a,.m-sections a.m-row,.m-sections a.m-mid{text-decoration:none;color:inherit}
.m-big img{aspect-ratio:16/9}.m-big>div{padding-top:14px}.m-big h3{font:700 27px/1.2 Arial;letter-spacing:-.5px;margin:6px 0 10px}
.m-big p{font-size:14px;line-height:1.6;color:#b1b0b1;margin:0 0 10px}.m-lead small,.m-sections small{font-size:10px;color:#929397}
.m-sides{display:grid;gap:20px;align-content:start}.m-side img{aspect-ratio:16/9}.m-side>div{padding-top:9px}.m-side h4{font:700 16px/1.3 Arial;margin:5px 0 6px}
.m-sections{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
.m-head{border-top:3px solid var(--bar);padding-top:12px;margin-bottom:18px}.m-head h2{font:700 20px Arial;margin:0 0 4px}.m-head span{font-size:9px;letter-spacing:1.4px;color:#9c9ca1}
.m-mid{display:block;margin-bottom:18px}.m-mid img{aspect-ratio:16/9;margin-bottom:10px}.m-mid h4{font:700 18px/1.3 Arial;margin:6px 0 8px}.m-mid p{font-size:13px;line-height:1.55;color:#aaa;margin:0 0 8px}
.m-row{display:grid;grid-template-columns:104px minmax(0,1fr);gap:14px;padding:13px 0;border-top:1px solid var(--line);align-items:center}
.m-row img{aspect-ratio:16/10}.m-row h5{font:700 14px/1.35 Arial;margin:4px 0 5px;color:#f0eeea}.m-news h5{margin-top:0}
.m-news-list>.m-row:nth-child(-n+2){display:none}
.m-more{margin:14px 0 0;font-size:12px}.m-more a{text-decoration:underline;text-underline-offset:5px}
@media(max-width:700px){.m-lead,.m-sections{grid-template-columns:1fr}.m-lead{gap:0;margin:18px 0 32px}.m-big h3{font-size:22px}.m-big p{display:none}.m-big{margin-bottom:6px}
.m-sections{gap:30px}.m-row{grid-template-columns:92px minmax(0,1fr)}
.m-side,.m-mid{display:grid;grid-template-columns:92px minmax(0,1fr);gap:14px;align-items:center;padding:13px 0;border-top:1px solid var(--line);margin:0}
.m-side img,.m-mid img{aspect-ratio:16/10;margin:0;grid-row:1/4}.m-side>div{padding-top:0}.m-sides{gap:0}.m-mid p{display:none}.m-mid h4,.m-side h4{font-size:14px;margin:4px 0}
.m-desk>a:nth-of-type(n+7){display:none}.m-news-list>.m-row:nth-child(n+9){display:none}}

/* 2026-10-10 Victor: "Up next" card at the end of articles (partials/up-next.hbs via handheld-reading.hbs). */
.up-next{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);margin:44px 0 10px;background:#191b1e;border:1px solid #323438;border-top:3px solid #c4314b;text-decoration:none!important;color:inherit}
.up-next img{width:100%;height:100%;min-height:220px;object-fit:cover;display:block}
.up-next .u-copy{padding:26px 28px;display:flex;flex-direction:column;justify-content:center}
.up-next .u-kicker{font-size:11px;letter-spacing:2px;font-weight:700;color:#f07187;margin-bottom:10px}
.up-next h3{font:700 24px/1.25 Arial;margin:8px 0 10px;color:#f0eeea}.up-next p{font-size:14px;line-height:1.55;color:#b1b0b1;margin:0 0 16px}
.up-next .u-go{font-size:13px;font-weight:700;color:#f0eeea}.up-next:hover{border-color:#b87a86}
.handheld-reading:not(:has(li)){display:none}
@media(max-width:700px){.up-next{grid-template-columns:1fr}.up-next img{min-height:0;aspect-ratio:16/9}.up-next .u-copy{padding:18px}.up-next h3{font-size:20px}}
/* 2026-10-10 Victor: homepage uses the window width (up to 1920px); articles keep their reading width. */
@media(min-width:701px){.home-template .wrap{width:min(1920px,calc(100% - 80px))}.home-template .library-columns{grid-template-columns:minmax(0,1fr) 300px}}

/* 2026-10-10 Victor: All articles page (page-all-articles.hbs). 5 per row by default, 4 and 3 as the window narrows, 2 on phones. */
@media(min-width:701px){.page-all-articles .wrap{width:min(1920px,calc(100% - 80px))}.page-all-articles .library-columns{grid-template-columns:minmax(0,1fr) 300px}}
.a-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:26px 22px;margin-top:8px}
@media(max-width:1599px){.a-list{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1249px){.a-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.a-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}}
.a-month{grid-column:1/-1;display:flex;justify-content:space-between;align-items:baseline;font:700 20px Arial;margin:20px 0 0;padding-top:12px;border-top:3px solid #c4314b}
.a-month span{font-size:11px;letter-spacing:1px;color:#9c9ca1;font-weight:400}
.a-card{display:block;background:#191b1e;border:1px solid #323438;text-decoration:none!important;color:inherit;transition:border-color .2s,transform .2s}
.a-card:hover{border-color:#b87a86;transform:translateY(-3px)}
.a-card img,.a-noimg{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#222}.a-card>div{padding:12px 14px 14px}
.a-card h5{font:700 15px/1.3 Arial;margin:6px 0 8px;color:#f0eeea}.a-card small{font-size:10px;color:#929397}
@media(max-width:700px){.a-card>div{padding:9px 10px 11px}.a-card h5{font-size:13px}}
@media(prefers-reduced-motion:reduce){.a-card{transition:none}}

/* 2026-10-10 Victor: category pages as square picture cards (same 5/4/3/2 grid and wide width as All articles); 20 per page. */
@media(min-width:701px){.tag-template .wrap{width:min(1920px,calc(100% - 80px))}.tag-template .library-columns{grid-template-columns:minmax(0,1fr) 300px}}
.tag-template .feed-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:26px 22px;margin-top:26px}
@media(max-width:1599px){.tag-template .feed-list{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1249px){.tag-template .feed-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){.tag-template .feed-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 12px}}
.tag-template .feed-story{display:block!important;padding:0!important;background:#191b1e;border:1px solid #323438!important;transition:border-color .2s,transform .2s}
.tag-template .feed-story:hover{border-color:#b87a86!important;transform:translateY(-3px)}
.tag-template .feed-story .card-image img{aspect-ratio:4/3!important;width:100%;margin:0}
.tag-template .feed-copy{padding:12px 14px 14px}.tag-template .feed-story p{display:none}
.tag-template .feed-story h3{font:700 15px/1.3 Arial!important;margin:6px 0 8px}
@media(max-width:700px){.tag-template .feed-copy{padding:9px 10px 11px}.tag-template .feed-story h3{font-size:13px!important}}
.tag-template .feed-story .card-image{display:block}
@media(prefers-reduced-motion:reduce){.tag-template .feed-story{transition:none}}

/* 2026-10-10 Victor: header with the logo on the left (bigger badge + wordmark + tagline) and the menu on the same row,
   right-aligned, full width on every page. Below 1400px the menu sits on its own row under the logo. Phones unchanged. */
.brand-tag{display:none}
@media(min-width:701px){
.library-theme .site-head{width:min(1920px,calc(100% - 80px));margin:0 auto;border-bottom:1px solid var(--line)}
.library-theme .site-head .masthead{width:auto!important;margin:0!important;flex-direction:row!important;align-items:center!important;padding:24px 0 18px!important}
.library-theme .site-head .masthead>p{display:none}
.library-theme .site-head .library-brand{gap:20px}
.library-theme .site-head .library-brand img{width:100px;height:100px}
.library-theme .site-head .library-brand small{font-size:16px;letter-spacing:8px;margin-bottom:9px}
.library-theme .site-head .library-brand strong{font-size:56px}
.library-theme .site-head .brand-tag{display:block;font:normal 13px/1.2 Arial;letter-spacing:.4px;color:var(--muted);margin-top:9px}
.library-theme .site-head .nav-shell{border:0}
.library-theme .site-head .nav-shell .library-nav{width:auto!important;margin:0!important;padding:0 0 18px!important;justify-content:flex-start!important;flex-wrap:wrap!important;gap:10px 24px!important}
.library-theme .site-head .library-nav>a,.library-theme .site-head .library-nav>button{white-space:nowrap}}
@media(min-width:1400px){
.library-theme .site-head{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;column-gap:32px}
.library-theme .site-head .nav-shell .library-nav{justify-content:flex-end!important;flex-wrap:nowrap!important;padding:0!important;gap:26px!important}}