:root{color-scheme:light;--paper:#f8f6f0;--paper-light:#fffefa;--ink:#252722;--muted:#6f7169;--line:#aaa99e;--line-soft:#d4cec1;--accent:#9b4a3d;--olive:#596254}
*{box-sizing:border-box}body{min-height:100vh;margin:0;background:linear-gradient(rgba(63,63,55,.025) 1px,transparent 1px),var(--paper);background-size:100% 28px;color:var(--ink);font-family:"Helvetica Neue","PingFang SC",Arial,sans-serif}body:before{position:fixed;z-index:-1;inset:0;background:linear-gradient(90deg,transparent 49.8%,rgba(91,87,77,.035) 50%,transparent 50.2%);content:""}button{font:inherit}.app-shell{width:min(1500px,calc(100% - 56px));min-height:100vh;margin:auto;padding:34px 0 42px}.topbar{display:flex;align-items:flex-end;justify-content:space-between;min-height:108px;margin-bottom:18px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);padding:20px 0 16px}.topbar:after{content:"ARCHIVE  /  2023—2026";color:var(--muted);font:11px ui-monospace,monospace;letter-spacing:.12em}.eyebrow{margin:0 0 9px;color:var(--accent);font:700 .68rem ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase}h1,h2,p{margin-top:0}h1,h2{font-family:Georgia,"Songti SC",serif;font-weight:500}h1{margin-bottom:0;font-size:clamp(2rem,4vw,4.25rem);line-height:.9;letter-spacing:-.045em}
.workspace{display:grid;grid-template-columns:minmax(0,1fr) clamp(380px,30vw,500px);min-height:680px;border-bottom:1px solid var(--ink)}.map-panel,.story-panel{position:relative;border-radius:0;background:transparent;box-shadow:none}.map-panel{display:flex;min-height:680px;flex-direction:column;gap:34px;overflow:hidden;border-right:1px solid var(--ink);padding:52px 50px 30px 0}.memory-map{position:relative;flex:0 0 260px;height:260px;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);background-image:linear-gradient(90deg,rgba(72,71,64,.07) 1px,transparent 1px);background-size:10% 100%}.timeline-line{position:absolute;top:50%;left:4%;width:92%;height:1px;background:var(--ink);transform:translateY(-50%)}.timeline-line:before,.timeline-line:after{position:absolute;top:-3px;width:7px;height:7px;border:1px solid var(--ink);background:var(--paper-light);content:""}.timeline-line:before{left:0}.timeline-line:after{right:0}
.year-point{position:absolute;z-index:3;display:grid;grid-template-rows:1fr 1fr;min-width:78px;min-height:132px;place-items:center;border:0;border-radius:0;padding:0;background:transparent;color:var(--ink);cursor:pointer;transform:translate(-50%,-50%);transition:color .16s,transform .16s}.year-point:after{position:absolute;top:calc(50% - 5px);width:9px;height:9px;border:1px solid var(--ink);background:var(--paper-light);content:""}.year-point:hover{transform:translate(-50%,calc(-50% - 3px))}.year-point:hover:after,.year-point.active:after{background:var(--accent)}.year-point strong{align-self:end;margin-bottom:18px;font:500 1.15rem Georgia,"Songti SC",serif}.year-point span{align-self:start;margin-top:22px;color:var(--muted);font:600 .58rem ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase}.year-point.active strong,.year-point.active span{color:var(--accent)}.year-stem{position:absolute;z-index:1;top:50%;width:1px;height:78px;background:var(--line);transform:translate(-50%,-50%)}
.song-list-panel{position:relative;min-height:300px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px;border-bottom:1px solid var(--ink);padding-bottom:13px}.section-heading h2{margin:0;font-size:clamp(1.6rem,3vw,2.6rem)}.section-heading span{color:var(--muted);font:12px ui-monospace,monospace}.song-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));border-top:1px solid var(--line-soft);border-left:1px solid var(--line-soft)}.song-row{position:relative;min-height:76px;border:0;border-right:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);border-radius:0;padding:14px 16px 12px;background:rgba(251,248,241,.42);color:var(--ink);text-align:left;cursor:pointer;transition:background .15s}.song-row:before{position:absolute;top:0;left:0;width:3px;height:0;background:var(--accent);content:"";transition:height .15s}.song-row:hover,.song-row.active{background:var(--paper-light)}.song-row:hover:before,.song-row.active:before{height:100%}.song-row strong,.song-row span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.song-row strong{margin-bottom:7px;font:500 .94rem Georgia,"Songti SC",serif}.song-row span{color:var(--muted);font-size:.72rem}
.story-panel{display:flex;min-width:0;flex-direction:column;padding:52px 0 30px 42px;transition:opacity .14s,transform .14s}.story-panel:before{display:block;width:46px;margin-bottom:52px;border-top:7px solid var(--accent);content:""}.story-panel.is-switching{opacity:.58;transform:translateY(3px)}.story-panel h2{max-width:10em;margin-bottom:10px;font-size:clamp(2rem,4vw,3.8rem);line-height:1.05;letter-spacing:-.035em}.artist{margin-bottom:34px;color:var(--olive);font-size:.88rem}.story{max-width:38em;border-top:1px solid var(--line-soft);padding-top:22px;color:#4f514b;font:1rem/1.85 Georgia,"Songti SC",serif}.meta-row{display:flex;flex-wrap:wrap;gap:10px;margin:auto 0 18px}.meta-row span{border-left:3px solid var(--accent);padding:5px 0 5px 10px;color:var(--muted);font:11px ui-monospace,monospace;text-transform:uppercase}.source-actions{display:grid;overflow:hidden;border:1px solid var(--ink);border-radius:0;background:var(--paper-light)}.source-actions.has-embed{background:var(--paper-light)}.source-actions iframe{display:block;width:100%;height:152px;border:0;border-radius:0;filter:saturate(.55) contrast(.92)}.source-actions a{display:inline-flex;min-height:42px;margin:12px;align-items:center;justify-content:center;border:1px solid var(--ink);border-radius:0;background:transparent;color:var(--ink);font-size:.82rem;font-weight:700;text-decoration:none;transition:background .15s,color .15s}.source-actions a:hover{background:var(--ink);color:var(--paper-light)}.source-note{margin:0 12px 12px;color:var(--muted);font-size:.75rem;line-height:1.5}
@media(max-width:860px){.app-shell{width:min(100% - 28px,680px);padding:22px 0 30px}.topbar{align-items:flex-start}.topbar:after{display:none}.workspace{grid-template-columns:1fr;border-bottom:0}.map-panel{min-height:620px;border-right:0;border-bottom:1px solid var(--ink);padding:38px 0 28px}.memory-map{flex-basis:220px;height:220px}.story-panel{min-height:480px;padding:36px 0 28px}.story-panel:before{margin-bottom:34px}}
@media(max-width:520px){h1{font-size:2.55rem}.topbar{min-height:92px}.map-panel{min-height:680px}.year-point{min-width:64px;min-height:118px}.year-point strong{font-size:1rem}.year-point span{font-size:.5rem}.song-list-panel{min-height:0}.song-list{grid-template-columns:1fr}.story-panel h2{font-size:2.5rem}}
.source-actions.has-embed{border-radius:18px;background:#322f30}
.story-panel:before{margin-bottom:34px}
.song-row:before{display:none}
.song-row.active{z-index:1;box-shadow:inset 0 0 0 2px #81796d}

/* Archive-label timeline */
.memory-map{background-image:linear-gradient(90deg,rgba(72,71,64,.055) 1px,transparent 1px);background-size:12.5% 100%}
.timeline-line{top:50%;height:0;border-top:1px dashed #918b80;background:none}
.timeline-line:before,.timeline-line:after{top:-5px;width:7px;height:7px;border-color:#81796d;background:var(--paper)}
.year-stem{display:none}
.year-point{grid-template-rows:auto auto;min-width:116px;min-height:82px;gap:7px;border:1px solid #81796d;padding:13px 14px 11px;background:var(--paper-light);box-shadow:4px 4px 0 var(--paper);transition:background-color .16s,color .16s,transform .16s,box-shadow .16s}
.year-point:after{display:none}
.year-point:hover{transform:translate(-50%,calc(-50% - 3px));box-shadow:4px 7px 0 var(--paper)}
.year-point strong{align-self:auto;margin:0;font-size:1.22rem;line-height:1}
.year-point span{align-self:auto;margin:0;color:var(--muted);font-size:.56rem;line-height:1;letter-spacing:.1em}
.year-point.active{border-color:var(--accent);background:var(--accent);color:var(--paper-light);box-shadow:4px 4px 0 #d9cec2}
.year-point.active strong,.year-point.active span{color:var(--paper-light)}
@media(max-width:520px){.year-point{min-width:76px;min-height:72px;padding:11px 7px 9px}.year-point strong{font-size:1rem}.year-point span{font-size:.46rem;letter-spacing:.04em}}
.song-row.active{z-index:1;background:var(--accent);color:var(--paper-light);box-shadow:4px 4px 0 #d9cec2}
.song-row.active span{color:#f1e7df}
.topbar{border-bottom:0}
.workspace{border-bottom:0}