:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#ffffffde;background-color:#050505;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--neon-red: #ff3366;--neon-green: #00ffaa;--neon-blue: #00e5ff;--glass-bg: rgba(255, 255, 255, .03);--glass-border: rgba(255, 255, 255, .08)}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh;overflow:hidden;background-color:#050505}#root{width:100%;height:100vh;display:flex;flex-direction:row}.app-container{display:flex;width:100%;height:100%;position:relative}.sidebar{width:80px;height:100%;background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-right:1px solid var(--glass-border);display:flex;flex-direction:column;align-items:center;padding:30px 0;gap:30px;z-index:10}.icon-btn{width:48px;height:48px;border-radius:12px;background:var(--glass-bg);border:1px solid var(--glass-border);color:#ffffff80;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .3s ease}.icon-btn:hover{background:#ffffff1a;color:#fff;transform:translateY(-2px)}.icon-btn.active{border-color:var(--neon-red);color:var(--neon-red);box-shadow:0 0 15px #ff33664d}.main-content{flex:1;display:flex;justify-content:center;align-items:center;position:relative}.timer-container{position:relative;width:400px;height:400px;display:flex;flex-direction:column;justify-content:center;align-items:center}.progress-ring{position:absolute;top:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.progress-ring circle{fill:transparent;stroke-width:6;stroke-linecap:round;transition:stroke-dashoffset .1s linear,stroke .3s ease}.progress-ring-bg{stroke:var(--glass-border)}.progress-ring-fg{stroke:var(--neon-red);filter:drop-shadow(0 0 10px rgba(255,51,102,.5))}.timer-text-container{display:flex;flex-direction:column;align-items:center;z-index:2}.phase-label{font-size:1.2rem;letter-spacing:4px;text-transform:uppercase;color:var(--neon-red);margin-bottom:10px;font-weight:600;text-shadow:0 0 10px rgba(255,51,102,.4)}.time-display{font-size:6rem;font-weight:300;color:#fff;font-variant-numeric:tabular-nums;line-height:1;margin-bottom:15px}.next-up{font-size:1rem;color:#ffffff80}.start-overlay{position:absolute;bottom:40px;left:50%;transform:translate(-50%)}.btn-primary{padding:12px 40px;font-size:1.2rem;font-weight:600;color:#000;background:#fff;border:none;border-radius:30px;cursor:pointer;box-shadow:0 0 20px #fff3;transition:all .3s ease;letter-spacing:1px}.btn-primary:hover{transform:scale(1.05);box-shadow:0 0 30px #fff6}.config-panel{position:absolute;top:0;left:80px;width:350px;height:100%;background:#0a0a0acc;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-right:1px solid var(--glass-border);padding:30px;transform:translate(-100%);transition:transform .4s cubic-bezier(.16,1,.3,1);box-sizing:border-box;display:flex;flex-direction:column;overflow-y:auto;z-index:5}.config-panel.open{transform:translate(0)}.config-panel h2{margin-top:0;font-size:1.5rem;font-weight:400;margin-bottom:30px}.setting-group{margin-bottom:25px}.setting-group label{display:flex;justify-content:space-between;font-size:.9rem;color:#ffffffb3;margin-bottom:10px}.setting-group input[type=range]{width:100%;accent-color:var(--neon-red)}.setting-group input[type=checkbox]{accent-color:var(--neon-red)}@keyframes breatheWork{0%{box-shadow:inset 0 0 #f360}50%{box-shadow:inset 0 0 150px #ff33661a}to{box-shadow:inset 0 0 #f360}}@keyframes breatheRest{0%{box-shadow:inset 0 0 #0fa0}50%{box-shadow:inset 0 0 150px #00ffaa0d}to{box-shadow:inset 0 0 #0fa0}}.breathe-work{animation:breatheWork 4s ease-in-out infinite}.breathe-rest{animation:breatheRest 6s ease-in-out infinite}.sound-select{width:100%;padding:10px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:8px;color:#fff;font-family:inherit;font-size:.9rem;outline:none;cursor:pointer;box-sizing:border-box;transition:all .3s ease}.sound-select:focus{border-color:var(--neon-red)}.sound-select option{background:#111;color:#fff}.restore-btn{position:absolute;top:15px;right:15px;width:36px;height:36px;border-radius:50%;background:var(--glass-bg);border:1px solid var(--glass-border);color:#fff9;display:flex;justify-content:center;align-items:center;cursor:pointer;z-index:100;transition:all .3s ease}.restore-btn:hover{background:#ffffff1a;color:#fff;transform:scale(1.1)}.app-container.mini-mode{justify-content:center;align-items:center}.app-container.mini-mode .sidebar,.app-container.mini-mode .config-panel{display:none!important}.app-container.mini-mode .main-content{flex:1;width:100%;height:100%;flex-direction:column;padding:20px;box-sizing:border-box;justify-content:space-evenly}.app-container.mini-mode .timer-container{width:260px;height:260px}.app-container.mini-mode .time-display{font-size:3.5rem;margin-bottom:5px}.app-container.mini-mode .phase-label{font-size:.9rem;letter-spacing:2px;margin-bottom:5px}.app-container.mini-mode .next-up{font-size:.75rem}.app-container.mini-mode .start-overlay{position:relative;bottom:auto;left:auto;transform:none;margin-top:10px;z-index:2}.app-container.mini-mode .btn-primary{padding:8px 30px;font-size:1rem}