:root{--background-color:#F9F5FF;--text-color:#333333;--primary-color:#8350C4;--secondary-color:#84BB9E;--accent-color:#F2EBF9;--timer-bg:#FFFFFF;--button-hover:#9C6ADE;--focus-bg-light:#F9F5FF;--break-bg-light:#F1F8E9;--long-break-bg-light:#E8F5E9;--timer-container-bg-light:#FFFFFF;--progress-bg-light:#E6E6E6;--start-button-bg:#4CAF50;--start-button-border:#389E38;--start-button-hover:#3D9140;--log-button-bg:#FF7979;--log-button-border:#FF5252;--log-button-hover:#E86262;--focus-bg-dark:#2D2040;--break-bg-dark:#2f442f;--long-break-bg-dark:#2D4A2D;--timer-container-bg-dark:#3D2963;--progress-bg-dark:#4A3A6B;--button-bg-dark:#8350C4;--button-hover-dark:#9C6ADE;--secondary-button-bg-dark:#5E9E75;--secondary-button-hover-dark:#84BB9E;--start-button-bg-dark:#379a5d;--start-button-border-dark:#3fa868;--start-button-hover-dark:#40aa69;--log-button-bg-dark:#C35151;--log-button-border-dark:#B33F3F;--log-button-hover-dark:#A94646;--progress-fill-focus:#9C6ADE;--progress-fill-break:#6BA089;--progress-fill-long-break:#5D8D7A}*{margin:0;padding:0;box-sizing:border-box}body{font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;background-color:var(--background-color);color:var(--text-color);line-height:1.6;padding:20px;margin:0 auto;max-width:800px}h2{color:var(--primary-color);margin-bottom:20px}details>summary>*{display:inline}details summary::marker{color:var(--primary-color)}details summary::-webkit-details-marker{color:var(--primary-color)}header{text-align:center;margin-bottom:30px;padding:20px}h1{color:var(--primary-color);font-size:2.5rem;margin-bottom:10px;display:flex;align-items:center;justify-content:center;gap:15px}.turnip-logo{width:90px;height:90px;display:inline-block}.tagline{font-size:1.2rem;color:var(--secondary-color);margin-bottom:15px}footer{text-align:center;margin-top:30px;padding:20px;color:var(--text-color);font-size:.9rem}.footer-links{margin-top:10px;font-size:.9rem}.footer-links a{color:var(--primary-color);text-decoration:none;margin:0 10px}.footer-links a:hover{text-decoration:underline}.timer-container{background-color:var(--timer-bg);border-radius:15px;box-shadow:0 8px 16px rgba(156,106,222,.2);padding:30px;text-align:center;margin-bottom:30px;position:relative;overflow:hidden}.timer-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center}.timer-header{position:relative;width:100%;margin-bottom:15px;text-align:center}.timer-label{font-size:1.5rem;color:var(--secondary-color);font-weight:700;margin-bottom:10px;display:inline-block}.timer-status-area{position:absolute;top:0;right:0;display:flex;flex-direction:column;align-items:flex-end}.timer-running-indicator{font-size:.8rem;color:var(--accent-color);margin-bottom:5px}.timer-running-indicator.hidden{display:none!important}.timer-container.controls-locked::after{content:"⏱️ Timer running";position:absolute;top:5px;right:10px;font-size:.8rem;color:var(--primary-color);background-color:rgba(255,255,255,.8);padding:2px 8px;border-radius:10px;opacity:.7}.timer-circle-container{margin:20px auto;position:relative;width:300px;height:300px}.timer-progress-circle{position:relative;width:100%;height:100%;display:flex;justify-content:center;align-items:center}.timer-progress-circle svg{position:absolute;top:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.progress-circle-bg{fill:none;stroke:var(--progress-bg-light);stroke-width:4}.progress-circle-bar{fill:none;stroke:var(--progress-fill-focus);stroke-width:6;stroke-linecap:round;transition:stroke-dashoffset 1s linear}.timer-content-center{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:2}.timer-display{font-size:3.5rem;font-weight:700;color:var(--primary-color);font-family:monospace;line-height:1.2;margin-bottom:20px;text-align:center}.set-counter{position:absolute;bottom:10px;right:10px;font-size:.85rem;color:var(--text-secondary);background-color:rgba(0,0,0,.1);padding:3px 8px;border-radius:12px;z-index:5}.button-container{display:flex;justify-content:center;width:100%;margin:20px 0}.button-left{display:flex;justify-content:flex-end;width:50%;padding-right:10px}.button-right{display:flex;justify-content:flex-start;width:50%;padding-left:10px}@media (max-width:600px){.button-container{flex-direction:column;align-items:center;gap:15px}.button-left,.button-right{width:100%;padding:0;justify-content:center}.button-left button,.button-right button{width:100%;max-width:280px;margin:0;white-space:nowrap}}button{padding:12px 24px;border:none;border-radius:8px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s ease;background-color:var(--primary-color);color:#fff}button:hover{background-color:var(--button-hover);transform:translateY(-2px)}button:active{transform:translateY(1px)}button.secondary{background-color:var(--secondary-color)}button.secondary:hover{background-color:#6ba089}#reset-btn{text-align:left;background-color:#d666b8;position:relative}#reset-btn:hover{background-color:#b4549b}.reset-clicked{background-color:#fc0;box-shadow:0 0 5px rgba(255,204,0,.7)}#reset-btn:hover::after{content:"Double-click to reset sequence";position:absolute;bottom:-30px;left:50%;transform:translateX(-50%);background-color:rgba(0,0,0,.7);color:#fff;padding:5px 10px;border-radius:4px;font-size:.75rem;white-space:nowrap;z-index:100}#distraction-btn{padding:8px 16px;background-color:var(--start-button-bg);color:#fff;border:2px solid var(--start-button-border);transition:all .3s ease;text-align:right}#distraction-btn:hover{background-color:var(--start-button-hover)}#distraction-btn.timer-running{background-color:var(--log-button-bg);border-color:var(--log-button-border)}#distraction-btn.timer-running:hover{background-color:var(--log-button-hover)}.disabled-break{opacity:.8!important;background-color:#8bb9a5!important;color:#fff!important;cursor:not-allowed!important;border-color:#78a897!important}.disabled-break:hover{transform:none!important;background-color:#8bb9a5!important}.sound-toggle-icon{background:0 0;border:none;font-size:1.2rem;cursor:pointer;padding:4px;border-radius:50%;color:var(--text-secondary);background-color:rgba(0,0,0,.05);width:32px;height:32px;display:flex;align-items:center;justify-content:center;transition:background-color .2s ease}.sound-toggle-icon:hover{background-color:rgba(0,0,0,.1)}.notification-container{background-color:var(--timer-bg);border-radius:15px;box-shadow:0 8px 16px rgba(156,106,222,.2);padding:20px 30px;margin-bottom:30px;text-align:center;transition:all .5s ease}.notification-container.hidden{opacity:0;height:0;padding:0;margin:0;overflow:hidden}.notification-button{display:inline-block;padding:12px 24px;background-color:var(--accent-color);color:var(--primary-color);border-radius:8px;text-decoration:none;font-weight:700;transition:all .3s ease;margin:10px 0}.notification-button:hover{background-color:var(--primary-color);color:#fff;transform:translateY(-2px)}.notification-button.enabled{background-color:var(--secondary-color)}.notification-button.enabled:hover{background-color:#6ba089}.mode-selector{display:flex;align-items:center;justify-content:center;margin-top:20px;gap:15px}.mode-nav-button{padding:8px 16px;background-color:var(--accent-color);color:var(--primary-color);border-radius:8px;font-size:1rem;transition:all .2s ease;position:relative}.mode-nav-button:hover{background-color:var(--primary-color);color:#fff;transform:translateY(-2px)}.mode-nav-button.disabled{opacity:.5;cursor:not-allowed;pointer-events:none;background-color:#ccc}#prev-mode-btn:hover::after{content:"Previous phase";position:absolute;bottom:-25px;left:50%;transform:translateX(-50%);background-color:rgba(0,0,0,.7);color:#fff;padding:3px 8px;border-radius:4px;font-size:.7rem;white-space:nowrap;z-index:100}#next-mode-btn:hover::after{content:"Next phase";position:absolute;bottom:-25px;left:50%;transform:translateX(-50%);background-color:rgba(0,0,0,.7);color:#fff;padding:3px 8px;border-radius:4px;font-size:.7rem;white-space:nowrap;z-index:100}.settings-container{background-color:var(--timer-bg);border-radius:15px;box-shadow:0 8px 16px rgba(156,106,222,.2);padding:30px;margin-bottom:30px}.settings-locked{position:relative}.settings-locked::after{content:"⏱️ Settings locked during timer";position:absolute;top:10px;right:10px;font-size:.8rem;color:var(--primary-color);background-color:rgba(255,255,255,.8);padding:4px 10px;border-radius:10px;opacity:.8}.settings-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,auto);gap:20px;max-width:500px;margin:0 auto}.setting-group{margin-bottom:20px}.setting-group label{display:block;margin-bottom:8px;font-weight:700;color:var(--primary-color)}.setting-group input{width:100%;padding:10px;border:2px solid var(--accent-color);border-radius:8px;font-size:1rem}.setting-group input:focus{border-color:var(--primary-color);outline:0}input.disabled,input:disabled{opacity:.7;background-color:#f2f2f2;cursor:not-allowed;border-color:#ccc}input.readonly{background-color:rgba(242,242,242,.5);border-color:#ddd;cursor:not-allowed}.reset-defaults-container{grid-column:1/-1;display:flex;justify-content:center;margin-top:15px}.reset-defaults-btn{background-color:var(--accent-color);color:var(--primary-color);padding:8px 16px;font-size:.9rem;border-radius:6px;transition:all .2s ease}.reset-defaults-btn:hover{background-color:var(--primary-color);color:#fff}.settings-reset-flash{animation:settings-reset-flash .3s ease}@keyframes settings-reset-flash{0%{background-color:var(--timer-bg)}50%{background-color:var(--accent-color)}100%{background-color:var(--timer-bg)}}.stats-container{background-color:var(--timer-bg);border-radius:15px;box-shadow:0 8px 16px rgba(156,106,222,.2);padding:30px;margin-bottom:30px}.stats-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.stats-selector{display:flex;border-radius:8px;overflow:hidden;border:2px solid var(--accent-color);min-width:200px}.stats-selector button{flex:1;border-radius:0;padding:8px 16px;background-color:var(--accent-color);color:var(--text-color);font-size:.95rem}.stats-selector button.active{background-color:var(--primary-color);color:#fff;box-shadow:inset 0 0 5px rgba(0,0,0,.2);font-weight:700}#all-time-stats-btn,#daily-stats-btn{background-color:#9c6ade}#all-time-stats-btn.active,#daily-stats-btn.active{background-color:#8350c4}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;text-align:center}.stat-box{padding:15px;background-color:var(--accent-color);border-radius:10px}.stat-value{font-size:2rem;font-weight:700;color:var(--primary-color)}.stat-label{font-size:.9rem;color:var(--text-color)}.stats-section{display:none}.stats-section.active{display:block}.turnip-graphic{width:80px;height:80px;background-image:url('/img/turnip_256.webp');background-size:contain;background-repeat:no-repeat;background-position:center;transform-origin:bottom center;transition:transform .3s ease}.grow-0{transform:scale(.4)}.grow-1{transform:scale(.6)}.grow-2{transform:scale(.8)}.grow-3{transform:scale(1)}.grow-4{transform:scale(1.2)}.grow-5{transform:scale(1.4)}.turnip-farm{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;justify-content:center}.turnip-farm-item{width:32px;height:32px;background-image:url('/img/turnip_256.webp');background-size:contain;background-repeat:no-repeat;background-position:center}.pulse{animation:pulse .3s 1}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}100%{transform:scale(1)}}.sequence-reset-flash{animation:reset-flash .3s ease}@keyframes reset-flash{0%{background-color:rgba(255,255,255,.1)}50%{background-color:rgba(255,255,255,.3)}100%{background-color:rgba(255,255,255,.1)}}@media (max-width:600px){.timer-display{font-size:3rem}.timer-circle-container{width:250px;height:250px}.settings-grid{grid-template-columns:1fr}.stats-header{flex-direction:column;gap:15px;align-items:center}.stats-selector{width:100%;max-width:280px}.stats-selector button{padding:10px 20px;font-size:1rem}.turnip-graphic{width:70px;height:70px}.timer-status-area .timer-running-indicator:nth-of-type(n+2){display:none!important}#distraction-btn,#reset-btn{padding:12px 16px;font-size:.95rem;text-align:center}#reset-btn{text-align:center}}.content-container{background-color:var(--timer-bg);border-radius:15px;box-shadow:0 8px 16px rgba(156,106,222,.2);padding:30px;margin-bottom:30px}.content-container h2{color:var(--primary-color);margin-bottom:20px}.content-container h3{color:var(--primary-color);margin:25px 0 15px 0;padding-top:10px;border-top:1px solid rgba(156,106,222,.2)}.content-container h3:first-of-type{border-top:none;padding-top:0}.content-container h4{color:var(--primary-color);margin:20px 0 10px}.content-container p{margin-bottom:15px}.content-container ol,.content-container ul{margin-bottom:15px;padding-left:25px}.content-container li{margin-bottom:10px}.back-link{display:inline-block;margin-top:20px;color:var(--primary-color);text-decoration:none;font-weight:700}.back-link:hover{text-decoration:underline}.tip-box{background-color:var(--accent-color);border-left:4px solid var(--primary-color);padding:15px;margin:20px 0;border-radius:4px}.tip-box h4{margin-top:0;color:var(--primary-color)}.nav-buttons{display:flex;justify-content:space-between;margin-top:30px}.nav-buttons a{padding:10px 15px;background-color:var(--accent-color);color:var(--primary-color);text-decoration:none;border-radius:8px;font-weight:700;transition:all .3s ease}.nav-buttons a:hover{background-color:var(--primary-color);color:#fff}.toc{background-color:var(--accent-color);padding:15px 25px;border-radius:8px;margin-bottom:30px}.toc h3{margin-top:0;padding-top:0;border-top:none}.toc ul{list-style-type:none;padding-left:0}.toc li{margin-bottom:8px}.toc a{text-decoration:none;color:var(--primary-color)}.toc a:hover{text-decoration:underline}.section-anchor{display:block;height:80px;margin-top:-80px;visibility:hidden}.pomodoro-steps{display:flex;flex-wrap:wrap;justify-content:space-between;margin:25px 0;gap:15px}.step-box{flex:1 1 200px;background-color:var(--accent-color);border-radius:10px;padding:15px;text-align:center}.step-box h4{color:var(--primary-color);margin-bottom:10px}.benefits-list{list-style-type:none;padding-left:0}.benefits-list li{background-color:var(--accent-color);padding:12px 15px 12px 45px;margin-bottom:10px;border-radius:8px;position:relative}.benefits-list li::before{content:"";position:absolute;left:12px;top:50%;transform:translateY(-50%);width:24px;height:24px;background-image:url('/img/turnip_256.webp');background-size:contain;background-repeat:no-repeat;background-position:center}.how-it-works-container{background-color:var(--timer-bg);border-radius:15px;box-shadow:0 8px 16px rgba(156,106,222,.2);padding:20px 30px;margin-bottom:30px;text-align:center}.how-it-works-link{display:inline-block;padding:12px 24px;background-color:var(--accent-color);color:var(--primary-color);border-radius:8px;text-decoration:none;font-weight:700;transition:all .3s ease;margin:10px 0}.how-it-works-link:hover{background-color:var(--primary-color);color:#fff;transform:translateY(-2px)}@media (max-width:600px){.content-container{padding:20px}.pomodoro-steps{flex-direction:column}.step-box{flex-basis:100%}.nav-buttons{flex-direction:column;gap:15px}.nav-buttons a{text-align:center}}#back-top-button{position:fixed;bottom:25px;right:25px;z-index:99;background-color:var(--primary-color);color:#fff;box-shadow:0 4px 10px rgba(131,80,196,.3);opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s,transform .3s;width:45px;height:45px;border-radius:50%;font-size:1.4rem;text-decoration:none;display:flex;align-items:center;justify-content:center}#back-top-button:hover{background-color:var(--button-hover);transform:translateY(-3px)}#back-top-button:active{transform:translateY(-1px)}@media (max-width:600px){#back-top-button{bottom:20px;right:20px;width:40px;height:40px;font-size:1.2rem}}.top-nav-link{display:inline-flex;align-items:center;background-color:var(--accent-color);color:var(--primary-color);padding:8px 16px;border-radius:8px;text-decoration:none;margin-bottom:20px;font-weight:700;transition:all .2s ease}.top-nav-link:hover{background-color:var(--primary-color);color:#fff;transform:translateY(-2px)}.top-nav-link::before{content:"←";margin-right:8px}@media (prefers-color-scheme:dark){:root{--background-color:#2D2040;--text-color:#E2D4F7;--accent-color:#3D2963;--timer-bg:#3D2963}.progress-circle-bg{stroke:var(--progress-bg-dark)!important}input{background-color:#2d2040;color:#fff}input.disabled,input:disabled{background-color:#333;border-color:#444}input.readonly{background-color:rgba(61,41,99,.5);border-color:#444;color:#e2d4f7}button{background-color:var(--button-bg-dark)}button:hover{background-color:var(--button-hover-dark)}button.secondary{background-color:var(--secondary-button-bg-dark)}button.secondary:hover{background-color:var(--secondary-button-hover-dark)}#reset-btn{background-color:#b4549b}#reset-btn:hover{background-color:#c75fab}.mode-nav-button.disabled{background-color:#444}.timer-container.controls-locked::after{background-color:rgba(0,0,0,.5)}.settings-locked::after{background-color:rgba(61,41,99,.8)}#distraction-btn{background-color:var(--start-button-bg-dark);border-color:var(--start-button-border-dark)}#distraction-btn:hover{background-color:var(--start-button-hover-dark)}#distraction-btn.timer-running{background-color:var(--log-button-bg-dark);border-color:var(--log-button-border-dark)}#distraction-btn.timer-running:hover{background-color:var(--log-button-hover-dark)}.disabled-break{background-color:#4e8865!important;border-color:#3d7755!important}.disabled-break:hover{background-color:#4e8865!important}#all-time-stats-btn,#daily-stats-btn{background-color:#8350c4}#all-time-stats-btn.active,#daily-stats-btn.active{background-color:#9c6ade}.reset-defaults-btn{background-color:#3d2963;color:#e2d4f7}.reset-defaults-btn:hover{background-color:#8350c4;color:#fff}.notification-button.enabled{background-color:#5e9e75}.notification-button.enabled:hover{background-color:#4d8460}}