@font-face{font-family:Figtree;font-weight:400;font-display:swap;src:url(fonts/figtree-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:Figtree;font-weight:500;font-display:swap;src:url(fonts/figtree-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:Figtree;font-weight:600;font-display:swap;src:url(fonts/figtree-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:Fraunces;font-weight:700;font-display:swap;src:url(fonts/fraunces-latin-700-normal.woff2) format('woff2')}
:root{--bg:#F3F7F2;--card:#fff;--ink:#0B2F26;--mut:#4F6E63;--soft:#7C9A8F;--green:#2F9A74;--mint:#BFE8D2;--mint2:#DDF1E6;--cream:#FBF3E6;--sun:#FFB52E;--sunedge:#D98E00;--coral:#FF7A6A;--edge:24px}
*{box-sizing:border-box;margin:0;-webkit-tap-highlight-color:transparent}
html,body{background:var(--bg);color:var(--ink);font-family:Figtree,system-ui,sans-serif;font-size:17px;line-height:1.45}
h1,h2,h3,.serif{font-family:Fraunces,Georgia,serif;font-weight:700;letter-spacing:-.025em;line-height:1.1}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
a{color:inherit}
:focus-visible{outline:3px solid var(--green);outline-offset:3px;border-radius:14px}
#app{max-width:480px;margin:0 auto;min-height:100vh;padding:calc(env(safe-area-inset-top) + 14px) var(--edge) 120px}
#app.full{padding-bottom:calc(env(safe-area-inset-bottom) + 24px)}
.mut{color:var(--mut);font-size:15px}.soft{color:var(--soft)}
h1{font-size:36px}h2{font-size:23px;margin:26px 0 12px}h3{font-size:19px}
/* top bar */
.bar{display:flex;align-items:center;gap:12px;min-height:48px;margin-bottom:10px}.bar .sp{flex:1}
.bar h1{font-size:30px;line-height:1.1}.bar .mk{width:46px;height:46px}
.chipback{display:inline-flex;align-items:center;gap:6px;height:44px;padding:0 16px 0 12px;border-radius:99px;background:#fff;font-weight:600;font-size:15px;box-shadow:0 6px 18px -12px rgba(11,47,38,.35)}
.round{width:44px;height:44px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 6px 18px -12px rgba(11,47,38,.35)}
/* buttons */
.btn{display:block;width:100%;height:58px;border-radius:22px;background:var(--sun);border-bottom:4px solid var(--sunedge);font-weight:600;font-size:18px;color:var(--ink);text-align:center;font-family:Fraunces,serif;letter-spacing:-.01em}
.btn:active{transform:translateY(2px);border-bottom-width:2px}.btn[disabled]{opacity:.45}
.btn.alt{background:#fff;border:2px solid var(--mint);border-bottom-width:4px}
.btn.sm{height:44px;width:auto;padding:0 22px;font-size:16px;border-radius:16px}
.row{display:flex;gap:12px}.row>*{flex:1}
.pill{display:inline-flex;align-items:center;gap:8px;background:#E9EFEA;padding:8px 14px;border-radius:99px;font-size:14px;font-weight:600}.pill:before{content:"";width:10px;height:10px;border-radius:50%;background:var(--sun)}
.chip{display:inline-block;padding:9px 16px;border-radius:99px;background:#fff;font-weight:600;font-size:14px;margin:0 8px 8px 0;box-shadow:0 4px 14px -10px rgba(11,47,38,.4)}
.chip.m{background:var(--mint2)}.chip.on{background:var(--mint2);outline:2px solid var(--green)}
.card{background:#fff;border-radius:28px;padding:22px;margin-bottom:14px;box-shadow:0 1px 0 rgba(11,47,38,.03),0 12px 30px -20px rgba(11,47,38,.3)}
/* fields */
.field{background:#fff;border-radius:20px;padding:12px 16px;margin-bottom:12px;box-shadow:0 6px 20px -16px rgba(11,47,38,.35)}
.field label{display:block;font-size:13px;color:var(--mut);font-weight:600;margin-bottom:2px}
input,textarea,select{width:100%;font:inherit;color:var(--ink);background:none;border:0;outline:none;padding:6px 0}textarea{min-height:120px;resize:none}
.field:focus-within{outline:2px solid var(--green)}
/* tiles */
.tile{display:block;width:100%;aspect-ratio:1;object-fit:contain}
.tilebtn{display:grid;gap:4px;text-align:center;font-weight:600;font-size:15px;justify-items:center}
.tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px 14px}
.tiles .tilebtn img{border-radius:28px}
/* today */
.hello{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:6px}.hello .g{color:var(--mut);font-size:16px}.hello h1{font-size:34px}
.hero{text-align:center;padding:6px 0 4px}.hero img{width:min(300px,72%);margin:8px auto 22px;display:block}
.hero .q{font-size:32px;padding:0 4px;margin-bottom:12px}.hero .ask{color:var(--mut);font-size:16px;margin-bottom:22px}
.rv{display:flex;align-items:center;gap:14px;background:#fff;border-radius:26px;padding:12px;margin-top:20px;box-shadow:0 12px 30px -20px rgba(11,47,38,.3)}
.rv img{width:84px;height:84px;border-radius:20px}.rv .n{font-family:Fraunces,serif;font-weight:700;font-size:44px;line-height:1}.rv .l{font-size:13px;color:var(--mut)}.rv>div{flex:1}
/* world rows */
.wh{text-align:center;margin:6px 0 18px}.wh img{width:200px;margin:0 auto 6px;display:block}.wh h1{font-size:34px}
.rows a,.rows .it{display:flex;gap:14px;align-items:center;background:#fff;border-radius:22px;padding:12px 14px;margin-bottom:10px;text-decoration:none;cursor:pointer;box-shadow:0 8px 24px -18px rgba(11,47,38,.35)}
.rows img{width:56px;height:56px;border-radius:14px;flex:none}.rows b{display:block;font-size:16px;line-height:1.25;font-weight:600}.rows span{font-size:13px;color:var(--mut)}.rows i{margin-left:auto;font-style:normal;color:var(--soft);font-size:22px}
/* note: concept swipe */
.swipe{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(var(--edge)*-1);padding:6px var(--edge);scrollbar-width:none}.swipe::-webkit-scrollbar{display:none}
.cc{flex:0 0 calc(100% - 28px);scroll-snap-align:center;background:#fff;border-radius:32px;padding:34px 24px;min-height:340px;display:grid;place-items:center;text-align:center;font-family:Fraunces,serif;font-weight:700;letter-spacing:-.025em;line-height:1.14;box-shadow:0 14px 34px -22px rgba(11,47,38,.35)}
.dots{display:flex;justify-content:center;gap:8px;margin:14px 0 4px}.dots i{width:8px;height:8px;border-radius:50%;background:var(--mint)}.dots i.on{background:var(--ink)}
.stk{position:sticky;bottom:0;padding:14px 0 calc(env(safe-area-inset-bottom) + 4px);background:linear-gradient(180deg,rgba(243,247,242,0),var(--bg) 30%)}.stk .btn+.btn{margin-top:10px}.stk.n{bottom:68px;padding-bottom:6px}@media(min-width:900px){.stk.n{bottom:0}}
/* reader */
.rhead{display:flex;align-items:center;gap:10px;font-weight:600;font-size:16px;margin-bottom:8px}.rhead img{width:44px;height:44px;border-radius:12px}.rhead span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.prog{height:6px;border-radius:9px;background:#E5ECE7;margin-bottom:26px;overflow:hidden}.prog i{display:block;height:100%;background:var(--sun);width:0}
.read p{font-size:20px;line-height:1.55;margin:0 0 22px;max-width:30em}.read h3{font-size:22px;margin:30px 0 14px}.read ul,.read ol{padding-left:24px;margin:0 0 22px}.read li{font-size:20px;line-height:1.5;margin-bottom:8px}
.read .qt{font-family:Fraunces,serif;font-weight:700;font-size:26px;line-height:1.2;letter-spacing:-.02em;margin:26px 0;padding:0}
/* review session */
.rtop{display:flex;align-items:center;gap:14px;margin-bottom:12px}.rtop .prog{flex:1;margin:0}.rtop b{font-size:17px}
.rcard{background:#fff;border-radius:32px;padding:34px 24px;min-height:300px;display:grid;place-items:center;text-align:center;box-shadow:0 14px 34px -22px rgba(11,47,38,.35)}
.rcard .serif{font-size:28px;line-height:1.14}.rcard .hid{display:block;height:54px;border-radius:99px;background:#CFEADB;margin:18px auto 0;width:84%}.rcard .ans{color:var(--green)}
.rate{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;text-align:center;font-size:13px;color:var(--mut)}.rate button{height:48px;border-radius:99px;font-weight:600;font-size:16px;color:#fff;border-bottom:3px solid rgba(0,0,0,.18);margin-bottom:6px}
.rate .a{background:var(--coral)}.rate .h{background:var(--sun);color:var(--ink)}.rate .g{background:var(--green)}.rate .e{background:var(--mint);color:var(--ink)}
.cap{text-align:center;color:var(--mut);margin:20px 0 14px;font-size:16px}
/* add */
.drop{border:2px dashed #CBDDD2;border-radius:24px;min-height:200px;background:#fff;padding:14px;display:flex;flex-direction:column}.drop textarea{flex:1;min-height:150px;font-size:18px}
.drop .ph{text-align:center;pointer-events:none}
.plus{width:68px;height:68px;border-radius:50%;background:var(--mint2);display:grid;place-items:center;font-size:36px;margin:20px auto 8px}
.dot{display:inline-block;width:14px;height:14px;border-radius:50%;margin-right:8px;vertical-align:-1px}
.seg{display:flex;background:#E5ECE7;border-radius:16px;padding:4px;margin:0 0 12px}.seg button{flex:1;height:42px;border-radius:12px;font-weight:600;color:var(--mut)}.seg .on{background:#fff;color:var(--ink);box-shadow:0 4px 10px -6px rgba(0,0,0,.3)}
.tg{display:flex;align-items:center;gap:12px;background:#fff;border-radius:18px;padding:14px 16px;margin-bottom:14px}.tg span{flex:1;font-weight:500}
.sw{width:52px;height:30px;border-radius:99px;background:#CBD8D0;position:relative;flex:none}.sw:after{content:"";position:absolute;left:3px;top:3px;width:24px;height:24px;border-radius:50%;background:#fff;transition:.15s}.sw.on{background:var(--green)}.sw.on:after{left:25px}
/* map */
.map{position:relative;width:100%;aspect-ratio:1;margin:6px 0 10px}.map svg{position:absolute;inset:0;width:100%;height:100%}.map button{position:absolute;transform:translate(-50%,-50%);display:grid;justify-items:center;gap:2px;font-weight:600;font-size:13px}
.map button img{width:74px;height:74px;border-radius:50%;object-fit:cover;border:3px solid var(--coral);background:#fff;transition:transform .15s}.map button.on img{transform:scale(1.14);box-shadow:0 8px 20px -8px rgba(11,47,38,.5)}
.map .k{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:84px;height:84px;border-radius:50%;background:#fff;display:grid;place-items:center;font-family:Fraunces,serif;font-weight:700;font-size:40px;box-shadow:0 12px 26px -16px rgba(11,47,38,.5)}
/* splash */
.sp1{min-height:calc(100vh - 150px);display:flex;flex-direction:column;position:relative}
.sun{position:absolute;right:-60px;top:-90px;width:330px;height:330px;border-radius:50%;background:radial-gradient(circle at 40% 40%,#FFC04A,#FFB52E 62%,rgba(255,181,46,.55));filter:blur(.3px)}
.sp-in{margin:auto 0;position:relative}.sp-in h1{font-size:76px;letter-spacing:-.04em}
.sdots{display:flex;justify-content:center;gap:8px;margin:0 0 18px}.sdots i{width:9px;height:9px;border-radius:50%;background:var(--mint)}.sdots i.on{background:var(--ink)}
.photo{width:min(300px,72%);aspect-ratio:1;object-fit:cover;border-radius:50%;display:block;margin:16px auto 22px}
.kt{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:12px 0 22px}
.kt span{background:var(--mint2);padding:8px 16px;border-radius:99px;font-weight:600;font-size:14px}
.big{font-size:56px;letter-spacing:-.04em;line-height:1}
.logo{width:96px;height:auto}
/* misc */
.otp{display:flex;gap:10px;justify-content:center;margin:18px 0}.otp input{width:48px;height:56px;text-align:center;font-size:24px;font-weight:600;background:#fff;border-radius:14px;padding:0;box-shadow:0 6px 18px -14px rgba(11,47,38,.4)}.otp input:focus{outline:2px solid var(--green)}
.keys{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:6px}.keys button{height:52px;border-radius:14px;background:#fff;font-size:22px;font-weight:500}
.timeline{position:relative;padding-left:0}.tl{display:flex;align-items:center;gap:16px;margin:0 0 26px;position:relative;font-family:Fraunces,serif;font-weight:700;font-size:19px;line-height:1.2}.tl .ic{width:48px;height:48px;border-radius:50%;background:var(--mint);display:grid;place-items:center;flex:none;font-size:20px}
.bel{display:flex;gap:14px;align-items:center;background:#fff;border-radius:20px;padding:20px 18px;margin-bottom:10px;font-family:Fraunces,serif;font-weight:700;font-size:18px;line-height:1.2}.bel i{width:34px;height:34px;border-radius:50%;flex:none}
.bigq{background:linear-gradient(135deg,var(--cream),#FDEBD2);border-radius:26px;padding:28px 22px;font-size:30px;margin-bottom:12px;position:relative}
.big-card{padding:22px;font-size:34px;line-height:1.1}.big-card small{display:block;font-family:Figtree;font-weight:500;font-size:17px;letter-spacing:0;color:var(--mut);margin-top:10px;line-height:1.35}
.li{display:flex;gap:14px;align-items:center;padding:16px 8px;border-bottom:1px solid #EEF3EF;font-weight:500;font-size:16px}.li:last-child{border:0}.li i{width:40px;height:40px;border-radius:50%;background:var(--mint2);display:grid;place-items:center;font-style:normal;flex:none}
.vid{border-radius:20px;background:linear-gradient(135deg,#DDF1E6,#FBF3E6);aspect-ratio:16/9;display:grid;place-items:center;position:relative;margin-bottom:10px}.vid b{width:60px;height:60px;border-radius:50%;background:#fff;display:grid;place-items:center;font-size:24px}.vid span{position:absolute;right:10px;bottom:10px;background:rgba(11,47,38,.85);color:#fff;border-radius:8px;padding:2px 8px;font-size:12px}
.badge{background:var(--sun);border-radius:99px;font-size:12px;padding:4px 10px;font-weight:600;font-family:Figtree;letter-spacing:0}
.num{font-family:Fraunces,serif;font-weight:700;font-size:56px;line-height:1}
.empty{text-align:center;padding:36px 12px}.empty img{width:64px;margin-bottom:12px}
.small{font-size:13px;color:var(--mut);text-align:center;margin-top:14px}
.sheet{position:fixed;inset:0;background:rgba(11,47,38,.35);display:flex;align-items:flex-end;z-index:20}.sheet>div{background:var(--bg);width:100%;max-width:480px;margin:0 auto;border-radius:28px 28px 0 0;padding:22px var(--edge) calc(env(safe-area-inset-bottom) + 22px)}
/* nav */
.nav{position:fixed;left:0;right:0;bottom:0;z-index:10;background:rgba(243,247,242,.94);backdrop-filter:blur(14px);padding:8px 8px calc(env(safe-area-inset-bottom) + 6px);border-top:1px solid #E1EBE4}
.nav div{max-width:480px;margin:0 auto;display:flex}.nav button{flex:1;display:grid;justify-items:center;gap:3px;font-size:12px;font-weight:600;color:var(--soft);padding:6px 0}
.nav svg{width:26px;height:26px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.nav .on{color:var(--ink)}.nav .on svg{fill:var(--ink);stroke:var(--ink)}.nav .on svg path[d^='M12 8']{stroke:#fff}
#toast{position:fixed;left:50%;bottom:104px;transform:translate(-50%,20px);background:var(--ink);color:#fff;padding:12px 18px;border-radius:99px;opacity:0;transition:.25s;pointer-events:none;z-index:30;font-size:15px;max-width:90vw}#toast.on{opacity:1;transform:translate(-50%,0)}
@media(min-width:900px){
 #app{max-width:760px;margin-left:calc(50% - 380px + 90px);padding-left:40px;padding-right:40px}
 .nav{top:0;bottom:0;right:auto;width:180px;border-top:0;border-right:1px solid #E1EBE4;padding:30px 14px}.nav div{display:block;max-width:none}.nav button{display:flex;gap:14px;align-items:center;width:100%;font-size:16px;padding:14px 16px;border-radius:16px;justify-items:start}.nav .on{background:#fff}
 #toast{bottom:40px}.tiles{grid-template-columns:repeat(3,1fr)}.map{max-width:520px;margin-left:auto;margin-right:auto}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
/* v2: fit to one view, flow, contrast */
#app{min-height:100dvh}
.sp1{min-height:calc(100dvh - 140px)}
.photo{width:min(60vw,31dvh);margin:12px auto 14px}
.kt{flex-wrap:nowrap;gap:6px;margin:10px 0 14px}.kt span{font-size:13px;padding:7px 12px;white-space:nowrap}
.big{font-size:clamp(40px,7.4dvh,56px)}
.sp-in h1{font-size:clamp(56px,10dvh,76px)}
.hero img{width:min(72%,30dvh);margin:4px auto 14px}.hero .q{font-size:clamp(22px,4.2dvh,32px);margin-bottom:8px}.hero .ask{margin-bottom:14px}
.hero .lnk{display:block;margin:12px auto 0;color:var(--green);font-weight:600;font-size:15px}
.rv{margin-top:14px}
.orb{display:flex;align-items:center;gap:14px;width:100%;text-align:left;background:#fff;border-radius:26px;padding:12px 16px;margin-top:12px;box-shadow:0 12px 30px -22px rgba(11,47,38,.3)}.orb svg{width:56px;height:56px;flex:none}.orb>div{flex:1}.orb h3{font-size:17px}.orb i{font-style:normal;color:var(--soft);font-size:22px}
.tiles .tilebtn img{background:#fff;padding:10px;border-radius:32px;box-shadow:0 14px 30px -20px rgba(11,47,38,.45),0 0 0 1px rgba(11,47,38,.05)}
.field :focus-visible,.field textarea:focus,.field input:focus{outline:none;box-shadow:none}
.sheet .field{padding:12px 16px}.sheet textarea{min-height:84px}
.rel{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;justify-content:center;margin-top:6px}.rel .chip{margin:0}
.storyp{min-height:calc(100dvh - 150px)}
.timeline.compact .tl{margin-bottom:12px;font-size:clamp(15px,2.6dvh,19px)}.timeline.compact .ic{width:40px;height:40px}
.acc{margin-bottom:8px}.acc .tl{display:flex;width:100%;text-align:left;margin:0 0 6px;align-items:center;gap:16px;font-family:Fraunces,serif;font-weight:700;font-size:19px;line-height:1.2}.acc p{display:none;margin:0 0 14px 64px;font-size:17px;line-height:1.5;color:var(--ink)}.acc.o p{display:block}
.bel i{flex:none}
@media (max-height:700px){.hero img{width:min(60%,24dvh)}.photo{width:min(52vw,26dvh)}.rv{padding:8px}.rv img{width:64px;height:64px}.rv .n{font-size:34px}.orb{padding:8px 14px}}

/* ---- saga (journey chapters) ---- */
.saga{position:fixed;inset:0;z-index:20;overflow-y:auto;scroll-snap-type:y proximity;background:var(--bg);-webkit-overflow-scrolling:touch}
.sgtop{position:sticky;top:0;z-index:3;display:flex;align-items:center;gap:12px;padding:calc(env(safe-area-inset-top) + 10px) 20px 10px;max-width:480px;margin:0 auto;background:linear-gradient(180deg,rgba(243,247,242,.96) 70%,rgba(243,247,242,0))}
.sgtop .round{flex:none}.sgd{flex:1;display:flex;gap:5px}.sgd i{flex:1;height:5px;border-radius:9px;background:#DCE8E0;transition:background .4s}.sgd i.on{background:var(--sun)}
.sgs{min-height:100dvh;scroll-snap-align:start;display:flex;align-items:center;margin-top:-48px;padding:56px 0 30px}
.sgs.t0{background:var(--bg)}.sgs.t1{background:linear-gradient(180deg,var(--cream),#FFF8EA)}.sgs.t2{background:linear-gradient(180deg,#E9F5EE,var(--mint2))}
.sgi{width:100%;max-width:480px;margin:0 auto;padding:0 var(--edge)}
.sgart{display:block;width:min(78vw,300px);margin:0 auto 6px}
.sgk{text-align:center;font-weight:600;font-size:15px;color:var(--green);margin-bottom:10px}
.sgq{font-size:clamp(25px,7.2vw,32px);line-height:1.18;text-align:center;margin-bottom:20px;text-wrap:balance}
.sgi p{font-size:17.5px;line-height:1.55;margin:0 0 13px;color:var(--ink)}
.sge .sgi{text-align:center}.sge .logo{width:84px;margin:0 auto 8px}
.tiles.mini{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin:14px 0 20px}.tiles.mini img{width:46px;height:46px;border-radius:14px;background:#fff;box-shadow:0 2px 8px rgba(11,47,38,.1)}
.sge .btn+.btn{margin-top:10px}
.sgs .sgart,.sgs .sgk,.sgs .sgq,.sgs p{opacity:0;transform:translateY(14px);transition:opacity .7s,transform .7s}
.sgs.in .sgart,.sgs.in .sgk,.sgs.in .sgq,.sgs.in p{opacity:1;transform:none}.sgs.in .sgk{transition-delay:.1s}.sgs.in .sgq{transition-delay:.2s}.sgs.in p:nth-of-type(1){transition-delay:.35s}.sgs.in p:nth-of-type(2){transition-delay:.5s}.sgs.in p:nth-of-type(3){transition-delay:.65s}
.pul{animation:pul 2.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center}@keyframes pul{50%{transform:scale(1.35);opacity:.12}}
@media(prefers-reduced-motion:reduce){.sgs .sgart,.sgs .sgk,.sgs .sgq,.sgs p{opacity:1;transform:none;transition:none}.pul{animation:none}}
@media(max-height:700px){.sgart{width:min(58vw,200px)}.sgq{margin-bottom:12px}.sgi p{font-size:16.5px}}

/* testing: always-available log out */
#lgo{position:fixed;top:calc(env(safe-area-inset-top) + 2px);right:10px;z-index:60;height:22px;padding:0 10px;border-radius:99px;background:rgba(11,47,38,.08);color:var(--mut);font:600 11px Figtree,sans-serif}
#app{padding-top:calc(env(safe-area-inset-top) + 26px)}
.sgtop{padding-top:calc(env(safe-area-inset-top) + 28px)}
#app{box-sizing:border-box}
.sp1{min-height:calc(100dvh - 156px)}

/* hello screen: the universe (3D) */
@property --rx{syntax:'<angle>';inherits:true;initial-value:64deg}@property --rz{syntax:'<angle>';inherits:true;initial-value:0deg}@property --ry{syntax:'<angle>';inherits:true;initial-value:0deg}
.hl{justify-content:flex-start}
.uni{--S:min(84vw,330px);position:relative;width:var(--S);aspect-ratio:1;margin:6px auto 0;perspective:900px;animation:rx 13s ease-in-out infinite alternate,rz 80s linear infinite,ry 19s ease-in-out infinite alternate}
.sc{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateY(var(--ry))}
.plane{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateZ(var(--rz))}
.uni .ring{position:absolute;border-radius:50%;border:1.5px dashed #AFD3BE;inset:0}.uni .ring.r2{inset:19%;border-color:#C6E2D1}
.uni .plane span{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;transform:rotate(var(--a)) translateY(calc(var(--S)/-2))}
.uni .plane b{position:absolute;left:0;top:0;transform-style:preserve-3d;transform:rotate(calc(var(--a)*-1)) rotateZ(calc(var(--rz)*-1)) rotateX(calc(var(--rx)*-1)) rotateY(calc(var(--ry)*-1))}
.uni .plane img{position:absolute;width:46px;height:46px;left:-23px;top:-23px;border-radius:14px;background:#fff;box-shadow:0 4px 14px rgba(11,47,38,.16)}
.uni .halo{position:absolute;left:50%;top:50%;width:62%;aspect-ratio:1;margin:-31% 0 0 -31%;border-radius:50%;background:radial-gradient(circle,rgba(255,196,77,.6),rgba(255,196,77,0) 68%);transform:rotateY(calc(var(--ry)*-1))}
.uni .core{position:absolute;left:50%;top:50%;width:46%;margin:-23% 0 0 -23%;transform:rotateY(calc(var(--ry)*-1))}
@keyframes rx{from{--rx:56deg}to{--rx:76deg}}@keyframes rz{to{--rz:360deg}}@keyframes ry{from{--ry:-16deg}to{--ry:16deg}}
@media(prefers-reduced-motion:reduce){.uni{animation:none}}
@media(max-height:700px){.uni{--S:min(64vw,240px)}.uni .plane img{width:38px;height:38px;left:-19px;top:-19px}}
.hl .sp-in{margin:auto 0 12px;text-align:left}.hl .sp-in h1{font-size:clamp(52px,9dvh,72px)}
.hl .wel{font-size:clamp(22px,3.4dvh,27px);line-height:1.15;color:var(--ink);margin-top:8px;font-weight:700}
.hl .tgl{font-size:15px;color:var(--mut);margin-top:8px;letter-spacing:.01em}
@media(prefers-reduced-motion:reduce){.uni .spin,.uni .spin img{animation:none}}
@media(max-height:700px){.uni{width:min(64vw,240px)}.uni .spin span{transform:rotate(var(--a)) translateY(-120px)}.uni .spin img{width:38px;height:38px;left:-19px;top:-19px}}
.gap2{margin-top:clamp(18px,4.2dvh,40px)}
@media(max-height:700px){.gap2{margin-top:16px}.sp1 .photo{width:min(50vw,24dvh);height:min(50vw,24dvh)}.sp1 .mk{width:56px!important}.sp1 h1.big{font-size:44px!important}}
.ccb{flex:0 0 auto;display:flex;align-items:center;gap:6px;background:var(--mint2);height:50px;padding:0 12px;border-radius:14px;font-weight:600;color:var(--ink);font-size:16px}
.cclist{max-height:46dvh;overflow:auto}.ccr{display:flex;align-items:center;gap:12px;width:100%;padding:12px 4px;border-bottom:1px solid #E3ECE6;text-align:left;font-size:16px}.ccr span{font-size:24px}.ccr b{flex:1;font-weight:500}.ccr i{font-style:normal;color:var(--mut)}
.stp{text-align:center;margin:6px 0 14px}.oa{width:104px;height:78px;display:block;margin:0 auto 2px}
.stl{font-size:13px;font-weight:600;color:var(--green);margin-bottom:6px}.stb{display:flex;justify-content:center;gap:6px}.stb i{width:34px;height:5px;border-radius:9px;background:#DCE8E0}.stb i.on{background:var(--sun)}
@media(max-height:700px){.oa{width:80px;height:60px}.stp{margin:0 0 8px}}
@media(max-height:700px){#app h1{font-size:min(36px,5.8dvh)}}
@media(max-height:700px){.tens{display:none}#app h1{font-size:min(32px,5.2dvh)}}
.hl .uni{margin-top:14px}
.mkw{display:inline-block;line-height:0}.mkw .oa{width:100%;height:auto;margin:0}.empty .mkw{display:block;margin:0 auto 6px}.hero .mkw{display:block;margin:0 auto 6px}
.bar .mkw{width:54px!important}.sp1 .mkw{display:block;margin-left:auto;margin-right:auto}.sp1[style*="left"] .mkw{margin-left:0}
/* ===== Home v2 ===== */
.home{display:flex;flex-direction:column;gap:12px;height:calc(100dvh - 156px);min-height:430px}
.home .hello{margin:0}.home .hello h1{font-size:30px;line-height:1.05}.home .hello .g{font-size:15px}
.sky{position:relative;flex:1;min-height:0;border-radius:30px;overflow:hidden;display:grid;place-items:center;background:linear-gradient(180deg,#FFF1CF,#E3F4E8)}
.sky.afternoon{background:linear-gradient(180deg,#CFEAFB,#FFF3C4)}
.sky.evening{background:linear-gradient(180deg,#FFD3B0,#EBD5F2 70%,#DCD8F7)}
.sky.night{background:linear-gradient(180deg,#16235A,#2D3D82 75%,#3D4F96)}
.skyq{position:absolute;top:14px;left:0;right:0;text-align:center;font-family:Fraunces,serif;font-weight:700;font-size:17px;color:var(--ink);z-index:2;pointer-events:none}
.sky.night .skyq{color:#fff}
.sk-stars{display:none;position:absolute;inset:0;background-image:radial-gradient(1.5px 1.5px at 12% 22%,#fff,transparent),radial-gradient(1px 1px at 30% 70%,#fff,transparent),radial-gradient(1.5px 1.5px at 62% 18%,#fff,transparent),radial-gradient(1px 1px at 80% 60%,#fff,transparent),radial-gradient(2px 2px at 90% 14%,#FFE7A8,transparent),radial-gradient(1px 1px at 48% 88%,#fff,transparent),radial-gradient(1.5px 1.5px at 8% 80%,#fff,transparent),radial-gradient(1px 1px at 72% 86%,#fff,transparent),radial-gradient(1px 1px at 40% 10%,#fff,transparent);animation:tw 3.6s ease-in-out infinite alternate}
.sky.night .sk-stars{display:block}@keyframes tw{from{opacity:.45}to{opacity:1}}
.sky .uni{--S:min(66vw,270px);margin:auto;position:relative;z-index:1}
.sky.night .uni .ring{border-color:#7F8FD0}.sky.night .uni .ring.r2{border-color:#5E70B8}
.sky.evening .uni .ring{border-color:#D3A8C0}.sky.afternoon .uni .ring{border-color:#9FCFE3}
.wt{position:absolute;left:-23px;top:-23px;width:46px;height:46px;padding:0;background:none}
.wt img{position:static!important;width:46px!important;height:46px!important;border-radius:14px;background:#fff;box-shadow:0 4px 14px rgba(11,47,38,.18)}
.wt em{position:absolute;top:50px;left:50%;transform:translateX(-50%);font-style:normal;font-size:11px;font-weight:700;white-space:nowrap;color:var(--ink);text-shadow:0 0 6px rgba(255,255,255,.9)}
.sky.night .wt em{color:#fff;text-shadow:0 0 6px rgba(10,20,60,.9)}
.wt.lit img{outline:3px solid var(--sun);outline-offset:1px}
.starcard{display:flex;align-items:center;gap:12px;background:#E6E9FA;border-radius:22px;padding:10px 16px;text-align:left}
.starcard svg{width:28px;height:28px;flex:none}.starcard div{flex:1}.starcard b{display:block;font-family:Fraunces,serif;font-size:16px;line-height:1.15}.starcard span{font-size:14px;color:#44508F}.starcard i{font-style:normal;color:#7C86C0;font-size:22px}
.home .btn{flex:none}
.strip{display:grid;gap:8px;grid-template-columns:repeat(4,1fr)}.strip.c2{grid-template-columns:repeat(2,1fr)}.strip.c3{grid-template-columns:repeat(3,1fr)}
.strip button{height:44px;border-radius:16px;background:#E6F1EA;font-weight:600;font-size:14px;color:var(--ink)}
.home.afternoon .strip button{background:#FFF3C4}.home.evening .strip button{background:#EBDDF3}.home.night .strip button{background:#E1E5F8}.home.morning .strip button{background:#FFEFC8}
.sgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-height:52dvh;overflow:auto}
.sgrid div{background:#fff;border-radius:18px;padding:12px 6px;text-align:center;opacity:.5}.sgrid div.on{opacity:1}
.sgrid svg{width:26px;height:26px;fill:#D5DFD8;display:block;margin:0 auto 4px}.sgrid .on svg{fill:var(--sun)}
.sgrid b{display:block;font-size:13px;line-height:1.2}.sgrid span{display:block;font-size:11px;color:var(--mut);line-height:1.25;margin-top:2px}
#tourl{position:fixed;inset:0;z-index:40}
.tspot{position:fixed;border-radius:24px;box-shadow:0 0 0 9999px rgba(11,47,38,.45);transition:all .45s cubic-bezier(.5,0,.2,1);pointer-events:none}
.tcard{position:fixed;left:24px;right:24px;max-width:432px;margin:0 auto;background:#fff;border-radius:24px;padding:16px 18px;transition:top .45s cubic-bezier(.5,0,.2,1);box-shadow:0 18px 40px -16px rgba(11,47,38,.5)}
.tsun{width:34px;height:34px;float:left;margin:0 12px 6px 0;animation:spin 14s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.tcard p{font-family:Fraunces,serif;font-weight:700;font-size:19px;line-height:1.2;min-height:40px}
.trow{display:flex;align-items:center;justify-content:space-between;clear:both;margin-top:8px}.trow button{font-weight:600;font-size:15px;color:var(--mut);padding:8px 4px}.trow .tn{background:var(--sun);color:var(--ink);padding:10px 22px;border-radius:14px}.trow b{font-size:13px;color:var(--soft)}
.lp{padding-top:2px}.lq{font-size:clamp(24px,4.4dvh,32px);line-height:1.12}
.lw{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.lw button{display:grid;justify-items:center;gap:6px;font-size:13px;font-weight:600}.lw img{width:100%;max-width:74px;border-radius:18px;background:#fff;box-shadow:0 6px 16px -10px rgba(11,47,38,.4)}.lw button[disabled]{opacity:.35}
.lt{font-size:22px;margin:4px 0 0;text-align:center}
.qq{font-size:clamp(22px,3.8dvh,28px);line-height:1.15;margin:4px 0 16px}
.qo{display:grid;gap:10px}.qo button{background:#fff;border-radius:20px;padding:14px 16px;text-align:left;font-size:16px;font-weight:600;line-height:1.25;border:2px solid transparent;box-shadow:0 6px 18px -14px rgba(11,47,38,.4)}
.qo .ok{border-color:var(--green);background:var(--mint2)}.qo .no{border-color:var(--coral)}.qo .dim{opacity:.5}
.qe{margin-top:14px;font-size:15px;line-height:1.4}.qe b{font-family:Fraunces,serif}
.fin{padding-top:7dvh}.fin h1{margin:14px 0 6px}
@media(max-height:700px){.sky .uni{--S:min(60vw,230px)}.wt,.wt img{width:38px!important;height:38px!important}.wt{left:-19px;top:-19px}.wt em{top:41px}.home{gap:10px}.home .hello h1{font-size:26px}.qo button{padding:11px 14px}.starcard{padding:8px 14px}.skyq{top:10px;font-size:15px}}
.sky .uni{--S:min(56vw,224px);animation:rxh 13s ease-in-out infinite alternate,rz 80s linear infinite,ry 19s ease-in-out infinite alternate}
@keyframes rxh{from{--rx:48deg}to{--rx:64deg}}
.wt em{font-size:10.5px}
@media(max-height:700px){.sky .uni{--S:min(54vw,206px)}}
@media(prefers-reduced-motion:reduce){.sky .uni{animation:none}}
.wt{overflow:visible;display:block}.wt em{z-index:3;transform:translateX(-50%) translateZ(0)}
.sky .uni .plane b{width:0;height:0}
.wt{transform-style:preserve-3d}.wt img{transform:translateZ(0)}.wt em{transform:translateX(-50%) translateZ(160px)}
.lw{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 10px;margin-top:6px}.lw button{width:calc(33.3% - 10px)}.lw img{max-width:none;width:clamp(62px,11.5dvh,94px)}
.lp .lq{margin-bottom:4px}
@media(max-height:700px){.lw{gap:10px 8px}.cc{min-height:min(340px,46dvh)}.lt{font-size:20px}}
/* ===== v18 ===== */
.o3{display:block;position:relative;width:100%;height:100%;border-radius:50%;overflow:hidden;background:#FBF3E6;border:2.5px solid #fff;box-shadow:0 8px 18px -4px rgba(11,47,38,.4),inset 0 -8px 14px rgba(11,47,38,.2)}
.o3 img{position:static!important;display:block;width:100%!important;height:100%!important;border-radius:0!important;box-shadow:none!important;background:none!important;transform:scale(1.3);object-fit:cover}
.o3:after{content:"";position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 24%,rgba(255,255,255,.7),rgba(255,255,255,0) 46%),radial-gradient(circle at 72% 88%,rgba(11,47,38,.25),transparent 58%)}
.uni .plane b>.o3{position:absolute;left:-26px;top:-26px;width:52px;height:52px}
.wt,.wt .o3{width:54px;height:54px}.wt{left:-27px;top:-27px}
.wt.lit .o3{border-color:var(--sun);box-shadow:0 0 0 3px rgba(255,181,46,.45),0 8px 18px -4px rgba(11,47,38,.4),inset 0 -8px 14px rgba(11,47,38,.2)}
.wt img{width:100%!important;height:100%!important;outline:0!important}
.wt.lit img{outline:0!important}
.lbls{position:absolute;inset:0;pointer-events:none;z-index:4}.lbls em{position:absolute;left:0;top:0;font-style:normal;font-size:11px;font-weight:700;white-space:nowrap;color:var(--ink);text-shadow:0 0 6px rgba(255,255,255,.95),0 0 3px rgba(255,255,255,.8)}
.sky.night .lbls em{color:#fff;text-shadow:0 0 6px rgba(10,20,60,.95)}
.skst{position:absolute;top:12px;left:14px;font-size:12px;font-weight:700;background:rgba(255,255,255,.7);padding:5px 10px;border-radius:99px;z-index:3}.sky.night .skst{background:rgba(255,255,255,.18);color:#fff}
.skp{position:absolute;left:12px;right:12px;bottom:12px;display:grid;gap:6px;z-index:5}
.glass{display:flex;align-items:center;gap:10px;text-align:left;padding:10px 14px;border-radius:18px;background:rgba(255,255,255,.62);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);font-size:14px;line-height:1.25;border:1px solid rgba(255,255,255,.7)}
.glass b{font-family:Fraunces,serif}.glass span{flex:1}.glass i{font-style:normal;font-size:20px;opacity:.5}.glass svg{width:22px;height:22px;fill:#FFB52E;flex:none}
.sky.night .glass{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.25)}
.jcard{display:flex;align-items:center;gap:14px;text-align:left;padding:10px 16px 10px 10px;border-radius:24px;background:linear-gradient(135deg,#FFF6DE,#FFE9B8);border:2px solid #FFD98A;box-shadow:0 10px 24px -14px rgba(217,142,0,.7)}
.jcard b{display:block;font-family:Fraunces,serif;font-size:18px;line-height:1.1}.jcard span{font-size:13.5px;color:#7A5A12}.jcard>div{flex:1}.jcard i{font-style:normal;font-size:24px;color:#B8860B}
.jph{width:54px;height:54px;border-radius:50%;padding:3px;background:conic-gradient(#FFB52E,#FFE29A,#FFB52E);flex:none;display:block}.jph img{width:100%;height:100%;border-radius:50%;object-fit:cover;border:2px solid #fff;display:block}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mini{display:grid;gap:4px;align-content:center;text-align:left;padding:10px 14px;min-height:62px;border-radius:20px;background:#fff;box-shadow:0 8px 20px -14px rgba(11,47,38,.45)}
.mini b{font-family:Fraunces,serif;font-size:26px;line-height:1;color:var(--coral)}.mini span{font-size:13px;color:var(--mut);line-height:1.2}
.sdots{display:flex;flex-wrap:wrap;gap:2px}.sdots svg{width:15px;height:15px;fill:#DCE5DF}.sdots svg.on{fill:var(--sun)}
.home .hello{align-items:center}
.home{gap:10px}
/* concept cards */
.swipe{perspective:1000px}
.cc{position:relative;display:flex;flex-direction:column;justify-content:space-between;align-items:stretch;text-align:left;padding:22px 22px 24px;min-height:min(380px,50dvh);overflow:hidden;border-radius:32px;font-family:Fraunces,serif;
 background:linear-gradient(160deg,#fff 35%,color-mix(in srgb,var(--w,#2F9A74) 20%,#fff));border:1.5px solid rgba(255,255,255,.9);
 box-shadow:0 2px 0 rgba(255,255,255,.9) inset,0 -10px 24px -12px color-mix(in srgb,var(--w,#2F9A74) 35%,transparent) inset,0 30px 40px -24px rgba(11,47,38,.5),0 10px 14px -10px rgba(11,47,38,.25)}
.ck{display:flex;justify-content:space-between;align-items:center;font-family:Figtree,sans-serif;font-size:13px;font-weight:700;color:var(--green);letter-spacing:0}.ck i{font-style:normal;color:var(--soft);font-weight:600}
.ct{position:relative;z-index:1;font-weight:700;letter-spacing:-.025em;line-height:1.14;color:var(--ink);margin:auto 0;padding:14px 0}
.cim{position:absolute;right:-26px;bottom:-26px;width:120px;opacity:.16;border-radius:50%;transform:rotate(-8deg)}
.cc.ce{background:linear-gradient(160deg,#FFF6DE,#FFDF9A);align-items:flex-start}
.cgo{background:var(--sun);border-bottom:4px solid var(--sunedge);border-radius:18px;padding:13px 20px;font-weight:700;font-size:16px;color:var(--ink);font-family:Fraunces,serif}
@media(max-height:700px){.cc{min-height:min(300px,46dvh);padding:16px 18px}.jcard{padding:7px 14px 7px 8px}.jph{width:46px;height:46px}.mini{min-height:54px;padding:8px 12px}.mini b{font-size:22px}.wt,.wt .o3{width:44px;height:44px}.wt{left:-22px;top:-22px}.uni .plane b>.o3{left:-22px;top:-22px;width:44px;height:44px}.jcard b{font-size:16px}.jcard span{font-size:12.5px}}
.sky.hp{padding:30px 0 62px}.sky.hp.night.mk,.sky.hp .skp .glass+.glass{}
.glass{white-space:nowrap}.glass span{overflow:hidden;text-overflow:ellipsis;font-size:13px}
.sdots{max-width:132px}.sdots svg{width:17px;height:17px;margin:0 2px 2px 0}
@keyframes rxs{from{--rx:60deg}to{--rx:72deg}}
@media(max-height:700px){.sky.hp{padding:26px 0 48px}.glass{padding:7px 12px}.sky .uni{--S:min(54vw,190px);animation:rxs 13s ease-in-out infinite alternate,rz 80s linear infinite,ry 19s ease-in-out infinite alternate}.skp{bottom:8px}}
#app:has(.home){padding-bottom:80px}.home{height:calc(100dvh - 112px)}
@media(max-height:700px){.home .hello .g{display:none}.home .hello h1{font-size:24px}.home .hello button{transform:scale(.8);transform-origin:right center}.mini span{font-size:12px}.duo .mini{min-height:50px}}
.cc{min-height:min(440px,56dvh)}.cgo{background:none;border:0;padding:0;font-family:Figtree,sans-serif;font-size:14px;color:#7A5A12;font-weight:600}
@media(max-height:700px){.cc{min-height:min(320px,48dvh)}}
.uni .plane b>i.wd{position:absolute;left:0;top:0;transform:translate(-50%,-50%);white-space:nowrap;font-style:normal;font-family:Fraunces,serif;font-weight:700;font-size:19px;letter-spacing:-.01em;color:var(--ink);background:#fff;padding:9px 16px 9px 28px;border-radius:99px;box-shadow:0 10px 22px -8px rgba(11,47,38,.35),0 2px 0 rgba(255,255,255,.9) inset}
.uni .plane b>i.wd:before{content:"";position:absolute;left:12px;top:50%;width:10px;height:10px;margin-top:-5px;border-radius:50%;background:var(--d);box-shadow:0 0 0 3px color-mix(in srgb,var(--d) 25%,transparent)}
@media(max-height:700px){.uni .plane b>i.wd{font-size:16px;padding:7px 13px 7px 24px}}
.hl .uni{--S:min(56vw,224px)}
.uni .plane b>i.wd{font-size:17px;box-shadow:0 3px 8px -3px rgba(11,47,38,.35)}
@media(max-height:700px){.hl .uni{--S:min(52vw,200px)}.uni .plane b>i.wd{font-size:15px}}
.hl .uni{--S:min(68vw,264px);margin-top:auto;margin-bottom:auto}.uni .plane b>i.wd{font-size:16px;padding:8px 14px 8px 25px}
@media(max-height:700px){.hl .uni{--S:min(62vw,230px)}.uni .plane b>i.wd{font-size:14.5px;padding:6px 11px 6px 22px}}
.sp1 .photo{margin:0 auto 12px}.sp1 h1.big{margin-bottom:2px}
.sp1[style*="center"]{padding-top:0}
.sp1[style*="center"] .gap2{margin-top:14px}
.hl .uni{--S:min(74vw,292px);animation:rxw 13s ease-in-out infinite alternate,rz 80s linear infinite,ry 19s ease-in-out infinite alternate}
@keyframes rxw{from{--rx:42deg}to{--rx:60deg}}
.uni .plane b>i.wd{padding:8px 15px 8px 36px}.uni .plane b>i.wd:before{left:15px}
@media(max-height:700px){.hl .uni{--S:min(68vw,250px)}.uni .plane b>i.wd{padding:6px 12px 6px 31px}.uni .plane b>i.wd:before{left:13px}}
@media(prefers-reduced-motion:reduce){.hl .uni{animation:none}}
.hl .uni{--S:min(66vw,264px)}
@media(max-height:700px){.hl .uni{--S:min(62vw,236px)}}
/* ===== v22 home orbit ===== */
.sky{display:flex;flex-direction:column;place-items:initial;padding:0!important}
.sky .skyq{position:static;padding:12px 0 0;font-size:16px}
.orbw{position:relative;flex:1;min-height:0;display:grid;place-items:center}
.orbw .uni{--S:var(--SS,230px)!important;margin:0;position:relative;z-index:2;animation:rxq 13s ease-in-out infinite alternate,rz 80s linear infinite,ry 19s ease-in-out infinite alternate}
@keyframes rxq{from{--rx:46deg}to{--rx:58deg}}
@media(prefers-reduced-motion:reduce){.orbw .uni{animation:none}}
.orbw .halo{position:absolute;left:50%;top:50%;width:calc(var(--SS,230px)*.62);aspect-ratio:1;margin:calc(var(--SS,230px)*-.31) 0 0 calc(var(--SS,230px)*-.31);border-radius:50%;background:radial-gradient(circle,rgba(255,196,77,.55),rgba(255,196,77,0) 68%);z-index:0;transform:none}
.orbw .core{position:absolute;left:50%;top:50%;width:calc(var(--SS,230px)*.26);margin:calc(var(--SS,230px)*-.13) 0 0 calc(var(--SS,230px)*-.13);z-index:1;transform:none}
.wc{position:absolute;left:0;top:0;transform:translate(-50%,-50%);display:flex;align-items:center;gap:7px;white-space:nowrap;padding:4px 13px 4px 4px;border-radius:99px;background:#fff;box-shadow:0 3px 9px -3px rgba(11,47,38,.4);font-weight:700;font-size:13px;color:var(--ink)}
.wc .o3{width:28px;height:28px;flex:none;border-width:2px;box-shadow:inset 0 -4px 8px rgba(11,47,38,.18)}
.wc em{font-style:normal}
.wc.lit{box-shadow:0 0 0 2.5px var(--sun),0 3px 9px -3px rgba(11,47,38,.4)}
.sky .skp{position:static;padding:0 12px 12px}
.sky.hp{padding:0!important}
.skst{top:10px}
.home .hello{margin:0;gap:8px}.home .hello h1{font-size:22px;line-height:1.1;display:flex;align-items:baseline;gap:6px}.home .hello h1 span{font-family:Figtree,sans-serif;font-weight:500;font-size:14px;color:var(--mut)}
.home .hello button{transform:scale(.62);transform-origin:right center;margin:-6px 0}
.hello .g{display:none}
.uni .core{width:30%;margin:-15% 0 0 -15%}.uni .halo{width:52%;margin:-26% 0 0 -26%}
@media(max-height:700px){.home .hello h1{font-size:20px}.sky .skp{padding-bottom:8px}.glass{padding:6px 11px}}
#app:has(.home){padding-bottom:74px}.home{height:calc(100dvh - 102px)}
.jcard span{font-size:12.5px}
@keyframes rxq{from{--rx:38deg}to{--rx:50deg}}
@media(max-height:700px){.sky .skp{display:none}}
.hr{display:flex;align-items:center;gap:6px}.spill{display:flex;align-items:center;gap:5px;padding:5px 11px 5px 8px;border-radius:99px;background:#fff;font-weight:700;font-size:14px;box-shadow:0 4px 10px -6px rgba(11,47,38,.4)}.spill svg{width:16px;height:16px;fill:var(--sun)}
.mini.row{display:flex;align-items:center;gap:12px;min-height:50px;padding:8px 16px}.mini.row b{font-size:24px}.mini.row span{flex:1;font-size:14px}.mini.row i{font-style:normal;color:var(--soft);font-size:22px}
.cc.ce .ct{font-size:inherit}
/* ===== v23 calm orbit ===== */
.orbw .uni{animation:rxq 16s ease-in-out infinite alternate,rz 110s linear infinite,ry 24s ease-in-out infinite alternate;perspective:1400px}
.wp{position:absolute;left:0;top:0;width:50px;height:50px;transform:translate(-50%,-50%);padding:0;transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.wp .o3{width:100%;height:100%;border-width:2.5px}
.wp.act{transform:translate(-50%,-50%) scale(1.3);z-index:3}
.wp.act .o3{border-color:var(--sun);box-shadow:0 0 0 4px rgba(255,181,46,.4),0 10px 20px -4px rgba(11,47,38,.45),inset 0 -8px 14px rgba(11,47,38,.2)}
.wp.lit .o3{border-color:#fff}
.wcap{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 14px 12px;padding:10px 10px 10px 16px;border-radius:20px;background:rgba(255,255,255,.7);text-align:left;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.wcap div{flex:1;min-width:0}.wcap b{display:block;font-family:Fraunces,serif;font-size:21px;line-height:1.1;color:var(--ink)}.wcap span{display:block;font-size:13px;color:var(--mut);margin-top:1px}
.wcap i{font-style:normal;font-weight:700;font-size:14px;background:var(--sun);border-bottom:3px solid var(--sunedge);padding:8px 16px;border-radius:14px;color:var(--ink);flex:none}
.sky.night .wcap{background:rgba(255,255,255,.14)}.sky.night .wcap b{color:#fff}.sky.night .wcap span{color:#C9D2F4}
.sky .skp{padding-top:0}
.sky .skp .glass{margin:0}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:10px}
/* hello: calm words */
.hl .uni{perspective:none;animation:rxw2 20s ease-in-out infinite alternate,rz 130s linear infinite}
@keyframes rxw2{from{--rx:52deg}to{--rx:60deg}}
.uni .plane b>i.wd{background:none;box-shadow:none;padding:0 0 0 17px;font-size:17px;text-shadow:0 0 8px #F3F7F2,0 0 4px #F3F7F2}
.uni .plane b>i.wd:before{left:0;width:9px;height:9px;margin-top:-4.5px}
@media(max-height:700px){.uni .plane b>i.wd{font-size:15px;padding-left:15px}}
@media(prefers-reduced-motion:reduce){.hl .uni,.orbw .uni{animation:none}}
.orbw{padding-top:8px}
.spill{display:none}
@keyframes rxq{from{--rx:44deg}to{--rx:54deg}}
@media(max-height:700px){.spill{display:flex}.duo{display:none}.home{gap:8px}.wcap{margin-bottom:8px;padding:7px 8px 7px 14px}.wcap b{font-size:18px}.wcap span{font-size:12px}.wcap i{padding:6px 13px}}
@keyframes rxw2{from{--rx:46deg}to{--rx:56deg}}
.uni .plane b>i.wd{font-size:19px;padding-left:19px}.uni .plane b>i.wd:before{width:10px;height:10px;margin-top:-5px}
@media(max-height:700px){.uni .plane b>i.wd{font-size:16px;padding-left:16px}}
.uni .plane b>i.wd{font-size:17px;padding-left:17px}
@media(max-height:700px){.uni .plane b>i.wd{font-size:15px;padding-left:15px}}
.wp .o3{box-shadow:0 3px 6px -2px rgba(11,47,38,.4),inset 0 -6px 10px rgba(11,47,38,.18)}
.wp.act .o3{box-shadow:0 0 0 4px rgba(255,181,46,.45),inset 0 -6px 10px rgba(11,47,38,.18)}
.hl .hcv{display:block;width:100%;flex:1;min-height:180px;margin-top:6px}
/* ===== climb ===== */
.duo{grid-template-columns:.8fr 1.7fr}
.mini b{font-size:28px}.mini span{font-size:12.5px}
.strk{display:grid;gap:3px;text-align:left;padding:10px 14px;border-radius:20px;background:linear-gradient(135deg,#fff,#EEF8F2);box-shadow:0 8px 20px -14px rgba(11,47,38,.45)}
.strk b{font-family:Fraunces,serif;font-size:16px;line-height:1.1}.strk span{font-size:12.5px;color:var(--mut);line-height:1.2}
.trk{display:flex;align-items:center;justify-content:space-between;position:relative;margin:2px 0 4px}
.trk:before{content:"";position:absolute;left:12px;right:12px;top:50%;height:2px;background:#DCE8E0;transform:translateY(-1px)}
.trk i{position:relative;width:24px;height:24px;border-radius:50%;background:#fff;display:grid;place-items:center;filter:grayscale(1) opacity(.45)}
.trk i svg{width:20px;height:20px}
.trk i.on{filter:none;box-shadow:0 0 0 2px var(--sun)}
.trk i.nx{filter:none;opacity:.9;box-shadow:0 0 0 2px #fff,0 0 0 3.5px #CFE0D6;animation:nxp 2.2s ease-in-out infinite}
@keyframes nxp{50%{box-shadow:0 0 0 2px #fff,0 0 0 6px #E2EFE8}}
.cl{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.cl div{display:grid;justify-items:center;gap:2px;padding:10px 4px;border-radius:16px;background:#fff;filter:grayscale(1) opacity(.5)}.cl div.on{filter:none;box-shadow:0 0 0 2px var(--sun)}
.cl svg{width:28px;height:28px}.cl b{font-size:13px}.cl span{font-size:11.5px;color:var(--mut)}
.sheet>div{max-height:86dvh;overflow:auto}
.spill{display:none!important}
@media(max-height:700px){.duo{grid-template-columns:1fr}.duo .mini{display:none}.strk{padding:8px 14px}.strk span{display:none}}
@media(max-height:700px){.duo{display:grid}}
/* world map */
.wh{display:flex;align-items:center;gap:14px;text-align:left;margin:2px 0 12px}.wh img{width:84px;margin:0;flex:none}.wh h1{font-size:28px}.wh p{font-size:15px!important}
.wm{background:#fff;border-radius:24px;padding:12px 12px 10px;margin-bottom:16px;box-shadow:0 8px 28px rgba(11,47,38,.07)}
.wmh{display:flex;align-items:center;gap:10px;margin-bottom:6px}.wmh b{font-family:Fraunces,serif;font-size:19px;flex:1}.wmh span{font-size:13px;color:var(--mut,#5C7A6E);font-weight:700}
.wmb{border:0;background:var(--mint2,#DDF1E6);color:var(--ink);border-radius:99px;padding:6px 12px;font:700 13px Figtree,sans-serif}
.wmc{position:relative;aspect-ratio:1.4;margin:4px 6px}
.bub{position:absolute;transform:translate(-50%,-50%);aspect-ratio:1;border-radius:50%;border:0;padding:4px;background:radial-gradient(circle at 35% 30%,#fff,#E3F3EA 70%);box-shadow:0 0 0 1.5px #BFE8D2 inset,0 6px 14px rgba(11,47,38,.08);display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ink);overflow:hidden}
.bub i{position:absolute;inset:auto 0 0 0;height:calc(var(--f)*100%);background:linear-gradient(180deg,#BFE8D2,#8FD3B3);opacity:.7;z-index:0}
.bub em{font:700 10px/1.08 Figtree,sans-serif;font-style:normal;z-index:1;text-align:center;max-height:2.3em;overflow:hidden}.bub small{font:800 13px Figtree;z-index:1;margin-top:2px}
.wmc.d{aspect-ratio:1.4}.dt{position:absolute;transform:translate(-50%,-50%);width:18px;height:18px;border-radius:50%;border:0;padding:0;background:#CFE0D6;transition:transform .2s}
.dt:after{content:"";position:absolute;inset:-7px}.dt.s1{background:var(--green)}.dt.s2{background:var(--sun);box-shadow:0 0 8px rgba(255,181,46,.7)}.dt.on{transform:translate(-50%,-50%) scale(1.5);outline:2.5px solid var(--ink);outline-offset:2px}
.wsel{min-height:74px;display:flex;flex-direction:column;justify-content:center;gap:8px;text-align:center}.wsel b{font-family:Fraunces,serif;font-size:17px;line-height:1.2}.wsel .stk{display:flex;gap:8px;justify-content:center}.wsel .btn{padding:10px 18px;width:auto;min-width:110px}
.wlg{display:flex;gap:6px;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#5C7A6E}.wlg i{width:10px;height:10px;border-radius:50%;background:#CFE0D6;margin-left:8px}.wlg i.s1{background:var(--green)}.wlg i.s2{background:var(--sun)}
/* saga2 */
.saga2{position:fixed;inset:0;z-index:20;display:flex;flex-direction:column;background:var(--bg)}
.sgst{position:relative;flex:none;height:clamp(190px,34dvh,290px);background:linear-gradient(180deg,#CFEFE0,#FFF3D6);border-radius:0 0 34px 34px;overflow:hidden;padding-top:env(safe-area-inset-top)}
.sgsv{display:block;width:100%;height:100%;max-width:520px;margin:0 auto}.sgstars{opacity:0}
.sgor{stroke:rgba(11,47,38,.22);stroke-width:1}.dk .sgor{stroke:rgba(255,255,255,.28)}
.sgdot{cursor:pointer}.sgc{fill:rgba(255,255,255,.85);stroke:rgba(11,47,38,.35);stroke-width:1.5;transition:all .4s}
.sgdot.done .sgc{fill:#2F9A74;stroke:#2F9A74}.dk .sgdot .sgc{stroke:rgba(255,255,255,.5);fill:rgba(255,255,255,.2)}.dk .sgdot.done .sgc{fill:#8FD3B3;stroke:#8FD3B3}
.sgdot.on .sgc{r:8;fill:#FFB52E;stroke:#fff;stroke-width:2.5;filter:drop-shadow(0 0 6px rgba(255,181,46,.9))}
.sgx{position:absolute;left:14px;top:calc(env(safe-area-inset-top) + 12px)}
.sghint{position:absolute;left:0;right:0;bottom:10px;text-align:center;font:700 12.5px Figtree,sans-serif;color:rgba(11,47,38,.55);transition:opacity .5s;pointer-events:none}
.sgpg{flex:1;min-height:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;outline:0}.sgpg::-webkit-scrollbar{display:none}
.sgp2{flex:none;width:100%;height:100%;scroll-snap-align:start;scroll-snap-stop:always;overflow-y:auto;padding:18px 0 28px;display:block}
.sgp2 .sgi{padding:0 var(--edge,24px);max-width:480px;margin:0 auto;text-align:left}
.sgp2 .sgk{text-align:left;font:700 13.5px Figtree,sans-serif;color:var(--green);margin:0 0 10px}
.sgp2 .sgq{font-size:clamp(24px,6.6vw,30px);line-height:1.18;margin:0 0 14px}
.sgp2 p{font-size:17px;line-height:1.55;margin:0 0 12px;opacity:1;transform:none}
.sgp2.sge .sgi{text-align:center}.sge .tiles.mini{margin:14px 0}.sge .btn+.btn{margin-top:10px}
@media(max-height:700px){.sgst{height:clamp(160px,30dvh,200px)}.sgp2 p{font-size:16px;line-height:1.5}.sgp2 .sgq{font-size:23px}}
.bub em.sm{font-size:9.5px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
/* one ring, true size */
.orbw .uni{width:var(--SS)!important;height:var(--SS);animation:rxq2 16s ease-in-out infinite alternate,rz 110s linear infinite,ry 24s ease-in-out infinite alternate}
@keyframes rxq2{from{--rx:42deg}to{--rx:50deg}}
.orbw .uni .ring.r1{border:1.5px solid rgba(255,255,255,.28)}
.sky:not(.night) .orbw .uni .ring.r1{border-color:rgba(11,47,38,.16)}
@media(max-height:700px){.orbw .uni{width:var(--SS)!important}.orbw .uni .plane b>.o3,.wp{width:42px;height:42px}.uni .plane b>.o3{left:-21px;top:-21px;width:42px;height:42px}}
.orbw .wp,.orbw .uni .plane b>.o3{width:var(--IC,44px)!important;height:var(--IC,44px)!important}
.orbw .uni .plane b>.o3{left:calc(var(--IC,44px)/-2)!important;top:calc(var(--IC,44px)/-2)!important}
.orbw .wp.act{transform:translate(-50%,-50%) scale(1.14)}
/* saga3: timed cards */
.saga2{background:linear-gradient(180deg,#CFEFE0,#FFF3D6)}
.sgst{background:none!important;border-radius:0;height:clamp(180px,32dvh,280px)}
.sgm{fill:#fff;stroke:#FFB52E;stroke-width:3;filter:drop-shadow(0 0 7px rgba(255,181,46,.95))}
.sgdot.on .sgc{r:5;fill:rgba(255,255,255,.85);stroke:rgba(11,47,38,.35);stroke-width:1.5;filter:none}.sgdot.done .sgc{fill:#2F9A74;stroke:#2F9A74}.sgdot.on.done .sgc{stroke:#FFB52E;stroke-width:2.5}
.dk .sgdot.on.done .sgc{stroke:#FFB52E}
.sgwrap{position:relative;flex:1;min-height:0;display:flex;flex-direction:column}
.sgpg{flex:1}.sgp2{padding:0 18px 70px;display:flex;align-items:stretch}
.sgcard{flex:1;background:#fff;border-radius:30px;box-shadow:0 18px 44px -14px rgba(11,47,38,.28);padding:26px 30px 26px 24px;display:flex;flex-direction:column;justify-content:center;overflow-y:auto;max-width:480px;margin:0 auto;width:100%}
.sgcard .sgk{font:700 14px Figtree,sans-serif;color:var(--green);margin:0 0 14px;text-align:left}
.sgcard p{font-size:18.5px;line-height:1.55;margin:0 0 14px;opacity:1;transform:none}.sgcard p:last-child{margin:0}
.sgcard.pl .sgq{font-size:clamp(27px,7.6vw,34px);line-height:1.16;margin:0;text-align:left}
.sgcard.sge{text-align:center;align-items:center}.sgcard.sge .btn{width:100%}.sgcard.sge .sgq{font-size:28px;margin:10px 0 2px}
.sgnext{position:absolute;right:6px;top:calc(50% - 35px);width:44px;height:44px;border-radius:50%;border:0;background:var(--sun);color:var(--ink);font:700 28px/1 Figtree,sans-serif;box-shadow:0 6px 16px rgba(11,47,38,.3),0 3px 0 #D98E00;transition:opacity .3s;padding:0 0 3px}
.sghint{position:absolute;left:0;right:0;bottom:calc(env(safe-area-inset-bottom) + 22px);text-align:center;font:700 13px Figtree,sans-serif;color:rgba(11,47,38,.6);transition:opacity .5s;pointer-events:none}
.dk .sghint{color:rgba(255,255,255,.7)}
@media(max-height:700px){.sgst{height:clamp(150px,27dvh,190px)}.sgcard p{font-size:16.5px;line-height:1.5}.sgp2{padding-bottom:56px}.sgcard{padding:20px 28px 20px 20px}.sgcard.pl .sgq{font-size:26px}}
.sgcard.sge .tiles.mini{display:flex!important;flex-wrap:nowrap;gap:4px;background:none!important;box-shadow:none!important;padding:0!important;margin:12px 0!important;justify-content:center}.sgcard.sge .tiles.mini a{display:block;flex:none}.sgcard.sge .tiles.mini img{width:36px!important;height:36px!important}
/* hello: cosmos window */
.hl .hcv{border-radius:32px;background:#050D22;box-shadow:0 22px 50px -18px rgba(5,13,34,.55);margin:6px 0 4px;min-height:200px;flex:1 1 auto}
.hl .hcv{margin:6px 0 14px}@media(max-height:700px){.hl .hcv{min-height:120px;margin-bottom:10px}}
/* input zones: deeper green so "type here" is always obvious */
.card:has(.field,input,textarea){background:#C9E7D6;box-shadow:0 0 0 1.5px #86C9A6 inset,0 14px 30px -18px rgba(24,110,78,.45)}
.field,.otp input{background:#fff;border:2px solid #4FAE82;box-shadow:0 0 0 4px rgba(79,174,130,.16)}
.card:has(.field) .field{background:#fff!important;box-shadow:0 2px 0 rgba(24,110,78,.18)}
.field label{color:#1F7A58}
.field:focus-within,.otp input:focus{border-color:#1F8A62;box-shadow:0 0 0 5px rgba(47,154,116,.28);outline:none}
.field input::placeholder,.field textarea::placeholder{color:#4A6B5D;opacity:1}.field input,.field textarea{color:#0B2F26;font-weight:600}
.card .row input{background:#fff;border:2px solid #4FAE82;border-radius:16px;padding:12px 14px}
@media(max-height:700px){.hl .sp-in h1{font-size:44px}.hl .wel{font-size:21px;margin:2px 0 4px}.hl .tgl{font-size:14.5px}.hl .sp-in{margin-bottom:4px}}
.stp{margin-top:-42px;position:relative;pointer-events:none}.stp *{pointer-events:none}@media(max-height:700px){.stp{margin-top:-38px}}
/* cosmos: SVG/CSS elements only */
.cosmos{position:relative;overflow:hidden;isolation:isolate}
.cosmos svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.cosmos .neb i{position:absolute;border-radius:50%;filter:blur(14px);opacity:0;animation:cfade 2.4s ease forwards,nebd 24s ease-in-out infinite alternate}
@keyframes nebd{from{transform:translate(0,0) scale(1)}to{transform:translate(14px,-10px) scale(1.12)}}
.cosmos .vig{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 55%,rgba(2,5,16,.55));pointer-events:none}
@keyframes cfade{from{opacity:0}to{opacity:1}}
@keyframes cspin{to{transform:rotate(360deg)}}
@keyframes tw{from{opacity:.2}to{opacity:1}}
.cosmos .tw{animation:tw var(--p) ease-in-out infinite alternate;animation-delay:var(--d)}
.cosmos .stars{opacity:0;animation:cfade 1.6s .15s ease forwards}
.cosmos .gspin{animation:cspin 240s linear infinite}
.cosmos .gz{opacity:0;transform:scale(.7);animation:gz 3.8s cubic-bezier(.45,0,.25,1) forwards}
@keyframes gz{0%{opacity:0;transform:scale(.7)}18%{opacity:1;transform:scale(.97)}40%{opacity:1;transform:scale(1.08)}100%{opacity:.06;transform:scale(2.8)}}
.cosmos .spin{animation:cspin linear infinite}.cosmos .spin.rev{animation-direction:reverse}
.cosmos .orbit,.cosmos .pl{opacity:0;animation:cfade 1s var(--d) ease forwards}
.cosmos .sunw{transform:scale(0);animation:sunin 1s 1.4s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes sunin{from{transform:scale(0)}to{transform:scale(1)}}
.cosmos .flash{opacity:0;animation:flash 1.1s 1.4s ease both}
@keyframes flash{0%{opacity:0}30%{opacity:1}100%{opacity:0}}
.cosmos .cont{animation:contm 16s linear infinite}
@keyframes contm{to{transform:translateX(var(--w))}}
.cosmos .shoot{opacity:0;animation:shoot 12s 7s infinite}
@keyframes shoot{0%{opacity:0;transform:translate(-120px,-170px)}2%{opacity:1}9%{opacity:0;transform:translate(70px,-110px)}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.cosmos .gspin,.cosmos .spin,.cosmos .cont,.cosmos .tw,.cosmos .shoot{animation:none}.cosmos .gz{animation:none;opacity:0}.cosmos .sunw{animation:none;transform:none}.cosmos .orbit,.cosmos .pl,.cosmos .stars,.cosmos .neb i{animation:none;opacity:1}}
/* cosmos on the page itself: no card */
.hl .hcv{background:none!important;box-shadow:none!important;border-radius:0!important;-webkit-mask-image:radial-gradient(ellipse 62% 60% at 50% 50%,#000 55%,transparent 100%);mask-image:radial-gradient(ellipse 62% 60% at 50% 50%,#000 55%,transparent 100%)}
.cosmos .neb i{filter:blur(18px)}

.orbw .wp{cursor:pointer}.orbw .uni,.orbw .plane,.orbw .sc{pointer-events:none}.orbw{cursor:pointer;-webkit-tap-highlight-color:transparent}
/* onboarding steps: header apart, content centred in the rest */
.stp{margin:0 0 clamp(14px,3.5dvh,30px)!important;pointer-events:auto}
#app.full.ob{display:flex;flex-direction:column;min-height:100dvh;box-sizing:border-box}
#app.full.ob>.stp{margin-top:-34px!important;margin-bottom:auto!important}
#app.full.ob>.stp+*{margin-top:clamp(8px,5dvh,44px)!important}
#app.full.ob>:last-child{margin-bottom:auto!important}
@media(max-height:700px){#app.full.ob>.stp+*{margin-top:2px!important}#app.full.ob h1{font-size:27px!important}#app.full.ob .mut{font-size:15px!important;margin-bottom:12px!important}#app.full.ob .small{margin-top:6px!important}#app.full.ob>.stp{margin-bottom:6px!important}}

/* continuous universe theme behind onboarding screens */
#amb{position:fixed;inset:0;z-index:0;pointer-events:none;opacity:0;transition:opacity .7s}
body.onb #amb{opacity:.55}body:not(.onb) #amb *{animation-play-state:paused!important}
#app{position:relative;z-index:1}
.amb svg{transform:translateY(30%) scale(1.25)}
.amb .gz{animation:none!important;opacity:.5;transform:scale(1.5)}
.amb .sunw{animation:none!important;transform:scale(1)}
.amb .flash,.amb .shoot{display:none}
.amb .orbit,.amb .pl,.amb .stars,.amb .neb i{animation:cfade .01s forwards!important}
.amb .neb i{animation:cfade .01s forwards,nebd 24s ease-in-out infinite alternate!important}
#app.ob>.stp{margin-bottom:auto!important}
#app.ob>.stp+*{margin-top:clamp(26px,9dvh,70px)!important}
.ob .oa{margin-bottom:12px!important}.ob .stl{margin-bottom:12px!important}
@media(max-height:700px){#app.ob>.stp+*{margin-top:14px!important}.ob .oa{margin-bottom:6px!important}.ob .stl{margin-bottom:8px!important}}
body.onb #amb{opacity:.27}
#amb{-webkit-mask-image:radial-gradient(ellipse 75% 55% at 50% 50%,rgba(0,0,0,.3) 0%,#000 100%);mask-image:radial-gradient(ellipse 75% 55% at 50% 50%,rgba(0,0,0,.3) 0%,#000 100%)}
body.onb #amb{opacity:.15}.amb .pl{animation:none!important;opacity:.3}
/* ambient vibe: stars, sparkle, glow and galaxy dust; no planets */
body.onb #amb{opacity:.5}
#amb{-webkit-mask-image:radial-gradient(ellipse 80% 58% at 50% 50%,rgba(0,0,0,.45) 0%,#000 100%);mask-image:radial-gradient(ellipse 80% 58% at 50% 50%,rgba(0,0,0,.45) 0%,#000 100%)}
.amb .pl{display:none}
.amb .orbit{stroke-opacity:.18!important}
.amb .gz{opacity:.75}
.amb .stars circle{animation:tw 2.8s ease-in-out infinite alternate!important}
.amb .stars circle:nth-child(2n){animation-duration:2s!important;animation-delay:-.7s!important}
.amb .stars circle:nth-child(3n){animation-duration:3.6s!important;animation-delay:-1.9s!important}
.amb .stars circle:nth-child(4n){r:1.5px}
.amb .stars circle:nth-child(9n){r:2.1px}
/* saga cards: depth, colour, emphasis */
.sgcard{position:relative;overflow:hidden;border:2px solid var(--bd,#CFE6D8);box-shadow:0 10px 0 var(--ed,#B9D9C6),0 26px 40px -14px rgba(11,47,38,.35);background:linear-gradient(160deg,var(--c1,#EAF7F0),#fff 70%);margin-bottom:10px}
.sgcard:before{content:"";position:absolute;right:-60px;top:-60px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,var(--gl,rgba(47,154,116,.22)),transparent 70%);pointer-events:none}
.sgcard.t0{--c1:#E4F6EC;--bd:#BFE5CF;--ed:#9DD3B6;--gl:rgba(47,154,116,.25)}
.sgcard.t1{--c1:#FFF1D6;--bd:#FFD98F;--ed:#EDB24A;--gl:rgba(255,181,46,.3)}
.sgcard.t2{--c1:#FFE6DF;--bd:#FFC2B4;--ed:#F29B88;--gl:rgba(255,122,106,.25)}
.sgcard.t3{--c1:#E3F0FB;--bd:#B9D8F2;--ed:#8FBBE0;--gl:rgba(70,140,220,.22)}
.sgcard>*{position:relative}
.sgcard b{font-weight:800;color:#0B2F26;background:linear-gradient(transparent 60%,rgba(255,181,46,.45) 0);padding:0 1px}
.sgcard .sgk{display:inline-block;align-self:flex-start;background:rgba(255,255,255,.75);border-radius:99px;padding:5px 12px;box-shadow:0 2px 0 rgba(0,0,0,.06)}
.chips4{display:flex;flex-wrap:wrap;gap:12px 10px;margin-top:30px}
.chips4 span{font:700 21px Fraunces,serif;padding:10px 18px;border-radius:99px;color:#0B2F26;box-shadow:0 5px 0 rgba(11,47,38,.16)}
.chips4 .c0{background:#BFE8D2}.chips4 .c1{background:#FFD98F}.chips4 .c2{background:#FFC2B4}.chips4 .c3{background:#B9D8F2}
@media(max-height:700px){.sgp2{padding-bottom:62px}.chips4{margin-top:20px}.chips4 span{font-size:18px;padding:8px 15px}}
.sgcard{padding-right:50px!important}
.sgcard p{font-size:20px;line-height:1.55}
@media(max-height:700px){.sgcard p{font-size:17.5px;line-height:1.5}.sgcard{padding-right:48px!important}}
@media(max-height:700px){.sgcard.sge .tiles.mini{margin:6px 0!important}.sgcard.sge .sgq{font-size:23px;margin:4px 0 0}.sgcard.sge .btn{height:46px;padding:0}.sgcard.sge .btn+.btn{margin-top:6px}.sgcard.sge>svg,.sgcard.sge>.mkw{width:48px!important;height:auto}.sgcard.sge .small{margin-top:6px!important}}
.sgcard.pl.pm .sgq{font-size:clamp(24px,6.6vw,29px);margin-bottom:14px}
/* calm ambient: dots merge into background, never sit under text */
body.onb #amb{opacity:.34}
#amb{-webkit-mask-image:radial-gradient(ellipse 62% 52% at 50% 50%,transparent 0%,transparent 55%,#000 100%);mask-image:radial-gradient(ellipse 62% 52% at 50% 50%,transparent 0%,transparent 55%,#000 100%)}
.amb .gz{opacity:.3}
.amb .stars circle:nth-child(4n),.amb .stars circle:nth-child(9n){r:1.1px}
.amb .stars circle:nth-child(3n){display:none}
.amb .orbit{stroke-opacity:.1!important}
/* ambient v3: only faint stars in the side margins; no sun, dust, rings or glow behind any text */
.amb .gz,.amb .sunw,.amb .neb,.amb .orbit,.amb .flash,.amb .shoot{display:none!important}
body.onb #amb{opacity:.3}
#amb{-webkit-mask-image:linear-gradient(90deg,#000 0,transparent 9%,transparent 91%,#000 100%);mask-image:linear-gradient(90deg,#000 0,transparent 9%,transparent 91%,#000 100%)}
/* storybook journey stage */
.saga2{--vi:#0B2F26}.saga2.dk{--vi:#0B1430}
.sgsv{display:block;width:100%;height:100%;max-width:none;margin:0}
.sgst{height:clamp(180px,30dvh,250px)}
@media(max-height:700px){.sgst{height:clamp(160px,27dvh,190px)}}
.ik{fill:var(--vi)}
.hl0{fill:rgba(11,47,38,.10)}.hl1{fill:rgba(47,154,116,.2)}
.gd{fill:rgba(47,154,116,.42)}.rd{stroke:rgba(255,255,255,.75);stroke-width:2.2;stroke-dasharray:2 7;stroke-linecap:round}
.dk .hl0{fill:rgba(255,255,255,.05)}.dk .hl1{fill:rgba(143,211,179,.1)}.dk .gd{fill:rgba(143,211,179,.2)}.dk .rd{stroke:rgba(255,255,255,.5)}
.sgt{font:700 15px Fraunces,Georgia,serif;fill:#0B2F26}.dk .sgt{fill:#fff}
.tk0{stroke:rgba(11,47,38,.22);stroke-width:2;stroke-linecap:round}.tk1{stroke:#2F9A74;stroke-width:2.6;stroke-linecap:round}
.dk .tk0{stroke:rgba(255,255,255,.25)}.dk .tk1{stroke:#8FD3B3}
.sgdot .sgc{fill:rgba(255,255,255,.9);stroke:rgba(11,47,38,.35);stroke-width:1.5}
.sgdot.done .sgc{fill:#2F9A74;stroke:#2F9A74}.sgdot.on .sgc{fill:#FFB52E;stroke:#fff;stroke-width:2;filter:drop-shadow(0 0 4px rgba(255,181,46,.9))}
.dk .sgdot .sgc{fill:rgba(255,255,255,.2);stroke:rgba(255,255,255,.5)}.dk .sgdot.done .sgc{fill:#8FD3B3;stroke:#8FD3B3}.dk .sgdot.on .sgc{fill:#FFB52E;stroke:#fff}
#sgsv *{transform-box:fill-box;transform-origin:center}
#sgsv .vg,#sgsv #sgwd,#sgsv #sgtv,#sgsv .sgdot,#sgsv #sgtk{transform-box:view-box;transform-origin:0 0}
.spin{animation:sgspin 14s linear infinite}.spin.r{animation-direction:reverse}.spin.s2{animation-duration:7s}.spin.s3{animation-duration:22s}.spin.s4{animation-duration:12s}
@keyframes sgspin{to{transform:rotate(360deg)}}
.wn{animation:sgwn 4s ease-in-out infinite}@keyframes sgwn{0%,100%{opacity:.35}50%{opacity:1}}
.bb{animation:sgbb 3.6s ease-in-out infinite}.bb.b2{animation-delay:-1.2s}.bb.b3{animation-delay:-2.4s}@keyframes sgbb{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.qm{animation:sgbb 3s ease-in-out infinite}
.ln{animation:sgdash 2.4s linear infinite}@keyframes sgdash{to{stroke-dashoffset:-28}}
.nd{animation:sgnd 3s ease-in-out infinite}@keyframes sgnd{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
.spk{animation:sgnd 2s ease-in-out infinite}
.rp path{animation:sgrp 2.2s ease-in-out infinite;opacity:.2}@keyframes sgrp{0%,100%{opacity:.2}50%{opacity:1}}
.fl{animation:sgfl 2.4s ease-in-out infinite}@keyframes sgfl{0%,100%{transform:skewY(0)}50%{transform:skewY(-6deg)}}
.tw{animation:tw 2.6s ease-in-out infinite alternate}
.sunz{animation:sgnd 5s ease-in-out infinite}
@media(prefers-reduced-motion:reduce){#sgsv *{animation:none!important}}
/* bullets */
.sgcard ul.bl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.sgcard .bl li{position:relative;padding-left:24px;font-size:19px;line-height:1.42;opacity:.3;transform:translateY(8px)}
.sgcard .bl li:before{content:"";position:absolute;left:1px;top:.5em;width:10px;height:10px;border-radius:50%;background:var(--ed);box-shadow:0 0 0 4px rgba(255,255,255,.7)}
.sgp2.act .bl li{animation:liin .55s cubic-bezier(.2,.8,.2,1) both}
.sgp2.act .bl li:nth-child(2){animation-delay:.14s}.sgp2.act .bl li:nth-child(3){animation-delay:.28s}.sgp2.act .bl li:nth-child(4){animation-delay:.42s}.sgp2.act .bl li:nth-child(5){animation-delay:.56s}.sgp2.act .bl li:nth-child(6){animation-delay:.7s}
@keyframes liin{from{opacity:.3;transform:translateY(8px)}to{opacity:1;transform:none}}
.sgcard.pl .sgq+.bl{margin-top:14px}
@media(max-height:700px){.sgcard .bl li{font-size:16.5px;line-height:1.4}.sgcard ul.bl{gap:9px}}
@media(prefers-reduced-motion:reduce){.sgcard .bl li{opacity:1;transform:none;animation:none!important}}

.sgst{height:clamp(200px,34dvh,270px)}
@media(max-height:700px){.sgst{height:clamp(186px,31dvh,215px)}}
.sgt{font-size:14px}
.sgst{height:clamp(200px,32dvh,226px)}
@media(max-height:700px){.sgst{height:clamp(176px,29dvh,200px)}}
@media(max-height:620px){.sgst{height:172px}}
.sgst{-webkit-mask-image:linear-gradient(#000 90%,transparent);mask-image:linear-gradient(#000 90%,transparent)}
/* journey v3: acts, segments, scenes, proof rows */
.sgtp{position:absolute;left:64px;right:86px;top:calc(env(safe-area-inset-top) + 12px);z-index:3;pointer-events:none}
.sgseg{position:relative;display:flex;gap:3px;pointer-events:auto}
.sgseg i{flex:1;height:5px;border-radius:3px;background:rgba(11,47,38,.16);overflow:hidden;position:relative;cursor:pointer;transition:transform .3s,height .3s}
.sgseg i:before{content:"";position:absolute;inset:-9px 0}
.sgseg i b{position:absolute;inset:0;background:#2F9A74;transform-origin:left;transform:scaleX(0);border-radius:3px}
.sgseg i.cur b{background:#FFB52E}
.sgseg i.pop{animation:segpop .8s cubic-bezier(.2,.9,.3,1.4)}
@keyframes segpop{0%{transform:scaleY(1)}30%{transform:scaleY(2.6)}100%{transform:scaleY(1)}}
.sgseg s{position:absolute;top:2px;width:6px;height:6px;border-radius:50%;pointer-events:none;animation:sgburst .85s ease-out forwards}
@keyframes sgburst{from{transform:translate(0,0) scale(1);opacity:1}to{transform:translate(var(--tx),var(--ty)) scale(.2);opacity:0}}
.dk .sgseg i{background:rgba(255,255,255,.22)}.dk .sgseg i b{background:#8FD3B3}.dk .sgseg i.cur b{background:#FFB52E}
.sgal{margin-top:9px;text-align:left}
.sga1{font:700 14px Fraunces,Georgia,serif;color:#0B2F26;line-height:1.15}
.sga2{font:600 11.5px Figtree,sans-serif;color:rgba(11,47,38,.62);margin-top:2px;transition:color .3s}
.sga2.ok{color:#B86F00;font-weight:800}
.dk .sga1{color:#fff}.dk .sga2{color:rgba(255,255,255,.68)}.dk .sga2.ok{color:#FFC24D}
.gp{stroke:rgba(11,47,38,.35);stroke-width:3;stroke-linecap:round}.gn{font:800 12px Fraunces,serif;fill:rgba(11,47,38,.4)}
.gate.on .gp{stroke:#FFB52E;filter:drop-shadow(0 0 4px rgba(255,181,46,.9))}.gate.on .gn{fill:#B86F00}
.dk .gp{stroke:rgba(255,255,255,.4)}.dk .gn{fill:rgba(255,255,255,.5)}.dk .gate.on .gn{fill:#FFC24D}
.gd{opacity:.62}.dk .gd{opacity:.4}
.fly{animation:sgfly 3.2s ease-in infinite}
@keyframes sgfly{0%{transform:translate(0,0) scale(1);opacity:0}15%{opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(.3);opacity:0}}
.pup{animation:sgpup 4s ease-in-out infinite}
@keyframes sgpup{0%,100%{transform:translateX(-5px)}50%{transform:translateX(16px)}}
.bm{animation:sgbm 3s ease-in-out infinite}@keyframes sgbm{0%,100%{opacity:.18}50%{opacity:.5}}
.rock{animation:sgrock 4s ease-in-out infinite}@keyframes sgrock{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg)}}
.clap{animation:sgclap 2.4s ease-in-out infinite}@keyframes sgclap{0%,60%,100%{transform:rotate(0)}75%{transform:rotate(-9deg)}}
.scan{animation:sgscan 3.6s linear infinite}@keyframes sgscan{from{transform:translateX(0)}to{transform:translateX(120px)}}
.eq{transform-origin:center bottom!important;animation:sgeq 1s ease-in-out infinite alternate}@keyframes sgeq{from{transform:scaleY(.25)}to{transform:scaleY(1)}}
.drip{animation:sgdrip 2.4s ease-in infinite}@keyframes sgdrip{0%{transform:translateY(-4px);opacity:0}25%{opacity:1}100%{transform:translateY(12px);opacity:0}}
svg .bar,svg.bar{transform-origin:left center!important;animation:sgbar 4.5s ease-in-out infinite}@keyframes sgbar{0%{transform:scaleX(.08)}85%,100%{transform:scaleX(1)}}
.sgcard .pf{display:flex;align-items:center;gap:12px;margin-top:14px;padding:9px 12px 9px 9px;border-radius:18px;background:rgba(255,255,255,.85);border:2px solid var(--bd,#CFE6D8);box-shadow:0 4px 0 var(--ed,#B9D9C6);text-decoration:none;color:inherit}
.sgcard .pf.on{cursor:pointer}.sgcard .pf.on:active{transform:translateY(2px);box-shadow:0 2px 0 var(--ed,#B9D9C6)}
.pft{position:relative;flex:none;width:62px;height:46px;border-radius:12px;background:linear-gradient(160deg,#E4F6EC,#FFF1D6);display:grid;place-items:center;overflow:hidden}
.pft svg{width:56px;height:42px}.pft img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pfx{display:flex;flex-direction:column;min-width:0;flex:1}.pfx b{background:none!important;font:800 15px Figtree,sans-serif;color:#0B2F26;line-height:1.2;padding:0}.pfx small{font:600 12.5px Figtree,sans-serif;color:rgba(11,47,38,.6);line-height:1.25;margin-top:2px}
.pfg{flex:none;width:30px;height:30px;border-radius:50%;background:#FFB52E;color:#0B2F26;display:grid;place-items:center;font-weight:800;font-size:16px}
.sgres{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:5;background:rgba(11,47,38,.86);color:#fff;font:600 13px Figtree,sans-serif;padding:9px 16px;border-radius:99px;white-space:nowrap}.sgres a{color:#FFC24D;font-weight:800;margin-left:4px}
@media(max-height:700px){.sgcard .pf{margin-top:10px;padding:7px 10px 7px 7px}.pft{width:54px;height:40px}.pft svg{width:48px;height:36px}.pfx b{font-size:14px}.pfx small{font-size:11.5px}}
/* tighter reading card so most screens fit one card */
.sgcard .bl li{font-size:17.5px;line-height:1.38}.sgcard ul.bl{gap:10px}
.sgcard.pl.pm .sgq{font-size:clamp(22px,6vw,27px);line-height:1.15;margin-bottom:12px}
@media(max-height:700px){.sgcard .bl li{font-size:16px;line-height:1.36}.sgcard ul.bl{gap:8px}.sgcard.pl.pm .sgq{font-size:22px;margin-bottom:10px}.sgcard{padding:18px 44px 18px 18px!important}.sgcard .sgk{margin-bottom:10px!important}.sgcard p{font-size:16px}}
.sgcard.cm{padding-top:16px!important;padding-bottom:16px!important}.sgcard.cm .bl li{font-size:15.5px;line-height:1.33}.sgcard.cm ul.bl{gap:7px}.sgcard.cm p{font-size:15.5px;line-height:1.38}.sgcard.cm.pl.pm .sgq{font-size:20.5px;margin-bottom:8px}.sgcard.cm .pf{margin-top:8px}.sgcard.cm .sgk{margin-bottom:8px!important}
.sga1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gp{stroke-width:2.6}.gf{fill:rgba(11,47,38,.28)}.gn{font:800 9.5px Figtree,sans-serif;fill:#fff}
.gate.on .gf{fill:#FFB52E;filter:drop-shadow(0 0 4px rgba(255,181,46,.8))}.gate.on .gn{fill:#0B2F26}.gate.on .gp{filter:none}
.dk .gf{fill:rgba(255,255,255,.3)}.dk .gate.on .gn{fill:#0B2F26}
@media(max-height:640px){.sgcard.sge{padding-top:14px!important;padding-bottom:14px!important}.sgcard.sge>svg,.sgcard.sge>.mkw{width:40px!important}.sgcard.sge .sgq{font-size:20px;line-height:1.15;margin:2px 0 0}.sgcard.sge .tiles.mini{margin:4px 0!important}.sgcard.sge .tiles.mini img{width:32px!important;height:32px!important}}
/* golden polish: type 1 : 1.618, Fibonacci spacing, horizon at ~.76 */
.sgseg{gap:4px}.sgseg i{height:6px;border-radius:4px}.sgseg i b{border-radius:4px}
.sgseg i.full{background:#2F9A74;box-shadow:0 0 0 1.5px rgba(70,199,154,.35),0 0 11px 1px rgba(70,199,154,.75)}
.sgseg i.full b{background:linear-gradient(90deg,#2F9A74,#52D1A3)}
.dk .sgseg i.full{box-shadow:0 0 0 1.5px rgba(143,211,179,.4),0 0 12px 2px rgba(143,211,179,.8)}
.sgseg i.pop{animation:segpop .9s cubic-bezier(.2,.9,.3,1.35)}
@keyframes segpop{0%{transform:scaleY(1) scaleX(1)}28%{transform:scaleY(3.4) scaleX(1.08);filter:brightness(1.5)}100%{transform:scaleY(1) scaleX(1)}}
.sgseg i.pop:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent);transform:translateX(-100%);animation:sgshine .8s .1s ease-out forwards}
@keyframes sgshine{to{transform:translateX(100%)}}
.sgseg s.ring{width:10px;height:10px;margin:-2px 0 0 -5px;border:2px solid #52D1A3;background:none;animation:sgring .9s ease-out forwards}
@keyframes sgring{from{transform:scale(.5);opacity:1}to{transform:scale(5.5);opacity:0}}
.sgseg s{width:7px;height:7px;box-shadow:0 0 8px currentColor}
.sga1{font-size:14.5px;letter-spacing:-.005em}.sga2{font-size:11.5px}
.sgcard .sgq,.sgcard.pl .sgq{letter-spacing:-.012em}
.sgcard.pl.pm .sgq{font-size:clamp(23px,6.3vw,28px)}
.sgcard .bl li{font-size:17px}
@media(max-height:700px){.sgcard .bl li{font-size:16px}.sgcard.pl.pm .sgq{font-size:25.9px;line-height:1.14}.sgcard .sgk{font-size:13px}}
.sgcard .bl li:before{width:9px;height:9px;top:.52em;box-shadow:0 0 0 3px rgba(255,255,255,.75)}
.sgcard ul.bl{gap:13px}@media(max-height:700px){.sgcard ul.bl{gap:8px}}
.sgcard{border-radius:34px!important}
.gd{opacity:.4}.dk .gd{opacity:.26}
.sgq{text-wrap:balance}

.pft{width:88px;height:50px;border-radius:12px}.pft svg{width:100%;height:100%}.pf.on .pft{box-shadow:0 6px 14px -8px rgba(11,47,38,.5)}
@media(max-height:700px){.pft{width:78px;height:44px}.pft svg{width:100%;height:100%}}
.pft svg svg{width:auto!important;height:auto!important}

.pft.pt{width:50px;height:70px;border-radius:9px}.pft.pt img{object-fit:cover}
@media(max-height:700px){.pft.pt{width:42px;height:58px}}

.chl .it{align-items:center}.chl .it b{font-size:18px}.chl .it span{display:block;color:#4F6E63;font-size:14px;margin-top:2px}.chl .it em{display:block;font-style:normal;font-size:13px;font-weight:600;color:var(--green);margin-top:6px}
.chh{margin:18px 4px 8px}.chh2{margin:2px 0 16px}.chh2 h1{font-size:30px;line-height:1.1}.chh2 p{font-size:16px;margin-top:6px}
.kg{margin:0 0 6px}.kg h3{margin:14px 2px 10px}.kd{display:inline-block;padding:6px 12px;border-radius:99px;font-size:13px;font-weight:700;background:#E4F6EC;color:#1F7A5A}
.kd.k-cureable{background:#FFF1D6;color:#8A5A00}.kd.k-founder{background:#fff;color:var(--ink);box-shadow:0 2px 8px -4px rgba(11,47,38,.4)}.kd.k-mixed{background:linear-gradient(90deg,#E4F6EC,#FFF1D6);color:#3F5A2A}
.kg .it b{font-size:17px}.kg .it span{display:block;color:#4F6E63;font-size:13px;margin-top:2px}
.read .ih{font-size:28px;line-height:1.12;margin:14px 0 6px}.read .oo{font-size:13px;margin:0 0 22px}
.chipback{flex:none;white-space:nowrap;width:auto;min-width:0}.bar .chipback{overflow:visible}

.chl{display:grid;gap:9px;margin:0 0 8px}
.chc{display:flex;align-items:center;gap:12px;background:#fff;border-radius:20px;padding:11px 14px 11px 11px;text-decoration:none;color:inherit;cursor:pointer;box-shadow:0 8px 22px -18px rgba(11,47,38,.4);border:1.5px solid #E3F1E9}
.chc:active{transform:scale(.985)}
.chn{flex:none;width:38px;height:38px;border-radius:50%;background:linear-gradient(145deg,#35A67C,#1F7A5A);color:#fff;font:700 17px/38px 'Fraunces',Georgia,serif;text-align:center}
.chb{min-width:0;flex:1}.chb b{display:block;font-size:16px;line-height:1.22;font-weight:600}
.chb span{display:block;color:#4F6E63;font-size:13px;line-height:1.3;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chb em{display:flex;align-items:center;gap:4px;font-style:normal;font-size:12.5px;font-weight:600;color:var(--green);margin-top:5px}
.kdot{width:8px;height:8px;border-radius:50%;background:#35A67C;display:inline-block}.kdot.k-cureable{background:#F2B233}.kdot.k-founder{background:#0A3F33}.kdot.k-mixed{background:linear-gradient(90deg,#35A67C 50%,#F2B233 50%)}
.chb em .kdot:last-of-type{margin-right:5px}
.chv{font-style:normal;color:var(--soft);font-size:22px}
.wh+.chl{margin-top:2px}
.chl{grid-template-columns:minmax(0,1fr)}.chc{min-width:0}
.chb span{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}


.read.sv{position:relative;isolation:isolate}
.read.sv .wash{position:absolute;z-index:-1;left:-24px;right:-24px;top:-90px;height:380px;pointer-events:none;background:radial-gradient(60% 70% at 88% 18%,color-mix(in srgb,var(--a) 26%,transparent),transparent 72%),radial-gradient(55% 60% at 6% 46%,color-mix(in srgb,var(--a) 13%,transparent),transparent 72%)}
.sv .ikd{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--a);margin:6px 0 14px}
.sv .ikd .kdot{width:9px;height:9px;background:var(--a)!important}.sv .ikd em{font-style:normal;margin-left:auto;font-weight:500;color:#6E8A7F}
.sv .ih{font-size:31px!important;line-height:1.1!important;margin:0!important;color:#0B2F26;letter-spacing:-.025em;max-width:94%}
.sv .rule{display:block;width:44px;height:5px;border-radius:9px;background:var(--a);margin:18px 0 22px}
.sv>p:first-of-type{font-size:21px}
.sv .qt{border-left:4px solid var(--a);padding-left:16px}
.sv.short>p{font-family:Fraunces,serif;font-weight:700;font-size:27px;line-height:1.22;letter-spacing:-.02em;color:#0B2F26;margin-top:6px}

.sv.short>p{font-family:Fraunces,serif!important;font-weight:400!important;font-size:23px!important;line-height:1.45!important;letter-spacing:0!important;color:#1F4A3E!important}
.sv.short .rule{margin:16px 0 18px}
.pubn{display:block;background:#FFF4D6;border-radius:18px;padding:12px 16px;margin:0 0 12px;text-decoration:none;color:#6B4300}.pubn b{display:block;font-size:15px}.pubn span{font-size:13px;display:block;margin-top:2px;text-decoration:underline}
.sv.short>p{font-family:Figtree,system-ui,sans-serif!important;font-size:21px!important;line-height:1.6!important;color:#2B4F44!important}

.wx{display:flex;align-items:center;justify-content:space-between;gap:10px;border-radius:30px;padding:20px 14px 20px 22px;margin:2px 0 16px;background:linear-gradient(135deg,#E4F6EC 0%,#CDEBDC 100%);box-shadow:0 14px 30px -22px rgba(11,47,38,.5);position:relative;overflow:hidden}
.wxt{min-width:0;flex:1}.wxt h1{font-size:36px;line-height:1.02;letter-spacing:-.03em;color:#0B2F26}
.wxt p{font-size:15px;line-height:1.35;color:#3F6556;margin:8px 0 0;max-width:15em}
.wxt em{display:inline-block;font-style:normal;font-size:13px;font-weight:700;color:#1F7A5A;background:rgba(255,255,255,.7);border-radius:99px;padding:6px 12px;margin-top:14px}
.wx img{width:104px;height:104px;border-radius:26px;flex:none;box-shadow:0 0 0 4px rgba(255,255,255,.8)}

.rvw{padding-bottom:6px}.rvf{display:flex;flex-direction:column;gap:2px;background:#fff;border-radius:22px;padding:14px 16px;margin:6px 0 14px;box-shadow:0 8px 22px -18px rgba(11,47,38,.4)}
.rvf span{font-size:12px;font-weight:700;color:#1F7A5A}.rvf b{font-family:Fraunces,serif;font-size:19px;line-height:1.2;color:#0B2F26}.rvf em{font-style:normal;font-size:13px;color:#6E8A7F}
.rvl{font-size:13px;font-weight:700;color:#1F7A5A;margin:14px 2px 6px}
.rvm{font-family:Fraunces,serif;font-weight:700;font-size:22px;line-height:1.28;color:#0B2F26;margin:0}
.rvo{font-size:16px;line-height:1.5;color:#3F6556;background:#EAF5EE;border-radius:16px;padding:12px 14px;margin:0;white-space:pre-line}
.rvc{font-size:15px;line-height:1.55;color:#3F5A50;background:#fff;border-radius:18px;padding:14px 16px;white-space:pre-line;max-height:280px;overflow:auto}
.rvc mark{background:#FFE9A8;color:#0B2F26;border-radius:4px;padding:1px 3px}
.rvw+.stk{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:10px}.rvw+.stk .btn{margin:0!important;padding:14px 8px;font-size:17px}.rvw+.stk .small{grid-column:1/3;margin:0;text-align:center}.rvm{font-size:20px}

.segs{display:flex;gap:4px;margin:6px 0 12px}.segs b{flex:1;height:6px;border-radius:9px;background:#D9E8DF;overflow:hidden}
.segs b i{display:block;height:100%;width:0;border-radius:9px;background:var(--a);transition:width .55s cubic-bezier(.2,.8,.2,1)}
.segs b.on i{width:100%;background:#1F7A5A}.segs b.cur i{transition:none}
.read.sv.sl{animation:svsl .46s cubic-bezier(.2,.8,.2,1) both}.read.sv.up{animation:svup .42s cubic-bezier(.2,.8,.2,1) both}
@keyframes svsl{from{opacity:0;transform:translateX(44px)}to{opacity:1;transform:none}}
@keyframes svup{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.read.sv.sl .ih,.read.sv.sl .rule{animation:svsl .6s .06s cubic-bezier(.2,.8,.2,1) both}
@media(prefers-reduced-motion:reduce){.read.sv.sl,.read.sv.up,.read.sv.sl .ih,.read.sv.sl .rule{animation:none}.segs b i{transition:none}}

.read p.sd{font-size:14px;font-weight:600;letter-spacing:.02em;color:#6E8A7F;margin:-6px 0 22px;font-style:italic}
.read p.sd::before{content:'';display:inline-block;width:18px;height:2px;background:currentColor;opacity:.5;vertical-align:middle;margin-right:8px}
.sv p b,.sv li b{font-weight:700;color:var(--ink,#0f2a22)}

.soon{display:flex;gap:14px;align-items:center;margin:18px 0 8px;padding:18px 18px;border-radius:22px;border:1.5px dashed rgba(31,107,85,.35);background:linear-gradient(135deg,rgba(255,255,255,.55),rgba(214,234,222,.45))}
.soon .sd1{flex:none;width:12px;height:12px;border-radius:50%;background:#F6B64A;box-shadow:0 0 0 0 rgba(246,182,74,.5);animation:soonp 2.4s ease-out infinite}
.soon b{display:block;font-family:Figtree,system-ui,sans-serif;font-weight:700;font-size:16px;color:#123f33}
.soon span{display:block;margin-top:3px;font-size:14px;line-height:1.45;color:#4d6b60}
@keyframes soonp{70%{box-shadow:0 0 0 10px rgba(246,182,74,0)}100%{box-shadow:0 0 0 0 rgba(246,182,74,0)}}
@media(prefers-reduced-motion:reduce){.soon .sd1{animation:none}}

.segs b.done{animation:segdone .7s cubic-bezier(.2,.8,.3,1)}
@keyframes segdone{0%{transform:scaleY(1);box-shadow:0 0 0 0 rgba(31,122,90,0)}35%{transform:scaleY(1.9);box-shadow:0 0 0 5px rgba(31,122,90,.16)}100%{transform:scaleY(1);box-shadow:0 0 0 0 rgba(31,122,90,0)}}
@media(prefers-reduced-motion:reduce){.segs b.done{animation:none}}

.kd.k-built{background:#ECE7FB;color:#4B36A8}.kdot.k-built{background:#6B52C8}
.chc.built{background:linear-gradient(135deg,#F3EFFF,#E7E0FB);border:1.5px solid rgba(107,82,200,.28);box-shadow:0 10px 26px -18px rgba(75,54,168,.55)}
.chc.built .chn{background:linear-gradient(145deg,#8A73E0,#5B45B8);display:flex;align-items:center;justify-content:center}
.chc.built .chb b{color:#2F2272}.chc.built .chb span{color:#5F5490}.chc.built .chv{color:#5B45B8}
.chc.built em .kdot{background:#6B52C8}

/* ---- more coming chip, numbered chapter rows, game cards ---- */
.wxt .more{display:flex;align-items:center;gap:8px;width:max-content;max-width:100%;margin-top:8px;padding:6px 12px 6px 10px;border-radius:16px;background:linear-gradient(135deg,#FFF1CF,#FFE3A0);color:#7A4A06;font-size:12.5px;font-weight:700;line-height:1.2}
.wxt .more i{flex:none;width:8px;height:8px;border-radius:50%;background:#F29A1F;box-shadow:0 0 0 0 rgba(242,154,31,.55);animation:soonp 2.4s ease-out infinite}
.rows.seq .it{gap:12px}
.rno{flex:none;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#3F6556;background:#E8F4EC;box-shadow:inset 0 0 0 1.5px #CFE6D8}
.rno.ok{background:#1F7A5A;color:#fff;box-shadow:none}
.gbd{display:inline-flex;align-items:center;gap:4px;margin-left:8px;padding:2px 8px;border-radius:99px;font-style:normal;font-size:11.5px;font-weight:700;text-decoration:none;vertical-align:middle}
.gbd.lock{background:#EEF2EF;color:#7E918A}.gbd.rdy{background:#FFE9B8;color:#8A5300}.gbd.on{background:#FFF1CF;padding:2px 6px}
.gbd svg{fill:#E2D7BE}.gbd .on,.gbd svg.on{fill:#F5A623}
.gcard{display:flex;align-items:center;gap:13px;width:100%;text-align:left;margin:0 0 16px;padding:14px 16px;border-radius:22px;color:#fff;background:linear-gradient(135deg,#123F4A 0%,#1B5E55 60%,#2A7A5E 100%);box-shadow:0 14px 28px -18px rgba(11,47,38,.7);border:0;font:inherit;cursor:pointer;position:relative;overflow:hidden}
.gcard:before{content:"";position:absolute;right:-26px;top:-30px;width:110px;height:110px;border-radius:50%;background:radial-gradient(circle,rgba(255,196,77,.5),rgba(255,196,77,0) 70%)}
.gcard .gi1{flex:none;width:44px;height:44px;border-radius:14px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;color:#FFD580}
.gcard .gi1 img{width:44px;height:44px;border-radius:14px}
.gcard>div{flex:1;min-width:0;position:relative}.gcard b{display:block;font-size:16px;font-weight:700}.gcard span{display:block;font-size:13.5px;opacity:.85;margin-top:2px}
.gcard em{font-style:normal;flex:none;position:relative;display:flex;gap:2px;align-items:center;background:#FFB52E;color:#3A2300;font-weight:800;font-size:13.5px;padding:8px 14px;border-radius:99px}
.gcard em svg{fill:rgba(58,35,0,.25)}.gcard em svg.on{fill:#3A2300}.gcard em:has(svg){background:rgba(255,255,255,.14);padding:6px 10px}.gcard em svg.on{fill:#FFC94D}
.gcard.lock{background:#EEF3F0;color:#5E766C;box-shadow:none;cursor:default;border:1.5px dashed #CBDCD2}.gcard.lock:before{display:none}.gcard.lock .gi1{background:#DDE8E1;color:#7E918A}.gcard.lock span{opacity:1}
.gpb{height:6px;border-radius:9px;background:#D8E5DD;margin-top:9px;overflow:hidden}.gpb i{display:block;height:100%;background:#2F9A74;border-radius:9px;transition:width .5s}
.gsegs{display:flex;gap:4px;margin-top:10px}.gsegs i{flex:1;height:6px;border-radius:9px;background:#D3E1D8}.gsegs i.on{background:#2F9A74}
.gcard.w{margin-top:2px}
.gh{display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin-top:10px;padding:10px 14px 10px 10px;border-radius:20px;background:linear-gradient(135deg,#123F4A,#1F6A5A);color:#fff;border:0;font:inherit;box-shadow:0 10px 22px -14px rgba(11,47,38,.7);cursor:pointer}
.gh .ghi{flex:none;width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;color:#FFD580}
.gh>div{flex:1;min-width:0}.gh b{display:block;font-size:15px}.gh span{display:block;font-size:12.5px;opacity:.85;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gh em{font-style:normal;text-align:right}.gh em b{font-family:Fraunces,serif;font-size:21px;color:#FFC94D;line-height:1}.gh em small{display:block;font-size:11px;opacity:.8;margin-top:2px}

/* ---- game arena ---- */
.gm,.gi{position:fixed;inset:0;z-index:9999;color:#fff;overflow:hidden;background:linear-gradient(180deg,#0E2A44 0%,#124B52 52%,#0B3A34 100%);font-family:Figtree,system-ui,sans-serif;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.gm{display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 10px) 14px calc(env(safe-area-inset-bottom) + 6px)}
.gm.boss{background:linear-gradient(180deg,#2A1747 0%,#3B2160 40%,#1B3F48 100%)}
.gsky{position:absolute;inset:0;pointer-events:none}.gsun{position:absolute;right:-40px;top:-50px;width:210px;height:210px;border-radius:50%;background:radial-gradient(circle,rgba(255,196,77,.55),rgba(255,196,77,.14) 45%,rgba(255,196,77,0) 70%)}
.gst{position:absolute;inset:0;background-image:radial-gradient(1.4px 1.4px at 12% 18%,#fff,transparent),radial-gradient(1.2px 1.2px at 78% 30%,#fff,transparent),radial-gradient(1.6px 1.6px at 40% 8%,#FFE6A8,transparent),radial-gradient(1.2px 1.2px at 62% 62%,#fff,transparent),radial-gradient(1.4px 1.4px at 22% 74%,#fff,transparent),radial-gradient(1.2px 1.2px at 90% 84%,#FFE6A8,transparent),radial-gradient(1.2px 1.2px at 8% 46%,#fff,transparent);animation:gtw 4s ease-in-out infinite alternate;opacity:.8}
@keyframes gtw{from{opacity:.35}to{opacity:.9}}
.ghud{position:relative;display:flex;align-items:center;gap:10px;height:40px}
.gx,.gmu,.gx2{flex:none;width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;border:0;font-size:15px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.gx2{position:absolute;left:14px;top:calc(env(safe-area-inset-top) + 10px);z-index:2}
.gmu .m{display:none}.gmu.off .w{display:none}.gmu.off .m{display:block}
.gdots{flex:1;display:flex;gap:4px}.gdots i{flex:1;height:6px;border-radius:9px;background:rgba(255,255,255,.2);transition:background .3s}.gdots i.cur{background:#FFC94D}.gdots i.ok{background:#52D1A3}.gdots i.bad{background:#FF7A6A}
.ghe{display:flex;gap:2px}.ghe svg{fill:rgba(255,255,255,.2)}.ghe svg.on{fill:#FF6B6B;filter:drop-shadow(0 0 5px rgba(255,107,107,.7))}
.gscr{position:relative;display:flex;align-items:baseline;gap:10px;min-height:30px;padding:2px 2px 0}
.gscr b{font-family:Fraunces,serif;font-size:26px;line-height:1;color:#FFC94D}.gscr em{font-style:normal;font-size:13px;font-weight:700;color:#7DF0C4;min-width:0}
.gboss{margin-left:auto;display:flex;align-items:center;gap:8px;align-self:center;flex:1;max-width:58%}.gboss img{width:30px;height:30px;border-radius:50%;box-shadow:0 0 0 2px #FFC94D,0 0 14px rgba(255,201,77,.7)}
.gbhp{flex:1;height:9px;border-radius:9px;background:rgba(255,255,255,.18);overflow:hidden}.gbhp i{display:block;height:100%;background:linear-gradient(90deg,#FF6B6B,#FFB52E);border-radius:9px;transition:width .45s}
.gboss.hurt img{animation:ghurt .4s}@keyframes ghurt{30%{transform:translateX(-4px) rotate(-8deg);filter:brightness(2)}60%{transform:translateX(4px) rotate(8deg)}}
.gq{position:relative;margin-top:6px;padding:14px 16px 16px;border-radius:22px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.gq small{display:block;font-size:12px;font-weight:700;letter-spacing:.02em;color:#FFD580}
.gq p{margin:6px 0 12px;font-family:Fraunces,serif;font-size:19px;line-height:1.28;font-weight:600;min-height:3.8em;display:flex;align-items:center}.gq p.sm{font-size:16.5px}
.gq p u{display:inline-block;min-width:3.2em;border-bottom:3px solid #FFC94D;text-decoration:none;margin:0 2px}
.gtm{height:7px;border-radius:9px;background:rgba(255,255,255,.16);overflow:hidden}.gtm i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#52D1A3,#FFC94D);border-radius:9px}.gtm i.lo{background:linear-gradient(90deg,#FF6B6B,#FF9E6B)}
.gl{position:relative;flex:1;min-height:150px;margin-top:8px;overflow:hidden}
.gp{position:absolute;left:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:6px 18px;border-radius:99px;border:1.5px solid rgba(255,255,255,.55);background:radial-gradient(120% 140% at 30% 20%,rgba(255,255,255,.34),rgba(255,255,255,.1) 60%);box-shadow:0 0 22px rgba(255,201,77,.28),inset 0 0 14px rgba(255,255,255,.14);color:#fff;font:inherit;font-weight:700;font-size:13.5px;line-height:1.2;cursor:pointer;will-change:transform;touch-action:manipulation}
.gp span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;pointer-events:none}
.gp.good{background:radial-gradient(120% 140% at 30% 20%,#9BF3CE,#2FBF86);border-color:#D6FFEC;box-shadow:0 0 30px rgba(82,209,163,.9);color:#05382A;animation:gpop .45s}
.gp.bad{background:radial-gradient(120% 140% at 30% 20%,#FFB4A8,#E5493A);border-color:#FFD6CF;box-shadow:0 0 26px rgba(255,107,107,.85);animation:gnope .4s}.gp.dim{opacity:.35}
@keyframes gpop{40%{filter:brightness(1.25);scale:1.08}}@keyframes gnope{25%{translate:-6px 0}55%{translate:6px 0}}
.gfb{min-height:42px;margin:6px 2px 0;padding:6px 12px;border-radius:14px;font-size:13.5px;line-height:1.3;opacity:0;transition:opacity .2s;display:flex;align-items:center}.gfb.on{opacity:1}.gfb.ok{background:rgba(82,209,163,.2);color:#C8FFE6}.gfb.no{background:rgba(255,107,107,.2);color:#FFD9D3}.gfb b{font-weight:700;margin-left:4px;color:#fff}
.gcn{position:relative;height:84px;flex:none}.gbase{position:absolute;left:50%;bottom:-34px;width:96px;height:96px;margin-left:-48px;border-radius:50%;background:radial-gradient(circle at 50% 30%,#FFE29A,#F2A81D 60%,#B8730A);box-shadow:0 0 30px rgba(255,196,77,.7)}
.gbar{position:absolute;left:50%;bottom:6px;width:10px;height:58px;margin-left:-5px;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,#FFF3C9,#FFC94D);transform-origin:50% 100%;transition:transform .18s;box-shadow:0 0 14px rgba(255,201,77,.9);z-index:1}
.gfx{position:fixed;inset:0;pointer-events:none;z-index:5}
.garr{position:fixed;width:6px;height:30px;border-radius:6px;background:linear-gradient(180deg,#fff,#FFC94D 40%,rgba(255,201,77,0));box-shadow:0 0 12px 2px rgba(255,201,77,.9);transform-origin:50% 100%}
.gpt{position:fixed;width:8px;height:8px;margin:-4px;border-radius:50%}.gpt.ok{background:#FFE29A;box-shadow:0 0 10px #FFC94D}.gpt.bad{background:#FF8A7A;box-shadow:0 0 8px #FF6B6B}
.gfl{position:fixed;transform:translate(-50%,-50%);font-family:Fraunces,serif;font-size:24px;animation:gfl .9s ease-out forwards}.gfl.ok{color:#FFE29A;text-shadow:0 0 12px rgba(255,196,77,.9)}
@keyframes gfl{from{opacity:1;margin-top:0}to{opacity:0;margin-top:-56px}}
.gm.shake{animation:gsh .4s}@keyframes gsh{20%{transform:translate(-5px,2px)}40%{transform:translate(5px,-2px)}60%{transform:translate(-3px,1px)}80%{transform:translate(3px,0)}}
@media(max-height:660px){.gq p{min-height:3.2em;font-size:17px}.gcn{height:70px}.gfb{min-height:36px;margin-top:4px}}

/* intro, results, chapter complete */
.gi{display:flex;align-items:center;justify-content:center;padding:24px}
.gic{position:relative;width:100%;max-width:380px;text-align:center}
.gbadge{width:84px;height:84px;margin:0 auto 14px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle,rgba(255,201,77,.4),rgba(255,201,77,.08) 70%);color:#FFD580;box-shadow:0 0 0 2px rgba(255,201,77,.5),0 0 32px rgba(255,201,77,.5)}.gbadge img{width:68px;height:68px;border-radius:50%}
.gic h1{font-family:Fraunces,serif;font-size:34px;line-height:1.05;margin:0;color:#fff}.gtt{margin:8px 0 18px;font-size:15px;color:#BFE9D8;line-height:1.35}
.grules{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:8px;text-align:left}.grules li{display:flex;gap:12px;align-items:baseline;padding:10px 14px;border-radius:16px;background:rgba(255,255,255,.1)}.grules b{flex:none;width:92px;color:#FFC94D;font-size:14px}.grules span{font-size:13.5px;line-height:1.3;color:#E6F6EE}
.gbtn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:54px;margin-top:10px;border-radius:99px;border:0;background:linear-gradient(180deg,#FFC94D,#F5A623);color:#3A2300;font:inherit;font-weight:800;font-size:17px;box-shadow:0 10px 22px -10px rgba(245,166,35,.8),inset 0 -3px 0 rgba(0,0,0,.12);cursor:pointer}
.gbtn.alt{background:rgba(255,255,255,.16);color:#fff;box-shadow:none}.gbtn.ghost{background:none;color:#BFE9D8;box-shadow:none;height:44px;font-size:15px}
.gsm{margin:12px 0 0;font-size:13px;color:#BFE9D8}
.gstars{display:flex;justify-content:center;gap:8px;margin-bottom:12px}.gstars svg{fill:rgba(255,255,255,.2)}.gstars svg.on{fill:#FFC94D;filter:drop-shadow(0 0 10px rgba(255,201,77,.9));animation:gstp .6s both}.gstars svg.on:nth-child(2){animation-delay:.15s}.gstars svg.on:nth-child(3){animation-delay:.3s}
@keyframes gstp{from{transform:scale(.2) rotate(-40deg);opacity:0}70%{transform:scale(1.25)}to{transform:scale(1);opacity:1}}
.gnum{display:flex;gap:8px;margin:2px 0 14px}.gnum div{flex:1;padding:12px 6px;border-radius:16px;background:rgba(255,255,255,.1)}.gnum b{display:block;font-family:Fraunces,serif;font-size:22px;color:#FFC94D}.gnum span{display:block;font-size:11.5px;color:#BFE9D8;margin-top:2px}
.gburst{width:84px;height:84px;margin:0 auto 14px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(145deg,#52D1A3,#1F9A6E);box-shadow:0 0 0 8px rgba(82,209,163,.2),0 0 0 18px rgba(82,209,163,.1),0 0 40px rgba(82,209,163,.6);animation:gbp .7s cubic-bezier(.2,1.4,.4,1) both}
@keyframes gbp{from{transform:scale(.3);opacity:0}}
.gwp{margin:16px 0 4px;padding:14px;border-radius:18px;background:rgba(255,255,255,.1);text-align:left}.gwp b{display:block;font-size:15px}.gwp>span{display:block;font-size:13px;color:#BFE9D8;margin-top:3px}.gwp .gsegs i{background:rgba(255,255,255,.2)}.gwp .gsegs i.on{background:#FFC94D}.gwp .gbtn{height:46px;font-size:15px}
@media(prefers-reduced-motion:reduce){.gst,.gstars svg,.gburst,.gm.shake,.gfl{animation:none}}
body:has(.gm) #lgo,body:has(.gi) #lgo{display:none}
.gfb{display:block;line-height:1.35;padding:9px 12px}

/* ---- soothing light game theme (overrides the first pass) ---- */
.gm,.gi{color:#0B2F26;background:linear-gradient(180deg,#FFF3DE 0%,#EAF5EC 46%,#D8EEEA 100%)}
.gm.boss{background:linear-gradient(180deg,#F3EAFB 0%,#E7F0F8 48%,#D8EEEA 100%)}
.gsun{background:radial-gradient(circle,rgba(255,189,66,.6),rgba(255,189,66,.16) 45%,rgba(255,189,66,0) 70%)}
.gst{background-image:radial-gradient(70px 22px at 16% 20%,rgba(255,255,255,.9),transparent),radial-gradient(90px 26px at 84% 48%,rgba(255,255,255,.75),transparent),radial-gradient(80px 24px at 26% 80%,rgba(255,255,255,.75),transparent),radial-gradient(60px 18px at 70% 86%,rgba(255,255,255,.7),transparent);animation:gcl 14s ease-in-out infinite alternate;opacity:1}
@keyframes gcl{from{transform:translateX(-14px)}to{transform:translateX(14px)}}
.gx,.gmu,.gx2{background:rgba(255,255,255,.85);color:#1F6A55;box-shadow:0 6px 14px -8px rgba(11,47,38,.45)}
.gdots i{background:rgba(11,47,38,.12)}.gdots i.cur{background:#F2A81D}.gdots i.ok{background:#35C28A}.gdots i.bad{background:#F0705F}
.ghe svg{fill:rgba(11,47,38,.14)}.ghe svg.on{fill:#F0705F;filter:none}
.gscr b{color:#C77A08}.gscr em{color:#1F9A6E}
.gboss img{box-shadow:0 0 0 2px #fff,0 0 0 4px #F2A81D}.gbhp{background:rgba(11,47,38,.12)}
.gq{background:rgba(255,255,255,.86);border:1px solid #fff;box-shadow:0 16px 32px -22px rgba(11,47,38,.5);backdrop-filter:none;-webkit-backdrop-filter:none}
.gq small{color:#B7791F}.gq p{color:#0B2F26}.gq p u{border-bottom-color:#F2A81D}
.gtm{background:rgba(11,47,38,.1)}.gtm i{background:linear-gradient(90deg,#35C28A,#F2C14A)}.gtm i.lo{background:linear-gradient(90deg,#F0705F,#F6A25F)}
.gp{color:#123F33;font-size:13px;line-height:1.2;padding:5px 16px;border:1.5px solid #8FD8B8;background:linear-gradient(160deg,#FFFFFF,#E3F5EC);box-shadow:0 10px 20px -12px rgba(11,47,38,.45),0 0 0 3px rgba(255,255,255,.5)}
.gp:nth-child(2){border-color:#F7B98A;background:linear-gradient(160deg,#FFFFFF,#FFEBD9)}
.gp:nth-child(3){border-color:#9CC7EE;background:linear-gradient(160deg,#FFFFFF,#E1EEFB)}
.gp:nth-child(4){border-color:#BBA7EC;background:linear-gradient(160deg,#FFFFFF,#EDE6FB)}
.gp.good{background:linear-gradient(160deg,#C9F5E0,#7FE0B6);border-color:#2FBF86;color:#06402E;box-shadow:0 0 0 4px rgba(53,194,138,.3),0 12px 24px -10px rgba(31,154,110,.6)}
.gp.bad{background:linear-gradient(160deg,#FFE0DA,#FFB4A8);border-color:#E5614F;color:#6B1D12;box-shadow:0 0 0 4px rgba(240,112,95,.25)}
.gp.dim{opacity:.5}
.gfb.ok{background:#D6F3E6;color:#14684B}.gfb.no{background:#FFE4DE;color:#8A2D1F}.gfb b{color:inherit}
.gbase{background:radial-gradient(circle at 50% 30%,#FFE9B0,#F5B02E 60%,#D68A10);box-shadow:0 0 34px rgba(255,189,66,.8)}
.garr{background:linear-gradient(180deg,#fff,#F5A623 45%,rgba(245,166,35,0));box-shadow:0 0 10px 2px rgba(245,166,35,.8)}
.gpt.ok{background:#F5B02E;box-shadow:0 0 8px #FFD27A}.gfl.ok{color:#C77A08;text-shadow:0 1px 0 #fff}
.gic h1{color:#0B2F26}.gk{margin:6px 0 0;font-size:16px;font-weight:600;color:#1F7A5A}.gtt{color:#4D6B60;margin-top:6px}
.gbadge{background:radial-gradient(circle,rgba(255,189,66,.4),rgba(255,189,66,.1) 70%);color:#C77A08;box-shadow:0 0 0 2px rgba(245,176,46,.55),0 0 28px rgba(255,189,66,.5)}
.grules li{background:rgba(255,255,255,.8);box-shadow:0 8px 16px -14px rgba(11,47,38,.5)}.grules b{color:#B7791F}.grules span{color:#3F6556}
.gsm{color:#5E766C}
.gbtn.alt{background:rgba(31,122,90,.12);color:#1F6A55}.gbtn.ghost{color:#4D6B60}
.gstars svg{fill:#E6DFCD}.gstars svg.on{fill:#F5A623;filter:drop-shadow(0 0 8px rgba(245,166,35,.6))}
.gnum div{background:rgba(255,255,255,.8)}.gnum b{color:#C77A08}.gnum span{color:#5E766C}
.gwp{background:rgba(255,255,255,.8)}.gwp>span{color:#4D6B60}.gwp .gsegs i{background:rgba(11,47,38,.12)}.gwp .gsegs i.on{background:#35C28A}
.gburst{background:linear-gradient(145deg,#52D1A3,#2FA878);box-shadow:0 0 0 8px rgba(82,209,163,.22),0 0 0 18px rgba(82,209,163,.12),0 0 34px rgba(82,209,163,.5)}
/* game cards in the app: sunny, not dark */
.gcard{color:#5A3A00;background:linear-gradient(135deg,#FFF6DE 0%,#FFE9B8 100%);box-shadow:0 12px 24px -18px rgba(150,95,0,.6);border:1.5px solid #F7DDA0}
.gcard:before{background:radial-gradient(circle,rgba(255,190,70,.4),rgba(255,190,70,0) 70%)}
.gcard .gi1{background:rgba(255,255,255,.75);color:#C77A08}.gcard span{opacity:.85}
.gcard em{background:#F5A623;color:#3A2300}.gcard em:has(svg){background:rgba(255,255,255,.7)}.gcard em svg{fill:#E6DFCD}.gcard em svg.on{fill:#F5A623}
.gcard.lock{background:#F1F4F1;color:#5E766C;border:1.5px dashed #CBDCD2}
.gpill{display:flex;align-items:center;gap:6px;height:34px;padding:0 12px 0 9px;border-radius:99px;border:0;background:#FFF1CF;color:#7A4A06;font:inherit;font-weight:800;font-size:14px;box-shadow:0 6px 14px -9px rgba(150,95,0,.7);cursor:pointer}
.gpill svg{color:#C77A08}
.home .hello .gpill{transform:none;margin:0}
.gboss svg{flex:none;color:#C77A08;filter:drop-shadow(0 0 6px rgba(255,189,66,.6))}.gboss.hurt svg{animation:ghurt .4s}
.gcard.rest{background:#F1F4F1;color:#4F6A5F;box-shadow:none;border:1.5px solid #D5E4DA;cursor:default}.gcard.rest:before{display:none}.gcard.rest .gi1{background:#E3EDE6;color:#7E918A}.gcard.rest span{opacity:1}
.gsm.rest{margin:12px 0 4px;font-weight:600;color:#4F6A5F}

/* Peak cut: a 3 second full-screen beat at the top of each act's tension, then the story carries on */
.sgsnap{position:absolute;inset:0;z-index:40;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;background:radial-gradient(circle at 50% 44%,#FFF0B8 0,#FFB52E 34%,#FF7A6A 100%);--vi:#0B2F26;animation:snIn .12s ease-out both;cursor:pointer;padding:0 22px}
.sgsnap.out{animation:snOut .26s ease-in both}
.sn-rays{position:absolute;inset:-70%;background:repeating-conic-gradient(from 0deg at 50% 50%,rgba(255,255,255,.6) 0 2.5deg,transparent 2.5deg 8deg);-webkit-mask:radial-gradient(circle at center,transparent 13%,#000 52%);mask:radial-gradient(circle at center,transparent 13%,#000 52%);animation:snSpin 7s linear infinite}
.sn-bar{position:absolute;left:0;right:0;height:8%;background:#0B2F26}.sn-bar.t{top:0;animation:snBarT .4s cubic-bezier(.2,1,.3,1) both}.sn-bar.b{bottom:0;animation:snBarB .4s cubic-bezier(.2,1,.3,1) both}
.sn-art{position:relative;width:min(92%,390px);height:auto;max-height:34%;filter:drop-shadow(0 6px 0 rgba(255,255,255,.55));animation:snArt .55s cubic-bezier(.2,1.5,.4,1) .06s both}
.sn-nm{position:relative;margin-top:14px;font:900 clamp(34px,11.5vw,54px)/.98 Fraunces,serif;color:#0B2F26;text-align:center;transform:skewX(-6deg);text-shadow:3px 3px 0 #fff,-2px 2px 0 #fff,0 5px 0 rgba(255,255,255,.7);animation:snSlam .45s cubic-bezier(.2,1.7,.4,1) .2s both;max-width:92%}
.sn-sub{position:relative;margin-top:16px;font:700 16.5px/1.35 Figtree,sans-serif;color:#0B2F26;text-align:center;max-width:310px;animation:snSub .45s ease-out .62s both}
.sn-flash{position:absolute;inset:0;background:#fff;pointer-events:none;animation:snFlash .55s ease-out both}
@keyframes snIn{from{filter:brightness(2.2)}to{filter:none}}
@keyframes snOut{to{opacity:0;transform:scale(1.04)}}
@keyframes snSpin{to{transform:rotate(360deg)}}
@keyframes snBarT{from{transform:translateY(-100%)}}
@keyframes snBarB{from{transform:translateY(100%)}}
@keyframes snArt{from{transform:scale(.6) rotate(-3deg);opacity:0}}
@keyframes snSlam{0%{transform:skewX(-6deg) scale(2.3);opacity:0}60%{opacity:1}100%{transform:skewX(-6deg) scale(1)}}
@keyframes snSub{from{opacity:0;transform:translateY(8px)}}
@keyframes snFlash{0%{opacity:1}100%{opacity:0}}
/* the peak carries on after the cut, in quick micro-cuts */
.sgp2.act .sgcard.pk{animation:pkPunch .3s cubic-bezier(.2,1.2,.4,1) both}
.sgp2.act .sgcard.pk .sgq{animation:pkCut .18s steps(2,end) both}
.sgp2.act .sgcard.pk .bl li,.sgp2.act .sgcard.pk p{animation:pkCut .18s steps(2,end) both}
.sgp2.act .sgcard.pk .bl li:nth-child(1){animation-delay:.06s}.sgp2.act .sgcard.pk .bl li:nth-child(2){animation-delay:.12s}.sgp2.act .sgcard.pk .bl li:nth-child(3){animation-delay:.18s}.sgp2.act .sgcard.pk .bl li:nth-child(4){animation-delay:.24s}.sgp2.act .sgcard.pk .bl li:nth-child(5){animation-delay:.3s}.sgp2.act .sgcard.pk .bl li:nth-child(6){animation-delay:.36s}
@keyframes pkPunch{from{transform:scale(1.03)}to{transform:none}}
@keyframes pkCut{from{opacity:0;transform:translateX(-6px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.sn-rays{animation:none}.sn-art,.sn-nm,.sn-sub,.sn-flash,.sn-bar{animation:none}.sgp2.act .sgcard.pk,.sgp2.act .sgcard.pk *{animation:none!important}}

/* Interludes */
.sgiv{position:absolute;inset:0;z-index:40;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(120% 90% at 50% 38%,#16584A 0,#0A2A24 62%,#061F1A 100%);cursor:pointer;animation:ivIn .22s ease-out both}
.sgiv.out{animation:ivOut .32s ease-in both}
.sgiv svg.ivs{width:min(100%,440px);height:auto;max-height:66%;overflow:visible;margin-top:-6%}
.iv-nx{position:absolute;left:0;right:0;bottom:calc(9% + env(safe-area-inset-bottom));text-align:center;color:#fff;animation:ivNx .6s ease-out 2.7s both}
.iv-nx span{display:block;font:600 13px Figtree,sans-serif;opacity:.65;margin-bottom:4px}
.iv-nx b{display:block;font:800 clamp(22px,6.6vw,28px)/1.15 Fraunces,serif;padding:0 28px}
.iv-bar{position:absolute;left:0;bottom:0;height:3px;background:#FFB52E;animation:ivBar 4.6s linear both}
.sgintro{background:#050D22;animation:none}.sgintro.out{animation:ivOut .34s ease-in both}
.sgintro .hcv{position:absolute;inset:0;width:100%;height:100%;animation:ivWarp 6.4s cubic-bezier(.4,0,.2,1) both}
.iv-fl{position:absolute;inset:0;background:#fff;opacity:0;pointer-events:none;animation:ivFl 6.4s ease-in both}
.iv-uk{position:absolute;left:0;right:0;bottom:calc(11% + env(safe-area-inset-bottom));text-align:center;font:700 22px Fraunces,serif;color:#fff;opacity:0;animation:ivUk 6.4s ease-out both}
.ivA{transform-box:fill-box;transform-origin:center}
.ivPop{animation:ivPop .55s cubic-bezier(.2,1.7,.4,1) both}.ivFade{animation:ivFadeK .8s ease-out both}.ivRise{animation:ivRiseK .7s cubic-bezier(.2,1,.3,1) both}
.ivDraw{stroke-dasharray:100;stroke-dashoffset:100;animation:ivDrawK 1.2s ease-in-out both}
.ivSpin{animation:ivSpinK linear infinite}.ivPulse{animation:ivPulseK 1.8s ease-in-out infinite}
.ivTw{animation:ivTwK 2.4s ease-in-out infinite}.ivSpark{animation:ivSparkK .9s ease-out both}
.ivShake{animation:ivShakeK .9s ease-in-out both}.ivBub{animation:ivBubK .6s ease-in both}.ivWig{animation:ivWigK .5s ease-in-out infinite alternate}
.ivRing{animation:ivRingK 1.6s ease-out both;transform-origin:center}
.ivGray{opacity:1}.ivOn{animation:ivOnK .45s cubic-bezier(.2,1.7,.4,1) both}
.ivTrav{offset-rotate:0deg}
@keyframes ivIn{from{filter:brightness(2.6)}to{filter:none}}
@keyframes ivOut{to{opacity:0;transform:scale(1.05)}}
@keyframes ivNx{from{opacity:0;transform:translateY(10px)}}
@keyframes ivBar{from{width:0}to{width:100%}}
@keyframes ivPop{from{transform:scale(0);opacity:0}}
@keyframes ivFadeK{from{opacity:0}}
@keyframes ivRiseK{from{transform:translateY(26px);opacity:0}}
@keyframes ivDrawK{to{stroke-dashoffset:0}}
@keyframes ivSpinK{to{transform:rotate(360deg)}}
@keyframes ivPulseK{50%{transform:scale(1.07);opacity:.85}}
@keyframes ivTwK{50%{opacity:.25}}
@keyframes ivSparkK{0%{transform:scale(0) rotate(0)}50%{transform:scale(1.4) rotate(90deg)}100%{transform:scale(1) rotate(180deg);opacity:.0}}
@keyframes ivShakeK{0%,100%{transform:rotate(0)}15%{transform:rotate(-4deg)}35%{transform:rotate(4deg)}55%{transform:rotate(-3deg)}75%{transform:rotate(3deg)}}
@keyframes ivBubK{to{transform:scale(.02);opacity:0}}
@keyframes ivWigK{to{transform:translateY(3px)}}
@keyframes ivRingK{from{transform:scale(1);opacity:.9}to{transform:scale(5.2);opacity:0}}
@keyframes ivOnK{from{transform:scale(.4);opacity:0}}
@keyframes ivTrav{from{offset-distance:0%}to{offset-distance:100%}}
@keyframes ivWarp{0%{transform:scale(2.4);filter:blur(10px);opacity:0}18%{opacity:1;filter:blur(0)}70%{transform:scale(1)}100%{transform:scale(1.9)}}
@keyframes ivFl{0%,78%{opacity:0}100%{opacity:1}}
@keyframes ivUk{0%,40%{opacity:0;transform:translateY(8px)}60%,78%{opacity:1;transform:none}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.sgiv *{animation-duration:.01s!important;animation-delay:0s!important}.sgintro .hcv{animation:none}}

/* Live previews */
.pfl{display:block;flex:none;margin:10px 0 0;border-radius:20px;overflow:hidden;background:#0A2A24;box-shadow:0 10px 24px -12px rgba(11,47,38,.5);text-decoration:none;color:inherit}
.pfs{position:relative;display:block;height:0;padding-bottom:56.25%;overflow:hidden;background:linear-gradient(135deg,#0F3A31,#1A5C4B)}
.pfs.tall{background:radial-gradient(circle at 50% 45%,#1F6B58,#0A2A24)}
.pfs .pfi{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:pfKb 9s ease-in-out infinite alternate;animation-play-state:paused}
.pfs.tall .pfi{inset:10% auto 10% 50%;width:auto;height:80%;transform:translateX(-50%);border-radius:6px;box-shadow:0 14px 28px rgba(0,0,0,.45);animation:pfFloat 3.6s ease-in-out infinite;animation-play-state:paused}
.pfv{position:absolute;inset:0;width:100%;height:100%}
.pfc{display:flex;align-items:center;gap:10px;padding:11px 14px;background:#fff}
.pfc .pfx{flex:1;min-width:0}.pfc b{display:block;font:700 15px Figtree,sans-serif;color:#0B2F26}.pfc small{display:block;font:500 12.5px Figtree,sans-serif;color:#527B6D;margin-top:1px}
.pfc .pfg{font-weight:800;color:var(--green);font-size:18px}
.pfs *{animation-play-state:paused}.sgp2.on .pfs *,.sgp2.on .pfs .pfi{animation-play-state:running}
.pfScr{animation:pfScrK .9s linear infinite}.pfFlk{opacity:0;animation:pfFlkK 2.2s steps(1) infinite}
.pfPlay{transform-box:fill-box;transform-origin:center;animation:pfPlayK 5s ease-in-out infinite}
.pfProg{transform-box:fill-box;transform-origin:left;animation:pfProgK 5s linear infinite}
.pfCd{animation:pfCdK 5s linear infinite}
.pfDisc{transform-box:fill-box;transform-origin:center;animation:ivSpinK 3.2s linear infinite}
.pfEq{transform-box:fill-box;transform-origin:bottom;animation:pfEqK .7s ease-in-out infinite alternate}
.pfNote{opacity:0;animation:pfNoteK 3.3s ease-out infinite}
.pfDrift{animation:pfDriftK 6.5s linear infinite}.pfHit{animation:pfHitK 6.5s linear infinite}
.pfShot{transform-box:fill-box;transform-origin:center;opacity:0;animation:pfShotK 6.5s linear infinite}
.pfPts{opacity:0;animation:pfPtsK 6.5s linear infinite}.pfCmb{animation:pfPlayK 6.5s ease infinite}
.pfSheen{opacity:0;transform:translateX(-120px) skewX(-18deg);animation:pfSheenK 3.8s ease-in-out infinite}
.pfTile{transform-box:fill-box;transform-origin:center;animation:pfTileK 4.4s ease-in-out infinite}
@keyframes pfKb{from{transform:scale(1.02)}to{transform:scale(1.16) translate(-2%,-1.5%)}}
@keyframes pfFloat{50%{transform:translateX(-50%) translateY(-6px)}}
@keyframes pfScrK{to{transform:translateY(18px)}}
@keyframes pfFlkK{0%{opacity:0}20%{opacity:.07}30%{opacity:0}62%{opacity:.05}70%{opacity:0}}
@keyframes pfPlayK{0%,12%{opacity:1;transform:scale(1)}20%,88%{opacity:0;transform:scale(1.5)}100%{opacity:1;transform:scale(1)}}
@keyframes pfProgK{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes pfCdK{from{stroke-dashoffset:0}to{stroke-dashoffset:100}}
@keyframes pfEqK{from{transform:scaleY(.18)}to{transform:scaleY(1)}}
@keyframes pfNoteK{0%{opacity:0;transform:translate(0,10px)}15%{opacity:1}100%{opacity:0;transform:translate(10px,-90px)}}
@keyframes pfDriftK{from{transform:translateX(0)}to{transform:translateX(-470px)}}
@keyframes pfHitK{0%{transform:translateX(0) scale(1);opacity:1}38%{transform:translateX(-270px) scale(1);opacity:1}41%{transform:translateX(-276px) scale(1.25);opacity:1}46%{transform:translateX(-278px) scale(.1);opacity:0}100%{transform:translateX(-278px) scale(.1);opacity:0}}
@keyframes pfShotK{0%,37%{opacity:0;transform:scale(.6)}40%{opacity:1;transform:scale(1.2)}48%,100%{opacity:0;transform:scale(2)}}
@keyframes pfPtsK{0%,40%{opacity:0;transform:translateY(0)}46%{opacity:1}62%{opacity:0;transform:translateY(-24px)}100%{opacity:0}}
@keyframes pfSheenK{0%{opacity:0;transform:translateX(-120px) skewX(-18deg)}30%{opacity:.28}60%{opacity:0;transform:translateX(420px) skewX(-18deg)}100%{opacity:0}}
@keyframes pfTileK{0%,100%{transform:scale(1);opacity:.55}12%,28%{transform:scale(1.12);opacity:1}40%{transform:scale(1);opacity:.55}}
@media(prefers-reduced-motion:reduce){.pfs *,.pfs .pfi{animation:none!important}}

/* Who are you */
.whof{width:100%;display:flex;align-items:center;gap:10px;background:var(--bg);border:2px solid var(--line,#CFE6D8);border-radius:16px;padding:12px 14px;text-align:left;position:relative}
.whof i{position:absolute;left:14px;top:7px;font:600 11.5px Figtree,sans-serif;color:var(--green);font-style:normal}
.whof b{flex:1;font:600 17px/1.25 Figtree,sans-serif;color:#7A978B;padding-top:12px}.whof.set b{color:#0B2F26}
.whof svg{width:22px;height:22px;color:var(--green);flex:none}
.whogrid{display:grid;grid-template-columns:1fr 1fr;gap:13px;max-height:68dvh;overflow-y:auto;padding:3px 2px 8px}
.whot{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left;padding:8px 8px 13px;border-radius:21px;background:#fff;border:2px solid #DCEBE2;box-shadow:0 8px 18px -14px rgba(11,47,38,.4);transition:transform .15s,border-color .15s}
.whot:active{transform:scale(.97)}.whot.on{border-color:var(--green);background:#EAF7F0}
.whoart{display:block;width:100%;aspect-ratio:1.618;border-radius:14px;background:radial-gradient(120% 100% at 50% 30%,#16584A,#0A2A24);overflow:hidden;margin-bottom:8px}.whoart svg{display:block;width:100%;height:100%}
.whot b{font:700 16px/1.2 Figtree,sans-serif;color:#0B2F26;padding:0 5px}.whot>span:last-child{font:500 13px/1.3 Figtree,sans-serif;color:#527B6D;padding:0 5px}
.still .ivA,.still .ivDraw,.still .ivPulse{animation:none!important}.still .ivDraw{stroke-dashoffset:0}
.whohero{margin:6px -4px 10px;border-radius:26px;background:radial-gradient(120% 100% at 50% 30%,#16584A,#0A2A24);overflow:hidden}.whoic{display:block;width:100%;height:auto;max-height:26dvh}
.whobody{padding:0 2px}.whotag{font:700 13.5px Figtree,sans-serif;color:var(--green);margin:0}
.whoh{font-size:25px;line-height:1.18;margin:0;color:#0B2F26}
.whobl{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}.whobl li{position:relative;padding-left:22px;font:600 16px/1.4 Figtree,sans-serif;color:#0B2F26}.whobl li:before{content:"";position:absolute;left:2px;top:7px;width:9px;height:9px;border-radius:50%;background:#FFB52E}

/* perf */
.sgp2{contain:layout style}.sgst{contain:layout paint}
.sgm{filter:none!important}.sgst .sgm{stroke-width:3.5}

.btn.wait{opacity:0;pointer-events:none}.stk .btn{transition:opacity .5s}
.whof b{color:#3E5E50}.whof.set b{color:#0B2F26}
.nav{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(243,247,242,.98)!important}
.glass{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;background:rgba(255,255,255,.82)!important}
body{touch-action:manipulation}

/* seen interludes are passed over, never stopped on */
.sgp2.sk{scroll-snap-align:none;scroll-snap-stop:normal}
/* safe centring: if a card is taller than its box it grows from the top, so the tag is never cut */
.sgcard{justify-content:flex-start!important}.sgcard>:first-child{margin-top:auto!important}.sgcard>:last-child{margin-bottom:auto!important}
.sgcard.cm2{padding-top:14px!important;padding-bottom:14px!important}.sgcard.cm2 p,.sgcard.cm2 .bl li{font-size:14.5px;line-height:1.3}.sgcard.cm2 .sgq{font-size:19px!important}.sgcard.cm2 .pfs{padding-bottom:44%}.sgcard.cm2 .pfx small{display:none}.sgcard.cm2 .sgk{margin-bottom:6px!important}
.tiles.mini span{display:block;flex:none}

/* bridge: the beat between the welcome and the journey */
.brg{position:fixed;inset:0;z-index:5;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 24px) 26px calc(env(safe-area-inset-bottom) + 24px);background:radial-gradient(120% 80% at 70% 10%,#1B3F5E,#0A1D33 55%,#07121F);color:#fff;overflow:hidden}
.brgs{display:block;width:100%;height:auto;max-height:36dvh;margin-top:6dvh}
.brgt{opacity:0;animation:brgTw 2.4s ease-in-out infinite alternate}@keyframes brgTw{from{opacity:.15}to{opacity:.9}}
.brgp{stroke-dasharray:100;stroke-dashoffset:100;animation:brgD 2.6s cubic-bezier(.5,0,.2,1) .2s forwards}@keyframes brgD{to{stroke-dashoffset:0}}
.brgf{opacity:0;animation:brgF .5s ease 2.8s forwards}@keyframes brgF{to{opacity:1}}
.brgx{margin:auto 0;padding-top:4dvh}
.brgx p{margin:0;opacity:0;transform:translateY(10px);animation:brgL .8s cubic-bezier(.2,.8,.2,1) forwards}
.brgx .b1{font:600 19px/1.3 Figtree,sans-serif;color:#9FD8BE;animation-delay:.5s}
.brgx .b2{font:500 22px/1.35 Figtree,sans-serif;color:#E8F1F6;margin-top:14px;max-width:15em;animation-delay:1.7s}
.brgx .b3{font-size:40px;line-height:1.05;color:#FFB52E;margin-top:8px;letter-spacing:-.02em;animation-delay:3s}
@keyframes brgL{to{opacity:1;transform:none}}
.brgb{opacity:0;animation:brgL .6s ease 3.9s forwards}
@media(prefers-reduced-motion:reduce){.brgp{animation:none;stroke-dashoffset:0}.brgx p,.brgb,.brgf{animation:none;opacity:1;transform:none}}

/* interlude atmosphere: light, rays, shockwave, rising sparks, a bolder title */
.sgiv .iv-rays{position:absolute;left:50%;top:44%;width:190vmax;height:190vmax;margin:-95vmax 0 0 -95vmax;background:repeating-conic-gradient(rgba(255,255,255,.075) 0 7deg,transparent 7deg 22deg);-webkit-mask-image:radial-gradient(circle,#000 0,transparent 38%);mask-image:radial-gradient(circle,#000 0,transparent 38%);animation:ivSpinK 38s linear infinite;pointer-events:none}
.sgiv .iv-halo{position:absolute;left:50%;top:44%;width:92vw;height:92vw;max-width:520px;max-height:520px;margin:calc(min(46vw,260px)*-1) 0 0 calc(min(46vw,260px)*-1);border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--ac) 42%,transparent) 0,transparent 66%);animation:ivHalo 2.8s ease-in-out infinite;pointer-events:none}
@keyframes ivHalo{50%{transform:scale(1.14);opacity:.75}}
.sgiv .iv-wave{position:absolute;left:50%;top:44%;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;border:3px solid var(--ac);opacity:0;animation:ivWv .95s cubic-bezier(.2,.7,.3,1) both;pointer-events:none}.sgiv .iv-wave.w2{animation-delay:.18s;border-width:2px}
@keyframes ivWv{0%{transform:scale(.2);opacity:.9}100%{transform:scale(7);opacity:0}}
.sgiv .iv-sp{position:absolute;bottom:-12px;width:var(--sz);height:var(--sz);border-radius:50%;background:var(--ac);opacity:0;animation:ivUp 4s ease-in infinite;pointer-events:none}
@keyframes ivUp{0%{transform:translateY(0);opacity:0}15%{opacity:.85}100%{transform:translateY(-92dvh);opacity:0}}
.sgiv svg.ivs{position:relative;width:min(112%,470px);max-height:68%;margin-top:-8%}
.iv-nx{animation-delay:1.5s!important;bottom:calc(8% + env(safe-area-inset-bottom))}
.iv-nx span{display:inline-block;background:var(--ac);color:#0A2A24;opacity:1;font:800 12px Figtree,sans-serif;padding:4px 12px;border-radius:99px;margin-bottom:10px}
.iv-nx b{font-size:clamp(26px,8vw,34px);line-height:1.12;text-wrap:balance}

/* Word Swap */
.swh{margin-top:12px;background:linear-gradient(135deg,#E6F6EE,#CDEBDD);border-color:#9ED3B8;box-shadow:0 10px 24px -14px rgba(24,110,78,.55)}.swh b{color:#0B2F26}.swh span{color:#2F6B55}.swh s{opacity:.75}.swh em{font-style:normal;font-weight:800;color:#0B2F26}
.swic{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:#fff;color:#2F9A74;flex:none}.swic svg{width:24px;height:24px}
.swhero{background:linear-gradient(160deg,#0F3F35,#0A2A24);color:#fff;border-radius:26px;padding:20px 20px 16px;margin:6px 0 14px}
.swk{font:700 25px/1.12 Fraunces,serif;margin:0 0 12px;color:#FFD27A}.swhero ul{list-style:none;margin:0 0 12px;padding:0;display:flex;flex-direction:column;gap:7px}.swhero li{font:600 16px/1.35 Figtree,sans-serif;padding-left:20px;position:relative}.swhero li:before{content:"";position:absolute;left:2px;top:.55em;width:8px;height:8px;border-radius:50%;background:#7BE0B0}
.swt2{font:500 14px/1.4 Figtree,sans-serif;color:#BFE8D2;margin:0}.swt2 b{color:#fff}
.swtabs{display:flex;gap:6px;background:#E3EFE8;border-radius:16px;padding:4px;margin-bottom:14px}.swtabs button{flex:1;padding:10px 4px;border-radius:12px;font:700 14.5px Figtree,sans-serif;color:#527B6D}.swtabs button.on{background:#fff;color:#0B2F26;box-shadow:0 3px 8px -4px rgba(11,47,38,.35)}
.swchips{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:10px;scrollbar-width:none}.swchips::-webkit-scrollbar{display:none}.swchips button{flex:none;padding:8px 14px;border-radius:99px;background:#fff;border:2px solid #CFE6D8;font:700 13.5px Figtree,sans-serif;color:#2F6B55}.swchips button.on{background:#0B2F26;border-color:#0B2F26;color:#fff}
.swgrid{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.swt{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;aspect-ratio:1.618;padding:10px 14px;border-radius:21px;background:#fff;border:2px solid #DCEBE2;box-shadow:0 8px 18px -14px rgba(11,47,38,.45);text-align:left}.swt:active{transform:scale(.97)}
.swt s{font:600 15px Figtree,sans-serif;color:#8AA89B;text-decoration-color:#FF7A6A;text-decoration-thickness:2px}.swt i{font-style:normal;color:#2F9A74;font-weight:800;line-height:1}.swt b{font:800 19px/1.1 Fraunces,serif;color:#0B2F26}
.swgp{font:700 12.5px Figtree,sans-serif;color:var(--green);margin:0 0 8px}.swpair{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px}.swpair s{font:600 22px Figtree,sans-serif;color:#8AA89B;text-decoration-color:#FF7A6A;text-decoration-thickness:2.5px}.swpair i{font-style:normal;color:#2F9A74;font-size:22px}.swpair b{font:800 30px/1 Fraunces,serif;color:#0B2F26}
.swex p{margin:0 0 8px;padding:11px 14px;border-radius:16px;font:600 16.5px/1.35 Figtree,sans-serif}.swex span{display:block;font:700 11.5px Figtree,sans-serif;margin-bottom:2px;opacity:.7}.swex .no{background:#FFEDE9;color:#7A3A2E}.swex .no mark{background:none;color:#C4452F;text-decoration:line-through;font-weight:800}.swex .yes{background:#E4F6EC;color:#0B4A38}
.swwhy{font:500 16px/1.45 Figtree,sans-serif;color:#33594B;margin:10px 2px 14px}
.swdr .swq{font:700 24px/1.2 Fraunces,serif;color:#0B2F26;margin:4px 0 0}.swdr mark,.swq mark{background:none;color:#C4452F;text-decoration:line-through}
.swo{display:grid;gap:10px}.swo button{padding:14px 16px;border-radius:18px;background:#fff;border:2px solid #CFE6D8;font:700 17px Figtree,sans-serif;color:#0B2F26;text-align:left}.swo button.ok{background:#E4F6EC;border-color:#2F9A74}.swo button.bad{background:#FFEDE9;border-color:#FF7A6A}
.swfb{margin:14px 2px 0;font:500 16px/1.45 Figtree,sans-serif;color:#33594B}
.swres{text-align:center;padding:22px 0}.swres b{font:800 44px Fraunces,serif;color:#0B2F26}.swres p{color:#527B6D;margin:6px 0 16px}
.swlist{display:flex;flex-direction:column;gap:10px;margin-top:14px}.swli{display:flex;align-items:center;gap:10px;background:#fff;border-radius:18px;padding:10px 10px 10px 16px;border:2px solid #DCEBE2}.swli>div{flex:1;display:flex;align-items:center;gap:8px;flex-wrap:wrap}.swli s{font:600 15px Figtree,sans-serif;color:#8AA89B;text-decoration-color:#FF7A6A;text-decoration-thickness:2px}.swli i{font-style:normal;color:#2F9A74}.swli b{font:800 18px Fraunces,serif;color:#0B2F26}
.swsay{padding:8px 12px;border-radius:99px;background:#E4F6EC;color:#0B4A38;font:700 13px Figtree,sans-serif}.swdel{width:32px;height:32px;border-radius:50%;color:#8AA89B;font-size:20px}

/* Home: compact pair so the universe keeps its room and never meets the text */
.home .pair{display:grid;grid-template-columns:1fr 1fr;gap:10px;flex:none}
.home .pair .jcard{margin:0;padding:8px 10px 8px 8px;gap:9px;border-radius:20px;min-width:0;border-width:2px}
.home .pair .jph{width:40px;height:40px;flex:none}.home .pair .swic{width:40px;height:40px}.home .pair .swic svg{width:21px;height:21px}
.home .pair .jcard b{font-size:15px;line-height:1.1}
.home .pair .jcard span:not(.jph):not(.swic){display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:12px;line-height:1.25;margin-top:2px}
.home .pair .jcard i{display:none}
.home .pair .jcard>div{min-width:0}

.home .bot{display:grid;grid-template-columns:1.1fr 1fr;gap:10px;flex:none}
.home .bot .jcard{margin:0;padding:8px 10px 8px 8px;gap:9px;border-radius:20px;min-width:0;border-width:2px;min-height:62px}
.home .bot .jph{width:42px;height:42px;flex:none}
.home .bot .jcard b{font-size:15px;line-height:1.1}
.home .bot .jcard span:not(.jph){display:block;font-size:12px;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home .bot .jcard i{display:none}.home .bot .jcard>div{min-width:0}
.home .bot .strk{min-height:62px;align-content:center;padding:8px 12px;gap:4px;min-width:0}
.home .bot .strk b{font-size:15px}
.home .bot .trk{margin:0}.home .bot .trk i{width:22px;height:22px}.home .bot .trk i svg{width:18px;height:18px}
.swi{position:fixed;inset:0;z-index:60;background:rgba(11,47,38,.55);display:grid;place-items:center;padding:20px 0;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.swic2{width:min(440px,100%);display:grid;gap:14px;justify-items:center}
.swit{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;width:100%;scrollbar-width:none}.swit::-webkit-scrollbar{display:none}
.swit section{flex:none;width:calc(100% - 40px);margin:0 20px;scroll-snap-align:center;background:var(--bg);border-radius:28px;padding:22px 20px;max-height:70dvh;overflow:auto;box-sizing:border-box}
.swit section .btn{margin-top:14px}
.swdots{display:flex;gap:6px}.swdots i{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.4)}.swdots i.on{background:#fff}
.swx{color:#fff;font:600 14px Figtree,sans-serif;background:none;border:0;padding:8px 14px}
.shq{background:#fff;border-radius:18px;padding:14px 16px;margin-bottom:14px;font:500 16px/1.4 Fraunces,serif;color:var(--ink);box-shadow:0 8px 20px -16px rgba(11,47,38,.5)}

.pfs.gm{background:#2a1a3d}.pfs.gm .pfi{object-fit:contain;animation:none}
.sgskip{position:absolute;right:14px;top:calc(env(safe-area-inset-top) + 14px);z-index:5;height:32px;padding:0 16px;border-radius:99px;background:rgba(255,255,255,.18);color:#fff;font:700 13px Figtree,sans-serif;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
body:has(.saga2) #lgo{display:none}
.rwlead{margin:0 0 12px;font:500 15px/1.4 Fraunces,serif;color:var(--ink)}
.rwst{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:14px}
.rwst button{display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 6px;border-radius:16px;background:#fff;font:700 14px Figtree,sans-serif;color:var(--mut);box-shadow:0 6px 14px -12px rgba(11,47,38,.5)}
.rwst button em{font-style:normal;width:20px;height:20px;border-radius:50%;background:#E3EEE7;display:grid;place-items:center;font-size:12px}
.rwst button.on{background:var(--sun);color:var(--ink)}.rwst button.on em{background:#fff}
.rwl{display:grid;gap:12px}
.rwc{background:#fff;border-radius:22px;padding:16px;box-shadow:0 8px 20px -16px rgba(11,47,38,.5)}
.rwc s{display:block;font:600 16px Figtree,sans-serif;color:#8AA89B;text-decoration-color:#FF7A6A;text-decoration-thickness:2px}
.rwc b{display:block;font:700 20px/1.2 Fraunces,serif;color:var(--ink);margin:6px 0}
.rwc p{margin:0 0 12px;font-size:14px;color:var(--mut)}
.sgskip{background:rgba(11,47,38,.1)!important;color:var(--ink)!important}
.swgrid{align-items:stretch;margin-bottom:22px}.swt{aspect-ratio:auto!important;min-height:112px;height:auto;padding:14px}
.swgrid+.small,#app>.small:last-child{position:static;clear:both;margin:0 0 24px}

html,body{max-width:100%;overflow-x:clip}
.home .hello{min-width:0}
.home .hello h1{flex:1 1 auto;min-width:0;overflow:hidden}
.home .hello h1 .nm{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:inherit}
.home .hello .hr{flex:none}
.sheet>div,.sheet .field{max-width:100%;min-width:0}.sheet textarea,.sheet input{width:100%;max-width:100%}
.home .hello h1{flex-direction:column!important;align-items:flex-start!important;gap:0!important;line-height:1.05}
.home .hello h1 span{font-size:14px!important;line-height:1.1}
.home .hello h1 .nm{max-width:100%}
.home{height:calc(100dvh - 114px)}
.home .bot{grid-template-columns:1.15fr 1fr}
.home .bot .jcard b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.home .bot .jcard span:not(.jph){display:none}
.home .bot .jph{width:38px;height:38px}
.home .bot .strk b{font-size:14px;white-space:nowrap}
.home .bot .jcard,.home .bot .strk{min-height:58px}
.home .bot .jcard b{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.1}
@media(max-width:340px){.home .bot .strk b{font-size:12.5px}.home .bot{grid-template-columns:1.1fr 1fr}}

/* 3D concept cards */
.k3{display:grid;grid-template-columns:1fr 1fr;gap:14px 14px;margin:18px 0;width:100%;perspective:700px}
.k3c{--e:#BFD9CB;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;height:clamp(78px,13dvh,112px);border-radius:24px;background:linear-gradient(160deg,#fff 0%,var(--bg1) 100%);border:2px solid #fff;box-shadow:0 6px 0 var(--e),0 18px 26px -12px rgba(11,47,38,.45),inset 0 2px 0 rgba(255,255,255,.9);transform:rotateX(8deg) rotateY(var(--ry,0deg));transform-origin:50% 100%;animation:k3in .7s cubic-bezier(.2,1.3,.4,1) both;animation-delay:var(--d,0ms)}
.k3c:nth-child(odd){--ry:-5deg}.k3c:nth-child(even){--ry:5deg}
.k3c svg{width:34px;height:34px;fill:none;stroke:var(--ic);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 3px 0 rgba(255,255,255,.8))}
.k3c b{font:700 18px Fraunces,serif;color:var(--ink);letter-spacing:.2px}
.k3c.t1{--bg1:#FFE0D6;--e:#F2B8A6;--ic:#D4583C}.k3c.t2{--bg1:#E8DEFC;--e:#C6B5EE;--ic:#6F4FC8}.k3c.t3{--bg1:#D3EEDF;--e:#A6D3BB;--ic:#1F8A62}.k3c.t4{--bg1:#D6E9FB;--e:#A9CBEC;--ic:#2F78C4}
@keyframes k3in{from{opacity:0;transform:translateY(24px) rotateX(40deg) scale(.85)}to{opacity:1}}
@media(prefers-reduced-motion:reduce){.k3c{animation:none}}
.sp1 .k3{margin:20px 0}
/* keyboard open: keep the headline visible */
body.kb.onb #app .stp,body.kb.onb #app .small,body.kb.onb #app .mut{display:none!important}
body.kb.onb #app h1{font-size:22px!important;line-height:1.15!important;margin:4px 0 8px!important}
body.kb.onb #app.ob>*{margin-top:6px!important}
body.kb.onb #app .card{padding:12px!important}
body.kb.onb #app .field{margin-bottom:10px!important}
body.kb.onb #app.full.ob{min-height:0;justify-content:flex-start;padding-top:8px}

/* 3D chips, calm version */
.k3{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 9px;margin:14px 0 0;width:100%;perspective:none}
.k3c{display:inline-block;height:auto;flex:none;padding:9px 17px 10px;border-radius:99px;font:600 15.5px/1 Figtree,system-ui,sans-serif;color:var(--ink);letter-spacing:.1px;background:linear-gradient(180deg,#fff 0%,var(--bg1) 100%);border:1px solid rgba(255,255,255,.95);box-shadow:0 3px 0 var(--e),0 8px 12px -6px rgba(11,47,38,.28),inset 0 1px 0 #fff;transform:none;animation:k3in .5s ease both;animation-delay:var(--d,0ms)}
.k3c.t1{--bg1:#FFEDE6;--e:#F3C9BB}.k3c.t2{--bg1:#EEE8FC;--e:#D3C8F0}.k3c.t3{--bg1:#E1F3E9;--e:#B5DAC6}.k3c.t4{--bg1:#E1EFFC;--e:#B9D4EE}
.k3c:nth-child(n){--ry:0}
@keyframes k3in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.sp1 .k3{margin:16px 0 0}
.stk .sdots{display:flex;flex-wrap:nowrap;justify-content:center;max-width:none;gap:8px;margin:0 0 16px}
.stk .sdots i{display:block;width:9px;height:9px;border-radius:50%;background:var(--mint)}.stk .sdots i.on{background:var(--ink)}
.k3{gap:8px 7px}.k3c{padding:9px 13px 10px;font-size:14.5px}
.k3{flex-wrap:nowrap;gap:6px}.k3c{padding:8px 11px 9px;font-size:14px;white-space:nowrap}
@media(min-width:400px){.k3{gap:8px}.k3c{padding:9px 15px 10px;font-size:15px}}
.sp1:not([style*="center"]) .k3{justify-content:flex-start;margin-top:22px}