@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&family=Space+Grotesk:wght@300;500;700&display=swap";:root{--bg-base:#0f172a;--mesh-c1:#7c3aed;--mesh-c2:#2563eb;--mesh-c3:#db2777;--mesh-c4:#0ea5e9;--text-primary:#fff;--text-secondary:#cbd5e1;--accent:#38bdf8;--ring-color:#38bdf8;--glass-bg:#0f172a66;--glass-border:#ffffff1a}.theme-break{--bg-base:#064e3b;--mesh-c1:#10b981;--mesh-c2:#059669;--mesh-c3:#34d399;--mesh-c4:#0d9488;--text-primary:#fff;--text-secondary:#a7f3d0;--accent:#10b981;--ring-color:#10b981;--glass-bg:#064e3b66;--glass-border:#ffffff26}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text-primary);background-color:var(--bg-base);margin:0;font-family:Outfit,sans-serif;overflow:hidden}.app-container{background-color:var(--bg-base);flex-direction:column;justify-content:center;align-items:center;width:100vw;height:100vh;transition:background-color 2s;display:flex;position:relative;overflow:hidden}.fluid-bg-container{z-index:0;background-color:var(--bg-base);filter:url(#fluid-filter);width:100vw;height:100vh;position:absolute;top:0;left:0;overflow:hidden}.blob{filter:blur(60px);opacity:.8;border-radius:50%;animation:20s ease-in-out infinite alternate float-blob;position:absolute}.blob-1{background-color:var(--mesh-c1);width:60vw;height:60vw;animation-delay:0s;top:-10vh;left:-10vw}.blob-2{background-color:var(--mesh-c2);width:70vw;height:70vw;animation-direction:alternate-reverse;animation-delay:-5s;bottom:-20vh;right:-10vw}.blob-3{background-color:var(--mesh-c3);width:50vw;height:50vw;animation-delay:-10s;top:40vh;left:30vw}.blob-4{background-color:var(--mesh-c4);width:80vw;height:80vw;animation-direction:alternate-reverse;animation-delay:-15s;top:10vh;right:30vw}@keyframes float-blob{0%{transform:translate(0)scale(1)}50%{transform:translate(15vw,10vh)scale(1.1)}to{transform:translate(-10vw,15vh)scale(.9)}}.glass-panel{z-index:10;background:var(--glass-bg);-webkit-backdrop-filter:blur(40px);border:1px solid var(--glass-border);border-radius:32px;flex-direction:column;align-items:center;width:90%;max-width:480px;padding:40px;transition:all .5s cubic-bezier(.4,0,.2,1);display:flex;position:relative;box-shadow:0 25px 50px -12px #00000080,inset 0 0 0 1px #ffffff0d}.time-display{letter-spacing:-2px;color:var(--text-primary);text-shadow:0 0 30px #ffffff4d;margin:20px 0;font-family:Space Grotesk,sans-serif;font-size:5rem;font-weight:700}.controls{gap:16px;margin-top:20px;display:flex}.btn-icon{border:1px solid var(--glass-border);width:56px;height:56px;color:var(--text-primary);cursor:pointer;background:#ffffff0d;border-radius:50%;outline:none;justify-content:center;align-items:center;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.btn-icon:hover{border-color:var(--accent);color:var(--accent);background:#ffffff1a;transform:scale(1.1);box-shadow:0 0 20px #ffffff1a}.btn-icon:active{transform:scale(.95)}.btn-main{background:var(--accent);color:#000;cursor:pointer;box-shadow:0 0 20px var(--accent);border:none;border-radius:28px;padding:0 32px;font-family:Outfit,sans-serif;font-size:1.1rem;font-weight:600;transition:all .2s cubic-bezier(.4,0,.2,1)}.btn-main:hover{filter:brightness(1.2);box-shadow:0 0 30px var(--accent);transform:scale(1.05)}.btn-main:active{transform:scale(.95)}.status-badge{letter-spacing:2px;text-transform:uppercase;color:var(--accent);border:1px solid var(--glass-border);background:#ffffff1a;border-radius:20px;margin-bottom:10px;padding:6px 16px;font-size:.9rem;font-weight:600}.timer-ring-wrapper{justify-content:center;align-items:center;display:flex;position:relative}.timer-ring-svg{filter:drop-shadow(0 0 15px #0009);width:280px;height:280px;transform:rotate(-90deg)}.timer-ring-bg{fill:none;stroke:#ffffff0d;stroke-width:6px}.timer-ring-progress{fill:none;stroke:var(--ring-color);stroke-width:6px;stroke-linecap:round;filter:drop-shadow(0 0 10px var(--ring-color));transition:stroke-dashoffset 1s linear,stroke 2s}.timer-content{flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute}.micro-container{background-color:var(--bg-base);justify-content:center;align-items:center;width:100%;height:100vh;padding:0 20px;display:flex}.micro-bar{-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);background:#0f172acc;border-radius:18px;justify-content:space-between;align-items:center;width:100%;max-width:600px;height:36px;padding:0 10px;display:flex;box-shadow:0 10px 30px #00000080}.theme-break .micro-bar{background:#064e3bcc}.micro-play-btn{background:var(--accent);color:#000;cursor:pointer;width:26px;height:26px;box-shadow:0 0 10px var(--accent);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex}.micro-play-btn:hover{filter:brightness(1.2);transform:scale(1.1)}.micro-play-btn:active{transform:scale(.95)}.micro-progress-container{background:#ffffff0d;border-radius:3px;flex:1;height:6px;margin:0 12px;position:relative;overflow:hidden;box-shadow:inset 0 1px 3px #000c}.micro-progress-fill{background:linear-gradient(90deg, var(--mesh-c1), var(--accent), var(--mesh-c3), var(--accent));height:100%;box-shadow:0 0 8px var(--accent);background-size:300% 100%;border-radius:3px;transition:width 1s linear;animation:3s linear infinite liquid-bar}@keyframes liquid-bar{0%{background-position:100% 0}to{background-position:-200% 0}}.micro-time{color:var(--text-primary);text-align:right;text-shadow:0 0 10px #fff3;flex-shrink:0;width:60px;font-family:Space Grotesk,sans-serif;font-size:1rem;font-weight:700}.micro-toggle-btn{appearance:none;color:var(--text-secondary);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;margin-left:8px;padding:8px;transition:all .2s;display:flex;background:0 0!important;border:none!important;outline:none!important}.micro-toggle-btn:hover{color:var(--text-primary)}.toast-container{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);color:#fff;z-index:100;background:#0f172ae6;border-radius:20px;align-items:center;gap:8px;padding:12px 24px;font-weight:600;animation:.3s ease-out forwards slide-up;display:flex;position:absolute;bottom:40px;left:50%;transform:translate(-50%);box-shadow:0 10px 30px #00000080}@keyframes slide-up{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}.pip-window-body{background-color:var(--bg-base);justify-content:center;align-items:center;width:100vw;height:100vh;margin:0;padding:0;font-family:Outfit,sans-serif;display:flex;overflow:hidden}.top-actions{z-index:20;position:absolute;top:24px;right:24px}.toggle-btn{border:1px solid var(--glass-border);width:40px;height:40px;color:var(--text-primary);cursor:pointer;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#ffffff1a;border-radius:12px;justify-content:center;align-items:center;transition:all .2s;display:flex}.toggle-btn:hover{color:var(--accent);background:#fff3;transform:scale(1.05)}.pip-ring-container{transform:scale(.8)}.onboarding-overlay{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1000;background:#0009;justify-content:center;align-items:center;width:100vw;height:100vh;padding:20px;display:flex;position:absolute;top:0;left:0}.onboarding-modal{text-align:center;max-width:400px;animation:.5s cubic-bezier(.4,0,.2,1) slide-up}.onboarding-modal h2{color:var(--accent);margin-bottom:16px;font-family:Space Grotesk,sans-serif;font-size:2rem}.onboarding-modal p{color:var(--text-secondary);margin-bottom:32px;font-size:1.1rem;line-height:1.6}@media (width<=480px){.glass-panel{width:95%;padding:24px 16px}.time-display{font-size:4rem}.controls{flex-wrap:wrap;justify-content:center;gap:8px}.btn-icon{width:48px;height:48px}.btn-main{padding:0 24px;font-size:1rem}}