:root{--bg-deep:#060812;--bg-card:#12162da6;--bg-card-hover:#1c2241cc;--border-glow:#9378ff33;--border-glow-active:#9378ff80;--accent-purple:#9d4edd;--accent-teal:#48cae4;--accent-pink:#f72585;--accent-amber:#ffb703;--text-main:#f0f2fe;--text-muted:#8e95bf;--input-bg:#0a0c1999;--font-primary:"Outfit", sans-serif;--font-secondary:"Plus Jakarta Sans", sans-serif;--font-mono:"Space Grotesk", monospace;--radius-xl:24px;--radius-lg:16px;--radius-full:9999px;--shadow-glow:0 12px 40px #9d4edd26;--shadow-card:0 8px 32px #0000004d}[data-theme=light]{--bg-deep:#f3f5fc;--bg-card:#ffffffbf;--bg-card-hover:#fffffff2;--border-glow:#7209b726;--border-glow-active:#7209b759;--accent-purple:#7209b7;--accent-teal:#0077b6;--accent-pink:#d81b60;--accent-amber:#d97706;--text-main:#1e2238;--text-muted:#64748b;--input-bg:#f1f5f9e6;--shadow-glow:0 12px 35px #7209b71f;--shadow-card:0 10px 30px #646e8c1f}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}body{background-color:var(--bg-deep);color:var(--text-main);font-family:var(--font-primary);-webkit-font-smoothing:antialiased;min-height:100vh;transition:background-color .4s,color .4s;position:relative;overflow-x:hidden}#bg-canvas{z-index:0;pointer-events:none;width:100vw;height:100vh;position:fixed;top:0;left:0}#app{z-index:1;flex-direction:column;max-width:1300px;min-height:100vh;margin:0 auto;padding:24px 20px;display:flex;position:relative}.top-header{background:var(--bg-card);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--border-glow);border-radius:var(--radius-full);box-shadow:var(--shadow-glow);justify-content:space-between;align-items:center;margin-bottom:24px;padding:16px 28px;transition:all .3s;display:flex}.top-header:hover{border-color:var(--border-glow-active)}.brand-wrapper{cursor:pointer;align-items:center;gap:12px;display:flex}.brand-icon{font-size:28px;animation:4s ease-in-out infinite pulse-float}.brand-title{letter-spacing:-.5px;background:linear-gradient(135deg, var(--text-main), var(--accent-purple), var(--accent-teal));-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:22px;font-weight:700}.domain-badge{font-family:var(--font-mono);color:var(--accent-purple);letter-spacing:.5px;background:#7209b71a;border:1px solid #7209b740;border-radius:12px;padding:4px 10px;font-size:11px}.nav-pill-bar{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--border-glow);border-radius:var(--radius-full);scrollbar-width:thin;scrollbar-color:var(--accent-purple) transparent;justify-content:flex-start;align-items:center;gap:8px;margin-bottom:28px;padding:8px 12px;display:flex;overflow-x:auto}.nav-pill-bar::-webkit-scrollbar{height:4px}.nav-pill-bar::-webkit-scrollbar-thumb{background:var(--accent-purple);border-radius:4px}.nav-pill{color:var(--text-muted);border-radius:var(--radius-full);font-family:var(--font-secondary);cursor:pointer;white-space:nowrap;background:0 0;border:none;flex-shrink:0;align-items:center;gap:6px;padding:8px 18px;font-size:13px;font-weight:500;text-decoration:none;transition:all .25s;display:flex}.nav-pill:hover{color:var(--text-main);background:#7209b71a}.nav-pill.active{background:linear-gradient(135deg, var(--accent-purple), var(--accent-teal));color:#fff;font-weight:600;box-shadow:0 4px 20px #7209b74d}.cat-pill-container{scrollbar-width:thin;scrollbar-color:var(--accent-purple) transparent;align-items:center;gap:8px;margin-bottom:12px;padding:6px 2px 10px;display:flex;overflow-x:auto}.cat-pill-container::-webkit-scrollbar{height:4px}.cat-pill-container::-webkit-scrollbar-thumb{background:var(--border-glow-active);border-radius:4px}.cat-pill{border:1px solid var(--border-glow);color:var(--text-main);border-radius:var(--radius-full);white-space:nowrap;cursor:pointer;background:#ffffff14;flex-shrink:0;align-items:center;gap:4px;height:32px;padding:6px 14px;font-size:12px;font-weight:500;transition:all .2s;display:inline-flex}[data-theme=light] .cat-pill{background:#fff}.cat-pill:hover{border-color:var(--accent-purple);background:#7209b726;transform:translateY(-1px)}.cat-pill.active{background:linear-gradient(135deg, var(--accent-purple), var(--accent-teal));color:#fff;border-color:#0000;font-weight:600;box-shadow:0 4px 14px #7209b759}.header-controls{align-items:center;gap:12px;display:flex}.theme-btn{border:1px solid var(--border-glow);color:var(--text-main);border-radius:var(--radius-full);font-family:var(--font-secondary);cursor:pointer;background:#ffffff1a;align-items:center;gap:8px;padding:8px 16px;font-size:13px;font-weight:500;transition:all .3s;display:flex;box-shadow:0 4px 12px #0000000d}[data-theme=light] .theme-btn{background:#fff;border-color:#7209b733;box-shadow:0 4px 15px #7209b714}.theme-btn:hover{border-color:var(--accent-purple);transform:translateY(-2px)}.battery-status{font-family:var(--font-mono);color:var(--accent-amber);cursor:pointer;background:#ffb7031f;border:1px solid #ffb7034d;border-radius:20px;align-items:center;gap:8px;padding:6px 14px;font-size:13px;transition:all .3s;display:flex}.battery-status:hover{background:#ffb70333;transform:scale(1.04)}.battery-icon{border:1px solid var(--accent-amber);border-radius:2px;width:14px;height:8px;padding:1px;position:relative}.battery-icon:after{content:"";background:var(--accent-amber);border-radius:0 1px 1px 0;width:2px;height:4px;position:absolute;top:2px;right:-3px}.battery-level{background:var(--accent-amber);border-radius:1px;width:15%;height:100%;animation:2s infinite alternate flicker-low}.audio-bar{align-items:center;gap:10px;display:flex}.audio-btn{border:1px solid var(--border-glow);color:var(--text-main);border-radius:var(--radius-full);font-family:var(--font-secondary);cursor:pointer;background:#ffffff14;align-items:center;gap:6px;padding:8px 14px;font-size:12px;font-weight:500;transition:all .25s;display:flex}[data-theme=light] .audio-btn{background:#fff}.audio-btn:hover{border-color:var(--accent-purple);background:#9d4edd26;transform:translateY(-2px)}.audio-btn.active{background:linear-gradient(135deg, var(--accent-purple), var(--accent-teal));color:#fff;border-color:#0000;box-shadow:0 4px 20px #7209b74d}.page-view{animation:.4s fadeIn;display:none}.page-view.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.main-grid{grid-template-columns:repeat(12,1fr);gap:20px;margin-bottom:40px;display:grid}.glass-card{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--border-glow);border-radius:var(--radius-xl);box-shadow:var(--shadow-card);padding:28px;transition:all .35s cubic-bezier(.2,.8,.2,1);position:relative;overflow:hidden}.glass-card:hover{border-color:var(--border-glow-active);box-shadow:var(--shadow-glow);transform:translateY(-3px)}.dedicated-page-card{flex-direction:column;justify-content:space-between;min-height:520px;display:flex}.card-header{align-items:center;gap:12px;margin-bottom:18px;display:flex}.card-icon{width:42px;height:42px;color:var(--accent-purple);background:#7209b71f;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;font-size:22px;display:flex}.card-title{letter-spacing:-.3px;font-size:20px;font-weight:600}.card-subtitle{color:var(--text-muted);font-size:13px;font-family:var(--font-secondary)}.span-12{grid-column:span 12}.span-8{grid-column:span 8}.span-6{grid-column:span 6}.span-4{grid-column:span 4}@media (width<=900px){.span-8,.span-6,.span-4{grid-column:span 12}.top-header{border-radius:20px;flex-direction:column;align-items:stretch;gap:16px}.header-controls{justify-content:space-between}.audio-bar{flex-wrap:wrap;justify-content:center}.nav-pill-bar{border-radius:20px}}.do-nothing-container{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:40px 20px;display:flex}.timer-circle{background:radial-gradient(circle,#7209b70f 0%,#0000 70%);border:3px solid #7209b733;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:170px;height:170px;margin:20px 0;transition:all .5s;display:flex;position:relative}.timer-circle.running{border-color:var(--accent-teal);animation:3s ease-in-out infinite pulse-ring;box-shadow:0 0 35px #0077b64d}.timer-time{font-family:var(--font-mono);color:var(--text-main);font-size:42px;font-weight:700}.timer-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:1px;font-size:12px}.whisper-box{min-height:28px;color:var(--accent-pink);margin-top:10px;font-size:14px;font-weight:500;transition:opacity .3s}.glow-btn{background:linear-gradient(135deg, var(--accent-purple), #5c099c);color:#fff;border-radius:var(--radius-full);font-family:var(--font-primary);cursor:pointer;border:none;padding:12px 28px;font-size:14px;font-weight:600;transition:all .3s;box-shadow:0 6px 20px #7209b759}.glow-btn:hover{transform:translateY(-2px)scale(1.02);box-shadow:0 10px 30px #7209b780}.glow-btn:active{transform:scale(.98)}.scream-textarea{background:var(--input-bg);border:1px solid var(--border-glow);border-radius:var(--radius-lg);width:100%;height:110px;color:var(--text-main);font-family:var(--font-secondary);resize:none;outline:none;padding:16px;font-size:14px;transition:all .3s}.scream-textarea:focus{border-color:var(--accent-purple);box-shadow:0 0 15px #7209b733}.abyss-actions{justify-content:space-between;align-items:center;margin-top:14px;display:flex}.breath-wrapper{flex-direction:column;align-items:center;padding:20px 0;display:flex}.breath-orb{background:radial-gradient(circle, var(--accent-teal) 0%, var(--accent-purple) 100%);border-radius:50%;justify-content:center;align-items:center;width:150px;height:150px;transition:transform 4s cubic-bezier(.4,0,.2,1),box-shadow 4s;display:flex;position:relative;box-shadow:0 0 30px #0077b666}.breath-orb.dedicated-large{width:220px;height:220px}.breath-orb.inhale{transform:scale(1.6);box-shadow:0 0 60px #0077b6b3}.breath-orb.hold{transform:scale(1.6);box-shadow:0 0 70px #d81b60b3}.breath-orb.exhale{transform:scale(1);box-shadow:0 0 25px #7209b766}.breath-text{color:#fff;letter-spacing:.5px;font-size:18px;font-weight:600}.bubble-canvas-container{border-radius:var(--radius-lg);background:var(--input-bg);border:1px solid var(--border-glow);width:100%;height:220px;position:relative;overflow:hidden}.bubble-canvas-container.dedicated-large{height:400px}#bubble-canvas,.dedicated-bubble-canvas{cursor:pointer;width:100%;height:100%}.bubble-stats{font-family:var(--font-mono);color:var(--accent-teal);pointer-events:none;background:#0000004d;border-radius:10px;padding:4px 10px;font-size:12px;position:absolute;bottom:12px;left:16px}[data-theme=light] .bubble-stats{color:var(--accent-purple);background:#ffffffd9}.advice-card-inner{flex-direction:column;justify-content:space-between;min-height:180px;padding:10px 0;display:flex}.advice-quote{color:var(--text-main);font-size:18px;font-style:italic;font-weight:500;line-height:1.5}.advice-footer{justify-content:space-between;align-items:center;margin-top:18px;display:flex}.secondary-btn{border:1px solid var(--border-glow);color:var(--text-main);border-radius:var(--radius-full);cursor:pointer;background:#ffffff1a;padding:8px 16px;font-size:12px;transition:all .2s}[data-theme=light] .secondary-btn{background:#fff}.secondary-btn:hover{border-color:var(--accent-purple);background:#7209b71a}.secondary-btn.active{background:var(--accent-purple);color:#fff;border-color:#0000}.squish-canvas-container{border-radius:var(--radius-lg);background:var(--input-bg);border:1px solid var(--border-glow);width:100%;height:200px;position:relative;overflow:hidden}.squish-canvas-container.dedicated-large{height:400px}#squish-canvas,.dedicated-squish-canvas{cursor:grab;width:100%;height:100%}#squish-canvas:active,.dedicated-squish-canvas:active{cursor:grabbing}@keyframes pulse-float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-4px)rotate(5deg)}}@keyframes pulse-ring{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}@keyframes flicker-low{0%,to{opacity:1}50%{opacity:.3}}footer{text-align:center;color:var(--text-muted);font-size:13px;font-family:var(--font-secondary);border-top:1px solid var(--border-glow);flex-direction:column;align-items:center;gap:6px;margin-top:auto;padding:24px 0 10px;display:flex}.footer-link{color:var(--accent-purple);font-weight:500;text-decoration:none}.footer-link:hover{text-decoration:underline}