@font-face { font-family:Anton; src:url('/fonts/anton/Anton-Regular.woff') format('woff'), url('/fonts/anton/Anton-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; font-display:block; }
:root { --ink:#171715; --paper:#f2ebdb; --muted:#b6b2a8; --red:#ed503b; --line:#3c3b34; --panel:#22221e; --focus-ring:#ff2a1f; --control-border:#777368; --ink-hover:#35352e; --bs-body-color:var(--paper); --bs-body-bg:var(--ink); }
* { box-sizing:border-box; }
.page-text-override { white-space:pre-line; overflow-wrap:anywhere; }
.membership-steps { display:flex; flex-wrap:wrap; gap:8px 24px; margin:24px 0; padding:16px 0 16px 24px; border-block:1px solid var(--line); font-size:.85rem; color:var(--muted); }
.membership-steps li { padding-right:16px; }
.membership-steps [aria-current="step"] { color:var(--paper); font-weight:700; }
html { font-size:16px; }
/* Nothing may widen the page sideways on phones (iPhone Safari zooms the whole page out if anything pokes past the edge).
   clip, not hidden, so sticky headers keep working. */
html, body { overflow-x:clip; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:Arial,Helvetica,sans-serif; line-height:1.65; }
.container { max-width:1320px; padding-left:36px; padding-right:36px; }
a { color:var(--paper); text-underline-offset:5px; }
a:hover { color:var(--red); }
img { max-width:100%; height:auto; display:block; }
h1,h2,h3,.brand,.cover-wordmark { font-family:Anton,Impact,"Arial Narrow",sans-serif; font-weight:400; line-height:1.08; letter-spacing:-.015em; }
h1 { font-size:clamp(2.8rem,6.4vw,6rem); overflow-wrap:anywhere; }
h2 { font-size:clamp(2.2rem,4.2vw,4rem); }
h3 { font-size:clamp(2rem,4vw,3.8rem); }
p { max-width:70ch; }
.red-word { color:var(--red); }
.eyebrow { text-transform:uppercase; letter-spacing:.15em; font-size:.7rem; font-weight:800; margin-bottom:24px; }
.muted,.text-secondary { color:var(--muted)!important; }
.text-danger { color:#ff9e90!important; }
:focus-visible { outline:3px solid var(--focus-ring)!important; outline-offset:5px; box-shadow:none!important; }
/* The page's main area takes focus from the "skip to content" link and from clicks, then drew a big red box when a key was pressed (Gary, Nov 5). It is a landing spot, not a control: no ring. */
#main-content:focus, #main-content:focus-visible { outline:none!important; }
.skip-link { position:absolute; left:16px; top:-100px; z-index:100; background:var(--paper); color:var(--ink); padding:12px; }
.skip-link:focus { top:12px; }
.site-header { border-bottom:1px solid var(--line); }
.site-header .navbar { padding-top:24px; padding-bottom:24px; gap:32px; }
.brand { color:var(--paper); text-decoration:none; font-size:1.6rem; line-height:.88; letter-spacing:-.03em; }
.navbar-brand > span { display:block; }
.brand-star { color:var(--red); padding-left:5px; }
.primary-links,.account-links { display:flex; gap:28px; align-items:center; font-size:.82rem; font-weight:700; }
.primary-links a:not(.btn),.account-links a:not(.btn) { display:inline-flex; align-items:center; min-width:44px; min-height:44px; text-decoration:none; padding:10px 0; }
.site-header .navbar-toggler { min-width:44px; min-height:44px; }
.navbar-collapse { justify-content:space-between; gap:20px; }
.account-links { gap:20px; margin-left:auto; }
.account-links form { margin:0; }
.btn { border-radius:0; font-size:.85rem; font-weight:700; padding:14px 22px; min-height:46px; transition:background-color .15s,color .15s; white-space:normal; }
.btn span { margin-left:16px; }
.btn-primary { --bs-btn-bg:var(--red); --bs-btn-border-color:var(--red); --bs-btn-color:#171715; --bs-btn-hover-bg:#ff755e; --bs-btn-hover-border-color:#ff755e; --bs-btn-hover-color:#171715; --bs-btn-active-bg:#ff755e; --bs-btn-active-border-color:#ff755e; --bs-btn-active-color:#171715; }
.btn-outline-primary { --bs-btn-color:var(--paper); --bs-btn-border-color:var(--control-border); --bs-btn-hover-bg:var(--paper); --bs-btn-hover-color:var(--ink); --bs-btn-hover-border-color:var(--paper); }
.btn-link { color:var(--paper); }
.btn-sm { padding:10px 16px; }
.btn-cream { background:var(--paper); color:var(--ink); border-color:var(--paper); }
.btn-cream:hover { background:white; color:var(--ink); }
.text-link { text-decoration:none; font-size:.85rem; font-weight:700; border-bottom:1px solid var(--control-border); padding:10px 0; display:inline-block; min-width:44px; min-height:44px; }
.button-row { display:flex; align-items:center; flex-wrap:wrap; gap:24px; }
.page-main { min-height:65vh; padding-top:40px; padding-bottom:80px; }
.home-hero { display:grid; grid-template-columns:1.02fr 1fr; gap:36px; align-items:center; padding:28px 0 64px; }
.home-hero h1 { font-size:clamp(3.2rem,5.8vw,5.4rem); }
.hero-intro { max-width:440px; color:var(--muted); margin:26px 0; font-size:1rem; }
.small-star { color:var(--red); font-size:1.2rem; margin-right:8px; }
.hero-footnote { font-family:monospace; font-size:.67rem; color:var(--muted); margin:28px 0 0; }
.hero-art { margin:0; transform:rotate(2deg); border:1px solid #6a4535; background:#10100f; box-shadow:14px 16px 0 #22211d; }
.hero-art img { width:100%; aspect-ratio:1.16; object-fit:cover; object-position:57% center; }
.hero-art figcaption { display:flex; justify-content:space-between; gap:12px; font-family:monospace; font-size:.55rem; letter-spacing:.04em; padding:14px; color:#d6c3a5; }
.manifesto-strip { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; border-block:1px solid #686358; padding:19px 0; font-size:clamp(.75rem,1.4vw,1.2rem); font-weight:900; letter-spacing:.08em; }
.manifesto-strip b { color:var(--red); }
.home-section { padding:72px 0; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:24px; margin-bottom:36px; }
.section-heading .eyebrow { color:var(--muted); margin-bottom:18px; }
.editorial-grid { display:grid; grid-template-columns:1fr 1fr; gap:70px; align-items:center; }
.poster-feature { display:block; text-decoration:none; background:#111; }
.poster-feature img { width:100%; max-height:590px; object-fit:contain; }
.poster-caption { display:flex; justify-content:space-between; padding:16px 20px; font-size:.65rem; font-weight:700; letter-spacing:.13em; border:1px solid var(--line); }
.editorial-copy > p:not(.eyebrow) { color:var(--muted); max-width:440px; margin:24px 0; }
.editorial-copy h3 { font-size:clamp(3rem,5vw,5rem); }
.editorial-note { display:flex; align-items:center; gap:22px; margin-top:48px; padding-top:24px; border-top:1px solid var(--line); }
.editorial-note > span { font-size:3rem; color:var(--red); }
.editorial-note p { font-size:.77rem; color:var(--muted); margin:0; }
.membership-banner { padding:44px; background:#c13929; color:var(--paper); display:flex; gap:36px; justify-content:space-between; align-items:center; }
.membership-banner h2 { font-size:clamp(2rem,3.5vw,3.3rem); }
.membership-banner .small { font-size:.72rem; margin-top:20px; }
.membership-banner a:hover { color:var(--ink); }
.site-footer { border-top:1px solid var(--line); background:#121310; }
.footer-top,.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap; }
.footer-top { padding-top:36px; padding-bottom:32px; }
.footer-top p { margin:0; font-size:.8rem; color:var(--muted); }
.footer-bottom { border-top:1px solid var(--line); padding-top:22px; padding-bottom:28px; color:var(--muted); font-size:.65rem; }
.footer-bottom nav { display:flex; gap:24px; }
.footer-bottom a { display:inline-flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:8px; text-decoration:none; }
.site-footer .brand { display:inline-flex; align-items:center; min-height:44px; }
.page-heading { padding:24px 0 40px; }
.page-heading .lead { color:var(--muted); margin-top:24px; font-size:1.1rem; }
.membership-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:48px; align-items:start; }
.membership-panel { background:var(--panel); border:1px solid var(--line); padding:36px; }
.membership-story img { margin-bottom:32px; }
.membership-story p { color:var(--muted); margin-top:24px; }
.benefit-list { list-style:none; padding:0; margin:30px 0; }
.benefit-list li { border-top:1px solid var(--line); padding:16px 0; }
.benefit-list li::before { content:"✦"; color:var(--red); margin-right:12px; }
.faq-section { max-width:850px; margin:80px auto 0; }
.faq-section h2 { margin-bottom:32px; }
details { border-top:1px solid var(--line); padding:18px 0; }
summary { cursor:pointer; font-weight:700; padding:6px 0; }
details p { color:var(--muted); padding:18px 0 0; margin:0; }
.art-print { width:100%; }
.art-credit, .fringe-print figcaption { font-size:.75rem; color:var(--muted); margin-top:12px; }
.fringe-print { margin:36px 0 0; max-width:280px; }
.form-control,.form-select { border-radius:0; background-color:#24251f; border-color:var(--control-border); color:var(--paper); padding:13px; }
.form-select { padding-right:40px; --bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23f2ebdb' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
.form-control:focus,.form-select:focus { background-color:#292a24; color:var(--paper); border-color:var(--focus-ring); }
.form-control::placeholder { color:#b6b2a8; }
.form-control:disabled { background:#33342e; color:#c5c0b5; }
#upload .form-text { color:var(--muted); }
#upload input[type="file"]::file-selector-button { background:var(--paper); color:var(--ink); }
.form-floating > label { color:#d2cbbc; }
.catalog-search { max-width:760px; margin-bottom:40px; }
.catalog-search label { display:block; font-size:.8rem; font-weight:700; margin-bottom:10px; }
.search-row { display:flex; gap:10px; }
.catalog-heading { display:flex; justify-content:space-between; gap:20px; border-top:1px solid var(--line); padding:24px 0; }
.catalog-heading > span { color:var(--muted); font-size:.75rem; }
.empty-catalog { border:1px solid var(--line); padding:64px 24px; text-align:center; background:var(--panel); }
.empty-catalog p { margin:20px auto; color:var(--muted); }
.empty-catalog h2 { font-size:clamp(2rem,4vw,3rem); }
.empty-symbol { font-size:3rem; color:var(--red); display:block; margin-bottom:24px; }
.video-card { border:1px solid var(--line); height:100%; background:var(--panel); }
.video-cover { display:block; position:relative; aspect-ratio:16/9; background:repeating-linear-gradient(-40deg,transparent,transparent 14px,#ffffff05 14px,#ffffff05 15px),#32241f; color:#d0b18b; padding:24px; text-decoration:none; overflow:hidden; }
.cover-wordmark { font-size:3rem; transform:rotate(-6deg); display:block; }
.play-symbol { position:absolute; right:24px; top:24px; font-size:2rem; }
.cover-caption { position:absolute; bottom:16px; left:24px; font-size:.55rem; letter-spacing:.14em; }
.video-card-body { padding:24px; }
.video-card h2 { margin:18px 0; line-height:1.2; overflow-wrap:anywhere; }
.video-card h2 a { text-decoration:none; }
.access-badge { color:#ffc875; border:1px solid #716047; padding:5px 9px; text-transform:uppercase; font-size:.62rem; letter-spacing:.08em; }
.catalog-pagination { display:flex; gap:18px; margin-top:32px; }
.card { background:var(--panel); color:var(--paper); border-color:var(--line); }
.table { color:var(--paper); border-color:var(--line); }
.nav-pills .nav-link.active { background:#bd3929; color:white; }
.nav-link { color:var(--paper); }
.stream-player { width:100%; aspect-ratio:16/9; border:0; }
.description { white-space:pre-wrap; }
progress { width:100%; }
#watch { background:#10110e; padding:24px; border:1px solid var(--line); }
@media(min-width:1500px) { .home-hero h1 { font-size:5.5rem; } }
@media(max-width:1100px) { .primary-links { gap:18px; } .account-links { gap:14px; } .site-header .navbar { gap:24px; } .editorial-grid { gap:36px; } .home-hero { gap:24px; } .hero-art figcaption span:last-child { display:none; } .home-hero h1 { font-size:4.2rem; } }
@media(max-width:900px) { .site-header .navbar { align-items:start; } .navbar-collapse { flex-wrap:wrap; } .account-links { margin-left:0; } .home-hero h1 { font-size:3.5rem; } .membership-banner { flex-direction:column; align-items:start; } }
@media(max-width:767px) { .container { padding-left:22px; padding-right:22px; } .site-header .navbar { padding-top:20px; padding-bottom:20px; align-items:center; } .primary-links { align-items:stretch; flex-direction:column; gap:0; padding:20px 0; } .account-links { padding-bottom:10px; flex-wrap:wrap; } .home-hero { grid-template-columns:1fr; padding-top:0; gap:40px; } .home-hero h1 { font-size:clamp(2.7rem,10.5vw,4.5rem); } .hero-art { transform:none; box-shadow:8px 8px 0 #22211d; } .hero-art img { aspect-ratio:16/10; } .hero-art figcaption span:last-child { display:block; } .manifesto-strip { gap:10px; font-size:.64rem; letter-spacing:0; } .editorial-grid,.membership-grid { grid-template-columns:1fr; gap:32px; } .section-heading { align-items:start; flex-direction:column; } .home-section { padding:48px 0; } .membership-banner,.membership-panel { padding:26px; } .membership-banner h2 { font-size:2.1rem; } .page-main { padding-top:28px; padding-bottom:48px; } .page-heading { padding-top:10px; } .footer-top { align-items:start; flex-direction:column; } .faq-section { margin-top:48px; } .search-row .btn { padding:12px; } .catalog-heading { flex-wrap:wrap; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none!important; animation:none!important; scroll-behavior:auto!important; } }
.catalog-image { width: 100%; height: auto; object-fit: contain; }
.generic-cover { aspect-ratio: 16/9; background: #171717; color: #fff; display: grid; place-items: center; font-family: Anton, sans-serif; font-size: 2rem; }
.video-cover { padding: 0; }
.video-cover .catalog-image { width: 100%; height: 100%; object-fit: contain; }
/* Documentary editorial: the existing ink, paper and red palette, with a quieter reading rhythm. */
h1,h2,h3 { text-wrap:balance; }
h2 { font-size:clamp(1.9rem,3.4vw,3rem); }
h3 { font-size:clamp(1.6rem,2.5vw,2.2rem); }
.eyebrow,.section-kicker { font-family:Arial,Helvetica,sans-serif; font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin:0 0 16px; }
.edition-line { display:flex; justify-content:space-between; gap:16px; border-bottom:1px solid var(--line); padding:0 0 16px; font-size:.68rem; letter-spacing:.08em; }
.edition-line span:first-child { color:var(--red); font-weight:700; }
.story-lead { display:grid; grid-template-columns:1.35fr 1fr; gap:40px; align-items:center; padding:36px 0 56px; }
.story-lead > * { min-width:0; }
.lead-image { display:block; background:#10110e; }
.lead-image .catalog-image { width:100%; aspect-ratio:16/9; object-fit:contain; }
.lead-image .generic-cover { font-size:clamp(1.5rem,3vw,3rem); padding:24px; }
.lead-copy h1 { font-size:clamp(2.3rem,4vw,4.2rem); line-height:1.12; margin:0 0 24px; overflow-wrap:anywhere; }
.lead-copy h1 a { text-decoration:none; }
.story-deck { font-size:1.05rem; line-height:1.75; color:var(--paper); margin-bottom:22px; overflow-wrap:anywhere; }
.story-access { font-size:.75rem; color:var(--muted); margin:16px 0 22px; }
.opening-statement { grid-template-columns:1fr 1.2fr; }
.opening-art { margin:0; }
.opening-art img { width:100%; }
figcaption { color:var(--muted); font-size:.72rem; margin-top:12px; }
.home-section { padding:48px 0; border-top:1px solid var(--line); }
.section-heading { margin-bottom:28px; flex-wrap:wrap; }
.section-heading h2 { margin:0; min-width:0; overflow-wrap:anywhere; }
.catalog-note { color:var(--muted); max-width:60ch; }
.video-card { border:0; background:transparent; }
.video-card-body { padding:18px 0 10px; }
.video-card-body > p { font-size:.75rem; margin-bottom:8px; color:var(--muted); }
.video-card-body a { display:inline-flex; align-items:center; min-width:44px; min-height:44px; max-width:100%; overflow-wrap:anywhere; }
.video-card h2 { font-size:1.55rem; line-height:1.2; margin:12px 0 16px; }
.access-badge { border:0; border-left:2px solid var(--red); padding:0 0 0 9px; color:var(--paper); letter-spacing:.03em; }
.archive-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:36px; }
.archive-story { min-width:0; }
.archive-story > a { text-decoration:none; }
.archive-story .catalog-image { aspect-ratio:16/9; object-fit:contain; }
.archive-story .section-kicker { margin-top:18px; }
.archive-story h3 { overflow-wrap:anywhere; }
.archive-story > p { color:var(--muted); font-size:.9rem; overflow-wrap:anywhere; }
.gonzo-introduction { display:grid; grid-template-columns:.8fr 1.2fr; gap:70px; align-items:center; }
.gonzo-introduction > * { min-width:0; }
.gonzo-introduction h2 { overflow-wrap:anywhere; margin:0; }
.gonzo-introduction blockquote { margin:24px 0 16px; }
.gonzo-introduction figure { margin:0; }
.gonzo-introduction img { width:100%; max-height:520px; object-fit:contain; }
.gonzo-introduction > div > p:not(.section-kicker) { max-width:60ch; color:var(--muted); }
blockquote { font-family:Georgia,"Times New Roman",serif; font-size:clamp(1.25rem,2.1vw,1.8rem); line-height:1.55; margin:28px 0; }
blockquote cite { display:block; font-family:Arial,Helvetica,sans-serif; font-size:.75rem; font-style:normal; color:var(--muted); margin-top:16px; }
.membership-banner { --focus-ring:var(--ink); background:var(--paper); color:var(--ink); border-top:5px solid var(--red); padding:40px; }
.membership-banner > div { min-width:0; max-width:100%; }
.membership-banner h2,.membership-banner p { overflow-wrap:anywhere; }
.membership-banner h2 { margin:0 0 16px; }
.membership-banner p { margin-bottom:0; }
.membership-banner .small { font-size:.85rem; line-height:1.6; margin-top:16px; }
.membership-banner a:not(.btn):hover { text-decoration-thickness:2px; }
.membership-banner ::selection { background:var(--ink); color:var(--paper); }
.membership-banner .section-kicker { color:#54534b; }
.membership-banner .btn-cream { background:var(--ink); color:var(--paper); border-color:var(--ink); }
.membership-banner a:not(.btn) { display:inline-flex; align-items:center; min-width:44px; min-height:44px; color:var(--ink); }
.membership-banner .btn:hover { background:var(--ink-hover); color:var(--paper); }
.membership-panel { background:transparent; border:0; border-top:3px solid var(--red); padding:28px 0; }
.membership-panel h2 { font-size:2rem; }
.benefit-list li::before { content:none; }
.faq-section { margin-left:0; }
.reporting-notes { border-top:1px solid var(--line); padding-top:48px; margin-top:56px; }
.reporting-grid { display:grid; grid-template-columns:1fr 1fr; gap:48px; margin:32px 0; }
.reporting-grid p { color:var(--muted); }
.site-header .navbar { padding-top:20px; padding-bottom:20px; }
.footer-bottom nav { flex-wrap:wrap; gap:8px 16px; font-size:.875rem; }
@media(max-width:1000px) {
    .story-lead { gap:28px; grid-template-columns:1fr 1fr; }
    .archive-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .gonzo-introduction { gap:36px; }
}
@media(max-width:767px) {
    .story-lead,.gonzo-introduction,.reporting-grid { grid-template-columns:minmax(0,1fr); gap:28px; }
    .story-lead { padding:28px 0 36px; }
    .story-lead h1 { font-size:clamp(2rem,8vw,3.2rem); }
    .edition-line { flex-wrap:wrap; font-size:.62rem; gap:6px; }
    .opening-statement .opening-art { grid-row:1; }
    .home-section { padding:32px 0; }
    .latest-section .row { --bs-gutter-x:min(1.5rem,44px); }
    .section-heading { flex-direction:row; align-items:center; gap:16px; }
    .section-heading h2 { font-size:1.9rem; }
    .section-heading .text-link { flex-shrink:0; }
    .archive-grid { grid-template-columns:minmax(0,1fr); gap:28px; }
    .gonzo-introduction figure { max-width:360px; margin-inline:auto; }
    .membership-banner { padding:28px 22px; }
    .page-heading h1 { font-size:clamp(2.4rem,10vw,4rem); }
    .reporting-notes { margin-top:36px; padding-top:32px; }
}
.about-grid { align-items:start; grid-template-columns:minmax(0,1fr); gap:32px; }
.page-main.store-main { min-height:0; padding-block:48px; }
.store-heading { max-width:70ch; padding:0; overflow-wrap:anywhere; }
.store-heading h1 { font-size:clamp(2.4rem,4vw,4rem); text-wrap:balance; margin:0 0 24px; }
.store-heading .lead { margin:0 0 24px; }
.store-heading #store-handoff { margin:0 0 8px; }
.store-heading .btn { max-width:100%; }
@media(max-width:767px) {
    .page-main.store-main { padding-block:32px; }
    .store-heading h1 { font-size:2.2rem; }
}
.about-grid > * { min-width:0; overflow-wrap:anywhere; }
.about-grid .about-poster { width:100%; max-width:36rem; margin:0 auto; }
.about-heading h1,.about-copy h2,.about-reporting h2,.about-reporting h3 { text-wrap:balance; }
.about-reporting h2 { font-size:clamp(1.9rem,3.4vw,3rem); margin:0; }
.about-reporting .reporting-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.about-reporting article { min-width:0; overflow-wrap:anywhere; }
.about-reporting h3 { font-size:clamp(1.6rem,2.5vw,2.2rem); line-height:1.2; margin:0 0 8px; }
.about-reporting .reporting-location { font-size:.875rem; font-weight:700; margin-bottom:16px; }
.about-reporting article > p:last-child { margin-bottom:0; }
.about-reporting .catalog-note { color:var(--muted); margin-bottom:8px; }
.site-header a[aria-current="page"],.site-footer a[aria-current="page"] { text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:5px; }
@media(max-width:767px) {
    .about-reporting .reporting-grid { grid-template-columns:minmax(0,1fr); }
}
@media(min-width:1000px) {
    .about-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-areas:"poster copy"; gap:32px 70px; }
    .about-copy { grid-area:copy; }
    .about-poster { grid-area:poster; }
}
@media(max-width:767px) {
    .membership-grid > .membership-panel { order:-1; }
}
/* Join: membership leads in source and on phones; artwork stays alongside on desktop. */
.join-grid { grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); grid-template-areas:"story membership"; }
.join-grid > section { min-width:0; overflow-wrap:anywhere; }
.join-grid > .membership-panel { grid-area:membership; order:0; }
.join-grid > .membership-story { grid-area:story; }
.join-grid .benefit-list { margin-block:24px 32px; }
.join-before { font-family:inherit; font-size:1rem; font-weight:700; line-height:1.65; letter-spacing:normal; margin:0 0 8px; }
.join-action { display:grid; gap:12px; margin-block-start:24px; }
.join-action p { margin:0; font-size:.875rem; }
.join-faq { overflow-wrap:anywhere; margin-block-start:48px; }
.join-faq summary { min-height:44px; }
.join-faq summary:hover { color:var(--red); }
@media(max-width:767px) {
    .join-grid { grid-template-columns:minmax(0,1fr); grid-template-areas:"membership" "story"; }
}
/* Browse: reporting leads; search and refinement support discovery. */
.browse-heading { padding:0 0 24px; }
.browse-heading h1 { font-size:clamp(2rem,4vw,3rem); margin:0 0 12px; }
.browse-heading p { color:var(--muted); font-size:1rem; margin:0; }
.browse-search { max-width:none; margin-bottom:24px; }
.browse-search-row { display:flex; align-items:end; gap:16px; }
.browse-search-row > div { flex:1; min-width:0; }
.browse-search-row > .btn { flex-shrink:0; }
.browse-filters { margin-top:16px; padding:0; border:0; }
.browse-filters > summary { min-height:44px; padding:10px 0; width:fit-content; max-width:100%; }
.browse-filters > summary:hover { color:var(--red); }
.browse-filter-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr)); gap:24px; padding:16px 0 24px; }
.browse-filter-grid > div { min-width:0; }
.browse-filters .browse-filter-help { color:var(--muted); font-size:.85rem; padding:0; margin:0 0 16px; }
.browse-active-filters { display:flex; align-items:center; flex-wrap:wrap; gap:12px 16px; margin-bottom:24px; }
.browse-active-filters .btn { text-align:start; max-width:100%; overflow-wrap:anywhere; }
.browse-results { --bs-gutter-x:min(1.5rem,44px); }
.browse-catalog-heading { align-items:baseline; flex-wrap:wrap; }
.browse-catalog-heading h2 { margin:0; }
.browse-pagination { flex-wrap:wrap; }
.browse-end { margin:24px 0 0; }
@media(max-width:575px) {
    .browse-filter-grid { gap:16px; }
    .browse-search-row { flex-wrap:wrap; gap:12px; }
    .browse-search-row > div { flex-basis:100%; }
}

.home-announcement { margin:0 0 28px; padding:20px 24px; background:var(--red); color:var(--ink); border:2px solid var(--red); }
.home-announcement p { margin:0; max-width:none; font-family:Anton,Impact,"Arial Narrow",sans-serif; font-size:clamp(1.5rem,3.6vw,2.5rem); line-height:1.2; overflow-wrap:anywhere; }

.shared-discussion { margin-block:48px; max-width:960px; }
.shared-discussion .form-text { color:var(--muted); }
.comment-toolbar { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-bottom:24px; }
.comment-toolbar .form-select { width:auto; min-height:44px; }
.shared-discussion button, .comment-thread-summary { min-height:44px; }
.shared-comment-composer { margin-bottom:24px; }
.shared-comment-list .content-comment { border-top:1px solid var(--line); padding-block:16px; overflow-wrap:anywhere; }
.shared-comment-list .comment-body { white-space:pre-wrap; }
.comment-children { border-left:2px solid var(--line); padding-left:16px; margin-left:4px; }
.comment-thread-summary { cursor:pointer; color:var(--paper); padding-block:10px; }
.comment-thread-summary:focus-visible { outline:2px solid var(--focus-ring); outline-offset:3px; }
.comment-actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.comment-context { color:var(--muted); }
@media(max-width:575px) { .comment-children { padding-left:8px; margin-left:0; } .shared-discussion { margin-block:32px; } }

.comment-moderation { border:1px solid var(--line); padding:16px; margin-bottom:24px; }
.comment-settings { display:grid; gap:12px; }
.comment-settings input[type=checkbox] { margin-right:8px; }

.shared-comment-list .comment-meta { display:flex; gap:12px; flex-wrap:wrap; align-items:baseline; }
.community-author-badge { display:inline-block; border:1px solid var(--line); padding:1px 6px; font-size:.75rem; line-height:1.5; color:var(--paper); white-space:nowrap; }
.audio-player:has(:focus-visible) { outline:3px solid var(--focus-ring); outline-offset:5px; }
.shared-comment-list .comment-actions { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }

.comment-mod-label { color:var(--red); font-weight:bold; border:1px solid var(--red); padding-inline:8px; }

.audio-player{display:block;width:100%;margin:1rem 0;color-scheme:dark}.audio-story{max-width:850px;margin-inline:auto}.audio-transcript{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.8}.audio-story section{margin-block:2rem}

.audio-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem;margin-block:1rem 3rem}.audio-card{padding-block:1.5rem;border-top:1px solid var(--line);overflow-wrap:anywhere}.audio-card h2{font-size:clamp(1.8rem,3vw,2.5rem)}@media(max-width:767px){.audio-grid{grid-template-columns:1fr;gap:1rem}}

.audio-story .form-text,.audio-editor .form-text{color:var(--muted)}.audio-editor .form-control::file-selector-button{background:var(--panel);color:var(--paper)}

/* Comments (film, article and audio pages): same look as the community chat. Behaviour and permissions unchanged. */
.shared-discussion h2#shared-discussion-heading { color:#ff4433; text-shadow:0 0 4px rgba(255,42,31,.9),0 0 12px rgba(255,42,31,.65),0 0 28px rgba(255,42,31,.4); }
.shared-discussion .comment-toolbar { gap:10px; margin-bottom:16px; font-size:.85rem; }
.shared-discussion .comment-toolbar label { color:#9a9a9a; }
.shared-discussion .comment-toolbar .form-select { min-height:36px; padding-block:4px; background-color:#151515; color:#eee; border-color:#333; }
.shared-discussion .comment-toolbar .btn { min-height:36px; padding:4px 12px; font-size:.8rem; background:transparent; color:#ddd; border:1px solid #333; border-radius:4px; }
.shared-discussion .shared-comment-status { font-size:.75rem; color:#777; margin:0 0 8px; }
.shared-comment-composer { background:#121212; border:1px solid #262626; border-radius:8px; padding:12px; }
.shared-comment-composer .comment-composer-label { font-size:.8rem; color:#9a9a9a; margin-bottom:6px; }
.shared-comment-composer textarea { background:#161616; color:#fff; border:1px solid #333; border-radius:6px; }
.shared-comment-composer textarea:focus { border-color:#ff2a1f; box-shadow:0 0 8px rgba(255,42,31,.4); background:#161616; color:#fff; }
.shared-comment-composer .btn-primary { border:2px solid #ff2a1f; background:rgba(20,0,0,.55); color:#fff; font-weight:700; border-radius:6px; padding:8px 20px; box-shadow:0 0 8px rgba(255,42,31,.6); }
.shared-comment-composer .btn-primary:hover { background:#ff2a1f; color:#000; }
.shared-comment-composer .comment-cancel { background:none; border:0; color:#ff8a7a; font-size:.8rem; }
.shared-discussion .comment-moderation { border:1px solid #262626; border-radius:6px; padding:8px 14px; font-size:.85rem; }
.shared-discussion .comment-moderation > summary { min-height:32px; color:#ff8a7a; }
.shared-comment-list .content-comment { display:grid; grid-template-columns:34px minmax(0,1fr); gap:12px; border-top:1px solid #262626; padding:14px 0 10px; }
.shared-comment-list .comment-children .content-comment { border-top:0; padding-top:10px; }
.shared-discussion .cm-avatar { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; background:#2a2a2a; border:1px solid #3a3a3a; color:#ff6a5a; font:700 .78rem Arial,Helvetica,sans-serif; }
.shared-discussion .cm-avatar.is-staff { background:#200; border-color:#ff2a1f; color:#fff; }
.shared-comment-list .comment-meta { gap:8px; margin:0 0 2px; font-size:.78rem; color:#777; }
.shared-comment-list .cm-name { font-weight:700; font-size:.92rem; color:#fff; text-decoration:none; border:0; }
.shared-comment-list .cm-name:hover { text-decoration:underline; }
.shared-discussion .community-author-badge { border:0; border-radius:3px; background:#ff2a1f; color:#000; font:700 .6rem Arial,Helvetica,sans-serif; letter-spacing:.06em; text-transform:uppercase; padding:1px 5px; }
.shared-discussion .comment-mod-label { background:transparent; color:#ff4433; border:1px solid #ff4433; }
.shared-comment-list .comment-body { margin:2px 0 6px; color:#e6e6e6; line-height:1.45; }
.shared-comment-list .comment-body.is-removed { font-style:italic; color:#777; }
.shared-comment-list .comment-actions { gap:6px; }
.shared-discussion .comment-votes { display:inline-flex; align-items:center; gap:2px; color:#ccc; font-size:.8rem; }
.shared-discussion .comment-score { min-width:1.4em; text-align:center; font-weight:700; }
.shared-discussion .comment-vote { min-height:30px!important; min-width:30px; background:none; border:0; border-radius:4px; color:#888; font-size:.8rem; cursor:pointer; }
.shared-discussion .comment-vote:hover { background:#222; color:#fff; }
.shared-discussion .comment-vote.is-up[aria-pressed=true] { color:#ff4433; }
.shared-discussion .comment-vote.is-down[aria-pressed=true] { color:#7aa7ff; }
.shared-discussion .comment-reply { min-height:30px!important; background:none; border:0; border-radius:4px; color:#ccc; font-size:.8rem; padding:0 8px; cursor:pointer; }
.shared-discussion .comment-reply:hover { background:#222; color:#fff; }
.shared-discussion .cm-more { position:relative; }
.shared-discussion .cm-more > summary { list-style:none; min-height:30px; padding:0 8px; display:flex; align-items:center; border-radius:4px; color:#aaa; cursor:pointer; }
.shared-discussion .cm-more > summary::-webkit-details-marker { display:none; }
.shared-discussion .cm-more > summary:hover { background:#222; color:#fff; }
.shared-discussion .cm-menu { position:absolute; left:0; top:calc(100% + 4px); z-index:5; width:210px; padding:6px; display:grid; background:#161616; border:1px solid #333; border-radius:6px; box-shadow:0 10px 30px rgba(0,0,0,.7); }
.shared-discussion .cm-menu-item { display:block; width:100%; min-height:34px!important; text-align:left; background:none; border:0; border-radius:4px; padding:7px 10px; color:#ddd; font-size:.85rem; text-decoration:none; cursor:pointer; }
.shared-discussion .cm-menu-item:hover { background:#242424; color:#fff; }
.shared-discussion .cm-menu-item.is-mod { color:#ff8a7a; }
.shared-discussion .cm-menu-label { display:block; border-top:1px solid #2a2a2a; margin-top:4px; padding:8px 10px 2px; color:#777; font-size:.64rem; letter-spacing:.1em; text-transform:uppercase; }
.shared-comment-list .comment-children { border-left:2px solid rgba(255,42,31,.45); padding-left:14px; margin:4px 0 0 -30px; }
.shared-comment-list .comment-thread-summary { min-height:30px; padding-block:4px; font-size:.8rem; color:#ff6a5a; }
.shared-comment-list .comment-continue { font-size:.8rem; color:#ff6a5a; }
@media(max-width:575px) { .shared-comment-list .comment-children { margin-left:-20px; padding-left:10px; } .shared-discussion .cm-menu { left:auto; right:0; } }
.shared-comment-list details { border:0; padding:0; margin:0; }
.shared-comment-list .comment-main > details:not(.cm-more) { margin-top:2px; }
.shared-comment-list .comment-meta,.shared-comment-list .comment-body,.shared-comment-list .content-comment p{padding-top:0}
.shared-discussion .comment-discuss-forum{min-height:34px;padding:4px 12px;font-size:.8rem;background:transparent;color:#ddd;border:1px solid #333;border-radius:4px}.shared-discussion .comment-discuss-forum:hover{border-color:#ff4433;color:#fff}
.browse-category { margin-bottom:56px; } .browse-category .browse-catalog-heading h2 { color:#ff4433; text-shadow:0 0 4px rgba(255,42,31,.9),0 0 12px rgba(255,42,31,.65),0 0 28px rgba(255,42,31,.4); } .browse-category .browse-replays { margin-bottom:24px; }
/* Film cards: one clear action instead of the access label and running time. */
.video-card-body .card-watch { display:inline-flex; align-items:center; gap:6px; margin-top:10px; padding:7px 14px; border:2px solid #ff2a1f; border-radius:6px; background:rgba(20,0,0,.55); color:#fff; font:700 .82rem Arial,Helvetica,sans-serif; text-decoration:none; box-shadow:0 0 8px rgba(255,42,31,.6); }
.video-card-body .card-watch:hover,.video-card-body .card-watch:focus-visible { background:#ff2a1f; color:#000; }

/* Listen page: rows like a podcast app (art tile, title, byline, summary, date, play). */
.listen-heading .eyebrow { display:none; }
.listen-list { list-style:none; margin:8px 0 48px; padding:0; max-width:900px; }
.listen-row { display:grid; grid-template-columns:120px minmax(0,1fr) auto; gap:20px; align-items:center; padding:18px 0; border-top:1px solid var(--line); }
.listen-row:last-child { border-bottom:1px solid var(--line); }
.listen-art { display:grid; place-items:center; aspect-ratio:1; overflow:hidden; border-radius:6px; background:linear-gradient(135deg,#1c1c1c,#3a1210); box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); text-decoration:none; }
.listen-wave { display:flex; align-items:center; gap:5px; height:44%; }
.listen-wave i { display:block; width:5px; border-radius:3px; background:#ff4433; box-shadow:0 0 6px rgba(255,42,31,.6); }
.listen-wave i:nth-child(1){height:35%}.listen-wave i:nth-child(2){height:70%}.listen-wave i:nth-child(3){height:100%}.listen-wave i:nth-child(4){height:55%}.listen-wave i:nth-child(5){height:85%}.listen-wave i:nth-child(6){height:45%}.listen-wave i:nth-child(7){height:25%}
.listen-art img { width:100%; height:100%; object-fit:cover; display:block; }
.listen-body { min-width:0; }
.listen-body h2 { font-size:1.35rem; margin:0 0 2px; line-height:1.2; }
.listen-body h2 a { text-decoration:none; }
.listen-body h2 a:hover, .listen-body h2 a:focus-visible { text-decoration:underline; }
.listen-byline { color:var(--muted); margin:0 0 6px; font-size:.9rem; }
.listen-summary { margin:0 0 6px; font-size:.92rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.listen-date { color:var(--muted); margin:0; font-size:.82rem; font-weight:700; }
.listen-play { display:grid; place-items:center; width:46px; height:46px; border-radius:50%; background:#f2efe6; color:#111; text-decoration:none; font-size:1rem; padding-left:3px; transition:transform .15s, background .15s; }
.listen-play:hover, .listen-play:focus-visible { background:#ff4433; color:#000; transform:scale(1.06); }
@media (max-width:600px) { .listen-row { grid-template-columns:96px minmax(0,1fr) auto; gap:12px; } .listen-body h2 { font-size:1.1rem; } .listen-summary { -webkit-line-clamp:3; } .listen-play { width:40px; height:40px; } }

/* Audio story page: square cover art beside the title; player sits close under the byline. */
.article-heading.audio-heading { display:grid; grid-template-columns:260px minmax(0,1fr); gap:28px; align-items:center; padding-bottom:0; }
.audio-heading-text > :last-child { margin-bottom:0; }
.audio-heading .eyebrow { margin-bottom:8px; }
.audio-artwork { display:grid; place-items:center; width:100%; aspect-ratio:1; object-fit:cover; border-radius:8px; background:linear-gradient(135deg,#1c1c1c,#3a1210); box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); }
.audio-artwork-empty .listen-wave { height:34%; }
.audio-story .audio-heading + section { margin-top:18px; }
.audio-story .audio-heading + section .audio-player { margin-top:0; }
.audio-artwork-editor { display:flex; gap:20px; align-items:flex-start; flex-wrap:wrap; }
.audio-artwork-editor .audio-artwork { width:150px; flex:none; }
.audio-artwork-editor form + form { margin-top:10px; }
@media (max-width:600px) { .article-heading.audio-heading { grid-template-columns:1fr; gap:16px; } .audio-heading .audio-artwork { max-width:320px; } }

/* Comments, YouTube-style (films, articles, broadcasts, audio, forum posts). Overrides the earlier comment rules. */
.shared-discussion .comment-toolbar { display:flex; align-items:center; gap:28px; flex-wrap:wrap; margin-bottom:22px; font-size:.92rem; }
.shared-discussion h2#shared-discussion-heading { margin:0; font:700 1.35rem Arial,Helvetica,sans-serif; color:#f1f1f1; text-shadow:none; }
.shared-discussion .comment-sort { position:relative; }
.shared-discussion .comment-sort-toggle { display:inline-flex; align-items:center; gap:8px; min-height:36px; padding:0 4px; background:none; border:0; color:#f1f1f1; font:500 .92rem Arial,Helvetica,sans-serif; cursor:pointer; }
.shared-discussion .comment-sort-toggle svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:2; }
.shared-discussion .comment-sort-menu { position:absolute; left:0; top:calc(100% + 4px); z-index:6; min-width:180px; padding:8px 0; background:#282828; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.6); }
.shared-discussion .comment-sort-menu button { display:block; width:100%; min-height:40px; padding:0 16px; text-align:left; background:none; border:0; color:#f1f1f1; font-size:.9rem; cursor:pointer; }
.shared-discussion .comment-sort-menu button:hover, .shared-discussion .comment-sort-menu button:focus-visible { background:#3a3a3a; }
.shared-discussion .comment-sort-menu button[aria-pressed=true] { background:#3a3a3a; font-weight:700; }
.shared-discussion .shared-comment-status:empty { display:none; }

.shared-discussion .shared-comment-composer { display:grid; grid-template-columns:40px minmax(0,1fr); gap:14px; align-items:start; background:none; border:0; border-radius:0; padding:0; margin-bottom:30px; }
.shared-discussion .shared-comment-composer[hidden] { display:none; }
.shared-discussion .comment-composer-avatar { width:40px; height:40px; background:#2a2a2a; border:0; }
.shared-discussion .comment-composer-avatar svg { width:22px; height:22px; fill:none; stroke:#aaa; stroke-width:1.8; }
.shared-discussion .comment-composer-label { font-size:.8rem; color:#aaa; margin:0 0 4px; }
.shared-discussion .shared-comment-composer textarea { min-height:34px; resize:none; overflow:hidden; padding:6px 0; background:transparent; border:0; border-bottom:1px solid #555; border-radius:0; color:#f1f1f1; font-size:.92rem; box-shadow:none; }
.shared-discussion .shared-comment-composer textarea:focus { background:transparent; border-bottom:2px solid #f1f1f1; box-shadow:none; }
.shared-discussion .shared-comment-composer #shared-comment-help { display:none; }
/* The emoji button is always on the comment bar (Gary, Nov 7); Cancel and Comment appear once you start a comment. */
.shared-discussion .comment-composer-buttons { display:flex; align-items:center; margin-top:6px; }
.shared-discussion .shared-comment-composer:not(.is-open) .comment-composer-buttons > :not(.comment-emoji) { display:none; }
.shared-discussion .shared-comment-composer.is-open #shared-comment-help { display:block; font-size:.75rem; margin:6px 0 0; }
.shared-discussion .shared-comment-composer.is-open .comment-composer-buttons { display:flex; justify-content:flex-end; gap:8px; margin-top:8px; }
.shared-discussion .comment-composer-buttons .comment-cancel { min-height:36px; padding:0 16px; border:0; border-radius:18px; background:none; color:#f1f1f1; font:500 .88rem Arial,Helvetica,sans-serif; }
.shared-discussion .comment-composer-buttons .comment-cancel:hover { background:#2a2a2a; }
.shared-discussion .comment-composer-buttons .btn-primary { min-height:36px; padding:0 16px; border:0; border-radius:18px; background:#ff4433; color:#000; font:600 .88rem Arial,Helvetica,sans-serif; box-shadow:none; }
.shared-discussion .comment-composer-buttons .btn-primary:hover { background:#ff6a5a; color:#000; }

.shared-comment-list .content-comment { display:grid; grid-template-columns:40px minmax(0,1fr) auto; gap:14px; border-top:0; padding:0; margin-bottom:22px; }
.shared-discussion .shared-comment-list .cm-avatar { width:40px; height:40px; border-radius:50%; font-size:.8rem; }
.shared-comment-list .comment-children .content-comment { grid-template-columns:32px minmax(0,1fr) auto; margin:12px 0 0; padding:0; }
.shared-discussion .shared-comment-list .comment-children .cm-avatar { width:32px; height:32px; font-size:.7rem; }
.shared-comment-list .comment-meta { gap:4px 6px; margin:0 0 3px; font-size:.78rem; color:#aaa; align-items:center; }
.shared-comment-list .cm-name { font-size:.8rem; font-weight:600; color:#f1f1f1; }
.shared-comment-list .comment-body { margin:0 0 4px; font-size:.92rem; color:#f1f1f1; line-height:1.45; }
.shared-comment-list .comment-actions { gap:2px; margin-left:-8px; }
.shared-discussion .comment-votes { gap:0; color:#aaa; font-size:.78rem; }
.shared-discussion .comment-score { min-width:0; margin:0 8px 0 -2px; font-weight:400; }
.shared-discussion .comment-score:empty { margin:0; }
.shared-discussion .comment-vote { display:grid; place-items:center; width:34px; height:34px; min-height:34px!important; padding:0; border-radius:50%; color:#f1f1f1; background:none; border:0; }
.shared-discussion .comment-vote svg { width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linejoin:round; }
.shared-discussion .comment-vote.is-down svg { transform:rotate(180deg); }
.shared-discussion .comment-vote[aria-pressed=true] svg { fill:currentColor; }
/* A liked thumb is filled in, never a cream disc (engagement.css styles other pressed buttons that way). */
.shared-discussion .comment-vote.is-up[aria-pressed=true], .shared-discussion .comment-vote.is-down[aria-pressed=true] { color:#f1f1f1; background:none; border-color:transparent; }
.shared-discussion .comment-vote.is-up[aria-pressed=true]:hover, .shared-discussion .comment-vote.is-down[aria-pressed=true]:hover { background:#2a2a2a; }
.shared-discussion .comment-vote:hover { background:#2a2a2a; }
.shared-discussion .comment-vote.is-static { width:28px; color:#aaa; }
.shared-discussion .comment-vote.is-static:hover { background:none; }
.shared-discussion .comment-reply { min-height:32px!important; padding:0 12px; border-radius:16px; color:#f1f1f1; font:600 .8rem Arial,Helvetica,sans-serif; }
.shared-discussion .comment-reply:hover { background:#2a2a2a; }
.shared-discussion .content-comment > .cm-more > summary { width:36px; height:36px; min-height:36px; padding:0; justify-content:center; border-radius:50%; font-size:1.15rem; color:#f1f1f1; }
.shared-discussion .content-comment > .cm-more > summary:hover { background:#2a2a2a; }
.shared-discussion .content-comment > .cm-more .cm-menu { left:auto; right:0; }
.shared-comment-list .comment-children { border-left:0; padding-left:0; margin:4px 0 0; }
.shared-comment-list .comment-thread-summary { display:inline-flex; align-items:center; gap:6px; min-height:36px; padding:0 12px; margin-left:-12px; border-radius:18px; list-style:none; color:#3ea6ff; font:600 .88rem Arial,Helvetica,sans-serif; }
.shared-comment-list .comment-thread-summary::-webkit-details-marker { display:none; }
.shared-comment-list .comment-thread-summary::before { content:""; width:7px; height:7px; border:solid currentColor; border-width:0 2px 2px 0; transform:translateY(-2px) rotate(45deg); transition:transform .15s; }
.shared-comment-list details[open] > .comment-thread-summary::before { transform:translateY(2px) rotate(-135deg); }
.shared-comment-list .comment-thread-summary:hover { background:#263850; }
.shared-comment-list .comment-continue { color:#3ea6ff; }
@media(max-width:575px) { .shared-discussion .comment-toolbar { gap:18px; } .shared-comment-list .content-comment { gap:10px; } .shared-comment-list .comment-children .content-comment { grid-template-columns:28px minmax(0,1fr) auto; } .shared-discussion .shared-comment-list .comment-children .cm-avatar { width:28px; height:28px; } }
/* Comment fixes (Oct 31): no focus box on the comment line, emoji picker, grey Comment button until there's text. */
.shared-discussion .shared-comment-composer textarea:focus, .shared-discussion .shared-comment-composer textarea:focus-visible { outline:none!important; box-shadow:none!important; }
.shared-discussion .shared-comment-composer.is-open .comment-composer-buttons { align-items:center; }
.shared-discussion .comment-emoji { position:relative; margin-right:auto; }
.shared-discussion .comment-emoji-toggle { display:grid; place-items:center; width:36px; height:36px; min-height:36px; padding:0; border:0; border-radius:50%; background:none; color:#f1f1f1; cursor:pointer; }
.shared-discussion .comment-emoji-toggle:hover { background:#2a2a2a; }
.shared-discussion .comment-emoji-toggle svg { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; }
.shared-discussion .comment-emoji-menu { position:absolute; left:0; top:calc(100% + 4px); z-index:6; display:grid; grid-template-columns:repeat(8,36px); gap:2px; padding:8px; background:#282828; border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.6); }
.shared-discussion .comment-emoji-menu[hidden] { display:none; }
.shared-discussion .comment-emoji-pick { width:36px; height:36px; min-height:36px; padding:0; border:0; border-radius:8px; background:none; font-size:1.3rem; line-height:1; cursor:pointer; }
.shared-discussion .comment-emoji-pick:hover, .shared-discussion .comment-emoji-pick:focus-visible { background:#3a3a3a; }
.shared-discussion .comment-composer-buttons .btn-primary.is-empty { background:#2a2a2a; color:#777; }
@media(max-width:575px) { .shared-discussion .comment-emoji-menu { grid-template-columns:repeat(7,36px); } }

/* Profile pictures: round photo in place of the initials circle (comments, chat, account settings). */
.cm-avatar.has-image { overflow:hidden; padding:0; background:#111!important; }
.cm-avatar.has-image img { width:100%; height:100%; object-fit:cover; display:block; border-radius:50%; }
.account-avatar-row { display:flex; gap:20px; align-items:flex-start; flex-wrap:wrap; }
.account-avatar-image { flex:none; width:96px; height:96px; border-radius:50%; object-fit:cover; display:grid; place-items:center; background:#2a2a2a; }
.account-avatar-empty svg { width:48px; height:48px; fill:none; stroke:#aaa; stroke-width:1.6; }
.account-avatar-remove { margin-top:10px; }
/* Mentions show as "@Name" in the comment text; the old remove-mention chips are hidden. */
.shared-discussion .comment-mentions { display:none; }

/* Empty form-error lists stay hidden everywhere (the page security policy blocks the framework's inline display:none). */
.validation-summary-valid { display:none; }
/* Profile picture cropper (Account settings). */
.avatar-crop-dialog { width:min(360px,calc(100vw - 24px)); padding:20px; border:2px solid #ff2a1f; border-radius:10px; background:#0b0b0b; color:#f1f1f1; text-align:center; }
.avatar-crop-dialog::backdrop { background:rgba(0,0,0,.75); }
.avatar-crop-dialog h2 { font:400 1.6rem Anton,Impact,sans-serif; text-transform:uppercase; color:#ff3b2b; margin:0 0 4px; }
.avatar-crop-view { position:relative; width:280px; height:280px; margin:12px auto; overflow:hidden; border-radius:50%; background:#111; cursor:grab; touch-action:none; box-shadow:0 0 0 2px #ff2a1f, 0 0 22px rgba(255,42,31,.45); }
.avatar-crop-view:active { cursor:grabbing; }
.avatar-crop-view img { position:absolute; left:0; top:0; max-width:none; user-select:none; transform-origin:0 0; }
.avatar-crop-zoom { display:flex; align-items:center; gap:10px; justify-content:center; margin:6px 0 14px; }
.avatar-crop-zoom input { width:180px; accent-color:#ff2a1f; }
.avatar-crop-actions { display:flex; gap:10px; justify-content:center; }

/* Nov 2 (Gary): no highlight box around a box you're typing in, anywhere on the site. The caret and the box's own border show where you are.
   Buttons and links keep a red ring only when someone moves through the page with the keyboard (Tab). */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):focus-visible,
textarea:focus, textarea:focus-visible, select:focus, select:focus-visible, [contenteditable]:focus, [contenteditable]:focus-visible { outline:none!important; }
/* iPhone/iPad Safari zooms the whole page when you tap a box with text smaller than 16px. Keep typing boxes at 16px or more there. */
@supports (-webkit-touch-callout: none) {
  input:not([type=checkbox]):not([type=radio]):not([type=file]):not([type=range]):not([type=color]), select, textarea { font-size:max(16px, 1em) !important; }
}

/* Show/hide password: the red camera inside the box (Gary, Nov 5). */
.pw-field { position:relative; display:block; }
.pw-field > input { padding-right:52px !important; }
.pw-eye { position:absolute; right:6px; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:42px; height:38px; padding:0; background:none; border:0; border-radius:6px; cursor:pointer; opacity:.85; }
.pw-eye:hover, .pw-eye:focus-visible { opacity:1; }
.pw-eye img { width:27px; height:auto; display:block; pointer-events:none; }
.pw-eye[aria-pressed="true"]::after { content:""; position:absolute; left:8px; right:8px; top:50%; height:2px; background:#ff2a1f; box-shadow:0 0 0 1px rgba(0,0,0,.7); transform:rotate(-35deg); }
