/* A single surface: ink becomes light, light becomes a wish. */
:root{--primary:#776490;--ink:#383145;--muted:#766e83;--line:#76628f20}header{padding-block:25px}.brand{font-weight:500;letter-spacing:.08em}.brand-symbol{font-size:27px}.icon-button{background:transparent;border-color:transparent}.icon-button:hover,.nav-button:hover{background:var(--surface)}.nav-button{border-radius:24px;padding-inline:14px}.ritual{width:min(100%,660px);padding-top:25px;padding-bottom:0}.eyebrow{font-size:11px;letter-spacing:.2em}.intro h1{font-size:clamp(29px,4vw,42px);letter-spacing:.06em;margin:15px 0 10px}.subtitle{font-size:14px}.experience{position:relative;margin:30px auto 0;max-width:490px;min-height:492px}.composition{position:relative;width:100%;max-width:440px;padding:23px 25px 11px;border-radius:22px;background:linear-gradient(135deg,#ffffffaa,#ffffff58);border:1px solid #fff9;box-shadow:0 4px 5px #65507c02,0 18px 45px #65507c08;z-index:4;transform-origin:center;transition:box-shadow .35s,border-color .35s,opacity .5s,transform .4s}.composition:focus-within{transform:translateY(-2px);box-shadow:0 0 0 4px #ad9bc10b,0 20px 50px #7b649710;border-color:#ac94ce66}.composition textarea{min-height:55px;font-size:16px;line-height:1.8}.paper-foot{margin-top:8px}#charCount{opacity:0;transition:opacity .25s}.writing #charCount,.has-wish #charCount{opacity:.6}.ink-indicator{display:flex;align-items:center;gap:4px;height:19px}.ink-indicator i{width:3px;height:3px;background:var(--primary);border-radius:50%;opacity:.22;transition:opacity .4s,transform .4s}.writing .ink-indicator i{opacity:.8;animation:ink 1.5s ease infinite}.writing .ink-indicator i:nth-child(2){animation-delay:.15s}.writing .ink-indicator i:nth-child(3){animation-delay:.3s}.has-wish:not(.writing) .ink-indicator i{opacity:.6}.guide-path{height:41px;width:1px;margin:0 auto;position:relative;background:linear-gradient(transparent,var(--line));opacity:0;transition:opacity .6s}.guide-path span{position:absolute;width:3px;height:8px;border-radius:50%;background:var(--primary);left:-1px;top:0;opacity:0}.has-wish .guide-path{opacity:1}.has-wish:not(.writing) .guide-path span{animation:guide-flow 2.6s ease-in-out 3}.orb-stage{margin:0 auto;width:330px;max-width:100%;height:245px}.orb{width:164px;height:164px;transition:transform .7s cubic-bezier(.2,.9,.25,1);transform:scale(.9)}.orb-surface{background:radial-gradient(ellipse at 34% 22%,#fff5dc 0%,#ffe2d2 20%,#eec0d9 46%,#b4b2dc 74%,#a5c8e5 100%);box-shadow:inset 2px 4px 10px #fff9,inset -8px -10px 22px #8886b52e,0 16px 35px #b79cbd17;animation:orb-rest 7s ease-in-out infinite}.orb-light{inset:0;opacity:.4;background:radial-gradient(ellipse at 38% 32%,#fff8e2bb,transparent 70%)}.orb-sheen{inset:5px;background:linear-gradient(150deg,#fff5,transparent 50%);border-color:#fff5}.orb-spark{font-size:29px;opacity:.7;transition:opacity .5s,transform .7s}.touch-mark{position:absolute;inset:0;margin:auto;width:46px;height:46px;stroke:#fff;stroke-width:1.2;opacity:0;transform:translateY(5px);transition:opacity .5s,transform .5s}.has-wish .touch-mark{opacity:.85;transform:translateY(0)}.has-wish .orb-spark{opacity:0;transform:scale(.6)}.has-wish .orb{transform:scale(1)}.has-wish:not(.writing):not(.holding):not(.ready):not(.releasing):not(.done) .orb:after{content:'';position:absolute;inset:-10px;border:1px solid var(--primary);border-radius:50%;animation:invitation 2.7s ease-out 3;pointer-events:none;opacity:0}.orb-aura{width:300px;height:300px;opacity:.6;background:radial-gradient(closest-side,#e5b7df55,#d1c0e320,transparent);transition:transform 1.4s,opacity .7s}.orbit-one{width:266px;height:208px;transform:rotate(-19deg);opacity:.45}.orbit-two{width:302px;height:224px;transform:rotate(25deg);opacity:.2}.star-one{left:34px;top:38px;font-size:14px}.star-two{right:22px;bottom:51px;font-size:20px}.little-star{opacity:.45;transition:opacity .6s,transform 1s}.orb-shadow{bottom:13px;width:85px;opacity:.5}.progress-ring{inset:-18px;width:200px;height:200px}.progress-ring circle{stroke-width:1.25}.cue-wrap{margin:8px 0 0;min-height:71px;transition:opacity .5s}#cue{font-size:14px;letter-spacing:.04em;margin:0;transition:opacity .4s}.ritual:not(.has-wish) .cue-wrap{opacity:0;pointer-events:none}.text-button{text-decoration:none;opacity:.65;font-size:13px;min-height:44px}.text-button:hover{opacity:1}.writing .orb{transform:scale(.9)}.writing .guide-path{opacity:.3}.holding .composition,.ready .composition{border-color:transparent;box-shadow:0 10px 30px #65507c05}.holding .composition textarea,.ready .composition textarea{color:var(--muted)}.holding .paper-foot,.ready .paper-foot{opacity:.2}.holding .orb{transform:scale(.88);transition-duration:1.6s}.holding .touch-mark{opacity:.2;transform:scale(.85)}.holding .orb-aura{transform:scale(1.25);opacity:1}.holding .orbit-one{transform:rotate(-8deg) scale(.88);transition:transform 1.6s}.holding .orbit-two{transform:rotate(8deg) scale(.86);transition:transform 1.6s}.holding .little-star{transform:scale(.6);opacity:.15}.holding .orb-spark{opacity:.8;transform:scale(.9)}.holding .orb-light{transform:scale(1.4);opacity:1}.ready .orb{transform:scale(1.045);transition:transform .55s cubic-bezier(.2,1.5,.4,1)}.ready .orb-surface{box-shadow:inset 2px 4px 9px #fffc,0 0 40px #ffe6c877,0 0 90px #dcc0ec44}.ready .orb-spark{opacity:1;transform:scale(1.2)}.ready .touch-mark{opacity:0;transform:translateY(-12px)}.ready .orb-aura{transform:scale(1.28);opacity:1}.ready .progress-ring{animation:ready-ring 2s ease-in-out infinite}.holding #tap,.ready #tap{visibility:hidden}.releasing .orb{animation:send-light 2.6s cubic-bezier(.3,0,.25,1) forwards}.releasing .orb-spark{opacity:1;transform:scale(1)}.releasing .touch-mark{opacity:0}.releasing .ripple{animation:ripple 1.8s .65s ease-out both}.releasing .particle{animation:particle 1.7s .7s ease-out both}.releasing .guide-path{opacity:0}.release-trail{position:absolute;left:50%;bottom:50%;height:160px;width:2px;transform-origin:bottom;background:linear-gradient(transparent,#f1dfec);opacity:0;pointer-events:none}.releasing .release-trail{animation:light-trail 1.8s .7s ease-out both}.releasing .orb-aura{animation:aura-send 2.5s ease both}.releasing .cue-wrap{opacity:.6}.done .composition,.done .guide-path{visibility:hidden;pointer-events:none}.done .orb-stage{height:245px;margin:0 auto;visibility:hidden}.done .cue-wrap{display:block;visibility:hidden}.response{position:absolute;inset:0 0 auto;margin:0 auto;width:100%;max-width:460px;padding:32px 32px 24px;border:1px solid #ffffff80;background:linear-gradient(145deg,#ffffff96,#ffffff4d);box-shadow:0 30px 75px #69577d0c;border-radius:25px;animation:arrival .9s cubic-bezier(.2,.7,.2,1) both}.response-mark{display:block;font-size:30px;color:var(--primary);margin-bottom:16px}.wish-date{display:block;font-size:12px;letter-spacing:.09em;color:var(--muted)}#wishEcho{font-size:16px;line-height:1.9;margin:18px 0 0;max-height:120px}.blessing{font-size:24px;margin:26px 0;line-height:1.65}.primary{background:var(--primary);color:#fff;border:1px solid #ffffff30;box-shadow:0 4px 10px #47365514;min-width:125px;transition:transform .2s,box-shadow .2s}.primary:hover{box-shadow:0 7px 20px #47365525}.response .text-button{margin-top:5px}footer{padding-top:15px;font-size:12px}.wash{animation-duration:28s}.typing .wash{animation-play-state:paused}[data-theme=dark] .composition,[data-theme=dark] .response{background:linear-gradient(135deg,#30293c9c,#231e2f75);border-color:#d4c2ea1a;box-shadow:0 20px 60px #00000012}[data-theme=dark] .primary{color:#21182d}[data-theme=dark] .orb-aura{background:radial-gradient(closest-side,#8e719b3d,#90789c0c,transparent)}[data-theme=dark] .ready .orb-surface{box-shadow:inset 2px 4px 9px #ffffff88,0 0 40px #c7a4d033,0 0 90px #aa90c622}.orb:hover .orb-sheen{opacity:.8}.low-motion .guide-path span{animation:none}.low-motion .orb:after{animation-iteration-count:1!important}
@keyframes ink{0%,100%{transform:translateY(0);opacity:.4}50%{transform:translateY(-2px);opacity:.9}}@keyframes guide-flow{0%,15%{opacity:0;transform:translateY(0)}35%{opacity:.5}85%,100%{opacity:0;transform:translateY(38px)}}@keyframes invitation{0%,35%{transform:scale(.98);opacity:0}48%{opacity:.22}100%{transform:scale(1.19);opacity:0}}@keyframes orb-rest{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}@keyframes ready-ring{0%,100%{opacity:1}50%{opacity:.5}}@keyframes send-light{0%,18%{transform:scale(1.045);opacity:1}39%{transform:scale(.28);opacity:1}58%{transform:translateY(-14px) scale(.19);opacity:1}100%{transform:translateY(-205px) scale(.02);opacity:0}}@keyframes light-trail{0%,24%{opacity:0;transform:scaleY(0)}55%{opacity:.55;transform:scaleY(.7)}100%{opacity:0;transform:scaleY(1)}}@keyframes aura-send{0%{transform:scale(1.28);opacity:1}35%{transform:scale(.6);opacity:.8}80%,100%{transform:scale(1.5);opacity:0}}@keyframes arrival{from{opacity:0;transform:translateY(15px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(min-width:700px) and (min-height:900px){.ritual{padding-top:55px}.experience{margin-top:38px}.orb-stage,.done .orb-stage{height:275px}.guide-path{height:50px}.response{top:15px}}@media(max-width:600px){header{padding:16px 21px}.ritual{padding:21px 23px 0}.intro h1{font-size:29px;letter-spacing:.035em;line-height:1.45}.subtitle{font-size:14px}.experience{margin-top:25px;min-height:469px}.composition{padding:19px 21px 10px;border-radius:20px}.composition textarea{min-height:54px;font-size:16px}.guide-path{height:31px}.orb-stage,.done .orb-stage{height:237px;max-width:310px}.orb{width:154px;height:154px}.progress-ring{inset:-18px;width:190px;height:190px}.orbit-one{width:242px;height:192px}.orbit-two{width:280px;height:208px}.orb-aura{width:270px;height:270px}.cue-wrap{margin-top:4px}.response{padding:25px 24px 19px}.blessing{font-size:22px}.star-one{left:28px}.star-two{right:19px}footer{padding-top:5px}}@media(max-width:350px){.ritual{padding-inline:18px}.intro h1{font-size:26px}.orbit-two{width:255px}.response{padding-inline:20px}}@media(prefers-reduced-motion:reduce){.releasing .orb{opacity:0}.releasing .composition{opacity:0}.guide-path span{display:none}.response{opacity:1}.ready .orb{transform:scale(1)}.release-trail{display:none}}
.orbit{transition:transform .75s cubic-bezier(.2,.8,.2,1),opacity .6s}.response .primary{font-size:14px}.cue-wrap .text-button{font-size:14px}.composition textarea::placeholder{opacity:.78}.composition:focus-within textarea::placeholder{opacity:.48;transition:opacity .3s}
/* Audited narrow/short viewport fixes. */
.experience{width:100%;min-width:0;overflow-x:clip;overflow-y:visible;padding:5px;margin-top:25px}
.orb-stage,.done .orb-stage{width:min(100%,330px);max-width:100%}
.orbit-one{width:min(266px,calc(100% - 35px))}.orbit-two{width:min(302px,calc(100% - 30px))}
.done .composition,.done .guide-path,.done .orb-stage,.done .cue-wrap{display:none}
.response{position:relative;inset:auto;width:100%;max-width:100%;overflow-wrap:anywhere}
.done .experience{min-height:440px;overflow:visible}
.paper-foot{gap:10px;min-height:34px}.ink-indicator{margin-inline-end:auto}
.paper-send{display:grid;place-items:center;width:34px;height:34px;flex:0 0 34px;min-height:34px;border-radius:50%;color:var(--dialog);background:var(--primary);opacity:0;transform:translateY(4px) scale(.88);transition:opacity .2s,transform .25s,background .2s;pointer-events:none}
.paper-send svg{width:18px;height:18px;stroke-width:1.6}.has-wish .paper-send:not(:disabled){opacity:1;transform:none;pointer-events:auto}.paper-send:active{transform:scale(.91)}
.paper-send::before{content:'';position:absolute;inset:-5px;border-radius:50%}
[data-theme=dark] .paper-send{color:#21182d}
@media(max-width:600px){.experience{margin-top:20px}.orb-stage,.done .orb-stage{width:min(100%,310px);max-width:100%}.orbit-two{width:min(280px,calc(100% - 25px))}.orbit-one{width:min(242px,calc(100% - 30px))}.done .experience{min-height:400px}}
@media(max-width:600px) and (max-height:700px){header{padding-block:10px}.ritual{padding-top:9px}.eyebrow{display:none}.intro h1{margin:7px 0 7px;font-size:26px}.experience{margin-top:15px;min-height:395px}.composition{padding-top:15px}.guide-path{height:20px}.orb-stage{height:195px}.orb-aura{width:220px;height:220px}.orbit-one{height:165px}.orbit-two{height:175px}.orb{width:135px;height:135px}.progress-ring{width:171px;height:171px}.cue-wrap{min-height:66px}.response{padding:20px}.response-mark{margin-bottom:9px}.blessing{font-size:21px;margin:18px 0}.done .experience{min-height:360px}.orb-shadow{bottom:1px}footer{padding-bottom:16px}}
@media(max-width:600px) and (max-height:500px){header{padding-block:7px}.intro h1{font-size:23px;margin-block:3px}.subtitle{display:none}.ritual{padding-top:0}.experience{margin-top:8px;min-height:300px}.composition{padding:12px 16px 7px}.composition textarea{min-height:38px;line-height:1.4}.paper-foot{margin-top:0}.guide-path{height:12px}.orb-stage{height:146px}.orb{width:99px;height:99px}.progress-ring{inset:-12px;width:123px;height:123px}.orbit-one{width:180px;height:125px}.orbit-two{width:207px;height:132px}.orb-aura{height:180px;width:180px}.little-star{display:none}.cue-wrap{margin-top:1px;min-height:64px}#cue{font-size:13px}.text-button{min-height:38px}.response{padding:16px 20px}.done .experience{min-height:280px}.response-mark{display:none}#wishEcho{margin-top:10px;max-height:75px;font-size:14px}.blessing{margin:13px 0;font-size:19px}footer{display:none}}
@media(prefers-reduced-motion:reduce){.paper-send{transform:none;transition:none}}
/* Third pass: give the ritual a clear visual center and a connected workspace. */
:root{--primary:#79629c;--muted:#70617e;--line:#826a9d2c}
.atmosphere{background:radial-gradient(ellipse at 0% 10%,#f4b9d886,transparent 55%),radial-gradient(ellipse at 100% 20%,#b7d5fba1,transparent 57%),radial-gradient(ellipse at 52% 100%,#ccbfedbb,transparent 64%),#f6f5fa}
.texture{opacity:.32}.wash{opacity:.18}header{max-width:1500px;width:100%;margin-inline:auto}
.ritual{width:min(1050px,100%);padding:35px 35px 20px}.intro h1{font-size:clamp(30px,3.6vw,46px);font-weight:500;color:var(--ink)}.subtitle{color:var(--muted)}
.experience{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-template-rows:310px auto;align-items:center;column-gap:24px;width:100%;max-width:940px;min-height:0;margin:34px auto 0;padding:30px 40px 20px;border:1px solid #ffffff99;border-radius:38px;background:linear-gradient(125deg,#ffffff68,#ffffff14 55%,#ece4fc30);box-shadow:inset 0 1px 0 #fffc,0 30px 80px #6a50720d;overflow:visible;isolation:isolate}
.composition{grid-column:1;grid-row:1;max-width:none;padding:26px 26px 14px;background:linear-gradient(125deg,#ffffffdb,#fff9);border:1px solid #fffd;border-radius:23px;box-shadow:0 12px 30px #8a6e9d0d,inset 0 1px 0 #fff;position:relative}
.composition textarea{font-family:ui-serif,'Songti SC',Georgia,serif;min-height:110px;font-size:19px;line-height:1.85;background:repeating-linear-gradient(transparent,transparent 34px,#8e77a50c 34px,#8e77a50c 35px);background-position:0 3px}
.composition textarea::placeholder{font-family:ui-sans-serif,system-ui,sans-serif;font-size:15px;opacity:.75}.paper-foot{margin-top:13px;min-height:44px}.paper-send{width:44px;height:44px;flex-basis:44px;min-height:44px;box-shadow:0 4px 12px #79629c25}.paper-send::before{display:none}.paper-send svg{width:20px;height:20px}.ink-indicator i{width:4px;height:4px}
.guide-path{display:none}.orb-stage{grid-column:2;grid-row:1;width:min(100%,340px);height:310px;max-width:100%}.orb{width:210px;height:210px}.progress-ring{inset:-20px;width:250px;height:250px}.orb-surface{background:radial-gradient(ellipse at 30% 18%,#fffbea 0%,#ffe4c8 20%,#eeb8d6 45%,#aa98d7 72%,#8eb6de 100%);box-shadow:inset 4px 5px 12px #ffffffe6,inset -7px -13px 21px #675ea435,inset 1px -3px 5px #e8edff8c,0 24px 42px #9e76b134}.orb-sheen{inset:4px;border-color:#fff9;background:linear-gradient(135deg,#ffffff88,transparent 42%,#ffffff00 70%,#c6e6ff4d)}.orb-light{background:radial-gradient(ellipse at 34% 29%,#fffce7bb,transparent 62%)}.orb-aura{width:340px;height:340px;background:radial-gradient(closest-side,#e4bce56b,#cab8ed26,transparent);opacity:.8}.orbit-one{width:min(305px,calc(100% - 24px));height:240px;opacity:.5}.orbit-two{width:min(330px,calc(100% - 15px));height:251px;opacity:.25}.orb-shadow{width:145px;height:18px;bottom:16px;background:radial-gradient(ellipse,#886c9c38,transparent 70%)}.little-star{color:#9375b2;opacity:.65}.star-one{top:40px;left:24px}.star-two{right:13px;bottom:58px}.touch-mark{width:53px;height:53px}.cue-wrap{grid-column:2;grid-row:2;margin:0;min-height:68px}.ritual:not(.has-wish) .cue-wrap{opacity:.5}.ritual:not(.has-wish) #cue{visibility:hidden}
.done .experience{display:block;max-width:530px;min-height:0;padding:22px;background:linear-gradient(135deg,#ffffff60,#ede2f64d)}.response{padding:26px 28px 20px;border-radius:23px;box-shadow:none;background:#ffffff85}.response-mark{color:#9873b3}.blessing{font-size:25px}.primary{background:#79629c;color:#fff}.done .intro .subtitle{opacity:.5}footer{padding-top:14px}
[data-theme=dark]{--primary:#c0a2e1;--muted:#bbaecb}[data-theme=dark] .experience{border-color:#dfc8ff18;background:linear-gradient(130deg,#38294277,#202c4533);box-shadow:inset 0 1px 0 #dfc8ff12,0 30px 80px #00000016}[data-theme=dark] .composition,[data-theme=dark] .response{background:linear-gradient(125deg,#3a2d48db,#262139b3);border-color:#cfbbec24;box-shadow:0 12px 30px #00000014}[data-theme=dark] .composition textarea{background-image:repeating-linear-gradient(transparent,transparent 34px,#e1bfff0c 34px,#e1bfff0c 35px)}[data-theme=dark] .orb-surface{background:radial-gradient(ellipse at 30% 18%,#ffe9bf 0%,#e6bec9 23%,#b091c6 49%,#776aa9 74%,#678cc1 100%);box-shadow:inset 3px 4px 10px #ffffff9c,inset -7px -13px 21px #2c26504d,0 20px 55px #9c78bf29}[data-theme=dark] .orb-aura{background:radial-gradient(closest-side,#ac7cc642,#7a70b516,transparent)}[data-theme=dark] .primary{background:var(--primary);color:#21182d}
@media(min-width:700px) and (min-height:900px){.ritual{padding-top:60px}.experience{margin-top:40px;grid-template-rows:340px auto}.orb-stage{height:330px}}
@media(max-width:650px){.ritual{padding:15px 21px 12px}.intro h1{font-size:29px;letter-spacing:.035em;margin-top:13px}.subtitle{font-size:14px}.experience{display:flex;flex-direction:column;gap:0;padding:20px 15px 8px;margin-top:22px;border-radius:29px;min-height:0}.composition{width:100%;padding:18px 19px 8px;border-radius:19px}.composition textarea{min-height:62px;font-size:17px;line-height:1.85;background-size:auto 31px}.composition textarea::placeholder{font-size:14px}.paper-foot{margin-top:5px}.guide-path{display:block;height:17px;flex-shrink:0}.orb-stage{height:248px;width:min(100%,310px);flex-shrink:0}.orb{width:184px;height:184px}.progress-ring{inset:-18px;width:220px;height:220px}.orb-aura{width:290px;height:290px}.orbit-one{height:208px;width:calc(100% - 26px)}.orbit-two{height:214px;width:calc(100% - 20px)}.orb-shadow{bottom:5px}.touch-mark{width:48px;height:48px}.cue-wrap{min-height:65px;flex-shrink:0}.star-one{top:29px;left:16px}.star-two{right:12px;bottom:42px}.done .experience{padding:12px;margin-top:22px}.response{padding:23px 20px 17px}.blessing{font-size:22px}footer{padding-top:4px}}
@media(max-width:650px) and (max-height:700px){header{padding-block:8px}.ritual{padding-top:6px}.intro h1{font-size:25px;margin:5px 0}.experience{margin-top:14px;padding-top:13px}.composition{padding-top:13px}.composition textarea{min-height:48px}.guide-path{height:10px}.orb-stage{height:190px}.orb{width:140px;height:140px}.progress-ring{inset:-15px;width:170px;height:170px}.orb-aura{width:218px;height:218px}.orbit-one{height:155px;width:210px;max-width:90%}.orbit-two{height:164px;width:230px;max-width:94%}.cue-wrap{min-height:60px}.touch-mark{width:40px;height:40px}.done .experience{min-height:0}.response{padding:18px}.blessing{font-size:20px;margin:16px 0}}
@media(max-width:650px) and (max-height:500px){.ritual{padding:0 15px 5px}.intro h1{font-size:22px}.experience{margin-top:7px;padding:9px 12px 4px;border-radius:23px}.composition{padding:8px 12px 4px}.composition textarea{min-height:30px;font-size:16px;line-height:1.4}.paper-foot{margin:0;min-height:44px}.guide-path{height:4px}.orb-stage{height:120px}.orb{width:88px;height:88px}.progress-ring{inset:-12px;width:112px;height:112px}.orb-aura{width:160px;height:160px}.orbit-one{width:164px;height:102px}.orbit-two{width:185px;height:107px}.orb-shadow{height:10px;bottom:0}.touch-mark{width:32px;height:32px}.cue-wrap{min-height:56px}.cue-wrap .text-button{min-height:32px}.response{padding:12px 16px}.done .experience{margin-top:7px;padding:8px}.blessing{font-size:18px;margin:11px 0}}
@media(prefers-reduced-motion:reduce){.orb-surface,.orb:after,.guide-path span{animation:none!important}.paper-send{transition:none}}