@charset "UTF-8";
:root{color-scheme:dark;--paper:#f0e4c9;--gold:#c4a46a;--muted:#b5a18c;--background:#251116;--line:#b7945a40;--ink:#160e12;font-size:16px}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--background);color:var(--paper);font-family:Georgia,'Times New Roman',serif;transition:background 1.8s ease;min-width:280px}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.4' filter='url(%23n)'/%3E%3C/svg%3E")}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,a:focus-visible{outline:2px solid var(--paper);outline-offset:5px}
button{border:0;background:none}
a{color:inherit;text-decoration:none}
.masthead{margin:0 3.6vw;height:94px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}
.signature{display:flex;align-items:center;gap:13px;font-size:1rem;letter-spacing:.015em}
.seal{font-size:2rem;color:var(--gold)}
.folio{font-family:Arial,sans-serif;font-size:.75rem;letter-spacing:.12em;color:var(--muted);text-transform:uppercase;white-space:nowrap}
.folio span{margin:0 14px;color:var(--gold)}
.atelier{display:grid;grid-template-columns:minmax(270px, .76fr) minmax(0,1.75fr);grid-template-rows:auto 1fr;column-gap:4.2vw;max-width:1920px;margin:auto;padding:54px 3.6vw 30px}
.introduction{grid-column:1;grid-row:1}
.eyebrow{font-family:Arial,sans-serif;color:var(--gold);text-transform:uppercase;font-size:.75rem;line-height:1.7;letter-spacing:.15em;margin:2px 0 29px}
.eyebrow span{margin:0 7px}
h1{font-weight:400;font-size:clamp(2.8rem,4.45vw,5.8rem);letter-spacing:-.065em;line-height:1.1;margin:0}
h1 em{font-weight:400;color:var(--gold);letter-spacing:-.075em}
.dedication{font-size:1.1rem;font-style:italic;color:var(--muted);margin:23px 0 36px}
.garden-section{grid-column:2;grid-row:1 / 3;align-self:center;min-width:0}
.tapestry-frame{padding:10px;border:1px solid #c4a46a85;position:relative;background:#120e0c;box-shadow:0 24px 90px #08060a40}
.tapestry-frame::before,.tapestry-frame::after{position:absolute;content:"";width:9px;height:9px;border:1px solid var(--gold);background:var(--background);transform:rotate(45deg);z-index:2;top:-5px}
.tapestry-frame::before{left:-5px}.tapestry-frame::after{right:-5px}
.tapestry{position:relative;overflow:hidden;aspect-ratio:3 / 2;background:#101e20;isolation:isolate}
.tapestry>img{width:100%;height:100%;object-fit:cover;display:block;transition:filter 2s ease,transform 15s ease}
.dusk-wash{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity 2s;background:linear-gradient(140deg,#071b414d,#08121b80);mix-blend-mode:multiply}
.stitch{--size:42px;position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);transform:translate(-50%,-50%);border:1px solid #e9ca8aba;border-radius:50%;background:#15201ade;display:grid;place-items:center;font-size:.875rem;color:#ffdf9a;box-shadow:0 0 0 4px #1c201944;transition:background .3s,box-shadow .3s}
.stitch::after{content:"";position:absolute;inset:-5px;border:1px dotted #f4d69480;border-radius:50%;pointer-events:none}
.stitch:hover,.stitch[aria-pressed="true"]{background:#f0d095;color:#2c1820;box-shadow:0 0 25px #ecc27350}
.stitch span{pointer-events:none}
.frame-caption{display:flex;align-items:center;justify-content:space-between;padding:12px 5px 3px;gap:12px;color:var(--muted);font-size:.8rem}
.frame-caption>span{font-style:italic}
.frame-caption button{color:var(--gold);min-height:32px;font-size:.875rem;padding:0 2px}
.frame-caption button span{font-size:1.2rem;margin-left:7px;vertical-align:middle}
.story-index{display:flex;justify-content:center;flex-wrap:wrap;gap:3px 17px;padding:18px 3px 0}
.story-index button{font-size:.875rem;padding:9px 0;color:var(--muted);border-bottom:1px solid transparent;transition:color .2s,border-color .2s;min-height:38px}
.story-index button span{font-size:.75rem;color:var(--gold);margin-right:5px}
.story-index button:hover,.story-index button[aria-pressed="true"]{color:var(--paper);border-color:var(--gold)}
.margin{grid-column:1;grid-row:2;align-self:start;min-width:0}
.story{max-width:360px;min-height:247px;border-top:1px solid var(--line);padding:24px 0 10px}
.story-number{text-transform:uppercase;font: .75rem/1.6 Arial,sans-serif;letter-spacing:.15em;color:var(--gold);margin:0 0 14px}
h2{font-size:1.35rem;font-weight:400;line-height:1.3;margin:0 0 14px;letter-spacing:-.02em}
.story-text{font-size:1rem;line-height:1.7;color:#c9b9a4;margin:0;white-space:pre-line}
.story.changed{animation:ink-appear .5s ease}
.garden-controls{margin-top:28px;display:flex;flex-direction:column;align-items:flex-start;gap:3px}
.control{display:flex;align-items:center;gap:11px;min-height:44px;padding:6px 0;font-size:.875rem;color:var(--muted);text-align:left}
.control:hover,.control[aria-pressed="true"]{color:var(--paper)}
.control>span:first-child{width:19px;text-align:center;color:var(--gold);font-size:1.25rem}
.sound-bars{display:flex;gap:3px;height:18px;align-items:center;justify-content:center}
.sound-bars i{display:block;width:2px;height:5px;background:var(--gold)}
.sound-bars i:nth-child(2){height:13px}.sound-bars i:nth-child(3){height:8px}
.control[aria-pressed="true"] .sound-bars i{animation:sing 1.6s ease-in-out infinite alternate}
.control[aria-pressed="true"] .sound-bars i:nth-child(2){animation-delay:.4s}.control[aria-pressed="true"] .sound-bars i:nth-child(3){animation-delay:.8s}
.colophon{margin:10px 3.6vw 0;border-top:1px solid var(--line);padding:22px 0 25px;display:flex;gap:18px;justify-content:space-between;align-items:center;color:var(--muted);font-size:.8rem}
.colophon p{margin:0;line-height:1.6}.colophon p:first-child{font-style:italic}.colophon p span{margin:0 8px}.footer-mark{color:var(--gold);font-size:1.5rem}
body.dusk{background:#131620}body.dusk .dusk-wash{opacity:1}body.dusk .tapestry>img{filter:brightness(.75) saturate(.8)}
.firefly{display:none;position:absolute;left:48%;top:45%;width:3px;height:3px;background:#ffdc97;border-radius:50%;box-shadow:0 0 15px 6px #ffdc9770;pointer-events:none;animation:drift 14s ease-in-out infinite alternate}
body.dusk .firefly{display:block}
dialog{background:#130f12;color:var(--paper);padding:0;border:1px solid var(--line);width:min(1500px,96vw);max-height:95dvh;overflow:auto;box-shadow:0 30px 100px #000a}
dialog::backdrop{background:#08070cee;backdrop-filter:blur(8px)}
.dialog-bar{display:flex;align-items:center;justify-content:space-between;padding:12px 22px;gap:20px;position:sticky;top:0;background:#130f12;z-index:2;font-size:.875rem}
.dialog-bar p{margin:0}.dialog-bar p span{color:var(--gold);margin:0 10px}.dialog-bar button{min-height:44px;white-space:nowrap;color:var(--gold)}.dialog-bar button span{font-size:1.5rem;margin-left:10px}
.dialog-art img{width:100%;height:auto;display:block}.dialog-note{text-align:center;font-style:italic;font-size:1rem;color:var(--muted);padding:4px 12px 12px}
.skip-link{position:fixed;left:15px;top:-100px;padding:12px;background:var(--paper);color:var(--ink);z-index:100}.skip-link:focus{top:15px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
@keyframes ink-appear{from{opacity:.35;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@keyframes sing{to{height:16px}}
@keyframes drift{0%{transform:translate(-20px,20px);opacity:.2}40%{opacity:1}65%{transform:translate(80px,-30px);opacity:.4}100%{transform:translate(-50px,-80px);opacity:1}}
@media(min-width:1600px){.atelier{padding-top:70px;padding-bottom:60px}.story{max-width:390px}.story-text{font-size:1.125rem}.garden-controls{margin-top:38px}}
@media(max-width:1100px) and (min-width:801px){.atelier{column-gap:3vw;grid-template-columns:minmax(240px,.8fr) minmax(0,1.4fr);padding-top:38px}.garden-section{align-self:start;margin-top:18px}.story-index{gap:2px 12px}.story{min-height:240px}.frame-caption{font-size:.75rem}.frame-caption>span{max-width:120px}}
@media(max-width:800px){.masthead{height:74px;margin:0 6vw}.folio{font-size:.75rem;letter-spacing:.06em}.folio span{margin:0 6px}.signature{font-size:.875rem;gap:8px}.seal{font-size:1.6rem}.atelier{display:flex;flex-direction:column;padding:34px 6vw 18px;gap:0}.introduction{position:relative}.eyebrow{margin:0 0 18px;font-size:.75rem}h1{font-size:clamp(2.85rem,8.6vw,4.6rem);line-height:1.08}h1 em{white-space:nowrap}.dedication{margin:17px 0 28px}.garden-section{width:100%}.tapestry-frame{padding:7px}.stitch{--size:38px;font-size:.8125rem}.frame-caption{padding:7px 3px 0;gap:5px;font-size:.75rem}.frame-caption button{font-size:.8125rem}.story-index{padding-top:12px;gap:2px 15px}.margin{margin-top:22px;display:grid;grid-template-columns:1fr;gap:0}.story{max-width:unset;min-height:0;padding-top:24px}.story-text{max-width:540px}h2{font-size:1.5rem}.garden-controls{margin-top:22px;flex-direction:row;flex-wrap:wrap;gap:4px 24px}.colophon{margin:12px 6vw 0;padding-top:20px;flex-wrap:wrap;font-size:.75rem}.footer-mark{display:none}.dialog-bar{padding:8px 12px}.dialog-bar p{max-width:170px;line-height:1.5}.dialog-bar p span{margin:0 4px}}
@media(max-width:380px){.folio{max-width:90px;white-space:normal;text-align:right;line-height:1.5}h1{font-size:2.7rem}.frame-caption>span{max-width:125px}.story-index{gap:2px 14px}.stitch{--size:34px}.colophon{gap:6px}.dialog-bar p{font-size:.75rem}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation:none!important;transition:none!important}.firefly{display:none!important}}

/* Language editions */
.masthead-tools{display:flex;align-items:center;gap:24px}
.language-switch{display:flex;align-items:center;gap:8px;font: .875rem/1.5 Arial,sans-serif;color:var(--muted);white-space:nowrap}
.language-switch a{display:inline-flex;align-items:center;justify-content:center;min-width:36px;min-height:44px;text-decoration:none}
.language-switch a[aria-current="page"]{color:var(--paper);text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--gold)}
html[lang="en"] h1{font-size:clamp(2.65rem,3.8vw,5.3rem);letter-spacing:-.055em}
@media(max-width:800px){.masthead{height:auto;min-height:86px;flex-wrap:wrap;gap:0 16px;padding:12px 0}.masthead-tools{gap:12px;flex-wrap:wrap}.folio{display:none}html[lang="en"] h1{font-size:clamp(2.6rem,7.3vw,4.4rem)}}