/* Archive layout. Palette and component styles are inherited from the event. */
:root { --panel:var(--bg-elevated); --quiet:var(--text-muted); --highlight:var(--accent); --highlight-ink:var(--accent-strong); --soft:var(--bg-sunken); }
:root[data-edition="oropa"] { --panel:var(--bg-elev); --quiet:var(--text-muted); --highlight:var(--gold); --highlight-ink:var(--gold); --soft:var(--bg-elev-2); --positive:var(--green); --negative:var(--red); --secondary:var(--blue); }
.archive { margin:0; line-height:1.6; min-height:100dvh; overflow-wrap:break-word; }
.archive *, .archive *::before, .archive *::after { box-sizing:border-box; }
.archive [hidden] { display:none !important; }
.archive button, .archive input, .archive select, .archive textarea { font:inherit; }
.archive a { color:var(--secondary); }
.archive button, .archive a { -webkit-tap-highlight-color:transparent; }
.archive :focus-visible { outline:3px solid var(--highlight); outline-offset:4px; }
.archive h1 { font-size:clamp(1.9rem,5vw,2.8rem); line-height:1.15; letter-spacing:-.04em; margin:0 0 16px; }
.archive h2 { font-size:1.25rem; margin:0 0 12px; line-height:1.35; }
.archive h3 { font-size:1.05rem; line-height:1.45; margin:0; }
.archive p { margin:0 0 16px; }
.archive button { cursor:pointer; }
.archive button:disabled { opacity:.5; cursor:default; }
.skip-link { position:fixed; top:8px; left:8px; z-index:100; transform:translateY(-150%); background:var(--panel); padding:12px; }
.skip-link:focus { transform:none; }
.archive-header { border-bottom:1px solid var(--border); background:var(--panel); }
.header-inner { max-width:1200px; margin:auto; min-height:88px; padding:18px 28px; display:flex; align-items:center; gap:22px; }
.archive-brand { display:flex; gap:12px; align-items:center; font-size:1.15rem; font-weight:800; text-decoration:none; color:var(--text) !important; letter-spacing:-.025em; }
.archive-brand > span:first-child { font-size:1.8rem; }
.archive-brand small { display:block; font-size:.73rem; font-weight:500; letter-spacing:.06em; opacity:.75; margin-top:2px; }
.archive-tag { margin-left:auto; border:1px solid var(--border); border-radius:999px; padding:4px 12px; font-size:.75rem; color:var(--quiet); }
.archive-nav { display:flex; gap:6px; }
.archive-nav a { text-decoration:none; color:var(--text); padding:9px 14px; font-size:.86rem; font-weight:650; border-radius:9px; white-space:nowrap; }
.archive-nav a.active { background:var(--soft); color:var(--highlight-ink); }
[data-edition="bologna"] .archive-header { background:var(--header-bg); border-color:var(--header-border); }
[data-edition="bologna"] .archive-brand, [data-edition="bologna"] .archive-nav a { color:var(--header-text) !important; }
[data-edition="bologna"] .archive-nav { margin-left:auto; }
[data-edition="bologna"] .archive-nav a.active { background:var(--header-active-bg); color:var(--header-active-text) !important; }
.theme-button { background:transparent; border:1px solid var(--header-border); color:var(--header-text); border-radius:50%; width:40px; height:40px; font-size:1.3rem !important; flex-shrink:0; }
.archive-main { max-width:1144px; padding:48px 28px 24px; margin:auto; min-height:65vh; }
.archive-main:focus { outline:none; }
.archive-main.narrow { max-width:860px; }
.eyebrow { text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; font-weight:800; color:var(--highlight-ink); display:block; margin-bottom:12px; }
.intro { margin-bottom:32px; }
.intro p { color:var(--quiet); max-width:65ch; }
.stat-strip { display:flex; gap:24px; flex-wrap:wrap; font-size:.85rem; color:var(--quiet); padding-top:8px; }
.stat-strip strong { color:var(--text); font-size:1.2rem; margin-right:5px; }
.archive-panel { border:1px solid var(--border); background:var(--panel); border-radius:14px; padding:24px; margin-bottom:20px; }
.champion { border-top:3px solid var(--highlight); display:flex; align-items:center; gap:24px; padding:30px; margin-bottom:32px; }
.champion-icon { font-size:3rem; }
.champion h2 { font-size:1.6rem; margin-bottom:4px; }
.champion .eyebrow { margin-bottom:6px; }
.champion-score { margin-left:auto; text-align:right; font-weight:800; font-size:2rem; color:var(--highlight-ink); }
.champion-score small { display:block; font-size:.72rem; color:var(--quiet); font-weight:500; }
.rank-list { list-style:none; padding:0; margin:16px 0; }
.rank-row { background:var(--panel); border:1px solid var(--border); border-radius:12px; display:flex; gap:16px; align-items:center; margin-bottom:10px; padding:17px 20px; }
.rank { width:34px; flex-shrink:0; text-align:center; font-size:1.15rem; color:var(--quiet); font-weight:700; }
.rank-name { flex:1; min-width:0; font-weight:650; }
.rank-name small { display:block; font-size:.74rem; font-weight:400; color:var(--quiet); }
.rank-points { font-size:1.15rem; font-weight:750; font-variant-numeric:tabular-nums; }
.note { font-size:.85rem; color:var(--quiet); }
.notice { padding:24px; border:1px dashed var(--border); border-radius:12px; background:var(--panel); }
.notice h2 { margin-bottom:8px; }
.notice p { color:var(--quiet); margin:0; }
.category-tabs { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px; }
.category-tabs a { display:inline-flex; text-decoration:none; padding:10px 16px; border:1px solid var(--border); border-radius:999px; font-size:.83rem; font-weight:650; color:var(--quiet); background:var(--panel); }
.category-tabs a.active { background:var(--highlight); color:#1c2540; border-color:var(--highlight); }
.task-top { display:flex; align-items:flex-start; gap:16px; justify-content:space-between; margin-bottom:16px; }
.task-number { display:block; color:var(--quiet); font-size:.72rem; margin-bottom:5px; letter-spacing:.06em; text-transform:uppercase; }
.point-pill { flex-shrink:0; border:1px solid var(--border); color:var(--highlight-ink); border-radius:999px; padding:3px 10px; font-size:.76rem; font-weight:700; }
.prose { white-space:pre-wrap; line-height:1.8; font-size:.95rem; }
.scratchpad { display:block; margin-top:20px; color:var(--quiet); font-size:.78rem; }
.archive textarea, .archive select, .archive input { background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:9px; padding:11px 12px; font-size:16px; min-width:0; }
.archive textarea { display:block; width:100%; min-height:80px; resize:vertical; margin:6px 0 16px; }
.action-button { display:inline-flex; align-items:center; justify-content:center; gap:8px; background:var(--highlight); color:#1c2540 !important; border:1px solid var(--highlight); border-radius:9px; padding:11px 18px; font-size:.85rem !important; font-weight:700 !important; text-decoration:none; }
.small-button { border:1px solid var(--border); background:var(--soft); color:var(--text); border-radius:8px; padding:8px 12px; font-size:.82rem !important; }
.solution { padding:20px; border-left:3px solid var(--positive); background:var(--soft); border-radius:0 9px 9px 0; margin-top:18px; }
.solution p:last-child { margin-bottom:0; }
.solution-title { display:block; color:var(--positive); font-size:.72rem; text-transform:uppercase; font-weight:800; letter-spacing:.08em; margin-bottom:10px; }
.filters { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:20px; }
.filters label { display:flex; flex-direction:column; gap:6px; color:var(--quiet); font-size:.78rem; }
.gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.photo-card { margin:0; border:1px solid var(--border); border-radius:12px; background:var(--panel); overflow:hidden; }
.photo-open { border:0; padding:0; display:block; width:100%; background:var(--soft); }
.photo-open img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:cover; transition:transform .2s; }
.photo-open:hover img { transform:scale(1.025); }
.photo-card figcaption { padding:14px 16px; font-size:.8rem; }
.photo-card figcaption strong { display:block; margin-bottom:4px; }
.photo-card figcaption span { color:var(--quiet); }
.badge { display:inline-block; font-size:.67rem; border:1px solid var(--border); border-radius:999px; padding:1px 7px; margin-top:8px; }
.badge.accepted { color:var(--positive); }.badge.refused { color:var(--negative); }.badge.pending { color:var(--quiet); }
.example-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:16px; }
.example-grid img { width:100%; aspect-ratio:1; object-fit:cover; display:block; border-radius:7px; }
.example-grid .photo-open { border-radius:7px; overflow:hidden; }
.photo-viewer { background:var(--panel); color:var(--text); border:1px solid var(--border); border-radius:14px; padding:18px; width:min(900px,95vw); max-height:94dvh; }
.photo-viewer::backdrop { background:rgba(0,0,0,.85); }
.viewer-top, .viewer-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:.8rem; }
.viewer-top { margin-bottom:14px; color:var(--quiet); }
.photo-viewer img { display:block; width:100%; max-height:64dvh; object-fit:contain; background:var(--bg); }
.photo-viewer p { font-size:.85rem; margin:14px 0; }
.story-toc { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:24px; }
.story-toc a { padding:6px 13px; background:var(--panel); border:1px solid var(--border); border-radius:7px; text-decoration:none; font-size:.8rem; }
.story-section { scroll-margin-top:20px; }
.story-section > h2 { color:var(--highlight-ink); }
.story-image { width:min(100%,500px); height:auto; display:block; border-radius:9px; margin:24px auto; }
.story-question { border-top:1px solid var(--border); margin-top:24px; padding-top:24px; }
.story-question .task-top { margin-bottom:4px; }
.conundrum { border-top:3px solid var(--highlight); }
.archive blockquote { border-left:2px solid var(--border); margin:16px 0 24px; padding-left:16px; color:var(--quiet); font-size:.85rem; font-style:italic; }
.guided > summary { cursor:pointer; font-weight:700; padding:6px 0; }
.guided > p { color:var(--quiet); font-size:.85rem; margin:16px 0; }
.games-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; margin-bottom:24px; }
.game-card { display:flex; flex-direction:column; margin:0; }
.game-card .game-symbol { font-size:2rem; margin-bottom:16px; }
.game-card p { font-size:.88rem; color:var(--quiet); flex:1; }
.game-card a { align-self:flex-start; }
.archive-footer { margin:36px auto 0; padding:28px; text-align:center; border-top:1px solid var(--border); color:var(--quiet); font-size:.75rem; }
.archive-footer span { opacity:.75; }
[data-edition="oropa"] .archive-footer { padding-bottom:110px; }
[data-edition="oropa"] > body > .archive-nav { position:fixed; bottom:0; left:0; right:0; background:var(--bg); border-top:1px solid var(--border); padding:6px max(8px,calc((100% - 760px)/2)) calc(8px + env(safe-area-inset-bottom)); z-index:30; justify-content:center; }
[data-edition="oropa"] > body > .archive-nav a { flex:1; text-align:center; font-size:.75rem; padding:6px 10px; }
[data-edition="oropa"] > body > .archive-nav a span { display:block; font-size:1.2rem; }
[data-edition="oropa"] > body > .archive-nav a.active { background:transparent; color:var(--gold); }
@media(max-width:760px) { .header-inner { flex-wrap:wrap; padding:16px 20px; gap:16px; }.archive-brand {font-size:1rem;} [data-edition="bologna"] .header-inner .archive-nav { order:3; width:100%; justify-content:center; margin:0; } .theme-button { margin-left:auto; } .archive-main {padding:32px 20px 20px;} .gallery {grid-template-columns:repeat(2,minmax(0,1fr));} .archive-panel {padding:20px;} .champion {gap:14px; padding:22px;} .champion h2 {font-size:1.2rem;} .champion-icon {font-size:2rem;} .champion-score {font-size:1.5rem;} .filters {grid-template-columns:1fr;} }
@media(max-width:420px) { .header-inner {padding:14px 16px;}.archive-main {padding:28px 16px 16px;} .gallery,.games-grid {grid-template-columns:1fr;} .champion {flex-wrap:wrap;} .champion-score {margin-left:0; text-align:left; width:100%;} .rank-row {padding:14px 12px;gap:10px;} .example-grid {grid-template-columns:repeat(2,minmax(0,1fr));}.viewer-actions {flex-wrap:wrap;}.archive-nav a {padding:8px 10px;font-size:.8rem;} }
@media(prefers-reduced-motion:reduce) { .archive *, .archive *::before {transition:none !important;animation:none !important;scroll-behavior:auto !important;} }

.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}