/* ONNEN — a place to cross into, and a place to return to.
   Presentation only. Ritual timings and private records retain their owners. */
:root{--yugen-paper:#e7dfd0;--yugen-soft:#c2b6a5;--yugen-red:#b34f3d;--yugen-line:rgba(207,179,142,.25);--yugen-x:0px;--yugen-y:0px}
body.onnen-yugen{background:#090b0c;color:var(--yugen-paper)}
.onnen-night{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden;contain:paint;opacity:.19;transition:opacity .8s ease}
.onnen-night-image{position:absolute;inset:-12px;background:url('/assets/scenes/onnen-night-river.webp') 72% center/cover no-repeat;transform:translate3d(var(--yugen-x),var(--yugen-y),0)}
.onnen-night:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,8,9,.58),transparent 65%),linear-gradient(0deg,#090b0c,transparent 32%,rgba(4,6,7,.12))}
body.onnen-yugen[data-screen='landing'] .onnen-night{opacity:1}
body.onnen-yugen:is([data-screen='target'],[data-screen='intensity'],[data-screen='message']) .onnen-night{opacity:.22}
/* This grain is static: oversized moving-grain bounds retain four viewports of tiles. */
body.onnen-yugen .grain{inset:0;opacity:.027;animation:none}
body.onnen-yugen #ambientCanvas{opacity:.14}
body.onnen-yugen .site-header{border-bottom-color:rgba(218,195,156,.16);background:linear-gradient(180deg,rgba(6,9,10,.8),rgba(6,9,10,.35));backdrop-filter:blur(12px)}
body.onnen-yugen .brand-mark{border-color:#9c4939;background:rgba(104,30,21,.16)}
body.onnen-yugen .brand-copy strong{letter-spacing:.2em}
body.onnen-yugen .brand-copy small{color:#a89b88}
body.onnen-yugen .landing-grid{grid-template-columns:minmax(0,1.28fr) minmax(0,.72fr);padding:clamp(48px,8vh,110px) 3vw 64px;gap:5vw;min-height:calc(100svh - 160px)}
body.onnen-yugen .landing-copy{max-width:720px;text-shadow:0 2px 24px #050708}
body.onnen-yugen .landing-copy #landingTitle{font-size:clamp(44px,5.8vw,86px)!important;line-height:1.21!important;letter-spacing:-.045em!important;color:var(--yugen-paper)}
body.onnen-yugen .landing-copy h1 em{color:#d0af96}
body.onnen-yugen .landing-copy .eyebrow{font-size:11px;color:#c1a68b;line-height:1.9;letter-spacing:.2em;max-width:46ch}
body.onnen-yugen .landing-copy .lede{max-width:39ch;font-size:15px;line-height:1.95;color:#c4bbaf}
body.onnen-yugen .landing-actions{margin-top:34px;gap:14px}
body.onnen-yugen .landing-actions .primary-cta{min-height:56px;padding:0 26px;font-size:13px;letter-spacing:.06em;background:#e1d5bf;color:#201711;box-shadow:0 4px 40px rgba(164,62,40,.13);text-shadow:none}
body.onnen-yugen .primary-cta:hover{background:#f1e5cf}
body.onnen-yugen .landing-actions .text-cta{padding:12px;color:#d4c5b0;min-height:48px;font-size:13px;letter-spacing:.04em;text-shadow:none}
body.onnen-yugen .onnen-room-entry{min-height:48px;background:rgba(12,15,15,.72);color:#dfcfb6;border-color:rgba(198,161,114,.45);padding-inline:18px;text-shadow:none}
body.onnen-yugen .landing-sigil{align-self:end;width:min(24vw,310px);opacity:.88!important;transform:none!important;filter:none!important;margin-bottom:12px}
body.onnen-yugen .landing-sigil .sigil-core{background:rgba(29,13,10,.8);border-color:#be6651;box-shadow:0 0 65px rgba(165,53,32,.18)}
body.onnen-yugen .landing-sigil .sigil-core span{font-size:clamp(34px,4vw,52px);color:#e0c5a5}
body.onnen-yugen .landing-sigil .sigil-ring{border-color:rgba(197,112,83,.34)}
body.onnen-yugen .landing-sigil .sigil-caption{color:#c3b39c;font-size:10px;letter-spacing:.09em;text-shadow:0 2px 6px #000}
body.onnen-yugen #landingMicrocopy{margin-top:25px;color:#d3bea2!important}
body.onnen-yugen #ageNote{color:#bdb3a5!important;max-width:48ch;line-height:1.85!important}
body.onnen-yugen .live-strip{background:rgba(5,8,9,.68);border-color:rgba(195,151,113,.18);backdrop-filter:blur(8px)}
body.onnen-yugen #legalDock{background:rgba(6,8,9,.86);border-color:rgba(191,158,114,.18)}
/* Keep the two native welcome columns. The art occupies the silent upper right. */
html body.onnen-yugen #v18Welcome{background:#090b0c;padding:clamp(28px,7vw,108px);align-items:center}
html body.onnen-yugen #v18Welcome .v18-welcome-bg{inset:-12px;background:url('/assets/scenes/onnen-night-river.webp') 72% center/cover no-repeat;animation:none;transform:translate3d(var(--yugen-x),var(--yugen-y),0);filter:none}
html body.onnen-yugen #v18Welcome .v18-welcome-red{inset:0;background:linear-gradient(90deg,rgba(3,7,8,.4),rgba(5,7,8,.08) 62%),linear-gradient(0deg,rgba(5,7,8,.91),transparent 66%);animation:none;transform:none}
html body.onnen-yugen #v18Welcome .v18-welcome-line{inset:-15%;background:radial-gradient(ellipse at 65% 63%,rgba(211,206,185,.065),transparent 42%);opacity:1;animation:onnen-yugen-mist 18s ease-in-out infinite alternate}
html body.onnen-yugen #v18Welcome .v18-welcome-inner{width:min(1300px,100%);grid-template-columns:minmax(0,1.45fr) minmax(260px,.65fr);gap:clamp(48px,9vw,170px);align-items:end}
html body.onnen-yugen #v18Welcome .v18-mark{width:56px;height:56px;font-size:28px;background:rgba(28,11,8,.72);margin-bottom:32px;border-color:#b6644c;animation:none}
html body.onnen-yugen #v18Welcome .v18-mark:before,html body.onnen-yugen #v18Welcome .v18-mark:after{animation:none;opacity:.25}
html body.onnen-yugen #v18Welcome .v18-kicker{color:#c2ab8f;font-size:11px;letter-spacing:.2em;animation:none}
html body.onnen-yugen #v18Welcome h1{color:#eee4d4;font-size:clamp(44px,6.1vw,86px)!important;line-height:1.18!important;letter-spacing:-.04em;max-width:12em;text-shadow:0 3px 40px #030505;animation:none;text-wrap:balance}
html body.onnen-yugen #v18Welcome .v18-body{color:#c5bdb0;font-size:15px;line-height:1.95;max-width:42ch;text-shadow:0 2px 12px #000;animation:none}
html body.onnen-yugen #v18Welcome .v18-steps{color:#bda68b;border-top-color:rgba(211,174,125,.22);font-size:11px;padding-top:20px;animation:none}
html body.onnen-yugen #v18Welcome .v18-panel{background:rgba(8,12,13,.78);border:1px solid rgba(211,174,125,.32);border-top-color:#ab7354;padding:28px;backdrop-filter:blur(18px);box-shadow:0 24px 80px rgba(0,0,0,.35);animation:none}
html body.onnen-yugen #v18Welcome .v18-label{color:#c1ad94;font-size:11px}
html body.onnen-yugen #v18WelcomeLanguage{color:#e5d8c6;background:rgba(5,8,9,.5);border-color:#665343;min-height:50px}
/* Style the open list as well as the closed control. Native fallback stays dark. */
html body.onnen-yugen #v18WelcomeLanguage{background:#11191c!important;color:#f2e6d3!important;color-scheme:dark}
html body.onnen-yugen #v18WelcomeLanguage option{background:#11191c;color:#f2e6d3;font-size:15px}
html body.onnen-yugen #v18WelcomeLanguage option:checked{background:#e1cba8;color:#171d20;font-weight:700}
@supports(appearance:base-select){
 html body.onnen-yugen #v18WelcomeLanguage,html body.onnen-yugen #v18WelcomeLanguage::picker(select){appearance:base-select}
 html body.onnen-yugen #v18WelcomeLanguage{display:flex;align-items:center;justify-content:space-between;padding:14px 16px}
 html body.onnen-yugen #v18WelcomeLanguage::picker(select){background:#11191c;color:#f2e6d3;border:1px solid #b99b73;box-shadow:0 16px 48px #000a;max-height:min(460px,60dvh);overflow-y:auto;min-width:200px;border-radius:2px;scrollbar-color:#9c7d57 #11191c}
 html body.onnen-yugen #v18WelcomeLanguage::picker-icon{color:#ddc5a0;transition:rotate .2s}
 html body.onnen-yugen #v18WelcomeLanguage:open::picker-icon{rotate:180deg}
 html body.onnen-yugen #v18WelcomeLanguage option{padding:13px 17px;min-height:46px;border-bottom:1px solid #a0805926;line-height:1.35;gap:12px}
 html body.onnen-yugen #v18WelcomeLanguage option:is(:hover,:focus-visible){background:#533b2d;color:#fff5e1;outline:2px solid #d3b78a;outline-offset:-2px}
 html body.onnen-yugen #v18WelcomeLanguage option:checked{background:#e1cba8;color:#171d20}
 html body.onnen-yugen #v18WelcomeLanguage option::checkmark{color:#852e24}
 html body.onnen-yugen #v18Welcome .v18-select-wrap:after{display:none}
}
html body.onnen-yugen #v18WelcomeEnter{min-height:54px;background:#e1d5bf;color:#231810;transition:background .2s,box-shadow .2s}
html body.onnen-yugen #v18WelcomeEnter:hover{background:#f0e3ce;box-shadow:0 0 28px rgba(216,140,83,.15)}
html body.onnen-yugen #v18WelcomeEnter:after{animation:none;background:none}
.onnen-atmosphere-toggle{display:inline-flex;align-items:center;gap:9px;border:0;border-bottom:1px solid rgba(183,154,118,.25);border-radius:0;background:transparent;color:#c1b29e;min-height:44px;padding:9px 2px;font:400 12px/1.5 system-ui;letter-spacing:.03em;cursor:pointer}
.onnen-atmosphere-toggle:before{content:'';width:6px;height:6px;border:1px solid #b18b64;border-radius:50%;background:#b18b64}
.onnen-atmosphere-toggle[aria-pressed='true']:before{background:transparent}
.onnen-atmosphere-toggle:hover{color:#eee1cd;border-color:#c7a77d}
.onnen-atmosphere-toggle:focus-visible{outline:2px solid #e7bd81;outline-offset:4px}
.v18-panel>.onnen-atmosphere-toggle{margin-top:12px;width:100%;justify-content:center}
.landing-copy>.onnen-atmosphere-toggle{margin-top:10px;align-self:flex-start}
body.onnen-yugen .flow-panel{background:linear-gradient(135deg,rgba(28,23,19,.92),rgba(11,13,14,.94));border:1px solid rgba(182,143,100,.27);box-shadow:0 25px 80px rgba(0,0,0,.25);padding:clamp(20px,2.6vw,38px);min-width:0;box-sizing:border-box}
body.onnen-yugen .flow-panel .choice-fieldset{margin-inline:0;min-width:0;padding-inline:0}
html body.onnen-yugen .flow-panel :is(.choice-chip.selected,.choice-chip[aria-pressed="true"],.level-card.selected,.level-card[aria-pressed="true"],.visibility-card.selected,.visibility-card[aria-pressed="true"]){background:linear-gradient(120deg,rgba(138,35,31,.8),rgba(70,21,20,.9));border-color:#c96858;color:#ffead8;box-shadow:inset 0 0 0 1px rgba(230,125,101,.14)}
body.onnen-yugen .flow-panel .choice-chip:focus-visible{outline:2px solid #e2ad83;outline-offset:3px}
body.onnen-yugen .flow-panel .level-card.selected :is(h3,p,small,.level-number){color:#f4d9c5}
@media(max-width:760px){body.onnen-yugen .flow-panel{padding:20px 16px}body.onnen-yugen .flow-panel .choice-fieldset{margin-inline:0;padding-inline:0}}
body.onnen-yugen :is(.ritual-input,.ritual-textarea){background:rgba(3,7,8,.66);border-color:rgba(191,157,115,.32);color:#e1d7c7}
body.onnen-yugen :is(.ritual-input,.ritual-textarea):focus{border-color:#bb7654;box-shadow:0 0 0 3px rgba(168,94,60,.08);outline-offset:4px}
body.onnen-yugen .choice-chip{background:rgba(13,16,16,.72);border-color:rgba(191,157,115,.28);min-height:46px}
body.onnen-yugen .flow-aside h2{color:#e0d3c1;text-shadow:0 3px 30px #030505}
body.onnen-yugen .flow-aside{top:calc(var(--onnen-header-height,82px) + 24px)}
html{scroll-padding-top:calc(var(--onnen-header-height,82px) + 24px)}
body.onnen-yugen .flow-panel :is(input,textarea,button,select){scroll-margin-top:calc(var(--onnen-header-height,82px) + 24px)}
body.onnen-yugen .flow-aside>p{color:#bfb3a2}
/* The return object remains recognizable, framed by the same night river. */
body.onnen-yugen #v25ReturningPresence.v91-return-threshold{background:linear-gradient(110deg,rgba(12,15,16,.96),rgba(15,14,12,.85))!important;border-top-color:#936c4c!important;backdrop-filter:blur(12px)}
body.onnen-yugen.onnen-has-seals .landing-copy #landingTitle{font-size:clamp(30px,3.5vw,48px)!important}
body.onnen-yugen #onnenQuietRoom[data-scene='moon']{background:#080d10}
body.onnen-yugen #onnenQuietRoom[data-scene='moon'] .onnen-room-shell{background:linear-gradient(90deg,rgba(5,10,12,.94),rgba(5,10,12,.25)),url('/assets/scenes/onnen-night-river.webp') 75% center/cover}
body.onnen-yugen #onnenQuietRoom .onnen-room-shell:before{border:0;right:-5%;top:40%;width:90%;height:60%;background:radial-gradient(ellipse,rgba(182,183,167,.065),transparent 65%);border-radius:0;animation:onnen-yugen-mist 18s ease-in-out infinite alternate}
body.onnen-yugen #onnenQuietRoom[data-scene='ember'] .onnen-room-shell:before{background:radial-gradient(ellipse,rgba(198,97,39,.1),transparent 65%)}
body.onnen-yugen #onnenQuietRoom[data-scene='paper'] .onnen-room-shell:before{background:radial-gradient(ellipse,rgba(190,164,102,.08),transparent 65%)}
body.onnen-yugen #onnenQuietRoom .onnen-room-object{filter:drop-shadow(0 15px 26px rgba(0,0,0,.4))}
body.onnen-yugen #onnenQuietRoom .onnen-room-footer{background:rgba(6,10,11,.38)}
body.onnen-yugen #onnenQuietRoom .onnen-room-header{position:relative;z-index:2}
body.onnen-yugen #onnenQuietRoom :is(#onnenRoomTitle,#onnenRoomBody,.onnen-room-local){text-shadow:0 2px 14px #020506}
body.onnen-yugen #onnenQuietRoom .onnen-room-kicker{margin-right:auto}
body.onnen-yugen #onnenQuietRoom .onnen-contemplate{background:rgba(6,10,11,.62);flex-shrink:0}
body.onnen-yugen #onnenQuietRoom[data-contemplating='true'] .onnen-room-content{grid-template-columns:1fr;justify-items:center;min-height:400px}
body.onnen-yugen #onnenQuietRoom[data-contemplating='true'] .onnen-room-copy{display:none}
body.onnen-yugen #onnenQuietRoom[data-contemplating='true'] .onnen-room-object{width:min(420px,100%)}
body.onnen-yugen #onnenQuietRoom[data-contemplating='true'][data-has-seal='false'] .onnen-room-object{visibility:hidden}
body.onnen-yugen #onnenQuietRoom[data-contemplating='true'][data-scene='moon'] .onnen-room-shell{background:linear-gradient(0deg,rgba(3,7,9,.65),transparent 75%),url('/assets/scenes/onnen-night-river.webp') 72% center/cover}
body.onnen-yugen #onnenQuietRoom .onnen-room-copy[hidden]{display:none}
@keyframes onnen-yugen-mist{from{transform:translate3d(-2%,1%,0);opacity:.6}to{transform:translate3d(3%,-2%,0);opacity:1}}
html[data-onnen-atmosphere='still'] .onnen-night-image,html[data-onnen-atmosphere='still'] body.onnen-yugen #v18Welcome .v18-welcome-bg{transform:none!important}
html[data-onnen-atmosphere='still'] body.onnen-yugen :is(.v18-welcome-line,.landing-sigil,.sigil-ring),html[data-onnen-atmosphere='still'] body.onnen-yugen .landing-sigil:before{animation:none!important}
html[data-onnen-atmosphere='still'] body.onnen-yugen #ambientCanvas{visibility:hidden}
html[data-onnen-page-hidden='true'] body.onnen-yugen #v18Welcome .v18-welcome-line,html[data-onnen-page-hidden='true'] body.onnen-yugen #onnenQuietRoom .onnen-room-shell:before,body.onnen-yugen #onnenQuietRoom[data-still='true'] .onnen-room-shell:before{animation-play-state:paused!important}
@media(min-width:1600px){.onnen-night-image,html body.onnen-yugen #v18Welcome .v18-welcome-bg{background-position:center}}
@media(max-width:900px){
 body.onnen-yugen .landing-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,.4fr);gap:16px;padding-inline:12px}
 html body.onnen-yugen #v18Welcome{padding:40px 32px}
 html body.onnen-yugen #v18Welcome .v18-welcome-inner{gap:32px;grid-template-columns:minmax(0,1.2fr) minmax(250px,.8fr)}
 html body.onnen-yugen #v18Welcome .v18-panel{padding:22px}
}
@media(max-width:720px){
 .onnen-night-image{background-position:72% top;background-size:auto max(740px,100svh)}
 .onnen-night:after{background:linear-gradient(0deg,#090b0c 5%,rgba(5,8,9,.72) 48%,rgba(5,8,9,.16))}
 body.onnen-yugen .landing-grid{grid-template-columns:1fr;padding:74px 0 34px;min-height:0}
 body.onnen-yugen .landing-copy{max-width:100%}
 body.onnen-yugen .landing-copy #landingTitle{font-size:clamp(38px,9.4vw,62px)!important;max-width:13em;line-height:1.23!important}
 body.onnen-yugen .landing-copy .lede{font-size:14px;max-width:37ch;margin-top:24px}
 body.onnen-yugen .landing-sigil{width:170px;justify-self:end;margin:4px 12px 10px}
 body.onnen-yugen .landing-actions{gap:10px;margin-top:26px}
 body.onnen-yugen .landing-actions .primary-cta{min-height:54px;flex-basis:100%;justify-content:space-between}
 body.onnen-yugen #ageNote{max-width:100%}
 html body.onnen-yugen #v18Welcome{place-items:start center;padding:48px 24px 30px}
 html body.onnen-yugen #v18Welcome .v18-welcome-inner{grid-template-columns:1fr;gap:30px}
 html body.onnen-yugen #v18Welcome .v18-welcome-bg{background-position:74% top;background-size:auto max(720px,100svh)}
 html body.onnen-yugen #v18Welcome .v18-welcome-red{background:linear-gradient(0deg,#080b0d 6%,rgba(5,8,9,.68) 57%,rgba(5,8,9,.15))}
 html body.onnen-yugen #v18Welcome .v18-mark{margin-bottom:70px;width:48px;height:48px;font-size:25px}
 html body.onnen-yugen #v18Welcome h1{font-size:clamp(36px,10vw,60px)!important;max-width:12em;line-height:1.23!important;margin-bottom:24px}
 html body.onnen-yugen #v18Welcome .v18-body{font-size:14px;line-height:1.9;margin-bottom:22px;max-width:40ch}
 html body.onnen-yugen #v18Welcome .v18-panel{padding:22px;background:rgba(8,12,13,.8)}
 body.onnen-yugen #onnenQuietRoom[data-scene='moon'] .onnen-room-shell{background:linear-gradient(90deg,rgba(5,10,12,.86),rgba(5,10,12,.5)),url('/assets/scenes/onnen-night-river.webp') 72% top/auto 100%}
 body.onnen-yugen #onnenQuietRoom .onnen-room-header{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}
 body.onnen-yugen #onnenQuietRoom .onnen-room-kicker{grid-column:1;grid-row:1}
 body.onnen-yugen #onnenQuietRoom .onnen-room-close{grid-column:2;grid-row:1;margin:0}
 body.onnen-yugen #onnenQuietRoom .onnen-audio-room{grid-column:2;grid-row:2;justify-self:end;margin:0}
 body.onnen-yugen #onnenQuietRoom .onnen-room-kicker{flex-basis:100%;margin-bottom:6px}
 body.onnen-yugen #onnenQuietRoom .onnen-room-close{margin-left:auto}
 body.onnen-yugen #onnenQuietRoom[data-contemplating='true'] .onnen-room-content{min-height:340px;flex:1}
}
@media(prefers-reduced-motion:reduce){
 .onnen-night-image,html body.onnen-yugen #v18Welcome .v18-welcome-bg{transform:none!important}
 .onnen-night{transition:none}
 html body.onnen-yugen #v18Welcome .v18-welcome-line,body.onnen-yugen #onnenQuietRoom .onnen-room-shell:before{animation:none!important}
}
