/* Liquid glass, shared by every page. Dark is the default; light applies with html[data-theme="light"]. */
:root{--gl-tint:hsl(145 67% 14%/.58);--gl-line:rgba(255,255,255,.22);--gl-hi:rgba(255,255,255,.16);--gl-blur:blur(30px) brightness(.72) saturate(1.3);--gl-in:rgba(0,0,0,.28);--gl-sh:0 14px 40px -18px rgba(0,0,0,.65)}
html[data-theme="light"]{--gl-tint:hsl(145 45% 98%/.62);--gl-line:rgba(13,90,59,.20);--gl-hi:rgba(255,255,255,.85);--gl-blur:blur(24px) brightness(1.06) saturate(1.5);--gl-in:rgba(255,255,255,.6);--gl-sh:0 14px 40px -22px rgba(13,90,59,.38)}
body{background-image:radial-gradient(60% 40% at 15% 0%,rgba(47,168,116,.30),transparent 70%),radial-gradient(50% 40% at 100% 30%,rgba(111,211,255,.16),transparent 70%),radial-gradient(60% 40% at 0% 85%,rgba(47,168,116,.22),transparent 70%);background-attachment:fixed}
html[data-theme="light"] body{background-image:radial-gradient(60% 40% at 15% 0%,rgba(123,227,174,.55),transparent 70%),radial-gradient(50% 40% at 100% 30%,rgba(138,219,255,.40),transparent 70%),radial-gradient(60% 40% at 0% 85%,rgba(123,227,174,.40),transparent 70%)}
.finder,.plan,.vc,.tile,.shotf,.cbox,.bcard,.mcard,.pc,.tc,.wcard,.tcta,.mvb,.rc,.faq details,.bfaq details{background:var(--gl-tint)!important;-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border:1px solid var(--gl-line)!important;box-shadow:inset 0 1px 0 var(--gl-hi),var(--gl-sh)!important}
.top{background:var(--gl-tint)!important;-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border-bottom:1px solid var(--gl-line)!important;box-shadow:inset 0 -1px 0 var(--gl-hi)}
.opt,.tab,.bub,.pill3 div,.btl,.pnav a,.bq li a,.brel a,.tch button{background:var(--gl-in)!important;border:1px solid var(--gl-line)!important;box-shadow:inset 0 1px 0 var(--gl-hi)!important}
.opt.on,.tab.on,.tab[aria-selected="true"]{background:var(--sun)!important;color:#06140D!important}
.cform input,.cform select,.cform textarea{background:var(--gl-in)!important;border:1px solid var(--gl-line)!important}
.finder .say{background:var(--gl-in)!important;border:1px solid var(--gl-line)!important}
@media (prefers-reduced-transparency:reduce){.finder,.plan,.vc,.tile,.shotf,.cbox,.bcard,.mcard,.pc,.tc,.wcard,.tcta,.mvb,.rc,.faq details,.bfaq details,.top{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--sf)!important}}

/* ---- Light mode refinements: calmer color, no hard shadows, light footer ---- */
html[data-theme="light"] .fbanner{background:linear-gradient(135deg,hsl(200 80% 96%/.78),hsl(150 55% 95%/.78))!important;-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border:1px solid var(--gl-line)!important;color:#0B2A1C;box-shadow:inset 0 1px 0 var(--gl-hi),var(--gl-sh)}
html[data-theme="light"] .fbanner p{color:#1D3B2C}
html[data-theme="light"] .fbanner .fb{background:#0D5A3B;color:#fff}
html[data-theme="light"] .letter,html[data-theme="light"] .mbox,html[data-theme="light"] .betanote,html[data-theme="light"] .plan.pro,html[data-theme="light"] .vbox{background:var(--gl-tint)!important;-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border:1px solid var(--gl-line)!important;box-shadow:inset 0 1px 0 var(--gl-hi),var(--gl-sh)!important;color:#0B2A1C}
html[data-theme="light"] .letter p,html[data-theme="light"] .betanote p{color:#2F4A3B}
html[data-theme="light"] .letter h2,html[data-theme="light"] .letter h3,html[data-theme="light"] .betanote h3{color:#0B2A1C}
html[data-theme="light"] .cvis .cph,html[data-theme="light"] .mshots img,html[data-theme="light"] .glance .shotf,html[data-theme="light"] .sticker{box-shadow:0 10px 26px -14px rgba(13,90,59,.4)!important;border:1px solid var(--gl-line)}
html[data-theme="light"] .btn,html[data-theme="light"] .btn.sm{box-shadow:0 8px 22px -12px rgba(13,90,59,.55)}
/* footer: light glass with the dark logo */
html[data-theme="light"] footer{background:hsl(145 45% 97%/.7)!important;-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);color:#2F4A3B;border-top:1px solid var(--gl-line);box-shadow:inset 0 1px 0 var(--gl-hi)}
html[data-theme="light"] footer h4{color:#0B2A1C}
html[data-theme="light"] footer a{color:#2F4A3B}
html[data-theme="light"] footer a:hover{color:#0D5A3B}
html[data-theme="light"] footer .fine{border-top-color:var(--gl-line)}

/* ===================== Glass v2: the app's Crystal Clear language, site-wide ===================== */
:root{--gl-tint:rgba(255,255,255,.065);--gl-pane:rgba(255,255,255,.045);--gl-line:rgba(255,255,255,.22);--gl-hi:rgba(255,255,255,.22);--gl-blur:blur(38px) saturate(1.2) brightness(.95);--gl-in:rgba(255,255,255,.07);--gl-sh:0 26px 60px -28px rgba(0,0,0,.7);--gl-r:22px;--gl-ink:var(--tx)}
html[data-theme="light"]{--gl-tint:rgba(255,255,255,.52);--gl-pane:rgba(255,255,255,.34);--gl-line:rgba(255,255,255,.92);--gl-hi:rgba(255,255,255,.95);--gl-blur:blur(36px) saturate(1.05) brightness(1.08);--gl-in:rgba(255,255,255,.55);--gl-sh:0 24px 50px -28px rgba(16,60,40,.38)}
/* backdrop: soft green fields, same family as the app */
html{background:#06100B}
body{background-color:#06100B!important;background-image:radial-gradient(60vw 55vh at 12% 0%,rgba(63,191,133,.30),transparent 70%),radial-gradient(50vw 55vh at 100% 28%,rgba(111,211,255,.14),transparent 70%),radial-gradient(60vw 50vh at 0% 88%,rgba(31,138,91,.30),transparent 70%),radial-gradient(50vw 40vh at 90% 100%,rgba(31,138,91,.22),transparent 70%)!important;background-attachment:fixed}
html[data-theme="light"],html[data-theme="light"] body{background-color:#DCE9E1!important}
html[data-theme="light"] body{background-image:radial-gradient(60vw 55vh at 12% 0%,rgba(150,214,181,.50),transparent 70%),radial-gradient(50vw 55vh at 100% 28%,rgba(170,214,226,.38),transparent 70%),radial-gradient(60vw 50vh at 0% 88%,rgba(150,214,181,.40),transparent 70%),radial-gradient(50vw 40vh at 90% 100%,rgba(190,225,205,.5),transparent 70%)!important}
/* cards: clear frosted glass, bright edge */
.finder,.plan,.vc,.tile,.shotf,.cbox,.bcard,.mcard,.pc,.tc,.wcard,.tcta,.mvb,.rc,.faq details,.bfaq details,.letter,.mbox,.betanote,.vbox{background:var(--gl-tint)!important;-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border:1px solid var(--gl-line)!important;border-radius:var(--gl-r)!important;box-shadow:var(--gl-sh),inset 1px 1px 1px -0px var(--gl-hi),inset 0 0 22px rgba(255,255,255,.05)!important;color:var(--tx)}
html[data-theme="light"] .finder,html[data-theme="light"] .plan,html[data-theme="light"] .vc,html[data-theme="light"] .tile,html[data-theme="light"] .shotf,html[data-theme="light"] .cbox,html[data-theme="light"] .bcard,html[data-theme="light"] .mcard,html[data-theme="light"] .pc,html[data-theme="light"] .tc,html[data-theme="light"] .wcard,html[data-theme="light"] .tcta,html[data-theme="light"] .mvb,html[data-theme="light"] .rc,html[data-theme="light"] .faq details,html[data-theme="light"] .bfaq details{color:#0C2218}
.shotf{border-radius:26px!important;padding:0;overflow:hidden}
.shotf .bar{background:rgba(255,255,255,.07)!important;border-bottom:1px solid var(--gl-line)!important;height:30px}
html[data-theme="light"] .shotf .bar{background:rgba(255,255,255,.5)!important}
.shotf .bar i{border:0!important;width:10px;height:10px;background:rgba(255,255,255,.35)!important}
html[data-theme="light"] .shotf .bar i{background:rgba(12,34,24,.22)!important}
.tile{padding:22px}
.tile .ti{border-radius:14px!important;background:rgba(255,255,255,.08)!important;border:1px solid var(--gl-line)!important}
html[data-theme="light"] .tile .ti{background:rgba(255,255,255,.7)!important;color:#0C5A38}
/* nav: a floating glass bar */
.top{position:sticky;top:10px;width:min(1240px,calc(100% - 24px));margin:10px auto 0;border-radius:24px;border:1px solid var(--gl-line)!important;border-bottom:1px solid var(--gl-line)!important;box-shadow:var(--gl-sh),inset 1px 1px 1px -0px var(--gl-hi)!important}
.top .wrap{height:60px}
/* controls: glass pills; the one primary action stays solid brand green */
.btn{border:1px solid rgba(255,255,255,.28)!important;box-shadow:0 10px 26px -12px rgba(31,138,91,.7),inset 0 1px 0 rgba(255,255,255,.35)!important}
.btn.ghost,.btn.sm:not(.hot){background:var(--gl-in)!important;color:var(--tx)!important;border-color:var(--gl-line)!important;box-shadow:inset 0 1px 0 var(--gl-hi)!important}
html[data-theme="light"] .btn.ghost,html[data-theme="light"] .btn.sm:not(.hot){color:#0C2218!important}
.opt,.tab,.bub,.pill3 div,.btl,.pnav a,.bq li a,.brel a,.tch button{background:var(--gl-in)!important;border:1px solid var(--gl-line)!important;border-radius:999px;box-shadow:inset 0 1px 0 var(--gl-hi)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.bub{border-radius:18px}
.tab.on,.tab[aria-selected="true"]{background:#fff!important;color:#0C2218!important;border-color:#fff!important}
/* section labels: sentence case, readable */
.k{text-transform:none;letter-spacing:0;font-size:14px;font-weight:700;padding:5px 14px;background:var(--gl-in)!important;color:var(--g2)!important;border:1px solid var(--gl-line)}
html[data-theme="light"] .k{color:#0C5A38!important}
/* index sections sit in large frosted windows, like the app's main panel */
.hero~section{padding:36px 0}
.hero~section>.wrap{background:var(--gl-pane);-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border:1px solid var(--gl-line);border-radius:38px;box-shadow:var(--gl-sh),inset 1px 1px 1px -0px var(--gl-hi);padding:56px 40px;max-width:1240px;width:calc(100% - 32px)}
.hero~section.gb{background:none!important;border:0!important}
.hero~section.gb h2,.hero~section.gb .sub{color:var(--tx)}
@media(max-width:700px){.hero~section>.wrap{padding:36px 16px;border-radius:28px;width:calc(100% - 16px)}.top{width:calc(100% - 12px);border-radius:20px}}
html[data-theme="light"] .hero~section>.wrap{color:#0C2218}
html[data-theme="light"] h1,html[data-theme="light"] h2,html[data-theme="light"] h3{color:#0C2218}
html[data-theme="light"] .sub,html[data-theme="light"] .cap{color:#2A3D32}
html[data-theme="light"] .tile span,html[data-theme="light"] .faq details p{color:#2A3D32}
footer{border-radius:38px 38px 0 0;margin-top:36px}
html[data-theme="dark"] footer,html:not([data-theme="light"]) footer{background:rgba(255,255,255,.05)!important;-webkit-backdrop-filter:var(--gl-blur);backdrop-filter:var(--gl-blur);border-top:1px solid var(--gl-line)}
@media (prefers-reduced-transparency:reduce){.hero~section>.wrap{-webkit-backdrop-filter:none;backdrop-filter:none;background:var(--sf)}}

/* card texture: soft sheen plus the app's fine eggshell grain */
:root{--grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .55  0 0 0 0 .6  0 0 0 0 .56  0 0 0 .9 0'/></filter><rect width='180' height='180' filter='url(%23g)' opacity='.24'/></svg>");--gl-sheen:radial-gradient(120% 70% at 8% 0%,rgba(255,255,255,.12),rgba(255,255,255,0) 58%),linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,0) 50%)}
html[data-theme="light"]{--gl-sheen:radial-gradient(120% 70% at 8% 0%,rgba(255,255,255,.55),rgba(255,255,255,0) 58%),linear-gradient(160deg,rgba(255,255,255,.3),rgba(255,255,255,0) 50%)}
.finder,.plan,.vc,.tile,.shotf,.cbox,.bcard,.mcard,.pc,.tc,.wcard,.tcta,.mvb,.rc,.faq details,.bfaq details,.letter,.mbox,.betanote,.vbox,.hero~section>.wrap,.top{background-image:var(--gl-sheen),var(--grain)!important;background-size:100% 100%,100% 100%,180px 180px!important;background-repeat:no-repeat,no-repeat,repeat!important}
/* readable ink inside cards */
html[data-theme="light"] :is(.tile,.plan,.vc,.shotf,.cbox,.bcard,.mcard,.pc,.tc,.wcard,.rc,.faq details,.finder) :is(p,span,li,small,figcaption,summary,div){color:#173326}
html[data-theme="light"] :is(.tile,.plan,.vc,.faq details,.finder) :is(b,strong,h3,h4,summary){color:#0A1C13}
html:not([data-theme="light"]) :is(.tile,.plan,.vc,.cbox,.faq details,.finder) :is(p,span,li,small,div){color:#DCEFE4}
html:not([data-theme="light"]) :is(.tile,.plan,.vc,.faq details,.finder) :is(b,strong,h3,h4,summary){color:#fff}
/* tuning: greener dark glass, readable highlight, full last row */
:root{--gl-tint:rgba(63,191,133,.085);--gl-pane:rgba(63,191,133,.05)}
html[data-theme="light"]{--gl-tint:rgba(255,255,255,.52);--gl-pane:rgba(255,255,255,.34)}
html[data-theme="light"] .gb h2 mark,html[data-theme="light"] h2 mark{color:#0C2218!important;background:linear-gradient(transparent 62%,rgba(95,211,156,.65) 62%)!important}
@media(min-width:1000px){.tiles>.tile:last-child:nth-child(7){grid-column:span 2}}
.pricesec,.whysec,.glance,.smallop,#faq{background:none!important}
html[data-theme="light"] .fbanner,html[data-theme="light"] .fbanner p{color:#0C2218}

/* ===== taste-skill pass: readability and structure (glass kept on purpose) ===== */
/* hero headline: two lines on desktop, wider text column */
.hero .wrap{grid-template-columns:1.3fr 1fr}
.hero h1{font-size:clamp(32px,4.1vw,56px);line-height:1.02;letter-spacing:-.035em}
@media(max-width:700px){.hero h1{font-size:32px}.sech h2{font-size:32px;line-height:1.1}}
@media(max-width:1000px){.hero .wrap{grid-template-columns:1fr}}
/* kickers removed; small uppercase labels become readable sentence case */
.sech .k{display:none}
.hero [class*="lim"],.hero .badge,.vc .say b,.say b,.rpill,.fb,.sticker,.sti{text-transform:none!important;letter-spacing:0!important}
/* nothing meant to be read below 13px */
.it,.rpill,.vbc-link,.vbc-note,small,.fb,.cap,.tnote,.pnote{font-size:max(14px,1em)}
.it,.rpill,.vbc-link,.vbc-note,small,.fb{font-size:14px!important}
/* mascot never covers a heading */
.vc{position:relative}.vc .vi{position:relative;z-index:0;pointer-events:none}.vc h3,.vc b{position:relative;z-index:2}
/* disabled primary button keeps readable text */
.btn.dis,.btn.dis:hover{color:#41584B!important}
html:not([data-theme="light"]) .btn.dis,html:not([data-theme="light"]) .btn.dis:hover{color:#B9D0C2!important;background:rgba(255,255,255,.1)!important}
html[data-theme="light"] .btn.dis{background:rgba(255,255,255,.7)!important}
@media(min-width:1001px){.hero .wrap{grid-template-columns:1.5fr 1fr}.hero h1{font-size:clamp(32px,3.7vw,56px)}}
.finder>b:first-child,.finder b:first-of-type,.plan>b:first-child{text-transform:none!important;letter-spacing:0!important;font-size:16px!important}
/* dark mode: paper-style cards (letter, notes) use light ink on the glass */
html:not([data-theme="light"]) .letter h2,html:not([data-theme="light"]) .letter h3,html:not([data-theme="light"]) .letter p b,html:not([data-theme="light"]) .signame,html:not([data-theme="light"]) .betanote h3{color:#F1F9F4!important}
html:not([data-theme="light"]) .letter p,html:not([data-theme="light"]) .betanote p,html:not([data-theme="light"]) .mbox p{color:#CFE3D6!important}
html:not([data-theme="light"]) .sig{color:#F1F9F4}
html:not([data-theme="light"]) .signame span{color:#A9C4B5!important}
html:not([data-theme="light"]) .letter a:not(.btn){color:#9BEBC3}
/* typography polish from the audits: no one-word last lines, shorter reading lines, calm ticker for reduced motion */
h1,h2,h3{text-wrap:balance}
p,li,.tile span,.faq details p{text-wrap:pretty}
.sech .sub,.faq details p,.letter p,.bcard p{max-width:72ch}
.sech.center .sub{margin-left:auto;margin-right:auto}
@media (prefers-reduced-motion:reduce){.fbar .trk{animation:none!important}}
.sbody .btl{border-radius:18px;padding:22px 26px}
.brel a{border-radius:18px!important}
