/* Canopy arrival: only the particle sphere is visible; DOM provides its hit area. */
.enter,.ritual-actions button,.passage-back{min-height:44px;border:1px solid #b9c8d733!important;border-radius:999px!important;background:#cbd5df0b!important;color:#e3e7ec!important;padding:10px 20px!important;font:13px/1.2 'Songti SC',serif!important;letter-spacing:.12em;box-shadow:inset 0 0 0 1px #ffffff08;backdrop-filter:blur(7px);transition:color .3s,border-color .3s,background .3s,transform .3s,opacity .3s}
.enter:hover,.ritual-actions button:hover:not(:disabled),.passage-back:hover{background:#dce4ec17!important;border-color:#c7a56a80!important;transform:translateY(-1px)}
.enter:focus-visible,.ritual-actions button:focus-visible,.passage-back:focus-visible{outline:1px solid #d4bf8e;outline-offset:4px}
.ritual-actions .ritual-primary{background:#dfe7ef18!important;border-color:#c7a56a70!important;min-width:120px}
.ritual-actions .ritual-back{font:24px/1 Georgia,serif!important;min-width:44px;width:44px;padding:8px!important;letter-spacing:0}
.lunar-mode .moon-deck{transition:transform 2s cubic-bezier(.3,0,.2,1),opacity 1.8s}
.lunar-mode.moon-near .moon-deck{transform:translateY(65vh) scale(1.65);opacity:0;pointer-events:none;visibility:hidden;transition:transform 2s cubic-bezier(.3,0,.2,1),opacity 1.8s,visibility 0s 2s}
.lunar-mode.moon-near .moon-slots{opacity:0;transition:opacity 1s}
.lunar-mode.moon-near .ritual-heading{opacity:.7;transition:opacity 1s}
body[data-ritual=passage] #ritual{padding:0;pointer-events:none;background:transparent}
.passage-back{position:fixed;bottom:24px;left:24px;pointer-events:auto;border:0;background:transparent;color:#b9c8d7;font:14px 'Songti SC',serif;padding:12px;opacity:.65}
.passage-back:hover,.passage-back:focus-visible{opacity:1}
.passage-error{position:fixed;top:45%;left:8%;right:8%;text-align:center;color:#e0e5ed}
#garden{transition:filter 2.8s ease}
body[data-ritual=reveal] #garden{filter:brightness(.76)}
body[data-ritual=reveal] .revealed-card{animation:moon-emerge 2.3s cubic-bezier(.16,.6,.22,1) both;animation-delay:calc(.35s + var(--i)*.28s)}
body[data-ritual=reveal] .revealed-card .face-button{animation:none}
body[data-ritual=reveal] .ritual-heading,body[data-ritual=reveal] .original-question{animation:reveal-copy 1.4s ease both;animation-delay:1.15s}
body[data-ritual=reveal] .ritual-actions,body[data-ritual=reveal] .ritual-note,body[data-ritual=reveal] .prototype-note{animation:reveal-copy 1.2s ease both;animation-delay:2.2s}
body[data-ritual=reveal] .position-label,body[data-ritual=reveal] .orientation{animation:reveal-copy 1.2s ease both;animation-delay:calc(.8s + var(--i)*.28s)}
body[data-ritual=reveal] #ritual{padding-top:clamp(250px,49svh,620px);padding-bottom:60px}
.result-dust{display:none;position:fixed;inset:0;z-index:3;pointer-events:none;overflow:hidden}
body[data-ritual=reveal] .result-dust{display:block}
.result-dust i{position:absolute;width:var(--size);height:var(--size);border-radius:50%;background:#c9d7e1;opacity:0;animation:result-drift var(--duration) ease-in-out var(--delay) infinite}
@keyframes result-drift{0%,100%{opacity:.10;transform:translate3d(0,14px,0)}50%{opacity:.55;transform:translate3d(var(--drift),-22px,0)}}
@media(prefers-reduced-motion:reduce){.result-dust i{animation:none;opacity:.25}}
body[data-ritual=reveal] .original-question{margin-bottom:20px}
@keyframes moon-emerge{from{opacity:0;transform:translateY(30px) scale(.84);filter:blur(7px)}45%{opacity:.6;filter:blur(2px)}to{opacity:1;transform:none;filter:none}}
@keyframes reveal-copy{from{opacity:0;visibility:hidden}to{opacity:1;visibility:visible}}
@media(prefers-reduced-motion:reduce){#garden,.lunar-mode .moon-deck,.lunar-mode.moon-near .moon-deck{transition:none}body[data-ritual=reveal] #ritual *{animation:none!important}}
.question-form textarea{min-height:0;height:auto;resize:none;line-height:1.65;padding:8px 8px 10px;max-height:240px;overflow-y:auto;box-sizing:border-box}
.question-form{margin-top:30px}
.moon-flight{position:fixed;z-index:30;pointer-events:none;border-radius:7%;object-fit:fill;transform-origin:center;box-shadow:none}
.moon-spark{position:fixed;width:3px;height:3px;border-radius:50%;background:#d5dfdf;pointer-events:none;z-index:20}
.lunar-mode .moon-card[hidden]{display:none!important}
.lunar-mode .moon-control{position:fixed;margin:0;transform:translate(-50%,-50%);z-index:8;pointer-events:auto;visibility:visible}
.lunar-mode .moon-disc,.lunar-mode .moon-control.ready .moon-disc{border:0;background:transparent;box-shadow:none;color:#c7a56a}
.lunar-mode .moon-control::after{display:none}.lunar-mode .moon-control:focus-within{outline:none}.lunar-mode .moon-disc:focus-visible{outline:none}.lunar-mode:has(.moon-control :focus-visible) .ritual-note{text-decoration:underline;text-underline-offset:5px}
.lunar-mode .static-moon{left:50%!important;top:32%!important;width:100px!important;height:100px!important}.lunar-mode .static-moon .moon-disc{border:1px solid #a9bbcb;background:#263b5a;font-size:24px}
.lunar-mode{padding-top:78px!important;overflow-y:auto}.lunar-mode .ritual-heading,.lunar-mode .original-question{position:relative;z-index:9;pointer-events:none}.lunar-mode h2{font-size:clamp(24px,2.6vw,34px)}.lunar-mode .original-question{max-width:60%;max-height:38px}
.lunar-mode::before{content:"";position:fixed;inset:8% 5% 28%;z-index:1;pointer-events:none;opacity:.38;background:radial-gradient(circle at 8% 22%,#d8dfdf 0 1px,transparent 1.8px),radial-gradient(circle at 19% 64%,#a9bbcb 0 1.2px,transparent 2px),radial-gradient(circle at 37% 31%,#f5f2ea 0 1px,transparent 1.8px),radial-gradient(circle at 54% 76%,#b9afc8 0 1.2px,transparent 2px),radial-gradient(circle at 69% 42%,#d8dfdf 0 1px,transparent 1.8px),radial-gradient(circle at 88% 68%,#a9bbcb 0 1.2px,transparent 2px);background-size:210px 170px,270px 230px,320px 260px,240px 210px,300px 250px,220px 190px;animation:quiet-sky 12s ease-in-out infinite alternate}
.lunar-mode .moon-deck{position:fixed;top:46%;left:0;width:100%;height:280px;z-index:6;scrollbar-width:none;mask-image:linear-gradient(90deg,transparent,#000 12% 88%,transparent)}
.lunar-mode .moon-track{height:278px;transition:width .65s cubic-bezier(.22,.7,.2,1)}.lunar-mode .moon-card{top:24px;opacity:var(--arc-opacity,1)!important;transform:translate(-50%,var(--arc-y,0px)) rotate(var(--arc-angle,0deg)) scale(var(--arc-scale,1));transition:left .65s cubic-bezier(.22,.7,.2,1),opacity .16s,transform .3s;transform-origin:50% 110%}
.lunar-mode .moon-card img{box-shadow:none!important;animation:canopy-arrive 1.8s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--arrival,0ms)}
.lunar-mode .moon-card[aria-pressed=true]{transform:translate(-50%,calc(var(--arc-y,0px) - 18px)) rotate(var(--arc-angle,0deg)) scale(var(--arc-scale,1));opacity:.32!important}
.lunar-mode .moon-card:hover:not(:disabled){transform:translate(-50%,calc(var(--arc-y,0px) - 10px)) rotate(var(--arc-angle,0deg)) scale(var(--arc-scale,1))}
.lunar-mode .moon-slots{position:fixed;bottom:102px;left:50%;transform:translateX(-50%);margin:0;z-index:7;pointer-events:none}.lunar-mode .selection-status{position:fixed;bottom:69px;left:4%;right:4%;margin:0;z-index:9;pointer-events:none}.lunar-mode .ritual-actions{position:fixed;bottom:15px;left:3%;right:3%;margin:0;z-index:9}
@keyframes canopy-arrive{from{opacity:0;transform:translateY(-85px) scale(.25)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(max-width:700px){.lunar-mode .moon-deck{top:49%;height:230px}.lunar-mode .moon-track{height:230px}.lunar-mode .moon-slots{bottom:102px}.lunar-mode .original-question{max-width:85%;font-size:11px}.lunar-mode{padding-top:72px!important}.lunar-mode h2{font-size:24px}}
@media(max-height:640px){.lunar-mode{min-height:640px;position:absolute!important}.lunar-mode .moon-deck,.lunar-mode .moon-slots,.lunar-mode .selection-status,.lunar-mode .ritual-actions{position:absolute}.lunar-mode .moon-deck{top:300px}}
@media(prefers-reduced-motion:reduce){.lunar-mode .moon-card img{animation:none}.lunar-mode .moon-card,.lunar-mode .moon-track{transition:none}}
#card-view[open]{animation:viewer-in .65s cubic-bezier(.18,.7,.2,1) both;transform-origin:center}
#card-view::backdrop{animation:viewer-backdrop .5s ease both}
#card-view.is-closing p{opacity:0;transition:opacity .2s}
#card-view.is-closing::backdrop{animation:viewer-backdrop-out .52s ease both}
#card-view .turn-upright{animation:turn-upright .9s cubic-bezier(.2,.75,.2,1) both}
@keyframes viewer-in{from{opacity:0;transform:translate(var(--from-x),var(--from-y)) scale(.34)}to{opacity:1;transform:none}}
@keyframes viewer-backdrop{from{background:#08132200}to{background:#081322df}}
@keyframes viewer-out{from{opacity:1;transform:none}to{opacity:0;transform:translate(var(--from-x),var(--from-y)) scale(.34)}}
@keyframes viewer-backdrop-out{from{background:#081322df}to{background:#08132200}}
@keyframes turn-upright{from{transform:rotate(180deg)}to{transform:rotate(0)}}
@keyframes quiet-sky{from{transform:translate3d(-5px,3px,0);opacity:.26}to{transform:translate3d(8px,-7px,0);opacity:.46}}
@media(prefers-reduced-motion:reduce){#card-view[open],#card-view::backdrop,#card-view .turn-upright,.lunar-mode::before{animation:none}}
.lunar-mode .moon-track{transition:none}
.lunar-mode .moon-deck{pointer-events:auto;touch-action:pan-x;scroll-behavior:auto}
body[data-ritual=reveal] #ritual>.original-question{max-width:740px;margin:0 auto 36px;padding:0 16px;font-size:clamp(25px,3vw,38px);line-height:1.65;letter-spacing:.05em;overflow-wrap:anywhere;text-wrap:balance}
body[data-ritual=reveal] #ritual{padding-top:clamp(150px,26svh,310px)}
body[data-ritual=reveal] #garden{transform:translateY(5svh);height:100svh}
body[data-ritual=reveal] #ritual>.original-question{max-width:880px;font-size:clamp(26px,3.2vw,40px);margin-bottom:30px;line-height:1.6}
body[data-ritual=reveal] #ritual>.original-question::before{content:'朔望  ·  此刻之问';display:block;font-size:12px;letter-spacing:.3em;color:#d3bd92;margin-bottom:18px}
body[data-ritual=reveal] #ritual>.original-question::after{content:'';display:block;width:86px;height:1px;background:linear-gradient(90deg,transparent,#c7a56a,transparent);margin:22px auto 0}
body[data-ritual=reveal] header{visibility:hidden;pointer-events:none}
#card-view,#card-view:focus,#card-view:focus-visible{outline:none;box-shadow:none;-webkit-tap-highlight-color:transparent}
.lunar-mode .moon-deck{touch-action:none;overscroll-behavior-x:contain}
.lunar-mode .moon-card{transition:left .65s cubic-bezier(.22,.7,.2,1);-webkit-tap-highlight-color:transparent}
@media(hover:none){.lunar-mode .moon-card:hover:not(:disabled){transform:translate(-50%,var(--arc-y,0px)) rotate(var(--arc-angle,0deg)) scale(var(--arc-scale,1))}}
#enter{display:block;appearance:none;-webkit-appearance:none;width:max-content;min-width:180px;max-width:100%;height:auto;min-height:46px;padding:13px 26px!important;font-size:14px!important;line-height:1.5!important;letter-spacing:.08em;white-space:nowrap;text-align:center;overflow:visible;flex-shrink:0;backdrop-filter:none;-webkit-backdrop-filter:none}
#enter span{display:none}
@media(max-width:700px){body[data-ritual=reveal] .atmosphere::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(to bottom,transparent 68%,#101b1b70 85%,#101b1b 100%);pointer-events:none}body[data-ritual=reveal] #ritual{padding-bottom:calc(40px + env(safe-area-inset-bottom,0px))}}

/* Home follows the reading page's restrained type and fine gold rules. */
body .intro,body[data-scene] .intro{width:min(440px,84%);left:8.5%;top:auto;bottom:19%;text-align:left}
.intro #eyebrow{font-size:9px;letter-spacing:.2em;line-height:1.8;margin:0 0 22px;display:flex;align-items:center;gap:14px}
.intro #eyebrow::before{content:'';width:28px;height:1px;background:#c7a56a80;flex:none}
.intro #title{font-size:clamp(32px,3.2vw,46px);line-height:1.6;letter-spacing:.04em;white-space:pre-line;font-weight:400}
.intro #description{font-size:13px;line-height:1.9;letter-spacing:.08em;color:#bdc7c3;margin:18px 0 30px}
.intro #enter{min-width:0;width:max-content;max-width:100%;margin:0;padding:10px 0!important;border:0!important;border-bottom:1px solid #c7a56a70!important;border-radius:0!important;background:transparent!important;box-shadow:none;font-size:14px!important;letter-spacing:.1em;text-align:left;transition:color .3s,border-color .3s}
.intro #enter:hover{border-color:#e1cfac!important;color:#fff!important;transform:none}
body .intro #fresh-question{display:block;width:max-content;max-width:100%;margin:10px 0 0;padding:10px 0;border:0;border-radius:0;background:transparent;font-size:12px;letter-spacing:.08em;color:#bdc7c3;text-align:left}
body .intro #fresh-question:hover{color:#eee8d8;background:transparent;transform:none}
@media(max-width:700px){body .intro,body[data-scene] .intro{left:8%;width:84%;bottom:19%}.intro #eyebrow{font-size:8px;margin-bottom:18px;gap:10px}.intro #title{font-size:32px}.intro #description{font-size:12px;margin:14px 0 24px}}
@media(max-height:560px){body .intro,body[data-scene] .intro{bottom:17%;top:auto}.intro #eyebrow{margin-bottom:8px}.intro #title{font-size:28px;line-height:1.4}.intro #description{margin:8px 0 12px}body .intro #fresh-question{margin-top:0}}
