:root { --ink:#191711; --paper:#e6dcc5; --paper-dim:#c4b89e; --brass:#b99255; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Courier New",Courier,monospace; background-image:linear-gradient(rgba(25,23,17,.025) 1px,transparent 1px); background-size:100% 5px; }
a { color:inherit; }
::selection { background:var(--brass); color:var(--ink); }
.topbar { height:68px; padding:0 clamp(20px,5vw,74px); display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(230,220,197,.18); background:var(--ink); color:var(--paper); font-size:12px; letter-spacing:.08em; position:relative; z-index:2; }
.wordmark { text-decoration:none; font-weight:700; }
.navlinks { display:flex; gap:clamp(18px,4vw,46px); }
.navlinks a { text-decoration:none; color:var(--paper-dim); }
.navlinks a:hover,.navlinks a:focus-visible { color:var(--brass); }
.hero { min-height:620px; position:relative; display:grid; place-items:center; overflow:hidden; isolation:isolate; background:var(--ink); color:var(--paper); border-bottom:1px solid var(--ink); }
.hero-map { position:absolute; inset:0; z-index:-2; background:url('assets/resonara-map.png') center/cover no-repeat; filter:grayscale(.5) sepia(.4) contrast(1.15); opacity:.22; }
.hero::after { content:""; position:absolute; inset:0; z-index:-1; background:radial-gradient(circle,transparent 0 15%,rgba(25,23,17,.35) 45%,rgba(25,23,17,.94) 90%); }
.hero-copy { width:min(820px,calc(100% - 40px)); text-align:center; padding:80px 0; }
.eyebrow { margin:0 0 24px; color:var(--brass); font-size:11px; letter-spacing:.16em; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:Georgia,"Times New Roman",serif; font-weight:400; }
h1 { font-size:clamp(68px,11vw,136px); line-height:.78; letter-spacing:-.055em; margin-bottom:36px; }
.lede { max-width:610px; margin:0 auto 36px; color:var(--paper-dim); font-size:clamp(14px,2vw,17px); line-height:1.7; }
.actions { display:flex; justify-content:center; gap:10px; flex-wrap:wrap; }
.button { min-width:220px; padding:15px 18px; border:1px solid rgba(230,220,197,.45); text-decoration:none; font-size:11px; letter-spacing:.08em; }
.button:hover,.button:focus-visible { border-color:var(--brass); color:var(--brass); }
.button.primary { background:var(--paper); color:var(--ink); border-color:var(--paper); cursor:not-allowed; }
.button small { color:#7a705d; font-size:9px; }
.signal { position:absolute; bottom:28px; display:flex; align-items:center; gap:4px; color:var(--brass); opacity:.65; }
.signal span:nth-child(3) { padding:0 3px; }
.quote { padding:36px 20px; border-bottom:1px solid var(--ink); text-align:center; position:relative; }
.quote p { font-family:Georgia,serif; font-style:italic; font-size:clamp(19px,3vw,27px); margin-bottom:10px; }
.quote cite { font-style:normal; color:#655f53; font-size:10px; letter-spacing:.11em; text-transform:uppercase; }
.quote button { display:block; margin:18px auto 0; border:0; background:transparent; color:#76591f; cursor:pointer; font-size:8px; letter-spacing:.1em; }
.quote button:hover,.quote button:focus-visible { color:var(--ink); text-decoration:underline; }
.world,.echoes,.contribute { padding:clamp(72px,10vw,130px) clamp(20px,7vw,100px); }
.world { border-bottom:1px solid var(--ink); }
.section-heading { display:grid; grid-template-columns:1fr 2fr; align-items:end; margin-bottom:56px; }
.section-heading>p { font-size:10px; letter-spacing:.14em; }
h2 { font-size:clamp(48px,7vw,86px); line-height:.95; letter-spacing:-.045em; margin-bottom:0; }
.records { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--ink); border-left:1px solid var(--ink); }
.record { padding:24px; min-height:285px; border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.record-top { display:flex; justify-content:space-between; color:#736b5b; font-size:10px; }
.record h3 { margin:62px 0 18px; font-family:Georgia,serif; font-weight:400; font-size:25px; }
.record p,.echo-grid p { color:#514c42; font-size:13px; line-height:1.75; }
.echoes { background:var(--ink); color:var(--paper); }
.echo-grid { display:grid; grid-template-columns:1.2fr 1fr; gap:12vw; align-items:end; }
.echo-grid em { color:var(--brass); font-weight:400; }
.echo-grid p { color:var(--paper-dim); max-width:560px; }
.echo-grid p:last-child { margin-bottom:0; }
.contribute { display:grid; grid-template-columns:1fr 1fr; gap:10vw; align-items:end; border-bottom:1px solid var(--ink); }
.contribute-links { border-top:1px solid var(--ink); }
.contribute-links a { display:flex; justify-content:space-between; padding:20px 4px; border-bottom:1px solid var(--ink); text-decoration:none; font-size:11px; letter-spacing:.05em; }
.contribute-links a:hover,.contribute-links a:focus-visible { color:#76591f; padding-left:10px; }
.contribute-links .support-link { align-items:center; gap:24px; }
.support-link img { width:126px; height:auto; display:block; border-radius:8px; }
.funding-ledger { grid-column:1/-1; margin-top:clamp(55px,8vw,100px); padding-top:34px; border-top:1px solid var(--ink); }
.funding-heading { display:grid; grid-template-columns:1.2fr .8fr; gap:10vw; align-items:end; margin-bottom:36px; }
.funding-heading h3 { margin:0; font:400 clamp(32px,4vw,52px)/1 Georgia,"Times New Roman",serif; }
.funding-heading>p { margin:0; color:#514c42; font-size:11px; line-height:1.7; }
.funding-grid { display:grid; grid-template-columns:1fr 1fr; border-top:1px solid var(--ink); border-left:1px solid var(--ink); }
.funding-meter { min-height:225px; padding:18px; display:flex; flex-direction:column; border-right:1px solid var(--ink); border-bottom:1px solid var(--ink); }
.funding-label { display:flex; justify-content:space-between; gap:20px; color:#655f53; font-size:7px; letter-spacing:.08em; }
.funding-label span:last-child { color:#76591f; text-align:right; }
.funding-meter h4 { margin:24px 0 8px; font:400 22px/1.1 Georgia,"Times New Roman",serif; }
.funding-numbers { display:grid; grid-template-columns:auto 1fr auto; align-items:end; gap:9px; margin-bottom:12px; }
.funding-numbers strong { font:400 30px/1 Georgia,"Times New Roman",serif; }
.funding-numbers>span { padding-bottom:3px; color:#655f53; font-size:8px; letter-spacing:.08em; }
.funding-numbers b { color:#76591f; font:400 18px/1 Georgia,"Times New Roman",serif; }
.funding-track { height:14px; padding:2px; overflow:hidden; border:1px solid var(--ink); background:repeating-linear-gradient(90deg,transparent 0,transparent calc(10% - 1px),rgba(25,23,17,.18) calc(10% - 1px),rgba(25,23,17,.18) 10%); }
.funding-track span { width:0; height:100%; display:block; background:var(--brass); transition:width .55s ease; }
.funding-meter.funded .funding-track span { background:var(--ink); }
.funding-meter.funded .funding-numbers b,.funding-meter.funded [data-funding-status] { color:#76591f; }
.funding-foot { margin-top:auto; padding-top:12px; display:flex; justify-content:space-between; align-items:end; gap:24px; }
.funding-foot p { max-width:390px; margin:0; color:#514c42; font-size:9px; line-height:1.45; }
.funding-foot span { color:#655f53; font-size:7px; letter-spacing:.07em; text-align:right; white-space:nowrap; }
footer { min-height:110px; padding:30px clamp(20px,5vw,74px); display:flex; justify-content:space-between; align-items:center; font-size:10px; letter-spacing:.1em; }
.footer-link { color:#76591f; text-decoration:none; }
.footer-link:hover,.footer-link:focus-visible { color:var(--ink); text-decoration:underline; text-underline-offset:4px; }
.back { color:var(--paper-dim); text-decoration:none; font-size:10px; }
.annals-header { padding:clamp(80px,12vw,150px) clamp(20px,12vw,170px) 70px; border-bottom:1px solid var(--ink); }
.annals-header h1 { color:var(--ink); margin-bottom:34px; }
.annals-header>p:last-child { max-width:620px; color:#514c42; line-height:1.7; font-size:13px; }
.annals-list { padding:0 clamp(20px,12vw,170px) 100px; }
.annal { display:grid; grid-template-columns:90px 1fr auto; gap:30px; padding:34px 0; border-bottom:1px solid var(--ink); }
.annal>span { font-size:10px; color:#655f53; }
.annal p { font-size:11px; letter-spacing:.05em; color:#655f53; }
.annal div>p:last-child { max-width:600px; line-height:1.6; }
.annal h2 { font-size:clamp(31px,5vw,52px); margin:10px 0 18px; }
.disclosure-header { padding:clamp(72px,10vw,122px) clamp(20px,12vw,170px) clamp(44px,7vw,72px); background:var(--ink); color:var(--paper); border-bottom:1px solid var(--ink); }
.disclosure-header .eyebrow { margin-bottom:22px; }
.disclosure-header h1 { max-width:940px; margin-bottom:28px; font-size:clamp(58px,9vw,112px); }
.disclosure-header>p:last-child { max-width:670px; margin-bottom:0; color:var(--paper-dim); font-size:13px; line-height:1.75; }
.disclosure-article { padding:clamp(48px,7vw,84px) clamp(20px,16vw,240px) clamp(64px,9vw,110px); border-bottom:1px solid var(--ink); }
.disclosure-article p { max-width:900px; margin:0 auto 1.35em; color:#413c34; font:400 clamp(18px,2vw,23px)/1.75 Georgia,"Times New Roman",serif; }
.disclosure-article p:first-child::first-letter { float:left; margin:.08em .12em 0 0; color:#76591f; font-size:3.4em; line-height:.78; }
.disclosure-signoff { max-width:900px; margin:38px auto 0; padding-top:20px; border-top:1px solid var(--ink); color:#76591f; font-size:10px; letter-spacing:.12em; }
@media (max-width:720px) { .navlinks a:first-child { display:none; } .hero { min-height:560px; } .section-heading,.echo-grid,.contribute,.funding-heading { grid-template-columns:1fr; gap:42px; } .records,.funding-grid { grid-template-columns:1fr; } .record { min-height:auto; } .record h3 { margin-top:38px; } footer { align-items:flex-start; flex-direction:column; min-height:130px; } }
@media (max-width:600px) { .annal { grid-template-columns:55px 1fr; gap:14px; } .annal>span:last-child { display:none; } .back { font-size:0; } .back::after { content:"< BACK"; font-size:10px; } .contribute-links .support-link { align-items:flex-start; flex-direction:column; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
