@font-face{font-family:Marck;src:url('fonts/MarckScript-Regular.ttf') format('truetype');font-display:swap}
@font-face{font-family:Hand;src:url('fonts/BadScript-Regular.ttf') format('truetype');font-display:swap}
:root{color-scheme:light;--ink:#452559;--muted:#674c78;--gold:#bd650e;--paper:#fff8ed;--brown:#603d69}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:18px}body{margin:0;color:var(--ink);background:#d8b4ed;font:17px/1.75 Georgia,serif}
body{isolation:isolate;overflow-x:clip;--temple-outset:max(0px,calc((720px - 100vw)/2))}body:before,body:after,.ritual:before,.ritual:after{content:'';position:fixed;top:0;bottom:0;width:calc(50% + var(--temple-outset));z-index:-1;background-image:url('temple-lilac.webp');background-repeat:no-repeat;background-size:1440px 960px;pointer-events:none}body:before,.ritual:before{left:calc(0px - var(--temple-outset));background-position:left -140px}body:after,.ritual:after{right:calc(0px - var(--temple-outset));background-position:right -140px}
a{color:#653482;text-underline-offset:4px;text-decoration-color:#b28cb9}a:hover{color:#a9580b}button,input,textarea{font:inherit}button,summary,a,input[type=checkbox]{cursor:pointer}
button{border:1px solid #ba8c56;border-radius:24px;background:#fff8edc9;color:#653a63;padding:11px 23px;transition:background .2s}button:hover{background:#fff5d9}button:disabled{opacity:.6;cursor:wait}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #8f4ca8;outline-offset:4px}
main{max-width:1080px;width:70%;margin:auto}.intro{text-align:center;padding:80px 0 3px}.intro h1{font:400 clamp(42px,5.5vw,76px)/1.15 Marck,cursive;margin:0;color:#612b79;text-shadow:0 2px 8px #fff9eaaa}.ornament{font-size:32px;line-height:1.2;color:#b96416;margin:6px 0}
h2,h3{font-weight:400;line-height:1.35}h2{font-size:31px}h3{font-size:22px}.eyebrow{font:11px/1.6 Arial,sans-serif;letter-spacing:.16em;color:#99501b}
.sanctuary{display:flex;flex-direction:column;align-items:center;gap:0}.altar-column{width:min(620px,60svh,88vw);max-width:100%}.altar{margin:0;padding:0;background:none;border:0}.altar-art{position:relative;isolation:isolate}.altar img{width:100%;height:auto;display:block;object-fit:contain;aspect-ratio:3/2}.halo{pointer-events:none;position:absolute;inset:20% 20% 30%;background:radial-gradient(ellipse,#ffe9b72b,transparent 68%);border-radius:50%}
.landing{position:absolute;left:44%;top:68%;width:13%;height:5.5%;transform:rotate(-5deg);z-index:3}.mini-letter{position:absolute;inset:0;background:#fff7eb;border:1px solid #c49764;color:#6d417e;text-align:center;font-size:12px;overflow:hidden;box-shadow:1px 2px 3px #743e6b40;forced-color-adjust:none}
.writing-column{width:min(620px,90vw);max-width:100%;margin-top:2px}fieldset{border:0;margin:0;padding:0;min-width:0}
.paper{position:relative;padding:18px 30px 16px;color:var(--brown);background:linear-gradient(105deg,#f1e4f2ed,#fffaf1f5 28%,#fffaf1f5 72%,#f0dfefed);border:1px solid #d3ae7980;border-radius:30px 30px 18px 18px;box-shadow:0 12px 35px #794c8a18,inset 0 0 0 5px #fff7e95c,inset 0 0 0 7px #c99d5838}
.paper:before,.paper:after{content:'❦';position:absolute;top:8px;font-size:30px;color:#ca8d43}.paper:before{left:10px}.paper:after{right:10px;transform:scaleX(-1)}
.paper-top{display:flex;justify-content:space-between;font:9px Arial,sans-serif;letter-spacing:.17em;color:#9e6b59;padding:0 8px}.paper-om{text-align:center;font-size:23px;line-height:1.3;color:#b27326;margin:2px 0}.paper h2{font:29px/1.35 Marck,cursive;margin:0 0 7px}
.paper textarea,.letter-copy{font:24px/34px Hand,cursive;color:#654074;background:repeating-linear-gradient(transparent,transparent 33px,#b187c42b 34px);border:0;outline-offset:4px;width:100%;height:150px;min-height:150px;resize:vertical;display:block;padding:0;border-radius:0;white-space:pre-wrap;overflow-wrap:anywhere}
.paper textarea::placeholder{color:#a583a7}.signature{display:flex;gap:10px;align-items:baseline;font:23px/1.5 Hand,cursive;margin:12px 0 8px}.signature>span{flex-shrink:0}.signature input,.name-copy{font:23px/1.5 Hand,cursive;color:#654074;min-width:0;width:100%;background:none;border:0;border-bottom:1px solid #b99abe65;padding:0}.signature input::placeholder{font:14px Georgia,serif;color:#a583a7}
.paper-bottom{display:flex;justify-content:space-between;font:10px Arial,sans-serif;color:#91718e;padding-top:6px}.form-foot{padding-top:12px}.primary{background:linear-gradient(110deg,#ffe6b4,#f6b66e);border:1px solid #dda45c;color:#673d49;box-shadow:0 5px 22px #a9653524}.primary:hover{background:#ffe0a6}
#offer{width:100%;display:flex;gap:12px;justify-content:space-between;padding:15px 24px;margin:0 0 16px;font-size:18px}.save-choice{display:flex;align-items:flex-start;gap:8px;font:13px/1.6 Arial,sans-serif;color:#5e3c73}input[type=checkbox]{accent-color:#9d5aaa;width:17px;height:17px;flex-shrink:0}.privacy{font:13px/1.7 Arial,sans-serif;color:#674c78}.form-status{font:13px/1.5 Arial,sans-serif;min-height:20px;color:#7c4492}
.altar-notes{max-width:650px;text-align:center;margin:20px auto 35px}.names{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;font-size:18px;color:#7c408c}.names small{display:block;font:10px/1.7 Arial,sans-serif;letter-spacing:.08em;color:#98682c}.altar-caption{font:13px/1.7 Arial,sans-serif;color:#674c78}.small-om{display:none}.altar-message p{margin:8px 0;font-size:20px}.settings{display:flex;gap:20px;justify-content:center;font:13px/1.6 Arial,sans-serif}
.guide{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;border-block:1px solid #bb8bc270;margin:38px 0;padding:28px 20px;background:#fff6fc80;border-radius:24px}.guide b{color:#b17031;font:12px Arial,sans-serif}.guide h3{margin:10px 0}.guide p{color:#674c78;font-size:15px;margin:0}
.story{padding:20px 26px;margin:0 0 35px;background:#fff6fcbb;border-radius:28px}.story-title{display:flex;gap:30px;align-items:center;flex-wrap:wrap}.story h2{font-size:35px;margin:10px 0 20px}.story-title .eyebrow{width:100%}.large-om{font-size:64px;color:#d39b52}.story-copy p{margin:0 0 22px}details{border-top:1px solid #c797c860;padding:16px 0}summary{cursor:pointer;margin-left:20px;font-size:18px;color:#724285}details p{padding-top:15px}details a{font-size:13px}
.archive{border:1px solid #dbbbdc;background:#fff7fbd9;border-radius:28px;padding:28px;display:grid;grid-template-columns:1fr 1fr;gap:20px 35px;margin:0 0 35px}.archive h2{margin:10px 0}.archive p{color:#674c78;font-size:14px}.archive pre{white-space:pre-wrap;overflow-wrap:anywhere;font:20px/1.8 Hand,cursive}.archive button{font-size:13px;padding:7px 15px}.questions{background:#fff8fbbb;padding:24px 28px;border-radius:28px;margin-bottom:35px}.questions h2{margin:0 0 15px}.questions p{color:#674c78}
.completion{padding:30px 26px;background:#fff5f4d9;border:1px solid #d5aecb;border-radius:28px;text-align:center}.completion h2{font:36px Marck,cursive}.blessing{font:32px Marck,cursive;color:#9f5a34}.actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}.actions .primary{width:100%}
footer{width:70%;max-width:1080px;margin:auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:20px 0 32px;font:13px/1.7 Arial,sans-serif;color:#63466c}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}#print-letter{display:none}
body.ritual-open{overflow:hidden}.ritual{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:8px 16px;border:0;color:#512765;background:#d8b4ed;isolation:isolate;overflow:hidden}.ritual[open]{display:flex;flex-direction:column;align-items:center}.ritual::backdrop{background:#d8b4ed}
.ritual-heading{height:42px;flex:none;text-align:center}.ritual-heading h2{font-size:30px;line-height:38px;margin:0;color:#a95b1d}.ritual-stage{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;max-width:980px;flex:1;min-height:0}.ritual-altar{position:relative;flex:none;max-width:100%}.ritual-altar img{width:100%;height:auto;display:block;aspect-ratio:3/2;object-fit:contain}.ritual-sheet{width:min(620px,90vw);height:min(330px,34dvh);flex:none;visibility:hidden}
.flying-sheet{position:absolute;z-index:4;pointer-events:none;transform-origin:center;will-change:transform}.flying-sheet .paper{width:100%;height:100%;margin:0;forced-color-adjust:none;box-shadow:0 0 24px #fff4bd60,0 10px 25px #7d448633}.flying-sheet .paper *,.resting-sheet,.resting-sheet *{forced-color-adjust:none}.flying-sheet textarea,.resting-sheet .letter-copy{overflow:hidden}.resting-sheet{position:absolute;left:0;top:0;transform-origin:0 0;pointer-events:none;margin:0;box-shadow:0 8px 15px #71407533}
.ritual-footer{flex:none;text-align:center;padding:6px 0 8px;height:86px}.ritual-footer p{margin:0 0 7px;font:14px/1.6 Georgia,serif;color:#734385}.ritual-footer button{font-size:14px;padding:8px 24px}
@media(max-width:700px){main,footer{width:90%}.intro{padding-top:55px}.intro h1{font-size:46px}.ornament{font-size:27px}.paper{padding:16px 22px}.paper textarea,.letter-copy{font-size:22px;line-height:33px}.signature{font-size:21px;gap:7px}.signature input{font-size:21px}.signature input::placeholder{font-size:11px}.names{font-size:16px;gap:8px}.settings{gap:10px;font-size:11px}.guide{grid-template-columns:1fr;gap:22px;padding:25px}.guide h3{margin:6px 0}.story{padding:24px}.story h2{font-size:29px}.large-om{display:none}.archive{grid-template-columns:1fr;padding:24px}.questions{padding:24px}.ritual{padding:6px 8px}.ritual-heading{height:34px}.ritual-heading h2{font-size:27px;line-height:32px}.ritual-footer p{font-size:12px}.ritual-footer{height:80px}.ritual-sheet{height:34dvh}#offer{font-size:16px;padding:14px 18px}footer{display:block}footer span,footer>a{display:block;margin-bottom:8px}}
@media(max-height:550px){.ritual-heading{height:24px}.ritual-heading h2{font-size:22px;line-height:24px}.ritual-footer{height:65px;padding:3px 0}.ritual-footer button{padding:5px 18px}.ritual-footer p{font-size:11px;margin:0 0 4px}.ritual-sheet{height:29dvh}.altar-column{width:min(620px,55svh,88vw)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}button{transition:none}}
@media print{body>*{display:none!important}body:before,body:after{display:none}body #print-letter{display:block!important;background:white;color:black;padding:25px;font:18px/1.7 Georgia,serif;white-space:pre-wrap}body{background:white}}

/* Keep the illustrated composition and its readable ink consistent in contrast themes. */
.intro,.sanctuary,.ritual{forced-color-adjust:none}


/* Leave the heading clear of the upper garland while retaining the side columns. */
/* Column artwork keeps a constant horizontal scale, including on phones. */


.reading-panel{padding:30px 28px;margin:0 0 35px;background:#fff6fce8;border:1px solid #dbbbdc80;border-radius:28px}.reading-panel h2{margin:10px 0 20px}.reading-panel>p{color:#674c78}.examples blockquote{font:23px/1.9 Hand,cursive;color:#654074;margin:18px 0 8px;padding:18px 24px;background:#fffaf1c7;border-left:2px solid #d9ac74;border-radius:0 16px 16px 0}.experiences article{padding:20px 0;border-top:1px solid #c797c860}.experiences h3{margin:0 0 8px;color:#724285}.story-person{font:13px/1.7 Arial,sans-serif;color:#976830;margin:0 0 12px}.experiences article>p:not(.story-person){margin:0 0 14px}.source-link{font:12px/1.7 Arial,sans-serif;overflow-wrap:anywhere}.reading-panel details>p{padding-top:0}@media(max-width:700px){.reading-panel{padding:24px}.reading-panel h2{font-size:27px}.examples blockquote{font-size:21px;padding:15px 18px}}
.reading-panel{forced-color-adjust:none}

.guide{grid-template-columns:1fr 1fr}.guide>div:last-child{grid-column:1/-1}.guide,.story{forced-color-adjust:none}@media(max-width:700px){.guide{grid-template-columns:1fr}}

.experiences .experience{padding:0;border-top:1px solid #c797c860}.experience>summary{margin:0;padding:18px 4px;font-size:20px;line-height:1.5;color:#724285}.experience>summary::marker{color:#b17031}.experience[open]>summary{color:#8b4d27}.story-body{padding:0 4px 20px}.story-body>p{margin:0 0 14px}.story-body .story-person{padding-top:0}.names>span{min-width:0}@media(max-width:700px){.experience>summary{font-size:18px}}