:root{--ink:#353a37;--muted:#777b75;--paper:#f8f5ef;--white:#fffdf9;--blush:#efdeda;--sage:#dfe7dc;--blue:#dfe8eb;--cream:#eee5d3;--rule:rgba(53,58,55,.16)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;font-size:16px;line-height:1.6}.locked{overflow:hidden}.locked> :not(.lock-screen):not(script){visibility:hidden}.lock-screen{position:fixed;inset:0;z-index:100;background:var(--paper);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:2rem}.lock-screen[hidden]{display:none}.lock-mark{position:absolute;top:2rem;font-size:1.1rem;color:#a3908b}.sound-toggle{position:absolute;top:1.8rem;right:2rem;border:0;border-bottom:1px solid var(--rule);background:transparent;color:var(--muted);font:500 .64rem "DM Sans";letter-spacing:.12em;text-transform:uppercase;padding:.4rem;cursor:pointer}.gatekeeper{position:absolute;left:clamp(2rem,6vw,7rem);bottom:7vh;width:clamp(150px,16vw,220px)}.gatekeeper svg{display:block;width:100%;overflow:visible}.gatekeeper-line{position:absolute;bottom:86%;left:54%;width:12rem;background:var(--white);border:1px solid var(--rule);border-radius:50%;padding:1rem 1.2rem;font:400 .95rem "Newsreader";line-height:1.2;transform:rotate(-3deg)}.gatekeeper-line::after{content:"";position:absolute;left:25%;bottom:-9px;width:16px;height:16px;background:var(--white);border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);transform:rotate(45deg)}.wizard-cloak{fill:#dfe7dc;stroke:#626a64;stroke-width:2}.wizard-hat{fill:#737c75;stroke:#4c534e;stroke-width:2}.wizard-hat-band{fill:#4f5751}.wizard-face{fill:#eadacd;stroke:#6c716d;stroke-width:2}.wizard-brow,.wizard-nose{fill:none;stroke:#5d625e;stroke-width:2;stroke-linecap:round}.wizard-eye{fill:#353a37}.wizard-beard{fill:#f2eee6;stroke:#747974;stroke-width:2}.wizard-arm,.wizard-staff{fill:none;stroke:#505751;stroke-width:4;stroke-linecap:round}.wizard-staff{stroke:#645849}.gatekeeper.speaking{animation:wizard-grumble .38s ease-in-out infinite alternate}.lock-screen h1{font-size:clamp(3.8rem,9vw,7.5rem)}.lock-copy{font:400 1.2rem "Newsreader";color:#656a65;margin:2rem 0 1.4rem}.lock-form{display:flex;align-items:center;border-bottom:1px solid var(--ink);width:min(360px,100%)}.lock-form input{flex:1;min-width:0;border:0;background:transparent;padding:.9rem .2rem;font:400 1rem "DM Sans";color:var(--ink);outline:0}.lock-form input::placeholder{color:#9a9c96}.lock-form button{border:0;background:transparent;color:var(--ink);font:500 .73rem "DM Sans";letter-spacing:.1em;padding:.9rem .2rem .9rem 1rem;cursor:pointer}.lock-form button span{margin-left:.5rem}.lock-error{min-height:1.5rem;font-size:.76rem;color:#9b5f5b;margin-top:.8rem}.skip-link{position:fixed;z-index:20;top:1rem;left:1rem;transform:translateY(-200%);background:var(--ink);color:white;padding:.6rem 1rem}.skip-link:focus{transform:none}.site-header{height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(1.4rem,5vw,5.5rem);position:absolute;width:100%;z-index:5}.wordmark{color:var(--ink);text-decoration:none;font:500 .78rem "DM Sans";letter-spacing:.18em}.wordmark span{font-size:.9rem;margin:0 .25rem}.site-header nav{display:flex;gap:2rem}.site-header nav a,.back-link{color:var(--ink);text-decoration:none;font-size:.8rem;letter-spacing:.08em;padding:.35rem 0;border-bottom:1px solid transparent}.site-header nav a:hover,.back-link:hover{border-color:currentColor}.menu-button{display:none;border:0;background:transparent}.hero{min-height:100vh;padding:9rem 1.5rem 5rem;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;position:relative}.eyebrow{text-transform:uppercase;letter-spacing:.19em;font-size:.66rem;font-weight:500;margin:0 0 1.6rem;color:var(--muted)}h1,h2,h3{font-family:"Newsreader",serif;font-weight:400;line-height:.95;margin:0}h1{font-size:clamp(4rem,10vw,8.6rem);letter-spacing:-.055em}h1 em{font-weight:400;color:#7b8178}.subtitle{font-family:"Newsreader",serif;font-size:clamp(1.15rem,2vw,1.5rem);margin:2rem auto 2.8rem;color:#656a65}.start-button{display:inline-flex;align-items:center;gap:1.4rem;text-decoration:none;background:var(--ink);color:var(--white);padding:.8rem .9rem .8rem 1.4rem;border-radius:100px;font-size:.78rem;letter-spacing:.08em;transition:transform .2s,background .2s}.start-button span{width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12)}.start-button:hover{transform:translateY(-2px);background:#4b514d}.soft-line{position:absolute;bottom:2rem;width:min(560px,70%);border-top:1px solid var(--rule)}.soft-line span{position:absolute;top:-.75rem;background:var(--paper);padding:0 1rem;color:#a3908b}.chapters{padding:clamp(6rem,10vw,10rem) clamp(1.3rem,6vw,7rem);max-width:1440px;margin:auto}.section-heading{text-align:center;margin-bottom:4rem}.section-heading h2,.chapter-intro h2,.about h2{font-size:clamp(3rem,6vw,5.5rem);letter-spacing:-.045em}.chapter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.chapter-card{min-height:390px;padding:1.5rem;position:relative;display:flex;flex-direction:column;color:var(--ink);text-decoration:none;border:1px solid rgba(53,58,55,.06);transition:transform .3s ease,box-shadow .3s}.chapter-card:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(53,58,55,.08)}.chapter-card.blush{background:var(--blush)}.chapter-card.sage{background:var(--sage)}.chapter-card.blue{background:var(--blue)}.chapter-card.cream{background:var(--cream)}.number{font-size:.65rem;letter-spacing:.15em}.line-icon{margin:auto;font:400 2rem "Newsreader";opacity:.65}.line-icon.notes{font-family:serif}.chapter-card h3{font-size:2rem;margin-bottom:.6rem}.chapter-card p{font:400 1rem "Newsreader";max-width:15rem;margin:0;color:#656a65}.arrow{position:absolute;right:1.5rem;bottom:1.4rem}.chapter-section{min-height:92vh;padding:clamp(6rem,12vw,11rem) clamp(1.5rem,10vw,10rem);scroll-margin-top:0;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(3rem,8vw,9rem)}.blush-wash{background:#f2e8e4}.sage-wash{background:#e8ede4}.blue-wash{background:#e8eef0}.cream-wash{background:#f0eadd}.chapter-intro p:last-child{font:400 clamp(1.15rem,2vw,1.45rem) "Newsreader";max-width:31rem;color:#656a65}.empty-state{min-height:320px;border:1px solid rgba(53,58,55,.19);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem}.empty-state>span{font-size:1.5rem;margin-bottom:2rem;color:#858b83}.empty-state p{font:400 1.5rem "Newsreader";margin:0}.empty-state small{color:var(--muted);margin-top:.35rem}.back-link{position:absolute;align-self:end}.chapter-section{position:relative}.about{padding:10rem 1.5rem;text-align:center;max-width:760px;margin:auto}.about p:last-child{font:400 1.3rem "Newsreader";color:#646964;max-width:560px;margin:2rem auto 0}footer{border-top:1px solid var(--rule);padding:2rem clamp(1.5rem,5vw,5rem);display:flex;justify-content:space-between;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase}.footer-heart{position:absolute;left:50%;transform:translateX(-50%)}:focus-visible{outline:2px solid #6c7e75;outline-offset:4px}
@keyframes wizard-grumble{from{transform:rotate(-1deg)}to{transform:rotate(1deg) translateY(-2px)}}
@media(max-width:900px){.gatekeeper{position:relative;left:auto;bottom:auto;width:100px;margin:0 0 .8rem -1rem}.gatekeeper-line{left:78%;bottom:60%;width:10rem;font-size:.82rem}.lock-screen h1{font-size:clamp(3.3rem,12vw,5.5rem)}.lock-copy{margin:1.2rem 0 .8rem}.chapter-grid{grid-template-columns:1fr 1fr}.chapter-section{grid-template-columns:1fr;min-height:auto}.chapter-intro{padding-top:3rem}.empty-state{margin-bottom:5rem}}
@media(max-width:560px){.site-header{height:68px}.menu-button{display:flex;width:40px;height:40px;align-items:center;justify-content:center;flex-direction:column;gap:5px}.menu-button span:not(.sr-only){display:block;width:19px;height:1px;background:var(--ink)}.site-header nav{display:none;position:absolute;right:1.3rem;top:60px;background:var(--white);padding:1rem 1.4rem;flex-direction:column;gap:.5rem;box-shadow:0 12px 30px rgba(53,58,55,.1)}.site-header nav.open{display:flex}.chapter-grid{grid-template-columns:1fr}.chapter-card{min-height:330px}.hero{padding-top:7rem}h1{font-size:clamp(3.7rem,18vw,5.2rem)}footer{gap:1rem;flex-wrap:wrap}.footer-heart{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.wizard-staff{transform-box:fill-box;transform-origin:50% 100%}
.gatekeeper.speaking .wizard-staff{animation:staff-thump .72s cubic-bezier(.3,.8,.3,1)}
.gatekeeper.speaking .wizard-brow{animation:brow-glower .72s ease}
@keyframes staff-thump{0%{transform:rotate(0)}42%{transform:rotate(-10deg) translateY(-8px)}72%{transform:rotate(2deg) translateY(1px)}100%{transform:rotate(0)}}
@keyframes brow-glower{0%,100%{transform:translateY(0)}45%{transform:translateY(3px)}}

/* Cinematic bridge gate */
.lock-screen{background:#07101a;color:#f3eee4;align-items:stretch;text-align:left;overflow:hidden}
.storm-scene{position:absolute;inset:0;overflow:hidden;background:#07101a}
.storm-scene::after{content:"";position:absolute;z-index:3;inset:0;background:linear-gradient(90deg,rgba(2,7,12,.08) 0%,rgba(2,7,12,.2) 38%,rgba(2,7,12,.52) 61%,rgba(2,7,12,.74) 100%);pointer-events:none}
.storm-scene img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.84) contrast(1.06);transform:scale(1.015)}
.storm-base-frame{z-index:0}
.storm-strike-frame{z-index:1;opacity:0}
.lock-screen.strike-frame .storm-strike-frame{opacity:1}
.lock-screen.unlocking{pointer-events:none;animation:unlock-fade .85s cubic-bezier(.4,0,.2,1) forwards;animation-duration:.85s!important}
.lock-screen.unlocking::before{content:"";position:absolute;z-index:8;inset:0;background:#f7f3e9;pointer-events:none;animation:unlock-flash .85s ease-out forwards;animation-duration:.85s!important}
@keyframes unlock-flash{0%{opacity:0}12%{opacity:.92}32%{opacity:.2}100%{opacity:0}}
@keyframes unlock-fade{0%,28%{opacity:1}100%{opacity:0}}
.lock-panel{position:relative;z-index:4;width:min(620px,52vw);margin-left:auto;margin-right:clamp(2rem,8vw,9rem);display:flex;flex-direction:column;align-items:flex-start}
.lock-panel .eyebrow{color:#aebdca;margin-bottom:1.2rem;text-shadow:0 2px 16px #000}
.lock-panel h1{font-size:clamp(4rem,8vw,8.2rem);color:#f4efe5;text-shadow:0 4px 30px rgba(0,0,0,.72)}
.lock-panel h1 em{color:#bdcbd4}
.lock-copy{color:#c7d0d5;margin:1.7rem 0 1rem;text-shadow:0 2px 12px #000}
.lock-form{border-color:rgba(226,235,240,.66);width:min(410px,100%);background:rgba(4,10,16,.22);padding:0 .3rem;backdrop-filter:blur(5px)}
.lock-form input{color:#f4efe5}.lock-form input::placeholder{color:#9eadb7}.lock-form button{color:#f4efe5}
.lock-error{color:#e9b8af}
.sound-toggle{z-index:6;color:#d0d9df;border-color:rgba(220,230,236,.35);text-shadow:0 1px 8px #000}
@media(max-width:900px){.storm-scene img{object-position:25% center}.storm-scene::after{background:linear-gradient(180deg,rgba(2,7,12,.02),rgba(2,7,12,.15) 42%,rgba(2,7,12,.88) 77%)}.lock-panel{width:100%;margin:auto 0 0;padding-bottom:4vh;align-items:center;text-align:center}.lock-panel h1{font-size:clamp(3.2rem,13vw,5.7rem)}.gatekeeper-line{left:5vw;top:27%;width:170px;font-size:.85rem}.lock-copy{margin:.9rem 0 .6rem}.lock-form{width:min(360px,92vw)}.sound-toggle{top:1rem;right:1rem}}

/* One-time title reveal */
.hero>.eyebrow,.hero>h1,.hero>.subtitle,.hero>.start-button,.hero>.soft-line{z-index:2}
.cherub-reveal{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none;opacity:0;transition:opacity .35s ease}
.cherub{position:absolute;top:8%;height:84%;width:52%;object-fit:contain;filter:saturate(.82) contrast(.98);will-change:transform,opacity}
.cherub-left{left:-2%;object-position:left center;transform:translateX(15%);opacity:0}
.cherub-right{right:-2%;object-position:right center;transform:translateX(-15%);opacity:0}
.cherub-revealing .cherub-reveal,.cherub-settled .cherub-reveal{opacity:1}
.cherub-revealing .cherub-left{animation:cherub-pull-left 1.9s cubic-bezier(.22,.8,.25,1) forwards;animation-duration:1.9s!important}
.cherub-revealing .cherub-right{animation:cherub-pull-right 1.9s cubic-bezier(.22,.8,.25,1) forwards;animation-duration:1.9s!important}
.cherub-settled .cherub{opacity:.7;transform:translateX(0)}
@keyframes cherub-pull-left{0%{opacity:0;transform:translateX(15%) scale(.94)}24%{opacity:.82}100%{opacity:.7;transform:translateX(0) scale(1)}}
@keyframes cherub-pull-right{0%{opacity:0;transform:translateX(-15%) scale(.94)}24%{opacity:.82}100%{opacity:.7;transform:translateX(0) scale(1)}}

@media(max-width:900px){.cherub{top:16%;height:68%;width:58%;opacity:.55}.cherub-left{left:-12%}.cherub-right{right:-12%}.cherub-settled .cherub{opacity:.48}}

/* Grounded storybook treatment for the archive pages. The gate stays cinematic. */
.wordmark{font-family:"DM Sans",sans-serif;font-weight:500;letter-spacing:.14em}
.wordmark button{border:0;background:transparent;color:#9a5149;font:inherit;font-size:.78rem;letter-spacing:0;margin:0 .18rem;padding:.35rem .12rem;cursor:pointer}
.hero{background:linear-gradient(180deg,#faf7f0 0%,#f5efe4 100%)}
.hero>.eyebrow,.section-heading>.eyebrow,.about>.eyebrow{font-family:"DM Sans",sans-serif;font-weight:500;letter-spacing:.15em;color:#6e716b}
.hero>h1,.section-heading h2,.chapter-card h3,.chapter-intro h2,.about h2{font-family:"Alegreya",serif;font-weight:600}
.hero>h1{font-size:clamp(4rem,9vw,7.6rem);line-height:.86;letter-spacing:-.035em;color:#303934}
.hero>h1 em{font-family:inherit;font-style:normal;font-weight:600;color:#53645a;display:inline-block;transform:rotate(-.7deg)}
.hero>.subtitle{max-width:34rem;font-family:"DM Sans",sans-serif;font-size:clamp(.98rem,1.6vw,1.16rem);line-height:1.65;color:#555e58}
.hero>.start-button{border-radius:4px;background:#35433b;padding:.82rem .9rem .82rem 1.25rem;box-shadow:3px 3px 0 #b6a98e;text-transform:uppercase;font-size:.7rem;font-weight:500}
.hero>.start-button span{border-radius:3px}
.chapters{max-width:1380px}
.section-heading h2,.chapter-intro h2,.about h2{letter-spacing:-.025em;line-height:1}
.section-heading h2{font-size:clamp(3rem,5.5vw,5rem)}
.chapter-grid{gap:1.15rem}
.chapter-card{min-height:370px;border:1px solid rgba(53,58,55,.26);border-radius:2px;box-shadow:4px 4px 0 rgba(75,78,71,.13);transition:transform .2s ease,box-shadow .2s ease}
.chapter-card::before{content:"";position:absolute;inset:7px;border:1px solid rgba(53,58,55,.11);pointer-events:none}
.chapter-card:hover{transform:translate(-2px,-3px);box-shadow:7px 8px 0 rgba(75,78,71,.13)}
.number{font-family:"DM Sans",sans-serif;font-weight:500;color:#5c625d}
.line-icon{position:relative;z-index:1;margin:auto 0;display:flex;flex-direction:column;align-items:flex-start;gap:.45rem;width:max-content;color:#455149;opacity:.9}
.line-icon svg{display:block;width:48px;height:48px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.icon-label{font:500 .61rem "DM Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase}
.chapter-card h3{font-size:2.15rem;letter-spacing:-.015em;line-height:1.05}
.chapter-card p{font:400 .92rem/1.55 "DM Sans",sans-serif;color:#555d57}
.arrow{font-family:"DM Sans",sans-serif}
.chapter-intro p:last-child,.about p:last-child{font:400 clamp(1rem,1.8vw,1.2rem)/1.65 "DM Sans",sans-serif;color:#555d57}
.empty-state{border-style:dashed;border-width:1px}
.empty-state>span{font:500 .72rem "DM Sans",sans-serif;letter-spacing:.16em;text-transform:uppercase}
.empty-state p{font:600 1.45rem "Alegreya",serif}
footer{font-family:"DM Sans",sans-serif}

@media(max-width:560px){.hero>h1{font-size:clamp(3.6rem,17vw,5rem)}.chapter-card{min-height:320px}}

/* Two-part archive: the shared history and the small things around it. */
.chapter-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:960px;margin-inline:auto}
.chapter-card{min-height:350px}
.timeline-section,.little-things-section{display:block;min-height:auto;padding-top:clamp(7rem,11vw,10rem);padding-bottom:clamp(7rem,11vw,10rem)}
.timeline-section .chapter-intro,.little-things-section .chapter-intro{max-width:760px;margin:0 auto clamp(4rem,7vw,6rem);text-align:center}
.memory-timeline{position:relative;max-width:900px;margin:0 auto;padding:0;list-style:none}
.memory-timeline::before{content:"";position:absolute;top:.5rem;bottom:.5rem;left:105px;width:1px;background:rgba(53,58,55,.25)}
.timeline-item{position:relative;display:grid;grid-template-columns:82px 1fr;gap:3.2rem;padding:0 0 3.4rem}
.timeline-item:last-child{padding-bottom:0}
.timeline-item::before{content:"";position:absolute;top:.38rem;left:100px;width:11px;height:11px;border:2px solid #53645a;border-radius:50%;background:#e8eef0}
.timeline-item time{font:500 .68rem "DM Sans",sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#626a64;padding-top:.35rem;text-align:right}
.timeline-item h3{font:600 clamp(1.55rem,3vw,2.15rem)/1.05 "Alegreya",serif;letter-spacing:-.015em;margin:0 0 .55rem}
.timeline-item div>p{font:400 .92rem/1.6 "DM Sans",sans-serif;color:#555d57;margin:0 0 1rem;max-width:38rem}
.timeline-item blockquote{margin:0;padding:.85rem 1rem;border-left:3px solid rgba(83,100,90,.58);background:rgba(255,255,255,.34);font:500 1rem/1.65 "Alegreya",serif;color:#39423d}
.timeline-item blockquote span{font:500 .58rem "DM Sans",sans-serif;letter-spacing:.11em;text-transform:uppercase;color:#6b716c;margin-right:.4rem}
.little-things-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;max-width:980px;margin:0 auto}
.little-thing-card{position:relative;min-height:230px;padding:2rem;border:1px solid rgba(53,58,55,.23);background:rgba(255,255,255,.28);box-shadow:3px 3px 0 rgba(75,78,71,.1)}
.little-thing-card:first-child{grid-column:span 2}
.little-thing-card>span{display:block;font:500 .62rem "DM Sans",sans-serif;letter-spacing:.14em;color:#626862;margin-bottom:3rem}
.little-thing-card h3{font:600 1.75rem/1.05 "Alegreya",serif;margin:0 0 .75rem}
.little-thing-card p{font:400 .9rem/1.65 "DM Sans",sans-serif;color:#555d57;margin:0;max-width:31rem}
.little-thing-card em{display:block;margin-top:.45rem;font-style:normal;color:#757a75}
.placeholder-card{border-style:dashed;background:rgba(255,255,255,.16)}
.timeline-section>.back-link,.little-things-section>.back-link{position:static;display:block;width:max-content;margin:4rem auto 0}

@media(max-width:700px){.chapter-grid,.little-things-grid{grid-template-columns:1fr}.little-thing-card:first-child{grid-column:auto}.memory-timeline::before{left:5px}.timeline-item{grid-template-columns:1fr;gap:.6rem;padding-left:2rem}.timeline-item::before{left:0}.timeline-item time{text-align:left}.little-thing-card{min-height:200px}}

/* The drawer: a quiet local notebook, deliberately not chat-shaped. */
.drawer-section{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:clamp(1rem,5vw,4rem);background:rgba(32,37,34,.72);color:#303833;overflow:auto}
.drawer-section[hidden]{display:none}
.drawer-heading{max-width:720px;margin:0 auto 3rem;text-align:center}
.drawer-heading h2{font:600 clamp(3.4rem,7vw,6rem)/.95 "Alegreya",serif;letter-spacing:-.03em;margin:0}
.drawer-heading>p:last-child{font:400 1rem/1.6 "DM Sans",sans-serif;color:#5f655f;margin:1.2rem 0 0}
.drawer-cabinet{position:relative;width:min(760px,100%);margin:auto;border:1px solid rgba(48,56,51,.38);background:#d7cebd;padding:clamp(.75rem,2vw,1.25rem);box-shadow:8px 10px 0 rgba(25,28,25,.28)}
.keepsake-close{position:absolute;z-index:2;top:1rem;right:1rem;width:2rem;height:2rem;border:0;border-radius:50%;background:#303833;color:#f7f2e8;font-size:1.25rem;line-height:1;cursor:pointer}
.drawer-gate,.drawer-notes{position:relative;background:#f7f2e8;border:1px solid rgba(48,56,51,.3);padding:clamp(2rem,5vw,4rem)}
.drawer-gate[hidden],.drawer-notes[hidden]{display:none}
.drawer-handle{width:110px;height:16px;margin:-.5rem auto 3rem;border:1px solid #596159;border-radius:2px;background:#c5b99f;box-shadow:inset 0 -4px 0 rgba(68,72,64,.12)}
.drawer-kicker{font:500 .62rem "DM Sans",sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#6b706a;margin:0 0 .65rem}
.drawer-gate h3,.drawer-notes h3{font:600 clamp(2rem,4vw,3rem)/1 "Alegreya",serif;margin:0 0 2rem}
.drawer-passcode-form label,.drawer-note-form label{display:block;font:500 .65rem "DM Sans",sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#646a64;margin-bottom:.55rem}
.drawer-passcode-form>div{display:flex;border-bottom:1px solid #596159}
.drawer-passcode-form input,.drawer-note-form textarea{width:100%;border:0;background:transparent;color:#303833;font:400 .95rem/1.55 "DM Sans",sans-serif;outline:0}
.drawer-passcode-form input{padding:.85rem .15rem}
.drawer-passcode-form input:disabled{color:#858982}
.drawer-passcode-form button,.drawer-note-form button,.drawer-preview,.drawer-note-head>button{border:0;background:transparent;color:#303833;font:500 .66rem "DM Sans",sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.drawer-passcode-form button{padding:.8rem .2rem .8rem 1.2rem}
.drawer-passcode-form button:disabled{cursor:not-allowed;color:#999b96}
.drawer-gate-status{min-height:1.5rem;margin:1rem 0 0;font:400 .78rem/1.55 "DM Sans",sans-serif;color:#7c514c}
.drawer-preview{margin-top:.5rem;padding:.75rem 1rem;background:#3d4941;color:#fbf7ee;box-shadow:3px 3px 0 #b7aa90}
.drawer-privacy,.drawer-local-status,.drawer-monitoring{font:400 .72rem/1.55 "DM Sans",sans-serif;color:#70746f}
.drawer-privacy{margin:1rem 0 0}
.drawer-note-head{display:flex;align-items:flex-start;justify-content:space-between;gap:2rem;border-bottom:1px solid rgba(48,56,51,.18);margin-bottom:2rem}
.drawer-note-head>button{padding:.4rem 0;border-bottom:1px solid currentColor}
.drawer-note-form{display:grid;grid-template-columns:1fr auto;gap:.65rem 1rem;align-items:end;margin-bottom:.6rem}
.drawer-note-form label{grid-column:1/-1;margin:0}
.drawer-note-form textarea{resize:vertical;min-height:82px;border:1px solid rgba(48,56,51,.27);background:#fffaf0;padding:.85rem}
.drawer-note-form button{min-height:82px;padding:0 1.1rem;background:#3d4941;color:#fbf7ee}
.drawer-local-status{margin:.5rem 0 2rem}
.drawer-empty{font:500 1.2rem "Alegreya",serif;color:#6f746e;border-top:1px solid rgba(48,56,51,.18);padding-top:1.5rem}
.drawer-note-list{list-style:none;margin:0;padding:0;border-top:1px solid rgba(48,56,51,.25)}
.drawer-note-list li{display:grid;grid-template-columns:120px 1fr;gap:1.5rem;padding:1.25rem 0;border-bottom:1px solid rgba(48,56,51,.18)}
.drawer-note-list time{font:500 .62rem/1.5 "DM Sans",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#757a74}
.drawer-note-list p{font:500 1.13rem/1.45 "Alegreya",serif;margin:0;white-space:pre-wrap;overflow-wrap:anywhere}
.drawer-monitoring{margin:2.5rem 0 0;padding-top:1rem;border-top:1px solid rgba(48,56,51,.18)}

@media(max-width:600px){.drawer-note-head{display:block}.drawer-note-head>button{margin-bottom:1.5rem}.drawer-note-form{grid-template-columns:1fr}.drawer-note-form button{min-height:44px}.drawer-note-list li{grid-template-columns:1fr;gap:.35rem}}

/* Flip-through archive decks */
.archive-add-trigger{margin-top:1.4rem;border:1px solid #4f5b54;background:transparent;color:#36413b;padding:.62rem 1.35rem;font:600 .68rem "DM Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;box-shadow:3px 3px 0 rgba(75,78,71,.13)}
.archive-deck{max-width:900px;margin:0 auto;outline:none;touch-action:pan-y}
.archive-track{min-height:520px;display:grid}
.archive-card{grid-area:1/1;min-height:520px;padding:clamp(2rem,5vw,4.5rem);border:1px solid rgba(53,58,55,.27);background:rgba(255,253,249,.72);box-shadow:7px 8px 0 rgba(75,78,71,.12);display:flex;flex-direction:column;justify-content:center}
.archive-card[hidden]{display:none}
.archive-card time,.archive-number{display:block;margin-bottom:1.5rem;font:600 .65rem "DM Sans",sans-serif;letter-spacing:.15em;text-transform:uppercase;color:#626a64}
.archive-card h3{font:600 clamp(2rem,4.5vw,3.5rem)/1.02 "Alegreya",serif;letter-spacing:-.02em;margin:0 0 1.6rem}
.archive-card>p,.archive-added-copy{max-width:42rem;margin:.25rem 0;font:400 1rem/1.7 "DM Sans",sans-serif;white-space:pre-wrap;overflow-wrap:anywhere;color:#4d5651}
.archive-card blockquote{margin:0;padding:0;border:0;max-width:46rem}
.archive-card blockquote p{margin:.45rem 0;padding:.65rem .9rem;border-left:3px solid rgba(83,100,90,.5);background:rgba(255,255,255,.5);font:500 clamp(1rem,2vw,1.18rem)/1.5 "Alegreya",serif}
.archive-card blockquote span{font:600 .58rem "DM Sans",sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#6b716c;margin-right:.35rem}
.archive-placeholder{color:#757a75!important;font-style:italic!important}
.archive-controls{display:grid;grid-template-columns:3rem 1fr 3rem;align-items:center;gap:1rem;margin:1.5rem auto 0;max-width:300px;text-align:center}
.archive-controls button{width:3rem;height:3rem;border:1px solid rgba(53,58,55,.35);background:rgba(255,255,255,.45);color:#37423c;font-size:1.2rem;cursor:pointer}
.archive-controls button:disabled{opacity:.28;cursor:default}
.archive-controls span{font:600 .66rem "DM Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#626a64}
.archive-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin-top:1.2rem}
.archive-gallery img{width:100%;max-height:280px;object-fit:cover;border:1px solid rgba(53,58,55,.22)}

/* Shared archive authoring */
.archive-author{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:1rem;background:rgba(32,37,34,.72);overflow:auto}
.archive-author[hidden]{display:none}
.archive-author-panel{position:relative;width:min(720px,100%);margin:auto;padding:clamp(2rem,5vw,4rem);background:#f7f2e8;border:1px solid #5b635d;box-shadow:8px 10px 0 rgba(25,28,25,.28)}
.archive-author-panel h2{font:600 clamp(2.4rem,5vw,4rem)/1 "Alegreya",serif;margin:0 0 2rem}
.archive-author-close{position:absolute;top:1rem;right:1rem;width:2rem;height:2rem;border:0;border-radius:50%;background:#303833;color:#f7f2e8;font-size:1.25rem;cursor:pointer}
#archive-author-gate p{font:500 1rem "DM Sans",sans-serif}
#archive-author-passcode-form{display:grid;grid-template-columns:1fr auto;gap:.5rem;align-items:end}
#archive-author-passcode-form label{grid-column:1/-1}
#archive-author-passcode-form input,#archive-author-form input,#archive-author-form textarea,#archive-author-form select{width:100%;border:1px solid rgba(48,56,51,.3);background:#fffaf0;color:#303833;padding:.75rem;font:400 .92rem "DM Sans",sans-serif}
#archive-author-passcode-form button,#archive-author-form>button{border:0;background:#3d4941;color:#fbf7ee;padding:.8rem 1.2rem;font:600 .66rem "DM Sans",sans-serif;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
#archive-author-form{display:grid;gap:1rem}
#archive-author-form[hidden]{display:none}
#archive-author-form label,#archive-author-passcode-form label{display:grid;gap:.4rem;font:600 .64rem "DM Sans",sans-serif;letter-spacing:.09em;text-transform:uppercase;color:#5e655f}
#archive-author-form small{font-size:.67rem;letter-spacing:0;text-transform:none;font-weight:400}
.archive-author-row{display:grid;grid-template-columns:1fr 2fr;gap:1rem}
#archive-author-status{min-height:1.5rem;margin:.9rem 0 0;color:#754f49;font:500 .78rem "DM Sans",sans-serif}

@media(max-width:700px){.archive-track,.archive-card{min-height:500px}.archive-card{padding:2rem 1.35rem}.archive-card blockquote p{font-size:1rem}.archive-author-row{grid-template-columns:1fr}.archive-gallery{grid-template-columns:1fr}}
