:root{
  --paper:#FCFAF3; --paper2:#F4ECD8; --ink:#26404F; --ink2:#4F5E6E;
  --green:#6E7B4B; --gold:#C7AE7C; --line:#DCD3BC; --rule:#9c8c66;
  --terra:#C77B5A; --terra-d:#A85C43; --terra-bg:#F6E7DD;
  --shadow:0 6px 22px rgba(40,30,18,.13);
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%}
body{font-family:'EB Garamond',Georgia,serif;color:var(--ink);background:var(--paper);
  background-image:radial-gradient(120% 80% at 50% 0%, #fffdf6 0%, var(--paper) 45%, var(--paper2) 100%);
  -webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0;z-index:0;background:#EFE3C8 url(bg-day.jpg) center/cover}
body.night::before{background:#0a1020 url(bg-night.jpg) center/cover}
body.night .affirm{color:#cdd7e0}
body.night .masthead h1{color:#FBF7EC}
body.night .masthead .kicker{color:#D9C18A}
body.night .masthead .muted{color:#bcc9d8}
body.night .section-h h2{color:#F3ECDC}
body.night .section-h small.note{color:#a6b4c4}
body.night .orn{color:#C7AE7C}
body.night .nav{background:linear-gradient(180deg,#17263f,#0e1830);border-bottom:1px solid rgba(199,174,124,.25);box-shadow:0 2px 14px rgba(0,0,0,.4)}
body.night .navtitle{color:#FBF7EC}
body.night .hamburger span{background:#C7AE7C}
#grain{position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.045;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='120' height='120'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}
.app{position:relative;z-index:2;max-width:560px;margin:0 auto;min-height:100%;
  padding:calc(74px + env(safe-area-inset-top)) 18px 34px 18px}
h1,h2,h3,.serif{font-family:'Cormorant Garamond',serif;font-weight:600;letter-spacing:.3px}
.muted{color:var(--ink2)} .ital{font-style:italic} .center{text-align:center}
.rule{height:1px;background:var(--rule);opacity:.4;margin:14px 0}
.orn{color:var(--gold);text-align:center;font-size:18px;letter-spacing:6px;margin:2px 0}
.section-h{display:flex;align-items:baseline;justify-content:space-between;margin:22px 0 8px}
.section-h h2{font-size:25px;margin:0} small.note{font-size:12px;color:var(--ink2)}
.label{font-size:12px;letter-spacing:3px;text-transform:uppercase;color:var(--green)}

.card{background:linear-gradient(180deg,#fffdf7,#f7f0df);border:1px solid var(--line);
  border-radius:14px;padding:16px;box-shadow:var(--shadow);position:relative;animation:rise .4s backwards}
.card .frame{position:absolute;inset:7px;border:1px solid var(--gold);border-radius:9px;opacity:.45;pointer-events:none}
@keyframes rise{from{opacity:0;transform:translateY(10px)}}

.btn{font-family:'EB Garamond',serif;font-size:15px;cursor:pointer;border:1px solid var(--ink);
  background:var(--ink);color:#fdf8ec;border-radius:10px;padding:10px 16px;
  transition:transform .12s ease,box-shadow .12s ease,background .2s}
.btn:hover{box-shadow:0 4px 14px rgba(40,30,18,.2)} .btn:active{transform:scale(.94)}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--gold)}
.btn.ghost:hover{background:rgba(199,174,124,.16)}
.btn.sm{padding:6px 12px;font-size:15px;border-radius:8px}
.iconbtn{cursor:pointer;border:1px solid var(--line);background:#fffdf7;border-radius:8px;width:34px;height:34px;
  display:inline-flex;align-items:center;justify-content:center;color:var(--ink2);transition:transform .12s,background .2s;font-size:15px}
.iconbtn:hover{background:rgba(199,174,124,.18)} .iconbtn:active{transform:scale(.86)}

.panel{animation:enter .42s cubic-bezier(.2,.7,.2,1)}
@keyframes enter{from{opacity:0;transform:translateY(10px)}}
.subview{animation:slidein .34s cubic-bezier(.2,.7,.2,1)}
@keyframes slidein{from{opacity:0;transform:translateX(16px)}}
.back{display:inline-flex;align-items:center;gap:6px;cursor:pointer;color:var(--ink2);font-style:italic;margin-bottom:8px;transition:transform .12s}
.back:active{transform:translateX(-3px)}

.affirm{text-align:center;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:21px;line-height:1.4;color:var(--ink2);padding:4px 10px 2px}
.masthead{text-align:center;margin:4px 0 2px}
.masthead .kicker{font-size:12px;letter-spacing:5px;color:var(--green);text-transform:uppercase}
.masthead h1{font-size:40px;margin:2px 0 0;letter-spacing:1px}
.emblem{display:block;width:120px;height:120px;border-radius:50%;object-fit:cover;margin:0 auto 8px;box-shadow:0 6px 18px rgba(20,28,40,.32);border:1px solid var(--line)}
.clockwrap{text-align:center;margin:8px 0 2px}
.clock{display:inline-flex;align-items:center;gap:8px;font-family:'Cormorant Garamond',serif;font-size:25px;letter-spacing:2px;color:#fff;background:none;border:1px solid #fff;border-radius:30px;padding:5px 20px;box-shadow:none}

.fact .cat{font-size:12px;letter-spacing:2px;text-transform:uppercase}
.fact .body{font-family:'Cormorant Garamond',serif;font-size:21px;line-height:1.34;margin:6px 0 4px}
.fact .deeper{font-style:italic;color:var(--ink2);font-size:15px}
.acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}

.plate img,.plate .ph{display:block;width:100%;height:188px;object-fit:cover;border-radius:10px}
.factlist{margin:10px 0 0;padding:0;list-style:none}
.factlist li{position:relative;padding:5px 0 5px 20px;font-size:15px;border-bottom:1px dotted var(--line)}
.factlist li:last-child{border-bottom:none}
.factlist li::before{content:"✦";position:absolute;left:0;color:var(--gold)}

.tool{background:linear-gradient(180deg,#26404F,#1f3540);color:#eef3f0;border:none;border-radius:16px;padding:18px;box-shadow:var(--shadow);position:relative;animation:rise .4s backwards}
.tool h2{color:#fdf8ec;margin:0 0 2px} .tool .sub{color:#bcd0c8;font-style:italic;font-size:15px}
.tool .row{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px dotted rgba(255,255,255,.18)}
.tool .row:last-child{border-bottom:none} .tool .row .txt{flex:1}
.tool .when{font-size:13px;color:#E8C36B;font-style:italic}
.tool input,.tool select{font-family:'EB Garamond',serif;font-size:15px;color:#eef3f0;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.22);border-radius:9px;padding:9px 11px;width:100%}
.tool select option{color:#26404F}
.tool .delr{cursor:pointer;color:#E8A39A;font-size:15px;background:none;border:none;transition:transform .12s}
.tool .delr:active{transform:scale(.8)}
.tool .btn{background:var(--gold);border-color:var(--gold);color:#3a2e18}
.inrow{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap} .grow{flex:1;min-width:120px}

.qotd{cursor:pointer;margin-top:22px}
.qotd .ans{margin-top:10px;font-style:italic;color:var(--ink2);max-height:0;overflow:hidden;transition:max-height .4s}
.qotd.open .ans{max-height:300px}

.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.chip{background:#fffdf7;border:1px solid var(--line);border-radius:14px;padding:15px 6px;text-align:center;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease,background .2s;animation:pop .4s backwards}
.chip:hover{box-shadow:var(--shadow);background:#fff;transform:translateY(-2px)} .chip:active{transform:scale(.91)}
.chip .ic{font-size:25px;display:block} .chip .nm{font-size:13px;margin-top:6px;display:block;line-height:1.15}
@keyframes pop{from{opacity:0;transform:scale(.85)}}

.plus{background:linear-gradient(180deg,#2b4a3a,#22382c);color:#eef3ee;border-radius:16px;padding:18px;box-shadow:var(--shadow)}
.plus h2{color:#fdf8ec;margin:0 0 4px} .plus .px{color:#cfe0d4}
.plus .btn{background:var(--gold);border-color:var(--gold);color:#26301c}
.plus .gift{background:transparent;border-color:rgba(255,255,255,.4);color:#fdf8ec}
.ribbon{display:flex;flex-wrap:wrap;justify-content:center;gap:3px 9px;text-align:center;font-size:13px;letter-spacing:.4px;color:#fff;background:none;border:1px solid rgba(255,255,255,.35);border-radius:18px;padding:8px 14px;margin:11px 0 5px}
.ribbon b{color:#fff;font-weight:600}
.skycard{background:linear-gradient(180deg,#26384a,#1b2735);color:#e8eef3;border-radius:14px;padding:16px;box-shadow:var(--shadow);position:relative;overflow:hidden;animation:rise .4s backwards}
.skycard .moon{font-size:40px;text-align:center;position:relative;z-index:1}
.skycard .sub{color:#aebfce} .skycard .center{position:relative;z-index:1}
.skycard .star{position:absolute;width:2px;height:2px;background:#fff;border-radius:50%;opacity:.7}
.histrow{display:flex;gap:10px;padding:7px 0;border-bottom:1px dotted var(--line)} .histrow:last-child{border-bottom:none}
.histrow .yr{font-family:'Cormorant Garamond',serif;font-weight:600;color:var(--green);min-width:48px}
.quotecard{font-family:'Cormorant Garamond',serif;font-size:21px;line-height:1.4;font-style:italic;color:var(--ink)}
.mc-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.mc-dow{font-size:12px;color:var(--ink2);letter-spacing:1px;padding-bottom:2px}
.mc-d{position:relative;height:30px;display:flex;align-items:center;justify-content:center;font-size:12px;border-radius:7px;color:var(--ink)}
.mc-today{background:var(--ink);color:#fdf8ec;font-weight:600}
.mc-mark{color:var(--terra-d);font-weight:600}
.mc-dot{position:absolute;bottom:3px;width:4px;height:4px;border-radius:50%;background:var(--terra)}
.mc-today .mc-dot{background:var(--gold)}
.mc-rem{box-shadow:inset 0 0 0 1.6px var(--gold)}
.mc-rdot{position:absolute;bottom:3px;right:5px;width:4px;height:4px;border-radius:50%;background:var(--accent)}
.remcal{margin-top:4px}
.remcal-h{font-size:12px;letter-spacing:.5px;color:var(--ink2);margin-bottom:4px}
.remcal-row{display:flex;gap:10px;align-items:baseline;padding:3px 0}
.remcal-d{font-family:'Cormorant Garamond',serif;font-weight:600;color:#A8843C;min-width:24px;text-align:center}
.remcal-t{font-size:15px;color:var(--ink)}
.mc-bday{box-shadow:inset 0 0 0 1.6px #C77B5A}
.mc-cake{position:absolute;bottom:1px;right:2px;font-size:12px;line-height:1}
.card.cal{padding:13px 14px}
.calnav{display:inline-flex;align-items:center;gap:5px}
.calbtn{border:1px solid var(--line);background:#fffdf7;border-radius:8px;width:27px;height:27px;line-height:1;font-size:15px;color:var(--ink);cursor:pointer;padding:0}
.calbtn:hover{border-color:var(--gold)}
.health{margin-top:9px;font-size:15px;color:var(--ink2);background:rgba(110,123,75,.10);border-left:3px solid var(--green);padding:8px 11px;border-radius:0 8px 8px 0}
body.night .health{color:#dfe7d8;background:rgba(150,170,120,.14)}
.lockwrap{position:relative;min-height:60vh}
.lockblur{filter:blur(5px);opacity:.45;pointer-events:none;user-select:none;max-height:74vh;overflow:hidden}
.lockcard{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding:60px 24px 0}
.lockcard .lk{font-size:40px}
.bdaybanner{background:linear-gradient(180deg,#fbf1e0,#f3e2c8);border:1px solid var(--gold);border-radius:14px;padding:12px 14px;text-align:center;color:#A8443A;font-family:'Cormorant Garamond',serif;font-size:21px;box-shadow:var(--shadow);margin-bottom:10px;animation:rise .4s backwards}
.bdaybanner span{display:block;font-family:'EB Garamond',serif;font-size:13px;color:var(--ink2);font-style:italic;margin-top:2px}
.bdayfx{position:fixed;inset:0;z-index:60;overflow:hidden;transition:opacity .5s}
.bdayfx.out{opacity:0}
.bdayfx-cv,.bdayfx-balloons{position:absolute;inset:0;pointer-events:none}
.bf-balloon{position:absolute;bottom:-150px;width:48px;height:60px;border-radius:50% 50% 48% 48%/56% 56% 44% 44%;opacity:0;animation-name:bfRise;animation-timing-function:ease-in;animation-iteration-count:1;animation-fill-mode:forwards}
.bf-balloon::after{content:"";position:absolute;top:59px;left:50%;width:1px;height:44px;background:rgba(60,42,20,.3)}
@keyframes bfRise{0%{transform:translateY(0) translateX(0);opacity:0}8%{opacity:1}90%{opacity:1}100%{transform:translateY(calc(-100vh - 220px)) translateX(var(--sway));opacity:0}}
.bdayfx-banner{position:absolute;top:34%;left:50%;width:min(420px,86%);transform:translate(-50%,-50%) scale(.5);opacity:0;text-align:center;background:linear-gradient(180deg,#fff8ec,#f3e2c8);border:1px solid var(--gold);border-radius:18px;padding:22px 18px;box-shadow:0 18px 50px rgba(120,80,30,.4);animation:bfPop .9s cubic-bezier(.2,1.5,.4,1) .2s forwards}
.bdayfx-banner .cake{font-size:40px;display:block;margin-bottom:4px;animation:bfBob 2.4s ease-in-out infinite 1s}
.bdayfx-banner h1{font-family:'Cormorant Garamond',serif;font-size:32px;line-height:1.1;margin:2px 0;color:#A8443A}
.bdayfx-banner h1 .nm{color:#26404F}
.bdayfx-banner p{font-style:italic;font-size:15px;color:#5d5742;margin:6px 0 0}
.bdayfx-banner small{display:block;margin-top:10px;font-size:12px;color:#9a8a6a;letter-spacing:.5px}
@keyframes bfPop{60%{opacity:1}to{transform:translate(-50%,-50%) scale(1);opacity:1}}
@keyframes bfBob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-6px) rotate(3deg)}}

.note-paper{position:relative;border-radius:16px;padding:20px 18px;box-shadow:var(--shadow);overflow:hidden;background:linear-gradient(180deg,#2b4a3a,#22382c);border:1px solid #1c2f25;animation:rise .4s backwards}
.note-paper::before{content:"";position:absolute;inset:8px;border:1.5px dashed rgba(255,247,230,.28);border-radius:11px;pointer-events:none}
.note-paper h2{color:#fdf8ec;margin:0}
.note-paper textarea{font-family:'Caveat','EB Garamond',cursive;font-size:21px;line-height:1.5;color:#34543f;background:rgba(255,255,255,.92);border:1px solid #cfe0d4;border-radius:12px;padding:12px 14px;width:100%;min-height:96px;resize:vertical}
.note-paper .btn{background:var(--gold);border-color:var(--gold);color:#26301c}
.vnote{display:flex;align-items:center;justify-content:space-between;gap:8px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:10px;padding:7px 10px;margin-top:8px}
.vlabel{color:#eef3ee;font-size:13px;font-family:'EB Garamond',serif}
.vbtns{display:flex;gap:6px;align-items:center}
.vbtns .btn{background:var(--gold);border-color:var(--gold);color:#26301c}
.notecard{position:relative;background:#fff;border:1px solid #ecd9cd;border-radius:10px;padding:14px 14px 10px;margin:12px 0;box-shadow:0 4px 12px rgba(120,70,40,.12);transform:rotate(var(--r,-1deg));transition:transform .2s;animation:rise .4s backwards}
.notecard:nth-child(even){--r:1.2deg} .notecard:hover{transform:rotate(0)}
.notecard .tape{position:absolute;top:-9px;left:50%;transform:translateX(-50%) rotate(-3deg);width:60px;height:18px;background:rgba(199,123,90,.45);border-radius:2px}
.notecard .nt{font-family:'Caveat','EB Garamond',cursive;font-size:21px;color:#5b3a2b;white-space:pre-wrap;line-height:1.45}
.notecard .nf{display:flex;justify-content:flex-end;gap:8px;margin-top:8px;border-top:1px dotted #ecd9cd;padding-top:8px}
.mic{display:inline-flex;align-items:center;gap:6px} .mic.rec{color:#A85C43}
.tabseg{display:inline-flex;background:rgba(255,255,255,.12);border-radius:12px;padding:3px;margin-bottom:6px}
.tabseg button{border:none;background:none;font-family:'EB Garamond',serif;font-size:15px;color:#cfe0d4;padding:6px 14px;border-radius:9px;cursor:pointer}
.tabseg button.on{background:#fdf8ec;color:#2b4a3a;box-shadow:0 2px 6px rgba(0,0,0,.18)}

.nav{position:fixed;left:0;right:0;top:0;z-index:16;max-width:560px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;background:linear-gradient(180deg,#fbf6ea,#f1e7d2);border-bottom:1px solid var(--line);padding:calc(7px + env(safe-area-inset-top)) 10px 7px;box-shadow:0 2px 12px rgba(60,42,20,.08)}
.navtitle{font-family:'Cormorant Garamond',serif;font-size:25px;letter-spacing:1px;color:var(--ink)}
.hamburger{width:40px;height:40px;display:flex;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;padding:0 8px}
.hamburger span{display:block;height:2.5px;width:24px;background:var(--ink);border-radius:2px;transition:transform .25s,opacity .2s}
.hamburger.x span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.hamburger.x span:nth-child(2){opacity:0}
.hamburger.x span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
.menu-scrim{position:fixed;inset:0;z-index:17;background:rgba(30,20,10,.35);opacity:0;pointer-events:none;transition:opacity .25s}
.menu-scrim.show{opacity:1;pointer-events:auto}
.menu{position:fixed;top:0;left:0;bottom:0;z-index:18;width:76%;max-width:300px;background:linear-gradient(180deg,#fbf6ea,#f1e7d2);box-shadow:6px 0 28px rgba(60,42,20,.28);transform:translateX(-100%);transition:transform .3s cubic-bezier(.2,.7,.2,1);padding:calc(22px + env(safe-area-inset-top)) 0 20px;display:flex;flex-direction:column;gap:2px}
.menu.open{transform:none}
.menu-h{font-family:'Cormorant Garamond',serif;font-size:32px;text-align:center;color:var(--ink);margin:0 0 14px;letter-spacing:1px}
.menu-item{display:flex;align-items:center;gap:14px;background:none;border:none;cursor:pointer;font-family:'EB Garamond',serif;font-size:18px;color:var(--ink2);padding:14px 24px;text-align:left;transition:background .2s,transform .12s}
.menu-item:active{transform:scale(.97)}
.menu-item .ic{width:30px;height:30px;display:flex;align-items:center;justify-content:center}
.menu-item .ic svg{width:24px;height:24px;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.menu-item.on{background:rgba(199,174,124,.2);color:var(--ink);font-weight:600}

#toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);z-index:40;background:var(--ink);color:#fdf8ec;padding:10px 18px;border-radius:30px;font-size:15px;opacity:0;transition:opacity .25s,transform .25s;pointer-events:none;box-shadow:var(--shadow)}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#rempop{position:fixed;inset:0;z-index:50;display:none;align-items:center;justify-content:center;background:rgba(30,20,10,.4);padding:24px}
#rempop.show{display:flex}
#rempop .pp{background:var(--paper);border:1px solid var(--gold);border-radius:18px;padding:24px;max-width:320px;text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.3);animation:pop .35s}
.vid{display:inline-flex;align-items:center;gap:6px;color:#A8443A;text-decoration:none;font-style:italic}
.pod{display:inline-flex;align-items:center;gap:6px;color:#6E7B4B;text-decoration:none;font-style:italic}
.btn.on{background:var(--green);color:#fff;border-color:transparent}
.quizchoices{display:flex;flex-direction:column;gap:8px}
.qz{text-align:left;padding:11px 13px;border:1px solid var(--line);background:#fffdf7;border-radius:11px;font-family:'EB Garamond',serif;font-size:15px;color:var(--ink);cursor:pointer;transition:all .15s}
.qz:hover{border-color:var(--gold)}
.qz.right{background:#e7f0e2;border-color:#6E7B4B;color:#3E5A33;font-weight:600}
.qz.wrong{background:#f6e3df;border-color:#C77B5A;color:#9a3f2e}
.qz.dim{opacity:.5}
.sheet{position:fixed;inset:0;z-index:55;background:rgba(20,16,10,.45);display:none;align-items:center;justify-content:center;padding:18px}
.sheet.show{display:flex}
.sheet-card{background:var(--paper);border:1px solid var(--line);border-radius:18px;max-width:420px;width:100%;padding:18px;box-shadow:0 20px 60px rgba(0,0,0,.35);max-height:84vh;overflow:auto}
.a11y-seg{display:flex;gap:6px;margin-top:6px}
.a11y-seg button{flex:1;padding:10px;border:1px solid var(--line);background:#fffdf7;border-radius:10px;font-family:'EB Garamond',serif;font-size:15px;color:var(--ink);cursor:pointer}
.a11y-seg button.on{background:var(--green);color:#fff;border-color:transparent}
.a11y-row{margin:16px 0}
.a11y-row .lab{font-family:'Cormorant Garamond',serif;font-size:18px;color:var(--ink)}
.a11y-row .hint{font-size:12px;color:var(--ink2);font-style:italic;margin-top:2px}
.toggle{padding:9px 18px;border-radius:999px;border:1px solid var(--line);background:#fffdf7;cursor:pointer;font-family:'EB Garamond',serif;font-size:15px;color:var(--ink)}
.toggle.on{background:var(--green);color:#fff;border-color:transparent}
body.a11y-contrast{--ink2:#2c3a44;--line:#7c7c6a}
body.a11y-contrast .muted,body.a11y-contrast .ital,body.a11y-contrast .sub,body.a11y-contrast .note{color:#2b2b2b}
body.night.a11y-contrast .muted,body.night.a11y-contrast .ital,body.night.a11y-contrast .sub,body.night.a11y-contrast .note{color:#eaf0f6}
body.a11y-contrast .vid{color:#8a2f20}
body.a11y-contrast .pod{color:#3c4924}

/* Modern Home Digest — scoped to .nest so nothing else is affected */
@keyframes nestRise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes nestFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
@keyframes nestPop{0%{transform:scale(1)}40%{transform:scale(1.28)}100%{transform:scale(1)}}
.nest .nchips{display:flex;flex-wrap:wrap;gap:7px;justify-content:center;margin:6px 0 14px}
.nest .nchip{font:inherit;font-size:12px;color:var(--ink);background:#fffdf7;border:1px solid var(--line);border-radius:30px;padding:6px 12px;cursor:pointer;transition:transform .18s,box-shadow .18s,background .18s}
.nest .nchip:hover{transform:translateY(-2px);box-shadow:var(--shadow);background:var(--paper2)}
.nest .nchip:active{transform:scale(.96)}
.nest .ntools{text-align:center;margin-bottom:6px}
.nest .nbtn{font:inherit;color:#fffdf7;background:var(--terra);border:none;border-radius:30px;padding:10px 18px;cursor:pointer;position:relative;overflow:hidden;box-shadow:var(--shadow);transition:transform .18s,filter .18s}
.nest .nbtn:hover{filter:brightness(1.05);transform:translateY(-2px)}
.nest .nbtn:active{transform:scale(.95)}
.nest .nbtn::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(120deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);transition:left .6s}
.nest .nbtn:hover::after{left:140%}
.nest .nbtn.sm{font-size:12px;padding:6px 12px;background:transparent;color:var(--terra-d);border:1px solid var(--terra);box-shadow:none;margin-top:10px}
.nest .nbtn.sm:hover{background:var(--terra-bg);filter:none}
.nest .nsec{margin:20px 0 6px}
.nest .nsec-h{display:flex;align-items:center;gap:10px;margin:0 0 3px}
.nest .nsec-h h2{margin:0;font-family:'Cormorant Garamond',serif;font-size:25px;color:var(--ink)}
.nest .nsec-ic{font-size:25px;display:inline-block;animation:nestFloat 4.5s ease-in-out infinite}
.nest .nsec-blurb{margin:0 0 10px;font-size:13px}
.nest .ntiles{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:620px){.nest .ntiles{grid-template-columns:1fr 1fr}}
.nest .ntile{position:relative;background:var(--nbg);border:1px solid var(--nbd);padding:15px 16px 15px;box-shadow:var(--shadow);animation:nestRise .55s cubic-bezier(.2,.7,.3,1) both;transition:transform .25s,box-shadow .25s}
.nest .ntile:hover{transform:translateY(-4px) rotate(-.35deg);box-shadow:0 14px 28px rgba(40,30,18,.17)}
.nest .ntile-ic{font-size:25px;line-height:1}
.nest .ntile h3{margin:7px 0 5px;font-family:'Cormorant Garamond',serif;font-size:21px;color:var(--ink);padding-right:26px}
.nest .ntile p{margin:0;font-size:15px;line-height:1.5;color:var(--ink2)}
.nest .nheart{position:absolute;top:9px;right:11px;border:none;background:transparent;font-size:18px;line-height:1;cursor:pointer;color:#bb7d63;transition:transform .2s}
.nest .nheart:hover{transform:scale(1.18)}
.nest .nheart.on{color:var(--terra-d);animation:nestPop .45s}
.nest .nsteps{max-height:0;overflow:hidden;transition:max-height .45s ease}
.nest .nsteps.open{max-height:420px}
.nest .nsteps ol{margin:10px 0 0;padding-left:20px}
.nest .nsteps li{margin:5px 0;font-size:13px;color:var(--ink2)}
.nest .nfoot{font-size:12px}

/* How-To — search bar (scoped, reuses .nest card styling) */
.nest .howsearch{display:flex;gap:8px;margin:8px 0 16px;flex-wrap:wrap}
.nest .howsearch input{flex:1;min-width:150px;font:inherit;font-size:15px;color:var(--ink);background:#fffdf7;border:1px solid var(--line);border-radius:30px;padding:10px 16px;outline:none;transition:border-color .18s}
.nest .howsearch input:focus{border-color:var(--terra)}
.nest .howno{display:none;background:#fffdf7;border:1px dashed var(--rule);border-radius:14px;padding:16px;text-align:center;margin:0 0 16px;font-size:13px;color:var(--ink2)}
.nest .howno .nbtn{margin-top:10px}
.nest .watch{margin-top:10px}

/* ===== Aurora skin — aesthetic only (palette + frosted glass + day/night gradient). Additive; no layout/feature changes. ===== */
:root{
  --paper:rgba(255,255,255,.62); --paper2:#EDE7FB;
  --ink:#34304A; --ink2:#6E6790;
  --green:#6C5CE7; --gold:#E58E6F;
  --line:rgba(120,108,170,.30); --rule:#B9A6F0;
  --terra:#6C5CE7; --terra-d:#5A4FC0; --terra-bg:#ECE7FB;
  --shadow:0 10px 30px rgba(60,40,90,.12);
}
html,body{background:transparent !important;}
body::before, body.night::before{display:none !important;}
body{color:var(--ink);}

#aurora-sky{position:fixed;inset:0;z-index:0;pointer-events:none;}
#aurora-sky .aurora-layer{position:absolute;inset:0;opacity:0;transition:opacity 1.2s ease;}
#aurora-sky .aurora-layer.on{opacity:1;}
.aurora-dawn{background:linear-gradient(160deg,#FCE7DC 0%,#F2E5F0 55%,#E7E2FB 100%);}
.aurora-day{background:linear-gradient(160deg,#E9F2FE 0%,#F4ECFB 55%,#FDEFEF 100%);}
.aurora-dusk{background:linear-gradient(160deg,#FBD7C0 0%,#E7A9CE 55%,#9E84E0 100%);}
.aurora-night{background:linear-gradient(160deg,#1B2348 0%,#2A2150 55%,#3A2347 100%);}

/* frosted glass surfaces (each keeps its own radius/padding/position) */
.card,.notecard,.sheet-card,.chip,.nchip,.iconbtn,.calbtn{
  background:rgba(255,255,255,.55) !important;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.7) !important;
  box-shadow:0 8px 26px rgba(60,40,90,.10) !important;
}
.sheet-card{ background:rgba(255,255,255,.72) !important; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); }
.chip,.nchip,.iconbtn,.calbtn{ box-shadow:none !important; }

/* nest pastel sections -> tinted glass (keeps each section's colour) */
.ntile{
  background:var(--nbg);
  background:color-mix(in srgb, var(--nbg) 58%, transparent) !important;
  -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px);
  border:1px solid rgba(255,255,255,.5) !important;
}

/* top nav + side menu -> glass */
.nav{ background:rgba(255,255,255,.5) !important; -webkit-backdrop-filter:blur(12px); backdrop-filter:blur(12px);
  border-bottom:1px solid rgba(255,255,255,.5) !important; box-shadow:0 2px 18px rgba(60,40,90,.08) !important; }
#menu{ background:rgba(255,255,255,.72) !important; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); }

/* day/night ribbon card -> translucent indigo glass */
.skycard{ background:rgba(40,33,68,.50) !important; -webkit-backdrop-filter:blur(9px); backdrop-filter:blur(9px);
  border:1px solid rgba(160,150,210,.30) !important; }

/* primary buttons -> violet */
.btn{ background:#6C5CE7 !important; border-color:#6C5CE7 !important; color:#fff !important; }

/* night: cards stay light & readable (their body text is dark); retune on-background text to Aurora light tones */
body.night .masthead h1{ color:#F1ECFC; }
body.night .masthead .kicker{ color:#C3B4F4; }
body.night .masthead .muted{ color:#B6ADD6; }
body.night .section-h h2{ color:#ECE7FB; }
body.night .section-h small.note{ color:#A99FD0; }
body.night .affirm{ color:#E4DEF6; }
body.night .orn{ color:#B9A6F0; }
body.night .nav{ background:rgba(40,33,68,.55) !important; border-bottom:1px solid rgba(160,150,210,.28) !important; }
body.night .navtitle{ color:#F1ECFC; }
body.night .hamburger span{ background:#C3B4F4; }

/* accessibility / performance fallbacks */
@media (prefers-reduced-transparency: reduce){
  .card,.notecard,.sheet-card,.chip,.nchip,.iconbtn,.calbtn,.nav,#menu,.skycard,.ntile{ -webkit-backdrop-filter:none !important; backdrop-filter:none !important; }
  .card,.notecard,.sheet-card{ background:rgba(255,255,255,.92) !important; }
}
@media (prefers-reduced-motion: reduce){ #aurora-sky .aurora-layer{ transition:none !important; } }

/* the three off-palette cards now match the rest (frosted glass + dark text) */
.plus,.tool,.note-paper{
  background:rgba(255,255,255,.55) !important;
  -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
  border:1px solid rgba(255,255,255,.7) !important;
  box-shadow:0 8px 26px rgba(60,40,90,.10) !important;
  color:var(--ink) !important;
}
.plus h2,.tool h2,.note-paper h2,.plus .px,.plus .sub,.tool .sub,.note-paper .sub,.tool .ital,.note-paper .ital{ color:var(--ink) !important; }
.btn.gift{ background:transparent !important; border-color:var(--accent) !important; color:var(--accent) !important; }
@media (prefers-reduced-transparency: reduce){
  .plus,.tool,.note-paper{ -webkit-backdrop-filter:none !important; backdrop-filter:none !important; background:rgba(255,255,255,.92) !important; }
}
/* logo: the orb is the O in the wordmark (like the photo) */
.masthead h1.wm{ display:inline-flex; align-items:center; gap:.02em; }
.masthead h1 .orbO{ width:1.04em; height:1.04em; display:inline-block; line-height:0; }
.masthead h1 .orbO svg{ display:block; width:100%; height:100%; }

/* At night the page is dark; keep the content cards light so their dark titles & text stay readable. */
body.night .card,
body.night .notecard,
body.night .sheet-card,
body.night .plus,
body.night .tool,
body.night .note-paper,
body.night #menu{ background:rgba(255,255,255,.86) !important; }
body.night .chip,
body.night .nchip,
body.night .iconbtn,
body.night .calbtn{ background:rgba(255,255,255,.80) !important; }
body.night .ntile{ background:color-mix(in srgb, var(--nbg) 72%, #ffffff) !important; }
body.night .health{ color:#3f5a45 !important; }
@media (prefers-reduced-transparency: reduce){
  body.night .card,body.night .notecard,body.night .sheet-card,
  body.night .plus,body.night .tool,body.night .note-paper{ background:rgba(255,255,255,.95) !important; }
}

.plate{ position:relative; }
.plate a.photo-credit{ position:absolute; right:7px; bottom:6px; font-size:12px; line-height:1; letter-spacing:.2px;
  color:#fff; background:rgba(20,16,40,.42); padding:3px 7px; border-radius:9px; text-decoration:none;
  -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px); }
.plate a.photo-credit:hover{ background:rgba(20,16,40,.62); }

.le-save{position:absolute;right:2px;top:50%;transform:translateY(-50%);background:none;border:0;cursor:pointer;
  font-size:18px;line-height:1;color:var(--ink2);opacity:.5;padding:6px 4px;-webkit-tap-highlight-color:transparent;
  transition:opacity .15s,color .15s,transform .12s;}
.le-save:hover{opacity:.9}
.le-save:active{transform:translateY(-50%) scale(.85)}
.le-save.on{color:#E58E6F;opacity:1}
#colBody .col-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
#colBody .col-head h2{font-family:'Cormorant Garamond',serif;margin:0;font-size:25px;color:var(--ink)}
#colBody .col-x{background:none;border:0;font-size:25px;line-height:1;color:var(--ink2);cursor:pointer;padding:2px 6px}
#colBody .col-list{max-height:62vh;overflow:auto}
.col-item{border:1px solid var(--line);border-radius:14px;padding:12px 13px;margin-bottom:10px;background:var(--paper)}
.col-item .ct{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--ink2);margin-bottom:4px}
.col-item .cx{font-family:'Cormorant Garamond',serif;font-size:18px;line-height:1.4;color:var(--ink)}
.col-item .cd{font-size:12px;color:var(--ink2);opacity:.8;margin-top:7px}
.col-acts{display:flex;gap:8px;margin-top:11px}
.col-acts button{font-size:12px;padding:6px 13px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer}
.col-acts button:active{transform:scale(.96)}
.col-empty{text-align:center;color:var(--ink2);padding:28px 12px;font-family:'Cormorant Garamond',serif;font-size:18px;line-height:1.5}

.le-trial-note{font-size:13px;color:var(--ink2);text-align:center;margin:2px 0 12px;
  font-family:'Cormorant Garamond',serif;letter-spacing:.3px}
.le-trial-btn{margin-bottom:10px}

/* A11y: visible keyboard focus indicator (mouse clicks unaffected) */
:focus-visible{outline:2px solid var(--terra);outline-offset:2px}
.chip:focus-visible,.back:focus-visible,.qotd:focus-visible{outline:2px solid var(--terra);outline-offset:2px;border-radius:8px}
.nest .howsearch input:focus-visible{outline:2px solid var(--terra);outline-offset:1px}

/* ===== Hero readability fix (purple theme) — dark text by day, light by night =====
   .ribbon/.clock were hardcoded white (invisible on the light purple hero);
   ghost buttons were caught by the aurora `.btn{color:#fff}` override. */
.ribbon, .ribbon b{ color:var(--ink) !important; border-color:rgba(108,92,231,.30) !important; }
#clock, .clock{ color:var(--ink) !important; border-color:rgba(108,92,231,.30) !important; }
.btn.ghost{ background:transparent !important; color:#6C5CE7 !important; border-color:rgba(108,92,231,.40) !important; }

body.night .ribbon, body.night .ribbon b,
body.night #clock, body.night .clock{ color:#ECE7FB !important; border-color:rgba(255,255,255,.35) !important; }
body.night .btn.ghost{ color:#C3B4F4 !important; border-color:rgba(195,180,244,.40) !important; }

/* prevent any element from forcing horizontal overflow */
html,body{overflow-x:hidden;max-width:100%}
*{min-width:0}

/* ===== Home/Mind chooser — playful animated tiles ===== */
.choose{ display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:2px }
.choose-tile{
  display:flex;flex-direction:column;align-items:center;gap:4px;
  padding:22px 10px;border-radius:16px;border:1px solid var(--line);cursor:pointer;
  background:linear-gradient(180deg,#fffdf7,#f1ecfb);color:var(--ink);font:inherit;
  box-shadow:var(--shadow);
  transition:transform .2s cubic-bezier(.2,.7,.2,1),box-shadow .2s;
  animation:tileFloat 4.2s ease-in-out infinite;
}
.choose-mind{ animation-delay:.5s;background:linear-gradient(180deg,#fffdf7,#ece8fb) }
.choose-tile:hover,.choose-tile:focus-visible{
  transform:translateY(-5px) scale(1.035);
  box-shadow:0 14px 30px rgba(108,92,231,.24);outline:none;
}
.choose-tile:active{ transform:scale(.97) }
.choose-emoji{ font-size:34px;line-height:1;animation:tileBob 3s ease-in-out infinite }
.choose-mind .choose-emoji{ animation-delay:.4s }
.choose-label{ font-family:'Cormorant Garamond',serif;font-weight:600;font-size:25px }
.choose-sub{ font-size:12px;color:var(--ink2);font-style:italic;text-align:center }
@keyframes tileFloat{ 0%,100%{transform:translateY(0)} 50%{transform:translateY(-3px)} }
@keyframes tileBob{ 0%,100%{transform:translateY(0) rotate(-4deg)} 50%{transform:translateY(-4px) rotate(4deg)} }
@media(prefers-reduced-motion:reduce){ .choose-tile,.choose-emoji{animation:none} }

/* ============================================================
   THE LIVING EDIT — brand theme  (charcoal · gold · cream)
   Appended last; overrides the old purple "aurora" skin.
   ============================================================ */
:root{
  --paper:#F4EFE4; --paper2:#ECE3D2; --ink:#2C2A27; --ink2:#6E665A;
  --green:#8C7B4E; --gold:#B7905A; --line:#E5DBC7; --rule:#CDBC95;
  --terra:#B7905A; --terra-d:#9C7C46; --terra-bg:#F1E7D5;
  --shadow:0 6px 20px rgba(70,52,22,.10);
}
/* flat cream backdrop; retire the purple aurora sky */
#aurora-sky{ display:none !important; }
html,body,body.night{ background:var(--page-bg,#F4EFE4) !important; color:var(--ink) !important; }

/* surfaces: warm ivory with a soft gold hairline */
.card,.notecard,.plus,.tool,.note-paper,.sheet-card,
body.night .card,body.night .notecard,body.night .plus,body.night .tool,body.night .note-paper{
  background:#FCF9F1 !important; border:1px solid var(--line) !important;
  box-shadow:0 6px 18px rgba(70,52,22,.08) !important; color:var(--ink) !important;
}
.card .frame{ border-color:var(--gold) !important; opacity:.5 !important; }

/* nav + drawer: solid cream */
.nav,body.night .nav{ background:#F4EFE4 !important; border-bottom:1px solid var(--line) !important;
  box-shadow:0 2px 14px rgba(70,52,22,.06) !important; }
.navtitle,body.night .navtitle{ color:var(--ink) !important; }
#menu,body.night #menu{ background:#F4EFE4 !important; }
.menu-h{ color:var(--gold) !important; }

/* buttons: charcoal primary, gold CTA, gold-outline ghost */
.btn{ background:var(--ink) !important; border-color:var(--ink) !important; color:#F7F2E7 !important; }
.btn.home-explore{ background:var(--gold) !important; border-color:var(--gold) !important; color:#2C2A27 !important; }
.btn.ghost,body.night .btn.ghost{ background:transparent !important; color:var(--ink) !important; border-color:var(--gold) !important; }
.btn.gift{ background:transparent !important; border-color:var(--gold) !important; color:var(--gold) !important; }

/* headings / labels */
.section-h h2,body.night .section-h h2{ color:var(--ink) !important; }
.masthead .muted,body.night .masthead .muted,body.night .masthead h1{ color:#3A342B !important; }
.label{ color:var(--gold) !important; }

/* date ribbon + clock */
.ribbon,.ribbon b,#clock,.clock,
body.night .ribbon,body.night .ribbon b,body.night #clock,body.night .clock{
  color:var(--ink) !important; border-color:rgba(183,144,90,.45) !important; }

/* focus ring -> gold */
:focus-visible,.chip:focus-visible,.back:focus-visible,.qotd:focus-visible,.choose-tile:focus-visible{
  outline:2px solid var(--gold) !important; outline-offset:2px; }

/* Home / Mind chooser tiles -> ivory with warm edge */
.choose-tile{ background:#FCF9F1 !important; border:1px solid var(--line) !important;
  box-shadow:0 6px 18px rgba(70,52,22,.08) !important; }
.choose-home{ background:linear-gradient(180deg,#FCF9F1,#F2E8D5) !important; }
.choose-mind{ background:linear-gradient(180deg,#FCF9F1,#EFE5D0) !important; }
.choose-tile:hover,.choose-tile:focus-visible{ box-shadow:0 12px 26px rgba(160,120,50,.20) !important; }
.choose-label{ color:var(--ink) !important; }
.choose-sub{ color:var(--ink2) !important; }

/* category label on fact cards -> gold (was per-category color) */
.fact .cat{ color:var(--gold) !important; }

/* ===== The Living EDIT brand — remaining screens (entire app) ===== */
/* night-sky card -> deep charcoal, not purple/blue */
.skycard{ background:linear-gradient(180deg,#3A372F,#26241F) !important; color:#EDE6D6 !important;
  border:1px solid rgba(183,144,90,.30) !important; }
.skycard .sub{ color:#C9BFA8 !important; }
.skycard .moon{ color:#E7D9B8 !important; }

/* Organizer tab segments (To-do / Note / Thought) */
.tabseg{ background:rgba(44,42,39,.06) !important; }
.tabseg button{ color:var(--ink2) !important; }
.tabseg button.on{ background:var(--ink) !important; color:#F7F2E7 !important; box-shadow:none !important; }

/* page kickers -> gold (day + night) */
.masthead .kicker,body.night .masthead .kicker,.kicker{ color:var(--gold) !important; }

/* birthday banner -> ivory + charcoal text */
.bdaybanner{ background:linear-gradient(180deg,#FCF9F1,#F2E8D5) !important; color:var(--ink) !important; border-color:var(--gold) !important; }

/* health / discovery note -> gold accent */
.health,body.night .health{ color:var(--ink2) !important; background:rgba(183,144,90,.12) !important; border-left:3px solid var(--gold) !important; }

/* Modern Home Digest tiles + chips -> ivory / gold */
.nest .ntile{ background:#FCF9F1 !important; border:1px solid var(--line) !important; }
.nest .ntile h3,.nest .ntile p{ color:var(--ink) !important; }
.nest .ntile p{ color:var(--ink2) !important; }
.nest .nchip{ background:#FCF9F1 !important; border:1px solid var(--line) !important; color:var(--ink) !important; }
.nest .nchip:hover{ background:var(--paper2) !important; }

/* neutralize leftover night-mode purple text */
body.night .masthead h1,body.night .section-h h2{ color:var(--ink) !important; }
body.night .affirm,body.night .section-h small.note{ color:var(--ink2) !important; }

/* ===== Onboarding ===== */
.ob{ padding-top:14px }
.ob-logo{ text-align:center; margin:8px 0 2px }
.ob-chips{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:10px }
.ob-chip{ font:inherit; font-size:15px; color:var(--ink); background:#FCF9F1; border:1px solid var(--line);
  border-radius:30px; padding:10px 16px; cursor:pointer; transition:transform .15s, background .2s, border-color .2s }
.ob-chip:hover{ transform:translateY(-2px) }
.ob-chip.on{ background:var(--gold) !important; border-color:var(--gold) !important; color:#2C2A27 !important; font-weight:600 }

/* burger menu: current-location header */
.menu-loc{ padding:0 24px 6px; }
.menu-loc-k{ display:block; font-size:11px; letter-spacing:3px; text-transform:uppercase; color:var(--gold); margin-bottom:2px; }
.menu-loc #menuLoc{ font-family:'Cormorant Garamond',serif; font-size:22px; color:var(--ink); }

/* current-location label in capitals */
.menu-loc #menuLoc{ text-transform:uppercase; letter-spacing:.6px; }

/* bottom navigation bar */
.botnav{ position:fixed; left:0; right:0; bottom:0; z-index:17; max-width:560px; margin:0 auto;
  display:none; justify-content:space-around; align-items:stretch;
  background:#F4EFE4; border-top:1px solid var(--line); box-shadow:0 -2px 14px rgba(70,52,22,.07);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom)); }
.botnav.show{ display:flex; }
.botnav-item{ flex:1; min-width:0; background:none; border:none; cursor:pointer;
  font-family:'EB Garamond',serif; font-size:11px; line-height:1.15; letter-spacing:.2px;
  color:var(--ink2); padding:8px 3px; border-radius:10px; text-align:center;
  transition:color .2s, background .2s; }
.botnav-item.on{ color:var(--gold); font-weight:600; }
.botnav-item:active{ background:rgba(183,144,90,.10); }
/* clearance so the bar never covers content */
.app{ padding-bottom:86px !important; }

/* premium tabs dimmed for free users */
.botnav-item.locked{ opacity:.45; }

/* hide the old cosmetic nest heart (real Save button replaces it) */
.nheart{ display:none !important; }

/* app tagline / one-line explanation under the greeting */
.app-tagline{ text-align:center; font-family:'Cormorant Garamond',serif; font-style:italic;
  font-size:19px; line-height:1.3; color:var(--ink2); margin:10px 16px 18px; }

/* big, bold app explanation under the logo */
.app-hero{ font-family:'Cormorant Garamond',serif; font-weight:600; font-size:30px; line-height:1.16;
  color:var(--ink); text-align:center; margin:6px 6px 2px; letter-spacing:.2px; }

/* refined monoline topic icons (replace emoji) */
.chip-ic{ width:27px; height:27px; display:block; margin:0 auto 2px; fill:none; stroke:var(--gold);
  stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }

/* A Quiet Minute — breathing circle with calming living visual + minute ring */
.quiet{ text-align:center; }
.breath-circle{ position:relative; width:144px; height:144px; margin:16px auto 6px; }
.breath-ring{ position:absolute; inset:0; transform:rotate(-90deg); }
.breath-ring circle{ fill:none; stroke-width:3; }
.breath-ring .bg{ stroke:rgba(183,144,90,.22); }
.breath-ring .fg{ stroke:var(--gold); stroke-linecap:round; stroke-dasharray:289; stroke-dashoffset:289; transition:stroke-dashoffset .3s linear; }
.breath-photo{ position:absolute; inset:9px; border-radius:50%; overflow:hidden; transform:scale(.84); box-shadow:inset 0 0 18px rgba(70,52,22,.12); }
.breath-circle.breathing .breath-photo{ animation:breathe 10s ease-in-out infinite; }
.breath-photo::before{ content:""; position:absolute; inset:-30%;
  background:radial-gradient(circle at 32% 30%, rgba(214,189,140,.85), transparent 55%),
            radial-gradient(circle at 70% 68%, rgba(150,176,150,.7), transparent 58%),
            radial-gradient(circle at 50% 50%, #FBF6EA, #ECDFC5);
  animation:breathDrift 16s ease-in-out infinite alternate; }
.breath-label{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  font-family:'Cormorant Garamond',serif; font-size:19px; letter-spacing:.3px; color:var(--ink); z-index:2; }
@keyframes breathe{ 0%{transform:scale(.84)} 40%{transform:scale(1.06)} 60%{transform:scale(1.06)} 100%{transform:scale(.84)} }
@keyframes breathDrift{ 0%{transform:scale(1) rotate(0deg)} 100%{transform:scale(1.18) rotate(12deg)} }
@media(prefers-reduced-motion:reduce){ .breath-circle.breathing .breath-photo{animation:none} .breath-photo::before{animation:none} }

/* Breathe-with-me transition shape */
.breath-fx{ position:fixed; inset:0; z-index:60; display:none; align-items:center; justify-content:center; pointer-events:none; }
.breath-fx.go{ display:flex; }
.breath-fx.go::after{ content:""; width:46px; height:46px; border:2px solid var(--gold); border-radius:16px;
  animation:bfx .7s cubic-bezier(.2,.7,.2,1) forwards; }
@keyframes bfx{ 0%{transform:scale(.3) rotate(0deg); opacity:0} 28%{opacity:.85} 100%{transform:scale(3.4) rotate(45deg); opacity:0} }
@media(prefers-reduced-motion:reduce){ .breath-fx.go::after{ animation:none } }

/* ===== Spacious, decluttered layout (calm negative space) ===== */
.app{ padding-left:24px; padding-right:24px; }
.card{ padding:22px; margin-bottom:16px; }
.section-h{ margin:34px 0 14px; }
.masthead{ margin:14px 0 8px; }
.ribbon{ margin:16px 0 10px; padding:9px 16px; }
.grid{ gap:16px; }
.choose{ gap:16px; margin-top:6px; }
.acts{ margin-top:16px; gap:11px; }
.fact .body{ line-height:1.46; }
.btn{ padding:11px 22px; }
.app-hero{ margin:12px 8px 8px; }
.panel{ padding-bottom:6px; }

/* ===== Compact sizing for real phones (smaller cards, tiles, fonts) ===== */
.app-invite{ text-align:center; font-family:'Cormorant Garamond',serif; font-weight:600;
  font-size:23px; color:var(--ink); margin:20px 12px 14px; line-height:1.25; }
.card{ padding:13px 14px !important; margin-bottom:18px !important; }
.fact .body{ font-size:16px; line-height:1.4; }
.fact .deeper{ font-size:13px; margin-top:2px; }
.fact .cat, .label{ font-size:11px; }
.section-h h2{ font-size:21px; }
.section-h{ margin:26px 0 12px; }
.acts{ margin-top:11px; gap:8px; }
.btn.sm, .btn.ghost.sm{ padding:7px 12px; font-size:13px; }
.app-hero{ font-size:26px; margin:10px 8px 6px; }
.ribbon{ font-size:12px; padding:7px 12px; }
/* Home/Mind tiles ~half size */
.choose{ gap:12px; }
.choose-tile{ padding:13px 10px !important; }
.choose-label{ font-size:18px; }
/* Mind topic chips a touch smaller */
.chip .nm{ font-size:14px; }
.chip-ic{ width:23px; height:23px; }

/* ===== Top-pick chooser spacing + uniform card fonts ===== */
/* Home/Mind tiles: a touch smaller, with clear space before the facts below */
.choose-tile{ padding:11px 10px !important; }
.choose-label{ font-size:17px; }
.choose{ gap:12px; margin:8px 0 30px !important; }
/* same body font in every card across the app */
.fact .body{ font-size:16px !important; }
.quotecard{ font-size:16px !important; line-height:1.45; }

/* ===== Uniform, upright text inside cards ===== */
.fact .body, .fact .deeper, .quotecard{ font-size:16px !important; font-style:normal !important; }
.card .ital, .card .muted.ital{ font-style:normal !important; }
.fact .deeper{ margin-top:3px; }

/* ===== Calmer, slower, more delicate open animation (~2.5-3s) ===== */
.panel{ animation-duration:2.6s !important; animation-timing-function:cubic-bezier(.22,.62,.24,1) !important; }
.card{ animation-duration:2.2s !important; animation-timing-function:cubic-bezier(.22,.62,.24,1) !important; }
.masthead, .ribbon, .app-invite, .choose{ animation:softIn 2.4s cubic-bezier(.22,.62,.24,1) both; }
@keyframes softIn{ from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none} }
@media(prefers-reduced-motion:reduce){ .panel,.card,.masthead,.ribbon,.app-invite,.choose{ animation:none !important } }

/* ===== Slow, single delicate screen entrance (~3.5s) ===== */
@keyframes softIn{ from{opacity:0; transform:translateY(26px)} to{opacity:1; transform:none} }
.panel{ animation:softIn 3.6s ease-in-out both !important; }
.card, .masthead, .ribbon, .app-invite, .choose{ animation:none !important; }

/* ===== Polish: theme segmented control + empty states ===== */
.seg .btn.on{ background:var(--gold) !important; color:#2b2114 !important; border-color:var(--gold) !important; box-shadow:0 2px 8px rgba(120,90,40,.22) !important; }
body.night .seg .btn.on{ background:#C7AE7C !important; color:#1b1206 !important; border-color:#C7AE7C !important; }
.seg .btn{ flex:1; }
.empty-state{ padding:26px 18px !important; }
.empty-state .empty-heart{ font-size:34px; color:var(--gold); line-height:1; margin-bottom:8px; }
body.night .empty-state .empty-heart{ color:#C7AE7C; }

/* ===== Brand lockup (full logo: monogram + wordmark + Home & Mind) ===== */
.brand-lockup{ display:block; text-align:center; }
.brand-lockup img{ height:158px; width:auto; display:block; margin:0 auto 2px; }
.brand-lockup.ob img{ height:134px; }
.brand-night{ display:none !important; }
body.night .brand-day{ display:none !important; }
body.night .brand-night{ display:block !important; }

/* ================= Readable dark theme (night) ================= */
body.night{ color:#ECE4D4 !important; }

/* Secondary text (card sub-captions, decks, hints) — these set their own
   color:var(--ink2), so the card's inherited light color never reaches them.
   Force a bright, high-contrast off-white on the dark surfaces. */
body.night .fact .deeper, body.night .deeper, body.night .qotd .ans,
body.night .nest .ntile p, body.night .nest .nsteps li,
body.night .col-item .cd, body.night .col-item .ct, body.night .remcal-h,
body.night .a11y-row .hint, body.night .choose-sub, body.night .le-trial-note,
body.night .bdaybanner span, body.night small.note{ color:#D8D1C2 !important; }

/* Surfaces -> dark charcoal with light text */
body.night .card, body.night .notecard, body.night .plus, body.night .tool,
body.night .note-paper, body.night .sheet-card, body.night .choose-tile{
  background:#22242E !important; border-color:rgba(199,174,124,.26) !important;
  box-shadow:0 6px 20px rgba(0,0,0,.42) !important; color:#ECE4D4 !important; }
body.night .choose-home{ background:linear-gradient(180deg,#262835,#1d1f28) !important; }
body.night .choose-mind{ background:linear-gradient(180deg,#262835,#1d1f28) !important; }

/* Inputs stay a readable light field */
body.night input, body.night textarea{ background:#FCF9F1 !important; color:#26272C !important; }

/* Nav, drawer, bottom nav -> dark */
body.night .nav, body.night #menu, body.night .botnav{
  background:#191b22 !important; border-color:rgba(199,174,124,.22) !important; }
body.night .navtitle{ color:#F3ECDC !important; }
body.night .hamburger span{ background:var(--gold) !important; }
body.night .botnav-item{ color:#B7BCC0 !important; }
body.night .botnav-item.on{ color:var(--gold) !important; }

/* Headings / hero / labels on the dark backdrop -> light */
body.night .masthead h1, body.night .masthead .muted, body.night .section-h h2,
body.night .app-hero, body.night .app-invite, body.night h1, body.night h2,
body.night h3, body.night .serif, body.night .choose-label{ color:#F3ECDC !important; }
body.night .muted, body.night .app-tagline, body.night .ital,
body.night .choose-sub, body.night .qotd .ans{ color:#C4C0B4 !important; }

/* Date ribbon / clock */
body.night .ribbon, body.night .ribbon b, body.night #clock, body.night .clock{
  color:#DED2B7 !important; border-color:rgba(199,174,124,.4) !important; }

/* Keep gold accents */
body.night .label, body.night .kicker, body.night .masthead .kicker,
body.night .menu-h, body.night .fact .label{ color:var(--gold) !important; }

/* Buttons on dark */
body.night .btn{ background:var(--gold) !important; border-color:var(--gold) !important; color:#20222B !important; }
body.night .btn.ghost{ background:transparent !important; color:#EDE5D5 !important; border-color:var(--gold) !important; }
body.night .card .frame{ opacity:.3 !important; }

/* Night: topic chips / tiles -> dark with light text */
body.night .chip, body.night .nchip, body.night .ntile, body.night .calbtn, body.night .iconbtn{
  background:#22242E !important; border-color:rgba(199,174,124,.26) !important; color:#ECE4D4 !important; }
body.night .chip .nm, body.night .nchip *, body.night .ntile *{ color:#ECE4D4 !important; }

/* ============ Night mode v2: lighter backdrop + full readability ============ */

/* Lighten the very-dark night backdrop a touch */
body.night::before{ background:linear-gradient(180deg,#1c2231 0%,#151a26 100%) !important; }

/* Surfaces a touch lighter, for clearer contrast with text */
body.night .card, body.night .notecard, body.night .plus, body.night .tool,
body.night .note-paper, body.night .sheet-card, body.night .choose-tile,
body.night .chip, body.night .nchip, body.night .ntile, body.night .calbtn, body.night .iconbtn{
  background:#262b38 !important; border-color:rgba(199,174,124,.28) !important; color:#EAE3D4 !important; }
body.night .nav, body.night #menu, body.night .botnav{ background:#1e222e !important; }

/* Safety net: default ALL text to a light tone in dark mode (accent rules below still win) */
body.night, body.night p, body.night span, body.night div, body.night li,
body.night h1, body.night h2, body.night h3, body.night h4, body.night h5,
body.night small, body.night label, body.night strong, body.night b, body.night em,
body.night td, body.night th, body.night dt, body.night dd{ color:#EAE3D4; }

/* Menu drawer text */
body.night .menu-loc, body.night .menu-loc-k{ color:#BCC2C6 !important; }
body.night #menuLoc{ color:#F3ECDC !important; }

/* Language switcher (inline-styled label + buttons) */
body.night #langSwitch > div{ color:#BCC2C6 !important; }
body.night #langSwitch button{ color:#EDE6D6 !important; border-color:rgba(199,174,124,.32) !important; background:transparent !important; }

/* Bottom nav labels */
body.night .botnav-item{ color:#C3C9CE !important; }
body.night .botnav-item.on{ color:var(--gold) !important; }

/* Keep gold accents (override the safety net) */
body.night .label, body.night .kicker, body.night .masthead .kicker, body.night .menu-h,
body.night .fact .label, body.night .orn{ color:var(--gold) !important; }

/* Light input fields keep dark, readable text */
body.night input, body.night textarea, body.night select{ color:#26272C !important; background:#FCF9F1 !important; }

/* Gold/solid buttons keep a dark label; ghost buttons stay light */
body.night .btn.home-explore, body.night .btn:not(.ghost){ color:#20222B !important; }
body.night .btn.ghost{ color:#EDE6D6 !important; }

/* ---- Surprise-tip highlight ---- */
.surprise-glow{ box-shadow:0 0 0 2px var(--gold), 0 10px 28px rgba(183,144,90,.35) !important; border-radius:14px; transition:box-shadow .35s ease; }
body.night .surprise-glow{ box-shadow:0 0 0 2px #C7AE7C, 0 10px 28px rgba(0,0,0,.5) !important; }

/* ===== A Quiet Minute — gold → burnt-orange breathing circle ===== */
.breath-photo::before{
  background:
    radial-gradient(circle at 34% 28%, rgba(240,205,130,.95), transparent 58%),
    radial-gradient(circle at 70% 74%, rgba(176,92,38,.92), transparent 60%),
    radial-gradient(circle at 50% 50%, #E7B667, #B4622A) !important;
}
.breath-ring .fg{ stroke:#C87A38 !important; }
.breath-ring .bg{ stroke:rgba(200,122,56,.20) !important; }
.breath-label{ color:#3E2C18 !important; }
body.night .breath-label{ color:#3E2C18 !important; }
