.app{position:relative;width:100vw;height:100vh;overflow:hidden}:root{--accent-gold: #f5c518;--accent-rgb: 245, 197, 24;--accent-gold-dim: rgba(var(--accent-rgb), .12);--bg-gradient: linear-gradient( 180deg, rgba(0, 0, 0, .6), rgba(0, 0, 0, .9) )}.app[data-mode=aggressive]{--accent-gold: #ff4444;--accent-rgb: 255, 68, 68}.sticky-note{position:fixed;top:1.25rem;left:1.25rem;z-index:30;width:min(260px,calc(100vw - 2rem));min-width:200px;min-height:150px;max-width:calc(100vw - 2.25rem);background:linear-gradient(180deg,#fff8dc,#fff3b8);color:#0b0b0b;border-radius:12px;padding:.9rem 1rem;box-shadow:0 16px 40px #02020659,0 3px 10px #00000026;border:1px solid rgba(255,230,138,.6);font-weight:600;pointer-events:auto;transform-origin:left top;transform:rotate(-.6deg);transition:transform .22s ease,box-shadow .22s ease;touch-action:none}.sticky-note{cursor:grab}.sticky-note.dragging{cursor:grabbing}.sticky-note:hover{transform:translateY(-3px) rotate(-.4deg) scale(1.01);box-shadow:0 18px 46px #02020659}.sticky-note h4{margin:0 0 .45rem;font-size:.85rem;color:#2b2b2b;letter-spacing:.02em}.sticky-editor{display:block}.sticky-textarea{width:100%;min-height:164px;padding:.85rem .9rem;border:none;border-radius:0;resize:none;font-family:inherit;font-size:.82rem;line-height:1.5;color:#5f4302;background:transparent;box-shadow:none;outline:none}.sticky-textarea::placeholder{color:#6b580d80}.sticky-textarea:focus{box-shadow:inset 0 1px 2px #0000000f}.sticky-note:before{content:"";position:absolute;right:10px;top:8px;width:16px;height:16px;background:linear-gradient(45deg,rgba(0,0,0,.06),rgba(255,255,255,.08));transform:rotate(12deg);border-radius:3px;opacity:.85}@media (max-width: 700px){.sticky-note{top:.9rem;left:.9rem;width:44vw;padding:.7rem .8rem;border-radius:8px}.sticky-note h4{font-size:.78rem}.sticky-textarea{font-size:.72rem;min-height:140px}}.fullscreen-bg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0}.bg-image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;opacity:0;transition:opacity .6s ease-in-out}.bg-image.active{opacity:1}.bg-darken{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,rgba(0,0,0,.1) 40%,transparent 60%),linear-gradient(to bottom,rgba(0,0,0,.3) 0%,transparent 20%),radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.4) 100%);pointer-events:none}.bg-particles{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1;pointer-events:none;overflow:hidden}.particle{position:absolute;width:2px;height:2px;background:var(--accent-gold);border-radius:50%;opacity:0;animation:float-particle 8s infinite ease-in-out}.particle:nth-child(1){left:10%;animation-delay:0s;animation-duration:7s}.particle:nth-child(2){left:25%;animation-delay:1.5s;animation-duration:9s}.particle:nth-child(3){left:40%;animation-delay:3s;animation-duration:6s}.particle:nth-child(4){left:55%;animation-delay:.5s;animation-duration:8s}.particle:nth-child(5){left:70%;animation-delay:2s;animation-duration:10s}.particle:nth-child(6){left:85%;animation-delay:4s;animation-duration:7s}.particle:nth-child(7){left:15%;animation-delay:2.5s;animation-duration:9s}.particle:nth-child(8){left:50%;animation-delay:1s;animation-duration:6.5s}.particle:nth-child(9){left:35%;animation-delay:3.5s;animation-duration:8.5s}.particle:nth-child(10){left:75%;animation-delay:.8s;animation-duration:7.5s}@keyframes float-particle{0%{transform:translateY(100vh) scale(0);opacity:0}10%{opacity:.4}90%{opacity:.05}to{transform:translateY(-10vh) scale(1);opacity:0}}.controls-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10;display:flex;align-items:flex-end;justify-content:center;pointer-events:none;transition:opacity .6s ease}.controls-overlay.visible{opacity:1}.controls-overlay.hidden{opacity:0}.bottom-bar{width:100%;padding:2rem 2.5rem 2.5rem;display:flex;flex-direction:column;align-items:center;gap:1.5rem;pointer-events:auto;background:linear-gradient(to top,rgba(0,0,0,.7) 0%,transparent 100%)}.visualizer{display:flex;align-items:flex-end;justify-content:center;gap:3px;height:32px;animation:fadeIn .5s ease}.visualizer-bar{width:3px;background:linear-gradient(to top,var(--accent-gold),rgba(var(--accent-rgb),.3));border-radius:2px;transition:height .15s ease}.visualizer-bar.is-playing{animation:visualize var(--duration) ease-in-out infinite alternate}.visualizer-bar.is-paused{height:4px!important;opacity:.3;transition:all .5s ease}@keyframes visualize{0%{height:var(--min-h)}to{height:var(--max-h)}}.mode-toggle{display:flex;gap:4px;padding:.35rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:50px;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}.mode-btn{padding:.45rem 1.2rem;border:none;border-radius:50px;background:transparent;color:#ffffff73;font-family:inherit;font-size:.65rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;outline:none;transition:all .3s ease}.mode-btn:hover{color:#ffffffd9}.mode-btn.active{color:var(--accent-gold);background:rgba(var(--accent-rgb),.12);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.5);text-shadow:0 0 12px rgba(var(--accent-rgb),.6)}.center-controls{display:flex;flex-direction:column;align-items:center;gap:.75rem}.play-btn{position:relative;width:72px;height:72px;border-radius:50%;border:2px solid rgba(var(--accent-rgb),.6);background:rgba(10,10,15,.6);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .4s cubic-bezier(.25,.46,.45,.94);outline:none;overflow:hidden}.play-btn:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:radial-gradient(circle at center,var(--accent-gold-dim),transparent 70%);opacity:0;transition:opacity .3s ease}.play-btn:hover{transform:scale(1.1);border-color:var(--accent-gold);box-shadow:0 0 40px rgba(var(--accent-rgb),.3),0 0 80px rgba(var(--accent-rgb),.1)}.play-btn:hover:before{opacity:1}.play-btn:active{transform:scale(.95)}.play-btn.is-playing{border-color:var(--accent-gold);box-shadow:0 0 25px rgba(var(--accent-rgb),.25);animation:btn-glow 2s ease-in-out infinite}@keyframes btn-glow{0%,to{box-shadow:0 0 20px rgba(var(--accent-rgb),.2)}50%{box-shadow:0 0 40px rgba(var(--accent-rgb),.4)}}.btn-icon{position:relative;z-index:1;color:var(--accent-gold)}.icon-play{width:0;height:0;border-style:solid;border-width:12px 0 12px 22px;border-color:transparent transparent transparent var(--accent-gold);margin-left:4px}.icon-pause{display:flex;gap:6px}.icon-pause span{display:block;width:5px;height:24px;background:var(--accent-gold);border-radius:2px}.status-label{font-size:.7rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:#fff6;transition:color .3s ease}.status-label.is-playing{color:var(--accent-gold)}.volume-control{display:flex;align-items:center;gap:.75rem;padding:.5rem 1.25rem;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:50px;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px)}.volume-icon{color:#ffffff80;flex-shrink:0}.volume-slider{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:120px;height:3px;background:linear-gradient(to right,var(--accent-gold) 0%,var(--accent-gold) var(--volume-pct, 70%),rgba(255,255,255,.1) var(--volume-pct, 70%));border-radius:2px;outline:none;cursor:pointer;transition:height .2s ease}.volume-slider:hover{height:5px}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:var(--accent-gold);cursor:pointer;box-shadow:0 0 10px #f5c51880;transition:transform .2s ease}.volume-slider::-webkit-slider-thumb:hover{transform:scale(1.3)}.volume-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:var(--accent-gold);cursor:pointer;border:none;box-shadow:0 0 10px #f5c51880}.volume-value{font-size:.7rem;font-weight:500;color:#fff6;min-width:32px;text-align:right}.youtube-container{position:fixed;top:-9999px;left:-9999px;width:1px;height:1px;opacity:0;pointer-events:none}.footer{position:fixed;bottom:.75rem;left:50%;transform:translate(-50%);font-size:.6rem;color:#fff3;letter-spacing:.15em;white-space:nowrap;z-index:11;transition:opacity .6s ease}.footer.visible{opacity:1}.footer.hidden{opacity:0}.pomodoro{position:fixed;top:1.25rem;right:1.25rem;z-index:30;display:flex;flex-direction:column;align-items:flex-end;gap:.55rem}.pomodoro-pill{display:flex;align-items:center;gap:.55rem;padding:.5rem 1.05rem;background:rgba(10,10,15,.55);border:1px solid rgba(255,255,255,.1);border-radius:50px;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);color:#ffffffd9;font-family:inherit;cursor:pointer;outline:none;transition:border-color .3s ease,box-shadow .3s ease}.pomodoro-pill:hover{border-color:rgba(var(--accent-rgb),.45);box-shadow:0 0 18px rgba(var(--accent-rgb),.12)}.pomodoro-pill svg{color:var(--accent-gold);flex-shrink:0}.pomodoro-phase{font-size:.58rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#ffffff73}.pomodoro-time{font-size:.82rem;font-weight:600;letter-spacing:.06em;font-variant-numeric:tabular-nums}.pomodoro-panel{width:236px;padding:1.15rem 1.25rem 1rem;background:rgba(8,8,12,.72);border:1px solid rgba(255,255,255,.09);border-radius:16px;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 18px 46px #02020673;display:flex;flex-direction:column;align-items:center;gap:.75rem;animation:fadeIn .35s ease}.pomodoro-status{margin:0;font-size:.6rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#ffffff6b}.pomodoro-clock{font-size:2.3rem;line-height:1;font-weight:700;letter-spacing:.04em;font-variant-numeric:tabular-nums;color:var(--accent-gold);text-shadow:0 0 26px rgba(var(--accent-rgb),.35)}.pomodoro-track{width:100%;height:4px;border-radius:2px;background:rgba(255,255,255,.08);overflow:hidden}.pomodoro-fill{height:100%;border-radius:2px;background:linear-gradient(to right,rgba(var(--accent-rgb),.45),var(--accent-gold));transition:width .3s linear}.pomodoro-dots{display:flex;gap:.5rem}.pomodoro-dot{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.14);transition:all .3s ease}.pomodoro-dot.filled{background:var(--accent-gold);box-shadow:0 0 8px rgba(var(--accent-rgb),.55)}.pomodoro-controls{width:100%;display:flex;flex-wrap:wrap;justify-content:center;gap:.45rem;margin-top:.15rem}.pomodoro-btn{padding:.42rem .95rem;border:none;border-radius:50px;background:transparent;color:#ffffff8c;font-family:inherit;font-size:.6rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;outline:none;transition:all .3s ease}.pomodoro-btn.alarm-stop{flex-basis:100%}.pomodoro-btn:hover{color:#ffffffe6}.pomodoro-btn.primary{color:var(--accent-gold);background:rgba(var(--accent-rgb),.12);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.5)}.pomodoro-btn.primary:hover{background:rgba(var(--accent-rgb),.2)}.pomodoro-stats{margin:0;font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:#ffffff47}@media (max-width: 600px){.pomodoro{top:.9rem;right:.9rem}.pomodoro-panel{width:min(236px,calc(100vw - 1.8rem))}.pomodoro-clock{font-size:2rem}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media (max-width: 600px){.bottom-bar{padding:1.5rem 1rem 2rem;gap:1rem}.play-btn{width:60px;height:60px}.volume-slider{width:80px}.icon-play{border-width:10px 0 10px 18px}.icon-pause span{height:20px;width:4px}.mode-btn{padding:.35rem .85rem;font-size:.58rem;letter-spacing:.12em}}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #0a0a0f;--bg-secondary: #12121a;--bg-card: rgba(18, 18, 26, .85);--bg-glass: rgba(255, 255, 255, .03);--border-glass: rgba(255, 255, 255, .06);--text-primary: #e8e6e3;--text-secondary: #8a8a9a;--text-accent: #f5c518;--accent-gold: #f5c518;--accent-gold-dim: rgba(245, 197, 24, .15);--accent-gold-glow: rgba(245, 197, 24, .4);--accent-blue: #3a7bd5;--accent-blue-dim: rgba(58, 123, 213, .15);--shadow-dark: 0 20px 60px rgba(0, 0, 0, .6);--shadow-glow: 0 0 40px rgba(245, 197, 24, .08);--radius-sm: 8px;--radius-md: 16px;--radius-lg: 24px;--radius-xl: 32px;--font-display: "Cinzel", serif;--font-body: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;--transition-smooth: all .4s cubic-bezier(.25, .46, .45, .94);--transition-bounce: all .5s cubic-bezier(.34, 1.56, .64, 1)}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--bg-primary);color:var(--text-primary);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:rgba(245,197,24,.2);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:rgba(245,197,24,.4)}::selection{background:var(--accent-gold-dim);color:var(--accent-gold)}