:root{--bg:#0f2e2a;--bg2:#1a3d38;--text:#f4f1ea;--muted:#aeb8b1;--muted2:#77837d;--line:rgba(255,255,255,.11);--accent:#8bd4c4;--accent2:#6ba896;--warm:#e4c9a4}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:linear-gradient(135deg, #0f2e2a 0%, #1a3d38 50%, #132922 100%),radial-gradient(ellipse at 50% -20%, rgba(139,212,196,.06), transparent 60%);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}
body{min-height:100vh;overflow-x:hidden;position:relative}
body::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 800"><defs><filter id="subtle"><feTurbulence type="fractalNoise" baseFrequency="0.02" numOctaves="3" result="noise"/><feDisplacementMap in="SourceGraphic" in2="noise" scale="3"/></filter></defs><g opacity="0.08" filter="url(%23subtle)"><path d="M10,200 Q30,180 50,200 T90,200" stroke="%238bd4c4" stroke-width="1" fill="none"/><path d="M1190,150 Q1170,130 1150,150 T1110,150" stroke="%238bd4c4" stroke-width="1" fill="none"/><path d="M100,700 Q120,680 140,700 T180,700" stroke="%238bd4c4" stroke-width="0.8" fill="none"/><path d="M1100,650 Q1080,670 1060,650 T1020,650" stroke="%238bd4c4" stroke-width="0.8" fill="none"/></g></svg>');background-attachment:fixed;pointer-events:none;z-index:1}
button{font:inherit;position:relative;z-index:2}.glow{position:fixed;border-radius:50%;filter:blur(70px);opacity:.12;pointer-events:none;z-index:0}.g1{width:320px;height:320px;background:rgba(139,212,196,.08);right:-100px;top:-100px;animation:drift1 20s ease-in-out infinite}.g2{width:280px;height:280px;background:rgba(139,212,196,.05);left:-100px;bottom:-80px;animation:drift2 25s ease-in-out infinite}
@keyframes drift1{0%,100%{transform:translate(0,0)}50%{transform:translate(20px,-20px)}}
@keyframes drift2{0%,100%{transform:translate(0,0)}50%{transform:translate(-20px,20px)}}
.shell{width:min(980px,calc(100% - 24px));margin:auto;padding:24px 0 56px;position:relative}.hero{display:flex;gap:16px;align-items:center;padding:8px 2px 28px}.logo{width:66px;height:66px;border-radius:22px;border:1px solid rgba(139,212,196,.2);background:rgba(139,212,196,.08);display:grid;place-items:center}.moon{width:24px;height:24px;border-radius:50%;background:var(--warm);box-shadow:0 0 26px rgba(228,201,164,.28)}
.eyebrow{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:700}h1{font-size:clamp(2.6rem,7vw,4.8rem);margin:.22rem 0 .5rem;line-height:.95;letter-spacing:-.05em;font-weight:300}.hero p,.feature p,.sectionTitle p{margin:0;color:var(--muted);line-height:1.55}
.feature{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px;border:1px solid rgba(139,212,196,.15);border-radius:40% 60% 50% 40% / 60% 50% 40% 50%;background:linear-gradient(145deg,rgba(139,212,196,.08),rgba(139,212,196,.04));box-shadow:0 25px 70px rgba(0,0,0,.22);backdrop-filter:blur(18px);position:relative;z-index:2}.feature h2{margin:.35rem 0 .25rem;font-size:1.65rem}.play{width:62px;height:62px;border-radius:50%;border:0;background:linear-gradient(135deg, var(--accent), var(--accent2));color:#0f2e2a;font-weight:700;cursor:pointer;transition:transform .2s;box-shadow:0 0 0 0 rgba(139,212,196,.4);animation:pulse-ring .6s ease-out infinite}
.play:hover{transform:scale(1.05)}
@keyframes pulse-ring{0%{box-shadow:0 0 0 0 rgba(139,212,196,.4)}100%{box-shadow:0 0 0 15px rgba(139,212,196,0)}}.sectionTitle{margin:26px 2px 13px}.sectionTitle h3{margin:0 0 4px}.sectionTitle p{font-size:.9rem}.grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.day{min-height:135px;padding:14px;border-radius:35% 65% 30% 70% / 70% 30% 70% 30%;border:1px solid var(--line);background:rgba(255,255,255,.045);color:var(--text);text-align:left;position:relative;transition:all .2s;z-index:2}.day.active{cursor:pointer;background:linear-gradient(150deg,rgba(139,212,196,.12),rgba(139,212,196,.05));border-color:rgba(139,212,196,.2)}.day.active:hover{background:linear-gradient(150deg,rgba(139,212,196,.16),rgba(139,212,196,.08));transform:scale(1.02)}.daynum{font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);font-weight:700}.daytitle{font-weight:650;margin-top:12px}.daymeta{font-size:.8rem;color:var(--muted2);margin-top:8px}.coming{position:absolute;top:12px;right:12px;font-size:.68rem;color:#708078}
.hidden{display:none!important}.session{max-width:700px;margin:auto}.back{background:none;border:0;color:var(--muted);padding:4px 0 16px;cursor:pointer}.panel{padding:clamp(22px,5vw,38px);border-radius:45% 55% 40% 60% / 55% 45% 60% 40%;border:1px solid rgba(139,212,196,.15);background:linear-gradient(160deg,rgba(139,212,196,.09),rgba(139,212,196,.04));backdrop-filter:blur(22px);box-shadow:0 30px 80px rgba(0,0,0,.25);position:relative;z-index:2}.top{display:flex;justify-content:space-between;align-items:flex-start}.top h2{font-size:clamp(2.2rem,7vw,3.7rem);margin:.35rem 0 0;line-height:1;letter-spacing:-.04em;font-weight:300}.chip{border:1px solid rgba(139,212,196,.15);border-radius:999px;padding:8px 11px;color:var(--muted);font-size:.8rem}
.orbWrap{display:grid;place-items:center;padding:30px 0 20px;position:relative;z-index:2}.orbWrap::before,.orbWrap::after{content:'';position:absolute;border-radius:50%;border:2px solid rgba(139,212,196,.3);top:50%;left:50%;transform:translate(-50%,-50%);animation:ripple 3s ease-out infinite}.orbWrap::before{width:200px;height:200px;animation-delay:0s}.orbWrap::after{width:250px;height:250px;animation-delay:1.2s}.orb{width:165px;height:165px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,rgba(139,212,196,.3),rgba(147,174,153,.18) 42%,rgba(90,117,99,.1) 68%,transparent 72%);animation:breathe 8s ease-in-out infinite;box-shadow:0 0 40px rgba(139,212,196,.15),inset 0 0 40px rgba(139,212,196,.08)}.orbInner{width:84px;height:84px;border-radius:50%;border:2px solid rgba(139,212,196,.3);box-shadow:0 0 20px rgba(139,212,196,.2),inset 0 0 20px rgba(139,212,196,.1)}
@keyframes breathe{0%,100%{transform:scale(.94);opacity:.82}50%{transform:scale(1.05);opacity:1}}
@keyframes ripple{0%{width:165px;height:165px;opacity:1;border-width:2px}100%{width:280px;height:280px;opacity:0;border-width:1px}}
.timer{text-align:center;font-size:clamp(3.8rem,13vw,6.6rem);font-variant-numeric:tabular-nums;letter-spacing:-.055em}.track{height:6px;background:rgba(255,255,255,.08);border-radius:999px;overflow:hidden;margin-top:18px}.progress{height:100%;width:0;background:linear-gradient(90deg,var(--accent2),var(--accent));transition:width .3s linear}.meta{display:flex;justify-content:space-between;color:var(--muted2);font-size:.8rem;margin-top:10px}.instruction{border-top:1px solid var(--line);margin-top:22px;padding-top:22px;min-height:104px;line-height:1.7;font-size:1.04rem}.controls{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.controls button{min-height:50px;border-radius:15px;padding:0 18px;cursor:pointer;transition:all .2s}.primary{flex:1;border:0;background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0f2e2a;font-weight:700}.primary:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(139,212,196,.2)}.secondary{border:1px solid rgba(139,212,196,.2);background:rgba(139,212,196,.06);color:var(--text);transition:all .2s}.secondary:hover{background:rgba(139,212,196,.12);border-color:rgba(139,212,196,.3)}.ghost{border:1px solid transparent;background:none;color:var(--muted);transition:color .2s}.ghost:hover{color:var(--accent)}.prep{min-height:18px;margin-top:10px;color:var(--muted2);font-size:.8rem}.note{display:flex;gap:10px;padding:18px 8px;color:var(--muted);font-size:.86rem;position:relative;z-index:2}.note strong{display:block;color:var(--text);margin-bottom:2px}

@keyframes float{0%,100%{transform:translateY(0px) rotate(0deg)}50%{transform:translateY(-8px) rotate(3deg)}}
@keyframes sway{0%,100%{transform:translateX(0) rotate(0deg)}50%{transform:translateX(6px) rotate(2deg)}}

.shell{position:relative}
.shell::before{content:'';position:absolute;width:120px;height:120px;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M50,20 Q70,35 60,60 Q40,70 30,50 Q35,30 50,20" fill="%238bd4c4" opacity="0.08"/><circle cx="40" cy="45" r="3" fill="%238bd4c4" opacity="0.1"/><circle cx="60" cy="40" r="2" fill="%238bd4c4" opacity="0.1"/></svg>') no-repeat center;background-size:contain;top:-30px;right:20px;opacity:0.6;animation:float 8s ease-in-out infinite;z-index:0;pointer-events:none}
.shell::after{content:'';position:absolute;width:100px;height:100px;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M30,30 L50,15 L65,30 L55,50 L65,70 L50,85 L35,70 L45,50 Z" stroke="%238bd4c4" fill="none" stroke-width="0.5" opacity="0.1"/></svg>') no-repeat center;background-size:contain;bottom:50px;left:10px;opacity:0.5;animation:sway 10s ease-in-out infinite;z-index:0;pointer-events:none}
@media(max-width:760px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.logo{width:56px;height:56px;flex:0 0 56px}}@media(max-width:420px){.feature{padding:20px;border-radius:24px}.play{width:56px;height:56px}.grid{gap:8px}.day{min-height:124px}.panel{border-radius:24px;padding:22px}.controls{flex-direction:column}.controls button{width:100%}}
@media(prefers-reduced-motion:reduce){.orb{animation:none}}