/* CC Fest look: warm grey paper, near-black ink, flat blue, orange and lime, square corners, hairline rules, no shadows.
   Tokens match the CC Fest design system. Anybody (with its width axis and italics) for type, Overpass Mono for labels. */
@font-face{font-family:Anybody;src:url('assets/fonts/Anybody.ttf') format('truetype');font-style:normal;font-weight:100 900;font-stretch:50% 150%;font-display:swap}
@font-face{font-family:Anybody;src:url('assets/fonts/Anybody-Italic.ttf') format('truetype');font-style:italic;font-weight:100 900;font-stretch:50% 150%;font-display:swap}
@font-face{font-family:"Overpass Mono";src:url('assets/fonts/OverpassMono.ttf') format('truetype');font-style:normal;font-weight:300 700;font-display:swap}
:root{--paper:#edede9;--surface:#f4f4f1;--tint:#e5e5e2;--ink:#18181a;--muted:#62625e;--line:#c4c4c0;--soft-line:#dcdcd8;--accent:#2d5bff;--orange:#ff4d2e;--lime:#c8ff32;--orange-text:#b12b14;--fact-ground:#161614;--fact-label:#ff795f;--fact-rule:#444444;--stage:#e2e2dd;--online:#5ce1e6;--camp:#ff7ac6;--dark-line:#3a3a3d;--sans:Anybody,Arial,sans-serif;--mono:"Overpass Mono",ui-monospace,Menlo,monospace;--gutter:clamp(20px,4.45vw,64px);color-scheme:light}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;background:var(--paper);color:var(--ink);font:300 16px/1.75 var(--sans)}
h1,h2,h3{margin:0;font-family:var(--sans);font-weight:700;letter-spacing:-.03em;line-height:1.04;text-wrap:balance;font-synthesis:none}
p,figure{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit;text-underline-offset:4px}
button,input{font:inherit;color:inherit}
button,a,input,summary{-webkit-tap-highlight-color:transparent}
button{cursor:pointer;background:none;border:0;padding:0}
img{display:block;max-width:100%}
.ital{font-style:italic;font-weight:400;letter-spacing:-.02em}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.js-only{display:none}
.js .js-only{display:flex}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.numbers-section :focus-visible{outline-color:var(--lime)}
.skip{position:fixed;top:-100px;left:20px;z-index:100;padding:12px;background:var(--lime);color:var(--ink)}
.skip:focus{top:10px}
.wm-cc{font-variation-settings:"wdth" 150}
.wm-fest{font-variation-settings:"wdth" 71}

/* Site header: the same header, logo and navigation as the CC Fest site (styles.css and redesign.css on main). */
.site-header{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 24px;min-height:56px;padding:12px var(--gutter);background:var(--surface);border-bottom:1px solid var(--line)}
.logo{font-size:13px;font-weight:500;letter-spacing:.05em;font-variation-settings:'wdth' 71;text-decoration:none;white-space:nowrap}
.site-header nav{display:flex;flex-wrap:wrap;gap:0 clamp(1rem,3vw,2.5rem);font-size:13px;color:var(--muted)}
.site-header nav a{text-decoration:none;padding-block:.5rem}
.site-header nav a:hover{color:var(--accent);text-decoration:underline}
.site-header nav a[aria-current="page"]{color:var(--ink);text-decoration:underline;text-underline-offset:.35em}
/* Chapter bar: this page's own header, which stays in view while reading. */
.masthead{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:28px;min-height:52px;padding:10px var(--gutter);background:var(--surface);border-bottom:1px solid var(--line)}
.wordmark{font-size:20px;font-weight:500;letter-spacing:.05em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.edition{padding-left:20px;border-left:1px solid var(--line);font:400 11px/1.5 var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.masthead nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:8px 22px;margin-left:auto;font-size:13px}
.masthead nav a{text-decoration:none}
.masthead nav a:hover{color:var(--accent);text-decoration:underline}

/* Hero */
.hero{padding:36px var(--gutter) 0;overflow:hidden}
.hero-kicker,.hero-bottom,.chapter-label{display:flex;justify-content:space-between;gap:20px;font:400 11px/1.5 var(--mono);letter-spacing:.07em;text-transform:uppercase}
.hero-rule{height:1px;margin-top:24px;background:var(--ink)}
.hero-copy{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:64px;align-items:center;padding:32px 0 28px}
.hero-aside{min-width:0}
.ten-feature{padding:72px var(--gutter)}
.ten-feature .anniversary-art{width:min(620px,100%);margin:0 auto}
.hero h1{font-size:clamp(60px,6.1vw,88px);line-height:.98;letter-spacing:-.04em}
.hero-lede{max-width:440px;margin-top:24px;font-size:18px;line-height:1.5}
.hero-answer{margin-top:14px;font-size:15px}
.pill{display:inline-flex;align-items:center;gap:40px;margin-top:24px;padding:.85rem 1.5rem;border:1px solid var(--accent);background:var(--accent);color:#fff;font-size:14px;font-weight:500;text-decoration:none}
.pill:hover{filter:brightness(.9)}
.pill span{font-size:20px;line-height:1}
.anniversary-art{position:relative;height:420px;padding:22px 24px;background:var(--accent);color:var(--paper);isolation:isolate;overflow:hidden;transform:rotate(2deg)}
.art-top,.art-caption{position:relative;z-index:3;display:flex;justify-content:space-between;gap:12px;font:400 11px/1.5 var(--mono);letter-spacing:.07em;text-transform:uppercase}
.art-caption{position:absolute;left:24px;right:24px;bottom:20px}
.art-number{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:800 290px/1 var(--sans);letter-spacing:-.12em;transform:translateX(-12px)}
.art-number .one{z-index:2;color:var(--lime);transform:rotate(-8deg)}
.art-number .zero{position:relative;color:var(--paper)}
.art-dot{position:absolute;left:58px;top:132px;z-index:2;width:58px;height:58px;border-radius:50%;background:var(--orange)}
.art-orbit{position:absolute;inset:0;width:100%;height:100%;z-index:1;fill:none;stroke:var(--orange);stroke-width:2;pointer-events:none}
.hero-bottom{margin:0 var(--gutter);padding:16px 0;border-top:1px solid var(--ink)}
.photo-ribbon{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:8px;padding:8px;background:var(--ink)}
.ribbon-item{margin:0;min-width:0}
.ribbon-photo{position:relative;overflow:hidden}
.ribbon-item img{width:100%;height:258px;object-fit:cover}
.ribbon-tag{position:absolute;left:12px;bottom:12px;max-width:calc(100% - 24px);padding:4px 8px;background:var(--paper);font:400 11px/1.5 var(--mono);letter-spacing:.04em}
.ribbon-credit{padding:10px 2px 2px;font:400 11px/1.5 var(--mono);letter-spacing:.04em;color:var(--surface)}

/* Chapters */
.chapter{padding:72px var(--gutter) 80px}
.chapter-label{padding-top:16px;margin-bottom:56px;border-top:1px solid currentColor}
.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:48px;margin-bottom:48px}
.section-heading h2{font-size:clamp(40px,5vw,72px)}
.section-heading>p{max-width:380px;font-size:16px}
.block-title{margin-bottom:28px;font-size:clamp(28px,3vw,40px)}
.origin-grid{display:grid;grid-template-columns:1fr 1fr;gap:9%}
.origin h2{font-size:clamp(44px,5.6vw,84px)}
.origin-copy p{margin-bottom:22px;font-size:16px}
.large-copy{font-size:24px;line-height:1.4;font-weight:400}
.text-link{display:inline-block;margin-top:8px;font-size:15px;font-weight:500;text-decoration:underline}
.principle{display:flex;align-items:center;gap:40px;margin-top:64px;padding-top:40px;border-top:1px solid var(--line)}
.principle p{font-size:clamp(26px,3vw,42px);font-weight:600;line-height:1.15;letter-spacing:-.03em}
.principle p .ital{font-weight:400}
.principle .tiny-label{margin-left:auto}
.origin{padding-bottom:0}
.origin .photo-ribbon{margin:72px calc(-1*var(--gutter)) 0}
.ribbon-intro{margin-top:72px;text-align:left}
.origin .ribbon-intro+.photo-ribbon{margin-top:12px}
.tiny-label{font:400 11px/1.6 var(--mono);letter-spacing:.07em;text-transform:uppercase;text-align:right;color:var(--muted)}

/* Chapter 02: decade overview, year panels, timeline */
.timeline-section{background:var(--paper)}
.decade-section{background:var(--surface)}
.decade-band{padding:32px;background:var(--orange)}
.decade-facts{display:grid;grid-template-columns:2fr 1fr;gap:1px;background:var(--fact-rule)}
.fact{display:flex;flex-direction:column;gap:12px;padding:24px;background:var(--fact-ground);color:var(--surface)}
.fact strong{font:700 64px/1 var(--sans);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.fact span{font-size:15px;line-height:1.4}
.fact .fact-split{font:400 12px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fact-label)}
.fact-bar{display:flex;gap:2px;height:10px;max-width:420px}
.fact-bar i{background:var(--surface)}
.fact-bar i.online{background:var(--online)}
.phases{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px;margin-top:44px}
.phases li{padding-top:18px;border-top:1px solid var(--ink)}
.phase-years{display:block;font:400 11px/1.5 var(--mono);letter-spacing:.07em;text-transform:uppercase}
.phase-title{margin:8px 0 0;font:700 26px/1.1 var(--sans);letter-spacing:-.03em;text-wrap:balance;font-synthesis:none}
.phases p{margin-top:12px;font-size:16px}
.phase-figure{margin-top:22px}
.phase-figure a{display:block}
.phase-figure img{width:100%;height:auto;border:1px solid var(--ink);background:var(--surface)}
.phase-figure figcaption{margin-top:10px;font-size:14px;line-height:1.5}
.phase-figure strong{display:block;margin-bottom:2px;font-size:16px;font-weight:700;letter-spacing:-.01em}
.phase-figure .text-link{margin-top:4px;font-size:14px}
.phase-credit{display:block;margin-top:6px;font:400 11px/1.5 var(--mono);letter-spacing:.04em;color:var(--muted)}
.explorer-controls{flex-direction:column;gap:22px}
.year-filters{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;padding-bottom:18px;border-bottom:1px solid var(--line)}
.year-filters button{min-height:44px;padding:10px 12px;border:1px solid transparent;font:400 12px/1.4 var(--mono);letter-spacing:.04em}
.year-filters button:hover{border-color:var(--ink)}
.year-filters button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#fff}
.filter-line{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px}
.location-filters{display:flex;flex-wrap:wrap;gap:6px}
.location-filters button,.gallery-filters button{min-height:44px;padding:10px 16px;border:1px solid var(--muted);font-size:14px}
.location-filters button[aria-pressed=true],.gallery-filters button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.archive-meta{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:30px;padding-bottom:12px;font:400 12px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.timeline-layout{display:grid;grid-template-columns:26% minmax(0,1fr);gap:6%;border-top:1px solid var(--ink)}
.era-note{padding-top:32px}
.era-note .tiny-label{display:block;margin-left:0;text-align:left}
.era-note p{max-width:240px;margin-top:8px;font-size:24px;font-style:italic;font-weight:400;line-height:1.25}
.era-note a{display:inline-block;margin-top:24px;font-size:14px;font-weight:500}
.thread-art{position:relative;display:flex;flex-direction:column;padding:28px 0 36px 20px}
.thread-art:before{content:'';position:absolute;left:57px;top:28px;bottom:36px;border-left:1px solid var(--ink)}
.thread-art i{position:relative;width:72px;height:72px;margin-top:-8px;border:1px solid var(--ink);border-radius:50%;background:var(--accent)}
.thread-art i:nth-child(2){background:var(--orange);transform:translateX(36px)}
.thread-art i:nth-child(3){background:var(--lime)}
.thread-art i:nth-child(4){background:var(--paper);transform:translateX(36px)}
.event{display:grid;grid-template-columns:108px minmax(0,1fr);gap:24px;padding:32px 0;border-bottom:1px solid var(--line);scroll-margin-top:120px}
.event-year{font:700 30px/1.05 var(--sans);letter-spacing:-.03em}
.event-date{display:block;margin-top:8px;font:400 12px/1.5 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--muted)}
.event-body{display:grid;grid-template-columns:minmax(0,1fr) 170px;gap:28px;align-items:start}
.event-location{display:flex;align-items:center;gap:8px;margin-bottom:10px;font:400 11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.location-dot{display:inline-block;width:10px;height:10px;background:var(--accent)}
.location-dot.la{background:var(--orange)}
.location-dot.sf{background:var(--lime);box-shadow:inset 0 0 0 1px var(--ink)}
.location-dot.online{background:var(--online);box-shadow:inset 0 0 0 1px var(--ink)}
.event h3{font-size:26px;line-height:1.15;font-weight:600;letter-spacing:-.02em}
.event p{max-width:600px;margin-top:10px;font-size:16px;line-height:1.6}
.event-source{display:inline-block;margin-top:14px;font-size:15px;font-weight:500;text-decoration:underline;text-underline-offset:4px}
.event-note{margin-top:8px;font-size:14px;color:var(--muted)}
.event-poster a{display:block}
.event-poster img{width:170px;height:auto;max-height:230px;object-fit:contain;object-position:top;border:1px solid var(--line)}
.event-poster figcaption{margin-top:8px;font-size:12px;line-height:1.45;color:var(--muted)}
.empty-state{padding:50px 0;font-size:19px}
.source-note{max-width:900px;margin-top:28px;font-size:14px;line-height:1.7;color:var(--muted)}
.small-copy{font-size:14px;margin-top:16px}

/* Poster wall */
.posters-section{background:var(--paper)}
.poster-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:40px 22px}
.poster-tile{margin:0}
.poster-open{position:relative;display:block;width:100%;aspect-ratio:3/4;overflow:hidden;background:var(--stage);border:1px solid var(--line);cursor:zoom-in}
.poster-open:hover{border-color:var(--ink)}
.poster-open img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.poster-tile figcaption{display:grid;gap:4px;margin-top:12px}
.poster-meta{font:400 11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.poster-credit{font-size:13px;line-height:1.45;color:var(--muted)}

/* Chapter 03: dark numbers band */
.numbers-section{background:var(--ink);color:var(--surface)}
.numbers-section .chapter-label{border-top-color:var(--surface)}
.numbers-section .section-heading>p,.numbers-section .source-note,.numbers-section .chart-instruction{color:var(--line)}
.numbers-section .ital{color:var(--lime)}
.chart-heading{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px}
.chart-heading h3{font-size:clamp(26px,3vw,36px)}
.legend{display:flex;flex-wrap:wrap;gap:20px;font:400 11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.legend span{display:flex;align-items:center;gap:8px}
.legend i{display:block;width:12px;height:12px;border:2px solid var(--surface)}
.legend i.nyc{background:var(--accent);border-color:var(--accent)}
.legend i.la{background:var(--orange);border-color:var(--orange)}
.legend i.sf{background:var(--lime);border-color:var(--lime)}
.legend i.online{background:var(--online);border-color:var(--online)}
.legend i.camp{background:var(--camp);border-color:var(--paper);border-style:dashed}
.chart-instruction{padding-top:16px;font-size:14px}
.event-chart{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:12px;align-items:end;height:290px;margin-top:40px;border-bottom:1px solid var(--dark-line)}
.chart-column{display:flex;flex-direction:column;height:100%;min-width:0;padding:6px 3px 12px;color:var(--surface);text-decoration:none;border:1px solid transparent}
.chart-column:hover,.chart-column:focus-visible{border-color:var(--surface)}
.chart-total{margin-bottom:10px;text-align:center;font:500 14px/1 var(--mono);font-variant-numeric:tabular-nums}
.chart-blocks{display:flex;flex-direction:column-reverse;justify-content:flex-start;gap:6px;height:200px}
.chart-block{display:block;width:100%;height:34px;border:2px solid var(--surface)}
.chart-block.nyc{background:var(--accent);border-color:var(--accent)}
.chart-block.la{background:var(--orange);border-color:var(--orange)}
.chart-block.sf{background:var(--lime);border-color:var(--lime)}
.chart-block.online{background:var(--online);border-color:var(--online)}
.chart-block.camp{background:var(--camp);border-color:var(--paper);border-style:dashed}
.chart-year{margin-top:14px;text-align:center;font:500 12px/1 var(--mono)}
.chart-footnote{display:flex;flex-wrap:wrap;justify-content:space-between;gap:25px;margin-top:26px;font:400 11px/1.6 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--line)}
.data-table{margin-top:28px;padding-top:14px;border-top:1px solid var(--dark-line);font-size:14px}
.data-table summary{min-height:44px;padding:10px 0;cursor:pointer;font-weight:500}

/* Chapter 04: photographs */
.gallery-section{background:var(--paper)}
.gallery-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:30px}
.gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 24px}
.gallery-item{min-width:0;margin:0}
.gallery-item>a{position:relative;display:block;overflow:hidden;background:var(--stage)}
.gallery-item img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform .25s}
.gallery-item>a:hover img{transform:scale(1.03)}
.photo-expand{position:absolute;right:10px;bottom:10px;display:grid;place-items:center;width:36px;height:36px;background:var(--paper);font-size:18px;line-height:1}
.photo-meta{display:flex;justify-content:space-between;gap:12px;margin:14px 0 8px;font:400 11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.photo-credit{max-width:380px;font-size:14px;line-height:1.55;color:var(--muted)}
.photo-moment{display:block;margin-bottom:4px;color:var(--ink)}

/* Chapter 05: lime band with the sketch */
.practice-section{background:var(--lime)}
.practice-section .chapter-label{border-top-color:var(--ink)}
.camp-grid{display:grid;grid-template-columns:1fr 1fr;gap:9%;align-items:center}
.camp-grid h2{margin-bottom:26px;font-size:clamp(40px,4.8vw,70px)}
.camp-grid>div>p{max-width:520px;margin-top:18px;font-size:16px}
.camp-grid .large-copy{font-size:24px}
.camp-figure{margin-top:22px;padding-top:16px;border-top:1px solid var(--ink);font-size:16px}
.camp-figure strong{display:block;font:700 48px/1 var(--sans);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.camp-feedback{margin-top:18px;font-size:16px;font-weight:500}
.sketch-card{padding:26px;background:var(--paper);border:1px solid var(--ink)}
/* One contributor's story, in their approved words, after the camp text. */
.story-feature{max-width:760px;margin-top:64px;padding:32px;background:var(--paper);border:1px solid var(--ink)}
.story-feature .tiny-label{display:block;text-align:left}
.story-feature h3{margin:10px 0 14px;font-size:clamp(26px,3vw,36px)}
.story-feature>p{font-size:16px}
.story-feature blockquote{margin:22px 0 0;padding-left:20px;border-left:4px solid var(--accent)}
.story-feature blockquote p{font-size:20px;font-style:italic;font-weight:400;line-height:1.45}
.story-feature footer{margin-top:8px;font:400 11px/1.5 var(--mono);letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}
.sketch-header{display:flex;justify-content:space-between;gap:12px;font:400 11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.pattern-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:10px;padding:28px 2px}
.pattern-cell{aspect-ratio:1;border-radius:50%;background:var(--tint)}
.pattern-cell.active{background:var(--accent)}
.sketch-controls{flex-wrap:wrap;gap:6px;padding-top:16px;border-top:1px solid var(--line)}
.sketch-controls button{min-height:44px;padding:10px 14px;border:1px solid var(--muted);font-size:14px}
.sketch-controls button[aria-pressed=true]{background:var(--accent);border-color:var(--accent);color:#fff}
.sketch-card code{display:block;margin-top:16px;font:400 13px/1.7 var(--mono);white-space:normal}
.sketch-card>p{margin-top:12px;font-size:14px}

/* Chapter 06: orange band */
.next-section{position:relative;overflow:hidden;background:var(--orange);color:var(--ink)}
.next-section .chapter-label{border-top-color:var(--ink)}
.next-section h2{position:relative;z-index:1;max-width:960px;font-size:clamp(48px,7vw,104px)}
.next-section>p{position:relative;z-index:1;max-width:720px;margin-top:28px;font-size:18px;line-height:1.5}
.next-section .pill{position:relative;z-index:1;margin-top:0}
.next-actions{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.pill-secondary{background:transparent;border-color:var(--ink);color:var(--ink)}
.pill-secondary:hover{filter:none;background:var(--ink);color:var(--orange)}
.next-section .organize{position:relative;z-index:1;margin-top:28px;font-size:16px;line-height:1.5}
.next-section .organize a{font-weight:500;text-underline-offset:4px}
.next-dot{position:absolute;right:7%;top:150px;width:220px;height:220px;border-radius:50%;background:var(--lime)}
.upcoming{position:relative;z-index:1;margin-top:40px;font:400 12px/1.7 var(--mono);letter-spacing:.06em;text-transform:uppercase}
.upcoming span{display:block;margin-top:6px;font:300 16px/1.5 var(--sans);text-transform:none;letter-spacing:0}


/* Footer */
.site-footer{display:flex;flex-wrap:wrap;align-items:center;gap:28px;padding:36px var(--gutter);border-top:1px solid var(--line)}
.site-footer p{font-size:14px;line-height:1.6}
.site-footer small{width:100%;font:400 11px/1.5 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.site-footer a:last-of-type{margin-left:auto;font-size:14px}

/* Dialogs: photographs and posters */
dialog{width:min(1000px,94vw);max-height:94vh;padding:24px;border:0;background:var(--paper);color:var(--ink);overflow:auto}
dialog::backdrop{background:rgba(24,24,26,.88)}
dialog img{display:block;width:100%;max-height:66vh;object-fit:contain;background:var(--stage)}
#poster-full{width:auto;max-width:100%;margin:0 auto}
.lightbox-toolbar,.lightbox-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:14px}
.lightbox-toolbar{margin-bottom:14px}
.lightbox-toolbar button,.lightbox-bottom button{min-height:44px;padding:10px 14px;border:1px solid var(--ink)}
.lightbox-bottom a{font-size:14px;font-weight:500}
dialog>p{margin:16px 0;font-size:15px;line-height:1.55}

@media (max-width:1000px){
 .hero-copy{grid-template-columns:1fr;gap:0}
 .anniversary-art{width:100%;max-width:520px;height:360px;justify-self:center}
 .art-number{font-size:250px}
 .origin-grid,.camp-grid{grid-template-columns:1fr;gap:32px}
 .section-heading{display:block}
 .section-heading>p{margin-top:20px}
 .timeline-layout{grid-template-columns:1fr}
 .era-note{display:none}
 .decade-facts{grid-template-columns:3fr 2fr}
 .phases{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
 .event-body{grid-template-columns:minmax(0,1fr) 150px}
 .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .poster-wall{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:720px){
 .masthead{gap:12px 16px;padding:12px var(--gutter)}
 .edition{display:none}
 .masthead nav{justify-content:flex-start;margin-left:0;gap:6px 16px;font-size:13px}
 .masthead nav a:nth-child(2){display:none}
 .site-header{align-items:flex-start;flex-direction:column;gap:.75rem;padding-block:1rem}
 .site-header nav{width:100%;justify-content:space-between;gap:0 1rem;font-size:11px}
 .site-header nav a{display:inline-flex;align-items:center;min-height:44px;padding-block:0}
 .hero{padding-top:26px}
 .hero-kicker{flex-direction:column;gap:4px}
 .hero h1{font-size:clamp(48px,14vw,72px)}
 .hero-copy{padding:30px 0 26px}
 .ten-feature{padding:52px var(--gutter)}
 .anniversary-art{height:300px;transform:none}
 .art-number{font-size:200px}
 .art-dot{left:44px;top:104px;width:44px;height:44px}
 .photo-ribbon{grid-template-columns:1fr 1fr;padding:6px;gap:6px}
 .ribbon-item:nth-child(3){display:none}
 .ribbon-item img{height:180px}
 .chapter{padding:52px var(--gutter) 60px}
 .chapter-label{flex-direction:column;gap:6px;margin-bottom:34px}
 .principle{flex-direction:column;align-items:flex-start;gap:18px}
 .principle .tiny-label{margin-left:0;text-align:left}
 .decade-band{padding:18px}
 .fact{padding:18px}
 .fact strong{font-size:44px}
 .phases{grid-template-columns:1fr}
 .filter-line{align-items:flex-start;flex-direction:column}
 .location-filters button,.gallery-filters button{padding:9px 12px}
 .event{grid-template-columns:1fr;gap:12px;padding:26px 0}
 .event-body{grid-template-columns:minmax(0,1fr)}
 .event-poster img{width:150px;max-height:210px}
 .poster-wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 16px}
 .event-chart{gap:4px;height:260px}
 .chart-column{padding:6px 1px 10px}
 .chart-blocks{gap:4px;height:150px}
 .chart-block{height:26px}
 .chart-total{font-size:12px}
 .chart-year{align-self:center;margin-top:8px;font-size:11px;writing-mode:vertical-rl;transform:rotate(180deg)}
 .chart-footnote{flex-direction:column;gap:8px}
 .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 14px}
 .gallery-item:first-child{grid-column:1/-1}
 .camp-grid h2{font-size:clamp(40px,11vw,56px)}
 .next-dot{display:none}
 .site-footer{flex-direction:column;align-items:flex-start}
 .site-footer a:last-of-type{margin-left:0}
 dialog{padding:16px}
 .lightbox-bottom{flex-wrap:wrap;gap:10px}
}
@media (prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*:before,*:after{animation:none!important;transition:none!important}
}

/* Community in numbers: anonymized aggregates, shown on the dark numbers band */
.community{margin-top:0}
.community-note{max-width:380px;font-size:15px;color:var(--line)}
.community-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin-top:32px;background:var(--dark-line)}
.community-grid>div{padding:28px 26px;background:var(--ink)}.community-grid strong{display:block;font:700 clamp(40px,4.4vw,60px)/1 var(--sans);letter-spacing:-.03em;color:var(--lime);font-variant-numeric:tabular-nums}
.community-grid span{display:block;margin-top:14px;font-size:15px;line-height:1.5;color:var(--surface)}
.community-grid .community-label{font-size:18px;font-weight:600;line-height:1.3}
.community-grid .community-label+span{margin-top:8px;font-size:14px;color:var(--line)}
.community-grid .community-label a{text-underline-offset:4px}
.community-coverage{max-width:720px;margin-top:24px;font-size:15px;line-height:1.6;color:var(--line)}
.community-method{display:grid;gap:10px;margin-top:32px;font-size:14px;line-height:1.6;color:var(--line)}
.community-method li{position:relative;padding-left:20px}
.community-method li:before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;background:var(--lime)}

/* Upcoming festivals and camps: shown on the page, never counted as completed records */
.upcoming-tag{display:inline-block;margin-left:8px;padding:3px 8px;background:var(--lime);color:var(--ink);font:400 11px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;vertical-align:middle}
.camp-tag{display:inline-block;margin-left:8px;padding:3px 8px;background:var(--camp);color:var(--ink);font:400 11px/1.4 var(--mono);letter-spacing:.06em;text-transform:uppercase;vertical-align:middle}
.people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:0 32px;margin-top:32px}
.person{border-top:1px solid var(--line)}
.person summary{cursor:pointer;display:flex;justify-content:space-between;gap:12px;padding:14px 0;font:600 18px/1.3 var(--sans);list-style:none}
.person summary::-webkit-details-marker{display:none}
.person summary::after{content:"+";font:400 18px/1.3 var(--mono);color:var(--muted)}
.person[open] summary::after{content:"−"}
.person summary:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.person-roles{list-style:none;margin:0 0 14px;padding:0;font:400 11px/1.6 var(--mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
@media (max-width:720px){
 .community-grid{grid-template-columns:1fr}
}
@media (max-width:420px){
 .community-grid{grid-template-columns:1fr}
}

/* Layout, October 9, 2026: the year panel sits under the chart, and long descriptions and the poster wall fold away */
.chart-band{margin-top:40px;padding:32px;background:var(--ink);color:var(--surface)}
.chart-band :focus-visible{outline-color:var(--lime)}
.chart-band .source-note{color:var(--line)}
.chart-column.is-selected{border-color:var(--lime)}
.read-more{margin-top:10px}
.read-more summary{display:inline-block;min-height:44px;padding:10px 0;cursor:pointer;font:500 14px/1.4 var(--sans);text-decoration:underline;text-underline-offset:4px;list-style:none}
.read-more summary::-webkit-details-marker{display:none}
.read-more summary::after{content:" +"}
.read-more[open] summary::after{content:" -"}
.browse-intro{margin-top:24px}
.browse-intro p{max-width:600px;margin-top:12px;font-size:16px}
.browse-posters .poster-wall{margin-top:32px}
@media (max-width:720px){.chart-band{padding:20px}}
@media (max-width:720px){.story-feature{margin-top:44px;padding:22px}}