:root{--fs:1;--ink:#2b1b12;--bg1:#ffd8a8;--bg2:#ffa94d;--bg3:#ff8787;--card:#fffaf3;--acc:#e8590c;--acc2:#c2255c;--focus:#1c3faa}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font-family:Rubik,Assistant,Arial,sans-serif;color:var(--ink);font-size:calc(18px*var(--fs));display:flex;flex-direction:column;min-height:100vh;
 background:linear-gradient(170deg,var(--bg1),var(--bg2) 55%,var(--bg3));background-attachment:fixed}
body.close{--ink:#fff8f0;--bg1:#5f3dc4;--bg2:#c2255c;--bg3:#f76707;--card:#2a1846;--acc:#ffd43b;--acc2:#ffa8a8;--focus:#ffe066}
body.teen{font-family:Assistant,Rubik,Arial,sans-serif}
body.teen .stitle{font-family:"Frank Ruhl Libre",Assistant,serif;letter-spacing:.3px}
.skip{position:absolute;right:-999px;top:0;background:#fff;color:#000;padding:8px 12px;z-index:99}
.skip:focus{right:8px}
a,button,[contenteditable],input,select{outline:none}
a:focus-visible,button:focus-visible,[contenteditable]:focus-visible,input:focus-visible,select:focus-visible,.mood button:focus-visible{outline:4px solid var(--focus);outline-offset:3px;border-radius:10px}
.bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between;padding:8px 12px;background:rgba(255,255,255,.55);backdrop-filter:blur(6px);color:#2b1b12}
body.close .bar{background:rgba(20,8,40,.55);color:#fff}
.barnav,.tools{display:flex;gap:6px;flex-wrap:wrap}
.bbtn{display:inline-flex;align-items:center;gap:4px;border:0;border-radius:999px;padding:7px 12px;background:#fff;color:#2b1b12;font:inherit;font-size:15px;font-weight:600;text-decoration:none;cursor:pointer;box-shadow:0 2px 0 rgba(0,0,0,.18)}
.bbtn:hover{transform:translateY(-1px)}
.bbtn[aria-pressed=true]{background:#2b1b12;color:#fff}
.bartitle{font-weight:800;font-size:16px;flex:1 1 200px;text-align:center}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:4px 14px;font-size:14px}
.crumbs li+li::before{content:"‹";margin-inline-end:4px;opacity:.7}
.crumbs a{color:inherit;font-weight:600}
main{flex:1;display:flex;align-items:center;justify-content:center;padding:10px 12px}
.slide{position:relative;width:min(1100px,100%);min-height:min(68vh,640px);background:var(--card);border-radius:28px;padding:clamp(18px,3.4vw,44px);
 box-shadow:0 18px 0 rgba(0,0,0,.10),0 30px 60px rgba(60,20,0,.28),inset 0 -8px 0 rgba(0,0,0,.05);display:flex;flex-direction:column;gap:14px;overflow:hidden;animation:pop .45s ease}
body.close .slide{box-shadow:0 18px 0 rgba(0,0,0,.25),0 30px 60px rgba(0,0,0,.45),inset 0 -8px 0 rgba(255,255,255,.04)}
@keyframes pop{from{transform:translateY(14px) scale(.98);opacity:0}to{transform:none;opacity:1}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.kick{font-size:calc(15px*var(--fs));font-weight:700;letter-spacing:.5px;color:var(--acc2);text-transform:none}
body.close .kick{color:var(--acc)}
.stitle{font-size:calc(clamp(26px,4.2vw,50px)*var(--fs));font-weight:800;line-height:1.15;margin:0}
.big{font-size:calc(clamp(22px,3vw,36px)*var(--fs));line-height:1.45;margin:0}
.mid{font-size:calc(clamp(18px,2.2vw,26px)*var(--fs));line-height:1.55;margin:0}
.small{font-size:calc(15px*var(--fs));opacity:.85}
.row{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.grow{flex:1 1 280px}
.orb{--c:#ff922b;width:clamp(110px,16vw,190px);height:clamp(110px,16vw,190px);border-radius:50%;display:grid;place-items:center;font-size:clamp(56px,8vw,100px);flex:none;
 background:radial-gradient(circle at 32% 28%,#fff 0 8%,color-mix(in srgb,var(--c) 55%,#fff) 22%,var(--c) 60%,color-mix(in srgb,var(--c) 70%,#000) 100%);
 box-shadow:0 14px 0 color-mix(in srgb,var(--c) 60%,#000),0 26px 40px rgba(0,0,0,.3),inset -10px -16px 30px rgba(0,0,0,.18),inset 10px 12px 24px rgba(255,255,255,.5);
 animation:bob 4s ease-in-out infinite}
.orb span{filter:drop-shadow(0 6px 4px rgba(0,0,0,.25))}
@keyframes bob{50%{transform:translateY(-8px) rotate(-3deg)}}
.sun{position:absolute;inset-inline-end:-50px;top:-50px;width:220px;height:220px;opacity:.9;pointer-events:none}
.ed{display:inline-block;min-width:3ch;border-bottom:3px dashed color-mix(in srgb,var(--acc) 70%,transparent);padding:0 6px;border-radius:6px;cursor:text}
.ed:hover{background:rgba(255,200,120,.25)}
.edhint{font-size:calc(13px*var(--fs));opacity:.75}
.grid{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.card{background:rgba(255,255,255,.75);color:#2b1b12;border-radius:20px;padding:14px;box-shadow:0 6px 0 rgba(0,0,0,.10),0 10px 18px rgba(0,0,0,.12)}
body.close .card{background:rgba(255,255,255,.12);color:#fff8f0;box-shadow:0 6px 0 rgba(0,0,0,.25)}
.card h3{margin:0 0 6px;font-size:calc(18px*var(--fs))}
.day [contenteditable]{display:block;min-height:3.2em;font-size:calc(16px*var(--fs));line-height:1.4;border-radius:10px;padding:4px;background:rgba(255,255,255,.6)}
body.close .day [contenteditable]{background:rgba(255,255,255,.12)}
.mood{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.mood button{border:0;background:#fff;border-radius:22px;padding:10px 12px;font:inherit;cursor:pointer;min-width:96px;box-shadow:0 8px 0 rgba(0,0,0,.14),0 12px 20px rgba(0,0,0,.15);color:#2b1b12;transition:transform .15s}
.mood button:active{transform:translateY(6px);box-shadow:0 2px 0 rgba(0,0,0,.14)}
.mood .em{font-size:calc(48px*var(--fs));display:block}
.mood .lb{font-size:calc(15px*var(--fs));font-weight:700}
.mood .ct{display:block;font-weight:800;font-size:calc(20px*var(--fs));color:#c2255c}
.mood.hide .ct{visibility:hidden}
.btnrow{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.pbtn{border:0;border-radius:999px;padding:10px 18px;background:#2b1b12;color:#fff;font:inherit;font-weight:700;cursor:pointer;box-shadow:0 4px 0 rgba(0,0,0,.3)}
body.close .pbtn{background:#ffd43b;color:#2a1846}
.reveal{display:none}.reveal.on{display:block;animation:pop .4s}
.breath{width:clamp(130px,20vw,220px);height:clamp(130px,20vw,220px);border-radius:50%;margin:6px auto;display:grid;place-items:center;font-weight:800;color:#fff;text-align:center;
 background:radial-gradient(circle at 35% 30%,#fff7,#4dabf7 40%,#1971c2);box-shadow:0 12px 0 #134b85,0 24px 40px rgba(0,0,0,.3);animation:breathe 10s ease-in-out infinite}
body.close .breath{background:radial-gradient(circle at 35% 30%,#fff7,#b197fc 40%,#6741d9);box-shadow:0 12px 0 #3b1f8f,0 24px 40px rgba(0,0,0,.4)}
@keyframes breathe{0%,100%{transform:scale(.72)}45%,55%{transform:scale(1.05)}}
.steps{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));counter-reset:s}
.steps .card{position:relative}
.timer{font-size:calc(34px*var(--fs));font-weight:800;text-align:center;font-variant-numeric:tabular-nums}
.goal label{display:flex;gap:10px;align-items:center;font-size:calc(clamp(18px,2.2vw,26px)*var(--fs));padding:8px 10px;border-radius:14px;background:rgba(255,255,255,.6);margin:6px 0;cursor:pointer}
body.close .goal label{background:rgba(255,255,255,.12)}
.goal input{width:28px;height:28px;accent-color:#e8590c;flex:none}
.verse{font-family:"Frank Ruhl Libre",serif;font-size:calc(clamp(24px,3.2vw,40px)*var(--fs));line-height:1.5;margin:0;padding:12px 18px;border-inline-start:8px solid var(--acc);background:rgba(255,255,255,.55);border-radius:14px}
body.close .verse{background:rgba(255,255,255,.1)}
.ref{font-size:calc(15px*var(--fs));opacity:.8}
.opt{font-size:calc(15px*var(--fs));background:rgba(255,255,255,.55);border-radius:12px;padding:6px 12px;display:inline-block}
body.close .opt{background:rgba(255,255,255,.12)}
.chain{display:flex;flex-wrap:wrap;gap:4px;justify-content:center;min-height:44px}
.chain i{width:38px;height:24px;border:6px solid #ffd43b;border-radius:14px;display:inline-block;box-shadow:0 3px 0 rgba(0,0,0,.25);animation:pop .3s}
.chain i:nth-child(even){border-color:#ff8787}
.pics{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.pics .orb{width:clamp(100px,18vw,200px);height:clamp(100px,18vw,200px)}
.easy{font-size:calc(clamp(30px,5vw,60px)*var(--fs));font-weight:800;text-align:center;line-height:1.5;margin:0}
.chnm .slide{align-items:center;text-align:center;justify-content:center}
.wbtn{border:0;border-radius:999px;padding:4px 12px;margin:2px;background:#fff3bf;color:#2b1b12;font:inherit;font-weight:700;cursor:pointer;box-shadow:0 3px 0 rgba(0,0,0,.18)}
.gloss{position:fixed;inset:auto 10px 10px 10px;max-width:640px;margin-inline:auto;background:#fff;color:#2b1b12;border-radius:20px;padding:16px;box-shadow:0 20px 50px rgba(0,0,0,.4);z-index:50;max-height:70vh;overflow:auto}
.gloss table{width:100%;border-collapse:collapse;font-size:17px}.gloss td,.gloss th{border-bottom:1px solid #eee;padding:6px;text-align:start}
.langs{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}
.langs button{border:2px solid #2b1b12;background:#fff;border-radius:999px;padding:3px 10px;cursor:pointer;font:inherit}
.langs button[aria-pressed=true]{background:#2b1b12;color:#fff}
.verify{font-size:13px;color:#a61e4d;margin:6px 0}
.lv{font-size:12px;font-weight:700;background:#ffe3e3;color:#a61e4d;border-radius:6px;padding:1px 6px;vertical-align:middle}
.pager{display:flex;align-items:center;justify-content:center;gap:10px;padding:8px 10px;flex-wrap:wrap}
.dots{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.dots button{width:14px;height:14px;border-radius:50%;border:2px solid #fff;background:rgba(255,255,255,.35);padding:0;cursor:pointer}
.dots button[aria-selected=true]{background:#fff;transform:scale(1.25)}
.credit{display:flex;gap:8px;align-items:center;justify-content:center;padding:6px 0 10px;font-size:14px;font-weight:600}
.credit img{border-radius:50%;background:#fff}
.num{position:absolute;inset-inline-end:18px;bottom:12px;font-size:13px;opacity:.6}
:fullscreen body,body:fullscreen{background-attachment:fixed}
body.fs .bar,body.fs .crumbs{display:none}
/* print view */
body.print{background:#fff;--ink:#2b1b12;--card:#fff}
body.print .bar,body.print .pager,body.print .crumbs .tools{display:none}
body.print main{display:block;padding:0}
body.print .slide{width:100%;min-height:0;box-shadow:none;border:3px solid #ffa94d;margin:0 0 14px;page-break-after:always;break-after:page;animation:none;color:#2b1b12;background:#fff}
body.print.close .slide{border-color:#9c36b5}
body.print .card,body.print .day [contenteditable],body.print .goal label,body.print .verse{background:#fff8ef;color:#2b1b12;box-shadow:none;border:1px solid #f1c48b}
body.print .orb,body.print .breath{animation:none;box-shadow:none}
body.print .noprint,body.print .mood .ct{display:none!important}
body.print .reveal{display:block}
body.print .printbar{display:flex}
.printbar{display:none;gap:8px;justify-content:center;padding:10px;flex-wrap:wrap}
@media print{.printbar,.skip,.crumbs{display:none!important}body{background:#fff!important}.slide{border-radius:12px}@page{size:A4 landscape;margin:10mm}}
@media (max-width:520px){.sun{width:120px;height:120px;opacity:.45}.bbtn span{display:none}.bartitle{order:3;flex-basis:100%;font-size:14px}.slide{border-radius:20px;min-height:60vh}.mood button{min-width:72px}.mood .em{font-size:38px}}

.slide::before{content:"";position:absolute;inset:auto -10% -40% -10%;height:60%;background:radial-gradient(ellipse at 50% 100%,rgba(255,169,77,.22),transparent 65%);pointer-events:none}
body.close .slide::before{background:radial-gradient(ellipse at 50% 100%,rgba(247,103,7,.25),transparent 65%)}
.slide>*{position:relative}
.slide .sun{position:absolute}