*{box-sizing:border-box}:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#ecfeff;background:#071827;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--glass:rgba(255,255,255,.12);--glass-border:rgba(255,255,255,.2);--cyan:#67e8f9;--teal:#2dd4bf;--soft:rgba(236,254,255,.76)}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden}button{font:inherit}.appShell{position:relative;min-height:100vh;padding:28px;overflow:hidden;background:radial-gradient(circle at top left,rgba(45,212,191,.28),transparent 34%),radial-gradient(circle at 80% 12%,rgba(96,165,250,.26),transparent 30%),linear-gradient(145deg,#06111f,#0b2540 48%,#052e36)}.waterGlow{position:fixed;border-radius:999px;filter:blur(18px);opacity:.7;pointer-events:none;animation:drift 8s ease-in-out infinite alternate}.glowOne{width:220px;height:220px;left:-70px;bottom:10%;background:#2dd4bf38}.glowTwo{width:280px;height:280px;right:-90px;top:20%;background:#7df9ff29;animation-delay:1.5s}@keyframes drift{0%{transform:translateZ(0) scale(1)}to{transform:translate3d(20px,-18px,0) scale(1.08)}}.glass{background:var(--glass);border:1px solid var(--glass-border);box-shadow:0 24px 90px #00000047;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px)}.topBar{position:relative;z-index:1;display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:28px}.topActions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.brand{display:flex;align-items:center;gap:14px}.brandIcon{width:52px;height:52px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(135deg,#67e8f9f2,#2dd4bfdb);color:#042f3f;box-shadow:0 16px 40px #2dd4bf42}.brand h1{margin:0;font-size:clamp(1.45rem,3vw,2.2rem);letter-spacing:-.04em}.brand p{margin:4px 0 0;color:var(--soft)}.languageButton,.primaryButton,.secondaryButton,.quietButton,.modeButton,.moodButton,.spotifyTopButton{border:0;cursor:pointer;color:inherit}.spotifyTopButton{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 16px;border-radius:999px;border:1px solid rgba(30,215,96,.42);background:linear-gradient(135deg,#1ed760eb,#2dd4bfdb);color:#032c35;font-weight:900;box-shadow:0 12px 30px #1ed76038}.spotifyTopButton.connected{background:linear-gradient(135deg,#67e8f9f2,#1ed760e0)}.spotifyTopButton:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}.languageButton{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 14px;border-radius:999px;background:#ffffff1f;border:1px solid rgba(255,255,255,.18)}.layout{position:relative;z-index:1;display:grid;grid-template-columns:minmax(245px,320px) 1fr;gap:22px;align-items:stretch}.sidePanel,.ritualPanel{border-radius:32px;padding:22px}.sectionTitle{display:flex;align-items:center;gap:8px;color:#cffafe;font-weight:800;margin-bottom:16px}.modeStack{display:grid;gap:12px}.modeButton{width:100%;min-height:84px;display:flex;align-items:center;gap:14px;text-align:left;padding:16px;border-radius:24px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);opacity:.78;transition:.18s}.modeButton:hover{transform:translateY(-2px);opacity:1}.modeButton.active{opacity:1;background:linear-gradient(135deg,#67e8f940,#2dd4bf33);border-color:#67e8f96b;box-shadow:0 16px 40px #2dd4bf29}.modeEmoji{display:grid;place-items:center;width:48px;height:48px;border-radius:18px;background:#ffffff1f;font-size:1.45rem}.modeText{display:grid;gap:4px}.modeText strong{font-size:1.15rem}.modeText small{color:var(--soft)}.spotifyCard,.soundList,.notifyCard{margin-top:18px;padding:14px;border-radius:22px;background:#0000002e;color:#ecfeffb8;font-size:.92rem}.spotifyPanel{display:grid;gap:10px;border-color:#1ed76057;background:linear-gradient(135deg,#1ed76021,#67e8f914),#0000002e}.spotifyTitle,.notifyHeader{display:flex;align-items:center;gap:8px;color:#cffafe}.spotifyPanel p,.notifyCard p{margin:0;line-height:1.45}.spotifyError,.notifyDenied{color:#fecaca;font-size:.82rem;word-break:break-word}.soundListTitle{color:#cffafe;font-weight:800;margin-bottom:8px}.soundLine{padding:5px 0;border-top:1px solid rgba(255,255,255,.08)}.notifyHeader{margin-bottom:8px}.notifyCard p{margin-bottom:12px}.notifyActions{display:grid;gap:8px}.smallButton{min-height:38px;font-size:.9rem}.notifyStatus{display:inline-flex;justify-content:center;padding:8px 10px;border-radius:999px;background:#2dd4bf2e;color:#ccfbf1;font-weight:800}.ritualPanel{min-height:640px;display:grid;align-content:space-between;gap:22px}.ritualTop{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.eyebrow{color:var(--cyan);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem}.ritualTop h2{margin:6px 0 0;font-size:clamp(1.45rem,3vw,2.25rem)}.ambientPill,.savedPill{border-radius:999px;padding:9px 13px;background:#67e8f924;color:#cffafe;white-space:nowrap}.ambientPill.ready{background:#2dd4bf38}.timerOrb{display:grid;place-items:center;min-height:360px}.orbRing{width:min(420px,78vw);aspect-ratio:1;display:grid;place-items:center;text-align:center;padding:40px;border-radius:50%;position:relative;background:radial-gradient(circle,rgba(236,254,255,.16),transparent 55%),linear-gradient(135deg,#67e8f942,#2dd4bf1c);border:1px solid rgba(255,255,255,.18);box-shadow:inset 0 0 70px #ffffff17,0 30px 90px #00000038}.orbRing:before{content:"";position:absolute;inset:18px;border-radius:50%;border:1px dashed rgba(236,254,255,.2);animation:spin 18s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.timerValue{font-size:clamp(4.2rem,11vw,7rem);font-weight:900;letter-spacing:-.08em;line-height:.9}.rotatingMessage{max-width:280px;margin:18px auto 0;color:#ecfeffc7;font-size:1.04rem;opacity:0;transform:translateY(4px) scale(.99);transition:.52s}.rotatingMessage.visible{opacity:1;transform:translateY(0) scale(1)}.controlRow{display:flex;justify-content:center;flex-wrap:wrap;gap:12px}.primaryButton,.secondaryButton,.quietButton{display:inline-flex;align-items:center;justify-content:center;gap:9px;border-radius:999px;min-height:46px;padding:0 18px;transition:.16s}.primaryButton{background:linear-gradient(135deg,#67e8f9,#2dd4bf);color:#032c35;font-weight:900;box-shadow:0 16px 36px #2dd4bf3d}.secondaryButton{background:#ffffff21;border:1px solid rgba(255,255,255,.16)}.quietButton{background:#0000002e;color:#ecfeffc7}.big{min-height:54px;padding-inline:22px}.primaryButton:hover,.secondaryButton:hover,.quietButton:hover{transform:translateY(-2px)}.modalOverlay{position:fixed;inset:0;z-index:10;display:grid;place-items:center;padding:18px;background:#02061785;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.extendModal{width:min(440px,100%);border-radius:32px;padding:28px;text-align:center;animation:modalIn .22s ease-out}@keyframes modalIn{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}.modalPulse{width:72px;height:72px;margin:0 auto 12px;display:grid;place-items:center;border-radius:28px;background:#67e8f929;font-size:2rem}.extendModal h2,.postCard h2{margin:0;font-size:1.75rem}.extendModal p,.postCard p{color:var(--soft);line-height:1.5}.modalActions{display:grid;gap:10px;margin-top:20px}.postCard{width:min(620px,100%);margin:auto;border-radius:32px;padding:28px;text-align:center}.moodGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px}.moodButton{display:grid;gap:9px;place-items:center;min-height:126px;border-radius:26px;padding:16px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);opacity:.56;transition:.18s}.moodButton:hover{opacity:.82}.moodButton.active{opacity:1;transform:translateY(-3px) scale(1.04);background:linear-gradient(135deg,#67e8f93b,#2dd4bf2e);border-color:#67e8f970;box-shadow:0 18px 42px #2dd4bf2e}.moodEmoji{font-size:2.4rem}.savedPill{display:inline-flex;margin-top:18px}@media(max-width:820px){.appShell{padding:18px}.layout{grid-template-columns:1fr}.ritualPanel{min-height:560px}.sidePanel,.ritualPanel{border-radius:26px}.modeStack{grid-template-columns:repeat(3,1fr)}.modeButton{min-height:120px;flex-direction:column;justify-content:center;text-align:center;padding:12px}.moodGrid{grid-template-columns:1fr}}@media(max-width:520px){.topBar{flex-direction:column;align-items:flex-start}.topActions{justify-content:flex-start}.modeStack{grid-template-columns:1fr}.timerOrb{min-height:300px}.orbRing{width:min(330px,82vw)}.timerValue{font-size:4rem}}
