body{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);margin:0;padding:0;--tools-text: white;--tools-text-muted: rgba(255,255,255,.9);--tools-border: rgba(255,255,255,.3);--theme-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%)}body[data-theme=light]{--tools-text: #1a1a1a;--tools-text-muted: #333;--tools-border: rgba(0,0,0,.25)}.tools-container{text-align:center;color:#fff;width:100%;max-width:880px;padding:2rem}.tools-container.journal-open{max-width:65rem}.tools-title{font-size:2.5rem;font-weight:700;margin-bottom:2rem;text-shadow:2px 2px 4px rgba(0,0,0,.3)}.tool-list{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.tool-btn.tool-btn-routines{border:2px solid #22c55e;background-color:#22c55e26;color:#bbf7d0}.tool-btn.tool-btn-routines:hover{border:2px solid #4ade80;background-color:#22c55e40;color:#fff}body[data-theme=light] .tool-btn.tool-btn-routines{border:2px solid #16a34a;background-color:#16a34a26;color:#166534}body[data-theme=light] .tool-btn.tool-btn-routines:hover{border:2px solid #15803d;background-color:#16a34a40;color:#14532d}.tool-btn{width:100%;padding:1.25rem 1.5rem;font-size:1.1rem;font-weight:500;border-radius:9999px;transition:all .3s;border:2px solid rgba(255,255,255,.3);background-color:#ffffff1a;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);cursor:pointer;display:flex;align-items:center;justify-content:flex-start;gap:0;text-align:left}.tool-btn-icon{width:2.5rem;min-width:2.5rem;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-size:1.25rem}.tool-btn-label{flex:1;padding-left:1rem}.tool-btn i{font-size:inherit}.tool-btn:hover{transform:translate(5px);box-shadow:0 4px 12px #0000004d;border-color:#fff9;background-color:#fff3;color:#fff}.tool-btn.selected{border-color:#fffc;background-color:#ffffff4d;box-shadow:0 4px 12px #0006}.tool-content{display:none;animation:fadeIn .4s ease-in;text-align:left;margin-top:2rem}.tool-content.show{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.view-fade-in{animation:viewFadeIn .35s ease-out forwards}@keyframes viewFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.task-tree-node.selected{background-color:#fff3}.task-tree-card{width:100%;min-width:20rem;box-sizing:border-box}.task-tree-container{text-align:left;width:100%;min-width:0;box-sizing:border-box}.task-tree{display:block;width:100%;min-width:0;box-sizing:border-box}.task-tree-branch{display:block}.task-tree-row{display:flex;align-items:center;min-height:2.25rem;width:100%;box-sizing:border-box}.task-tree-guide{flex-shrink:0;position:relative;min-height:2.25rem;display:flex;justify-content:center}.task-tree-guide-vertical{position:absolute;left:50%;top:0;bottom:0;width:1px;background:#fff6}.task-tree-connector{flex-shrink:0;min-height:2.25rem;position:relative;margin-right:0}.task-tree-connector-vertical{position:absolute;left:50%;width:1px;background:#fff6}.task-tree-connector-vertical--top{top:0;height:50%}.task-tree-connector-vertical--bottom{bottom:0;height:50%}.task-tree-connector-horizontal{position:absolute;left:50%;top:50%;width:50%;height:1px;background:#fff6}.task-tree-node{flex:1;min-width:0;display:flex;align-items:center;gap:.35rem;padding:.35rem .5rem;cursor:pointer;border-radius:6px;text-align:left}.task-tree-node-content{flex:1;min-width:0}.task-tree-node-input{width:100%;min-width:0;box-sizing:border-box}.task-tree-description-btn{flex-shrink:0;padding:.25rem;border:none;background:transparent;color:inherit;cursor:pointer;border-radius:4px;opacity:.85;display:flex;align-items:center;justify-content:center}.task-tree-description-btn:hover{opacity:1;background:#ffffff26}body[data-theme=light] .task-tree-description-btn:hover{background:#00000014}.task-tree-delete-btn{flex-shrink:0;padding:.25rem;border:none;background:transparent;color:inherit;cursor:pointer;border-radius:4px;opacity:.85;display:flex;align-items:center;justify-content:center}.task-tree-delete-btn:hover{opacity:1;background:#ff787840}body[data-theme=light] .task-tree-delete-btn:hover{background:#c8505026}.task-tree-children{margin-left:0}.task-tree-add-row{display:flex;align-items:center;min-height:2.25rem;margin-top:2px}.task-tree-add-row .task-tree-add-wrap{flex:1;min-width:0;padding-left:0;margin-top:0}.task-tree-add-wrap{margin-top:4px}body[data-theme=light] .task-tree-guide-vertical,body[data-theme=light] .task-tree-connector-vertical,body[data-theme=light] .task-tree-connector-horizontal{background:#00000040}.back-btn{margin-bottom:1.5rem;padding:.5rem 1.5rem;font-size:1rem;border-radius:25px;border:2px solid rgba(255,255,255,.3);background-color:#ffffff1a;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s;cursor:pointer}.back-btn:hover{background-color:#fff3;border-color:#ffffff80}.form-section{background-color:#ffffff1a;border-radius:15px;padding:2rem;margin-top:1rem;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}.form-section h2{color:#fff;margin-bottom:1.5rem;font-size:1.8rem}.journal-form-section{max-width:90rem;width:100%}.instructions-box{width:100%;max-width:32rem;box-sizing:border-box;display:flex;flex-direction:column;min-height:220px;padding:1rem;border-radius:12px;background:#ffffff14;border:1px solid rgba(255,255,255,.2)}.instructions-box-content{flex:1;min-height:6em;display:flex;flex-direction:column}.instructions-box-text{flex:1;color:var(--tools-text);line-height:1.7;margin:0 0 1rem}.instructions-box-buttons{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:auto;flex-shrink:0}.journal-clock-wrap{display:flex;flex-direction:column;align-items:center;gap:1rem}.journal-clock-face{width:200px;height:72px;border-radius:12px;background:#0000004d;border:4px solid rgba(255,255,255,.4);box-shadow:0 0 0 2px #0003,inset 0 0 24px #0000004d;display:flex;align-items:center;justify-content:center;position:relative}.journal-clock-face:before{content:"";position:absolute;top:6px;right:6px;bottom:6px;left:6px;border-radius:8px;border:1px solid rgba(255,255,255,.15);pointer-events:none}.journal-clock-time{font-variant-numeric:tabular-nums;font-size:2.75rem;font-weight:700;letter-spacing:.08em;line-height:1.2;color:var(--tools-text);text-shadow:0 1px 2px rgba(0,0,0,.3);z-index:1}.journal-clock-input{width:100%;max-width:5em;background:none;border:none;text-align:center;font-size:inherit;font-weight:inherit;font-variant-numeric:inherit;letter-spacing:inherit;line-height:inherit;color:inherit;padding:.25rem .5rem;border-radius:8px;transition:background .2s ease}.journal-clock-input:hover{background:#ffffff26}.journal-clock-input:focus{outline:none;background:#ffffff40}.journal-clock-duration{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;justify-content:center}.journal-clock-duration input{width:3.5rem;text-align:center;padding:.35rem .5rem;border-radius:8px;border:2px solid rgba(255,255,255,.35);background:#0003;color:var(--tools-text);font-size:1rem;font-weight:600}.journal-clock-duration input:focus{outline:none;border-color:#fff9}.journal-clock-buttons{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center}.journal-clock-buttons .btn{padding:.5rem 1rem;font-size:.95rem}body[data-theme=light] .journal-clock-face{background:#0000001f;border-color:#0000004d;box-shadow:0 0 0 2px #00000014,inset 0 0 20px #0000000f}body[data-theme=light] .journal-clock-input:hover{background:#00000014}body[data-theme=light] .journal-clock-input:focus{background:#0000001f}body[data-theme=light] .journal-clock-duration input{background:#0000000f;border-color:#00000040;color:#1a1a1a}.btn-next{background-color:#fff3;border:2px solid rgba(255,255,255,.3);color:#fff;padding:.75rem 2rem;border-radius:25px;font-weight:500;transition:all .3s;cursor:pointer}.btn-next:hover{background-color:#ffffff4d;border-color:#ffffff80;color:#fff}.welcome-modal-btn{border-color:#22c55e!important;background-color:#22c55e66!important;color:#dcfce7!important}.welcome-modal-btn:hover{border-color:#4ade80!important;background-color:#22c55e99!important;color:#fff!important}body[data-theme=light] .welcome-modal-btn{border-color:#16a34a!important;background-color:#16a34a59!important;color:#166534!important}body[data-theme=light] .welcome-modal-btn:hover{border-color:#15803d!important;background-color:#16a34a80!important;color:#14532d!important}.task-tree-subtask-btn{border:none!important;background:none!important;box-shadow:none!important;color:#ffffff8c;font-size:.85rem;padding:.3rem .6rem}.task-tree-subtask-btn:hover{color:#ffffffd9;background:#ffffff1a!important;border:none!important}body[data-theme=light] .task-tree-subtask-btn{color:#6b7280}body[data-theme=light] .task-tree-subtask-btn:hover{color:#374151;background:#0000000f!important}.btn-outline{background:transparent}.btn-outline-start{border-color:#4ade80;color:#4ade80}.btn-outline-start:hover{background:#4ade8033;border-color:#4ade80;color:#4ade80}.btn-outline-pause{border-color:#fbbf24;color:#fbbf24}.btn-outline-pause:hover{background:#fbbf2433;border-color:#fbbf24;color:#fbbf24}.btn-outline-reset{border-color:#60a5fa;color:#60a5fa}.btn-outline-reset:hover{background:#60a5fa33;border-color:#60a5fa;color:#93c5fd}body[data-theme=light] .btn-outline-start{border-color:#22c55e;color:#22c55e}body[data-theme=light] .btn-outline-start:hover{background:#22c55e26;color:#22c55e}body[data-theme=light] .btn-outline-pause{border-color:#eab308;color:#ca8a04}body[data-theme=light] .btn-outline-pause:hover{background:#eab30826;color:#ca8a04}body[data-theme=light] .btn-outline-reset{border-color:#3b82f6;color:#2563eb}body[data-theme=light] .btn-outline-reset:hover{background:#3b82f626;border-color:#3b82f6;color:#2563eb}.breathing-about-btn{border-color:#a855f7;color:#a855f7;background:transparent}.breathing-about-btn:hover{background:#a855f733;border-color:#a855f7;color:#c084fc}body[data-theme=light] .breathing-about-btn{border-color:#7c3aed;color:#6d28d9}body[data-theme=light] .breathing-about-btn:hover{background:#7c3aed26;border-color:#7c3aed;color:#6d28d9}.timer-display{font-size:3.5rem;font-weight:700;color:#fff;margin:3rem 0;min-height:4.5rem;display:flex;align-items:center;justify-content:center}.timer-clock-wrap{display:inline-flex;align-items:center;justify-content:center;margin:0;min-height:4.5rem;width:12rem;min-width:12rem;padding:.6rem 1rem;border-radius:12px;transition:background .2s ease}.timer-clock-wrap:hover{background:#ffffff1f}.timer-clock-wrap:focus-within{background:#ffffff47}.timer-clock-wrap-readonly:hover,.timer-clock-wrap-readonly:focus-within{background:transparent}@keyframes timerFlashTwice{0%,40%,to{background:#ffffff14;box-shadow:none}20%{background:#ffffff73;box-shadow:0 0 24px #ffffff80}60%{background:#ffffff73;box-shadow:0 0 24px #ffffff80}}.timer-clock-wrap.timer-flash-twice{animation:timerFlashTwice 1.2s ease-out}.timer-clock-wrap .timer-display,.timer-clock-wrap .timer-clock-input{margin:0;font-size:3rem;font-weight:700;width:100%;box-sizing:border-box;text-align:center}.timer-clock-input{width:100%;max-width:100%;background:none;border:none;font-size:inherit;font-weight:inherit;color:inherit;text-align:center;padding:0}.timer-clock-input:focus{outline:none}.timer-hours-minutes{display:flex;align-items:center;justify-content:center;gap:.15rem;width:100%}.timer-hours-minutes .timer-clock-input{width:2.2ch;min-width:2.2ch;max-width:4ch}.timer-hours-minutes .timer-hrs-input{text-align:right}.timer-hours-minutes .timer-min-input{text-align:left}.timer-sep{font-size:3rem;font-weight:700;color:inherit;-webkit-user-select:none;user-select:none;opacity:.9}body[data-theme=light] .timer-clock-wrap:hover{background:#00000014}body[data-theme=light] .timer-clock-wrap:focus-within{background:#0000002e}body[data-theme=light] .timer-clock-wrap-readonly:hover,body[data-theme=light] .timer-clock-wrap-readonly:focus-within{background:transparent}.timer-status{font-size:1.3rem;color:#ffffffe6;margin-bottom:2rem;min-height:2rem}.breathing-display{text-align:center;margin:2rem 0}.breathing-status{font-size:1.2rem;color:#fff;margin-bottom:1rem}.countdown-circle{width:150px;height:150px;border-radius:50%;border:4px solid rgba(255,255,255,.5);display:flex;align-items:center;justify-content:center;margin:2rem auto;font-size:3rem;font-weight:700;color:#fff}.countdown-circle-progress{position:relative;border:none;padding:0}.countdown-shape-square.countdown-circle{border-radius:20px}.countdown-circle-progress .countdown-circle-svg{width:100%;height:100%;display:block}.countdown-circle-progress .countdown-circle-value{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:3rem;font-weight:700;color:#fff;pointer-events:none}.round-counter{font-size:1.1rem;color:#fffc;margin-top:1rem}.duration-btn.selected{background-color:#ffffff4d;border-color:#fff9;box-shadow:0 4px 12px #0000004d}.form-control{background-color:#fff3;border:1px solid rgba(255,255,255,.3);color:#fff;padding:.75rem}.form-control::placeholder{color:#ffffff80}.form-control:focus{background-color:#ffffff40;border-color:#ffffff80;color:#fff;box-shadow:0 0 0 .2rem #ffffff40}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#0009;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.modal.show{display:flex;align-items:center;justify-content:center;animation:fadeIn .3s ease-in}.modal-content{background:linear-gradient(135deg,#667eea,#764ba2);margin:auto;padding:1.5rem;border-radius:15px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;color:#fff;box-shadow:0 8px 32px #0000004d;position:relative}@media (max-width: 768px){.modal-content{padding:1rem;width:95%;max-height:85vh}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}.modal-header h3{margin:0;font-size:1.5rem}.close-modal{background:none;border:none;color:#fff;font-size:2rem;font-weight:700;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .3s}.close-modal:hover{background-color:#fff3}.modal-body{line-height:1.8}.modal-body p{margin-bottom:1rem}.modal-body p:last-child{margin-bottom:0}.modal-body ul{text-align:left;margin-top:1rem}.modal-body li{margin-bottom:.5rem}.about-modal-content{max-width:480px}.theme-button{position:fixed;top:1rem;right:1rem;z-index:1001;padding:.75rem 1rem;border-radius:25px;border:2px solid rgba(255,255,255,.3);background-color:#ffffff1a;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:all .3s;cursor:pointer;font-size:.9rem;touch-action:manipulation}.theme-button:hover{background-color:#fff3;border-color:#ffffff80}.tools-back-button{left:1rem;right:auto;z-index:1004;width:auto;min-width:2.5rem;max-width:fit-content;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box}@media (max-width: 768px){.tools-back-button{left:.5rem;top:.5rem}}.tools-page-actions{position:fixed;top:1rem;right:1rem;z-index:1003;display:flex;flex-wrap:wrap;gap:.5rem}.tools-page-actions .theme-button{position:relative;top:auto;right:auto}.page-menu-trigger{font-size:1.25rem;line-height:1;padding:.5rem .75rem;min-width:2.5rem}.page-menu-dropdown{position:absolute;top:100%;right:0;margin-top:.35rem;min-width:10rem;padding:.35rem 0;border-radius:12px;background:#0006;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.25);box-shadow:0 8px 24px #0000004d;display:flex;flex-direction:column}.page-menu-item{display:block;width:100%;text-align:left;padding:.6rem 1rem;border:none;background:none;color:#fff;font-size:.95rem;cursor:pointer;transition:background .2s}.page-menu-item:hover{background:#ffffff26}body[data-theme=light] .page-menu-dropdown{background:#fffffff2;border-color:#0003;box-shadow:0 8px 24px #00000026}body[data-theme=light] .page-menu-item{color:#1a1a1a}body[data-theme=light] .page-menu-item:hover{background:#00000014}@media (max-width: 480px){.theme-button{top:.5rem;right:.5rem;padding:.5rem .75rem;font-size:.8rem}.tools-page-actions{top:.5rem;right:.5rem}}.color-option{width:60px;height:60px;border-radius:10px;border:3px solid rgba(255,255,255,.3);cursor:pointer;transition:all .3s;margin:.5rem;touch-action:manipulation}.color-option:hover{transform:scale(1.1);border-color:#fffc;box-shadow:0 4px 12px #0000004d}.color-option:active{transform:scale(.95)}.color-option.selected{border-color:#fff;border-width:4px;box-shadow:0 4px 12px #0006}.color-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1rem;justify-items:center}@media (max-width: 768px){.color-option{width:70px;height:70px;margin:.25rem}.color-grid{grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:.75rem}}@media (max-width: 480px){.color-option{width:60px;height:60px;margin:.2rem}.color-grid{grid-template-columns:repeat(3,1fr);gap:.5rem;margin-top:.5rem}.modal-header h3{font-size:1.2rem}}.routine-builder{margin-top:2rem}.available-tools{margin-bottom:2rem}.available-tools h3{color:#fff;margin-bottom:1rem;font-size:1.3rem}.tool-chip{display:inline-block;padding:.5rem 1rem;margin:.25rem;background-color:#ffffff26;border:1px solid rgba(255,255,255,.3);border-radius:20px;color:#fff;cursor:pointer;transition:all .3s;font-size:.9rem}.tool-chip:hover{background-color:#ffffff40;transform:translateY(-2px)}.routine-list{margin:2rem 0;min-height:200px}.routine-item{background-color:#ffffff1a;border:2px solid rgba(255,255,255,.2);transition:transform .22s ease-out;border-radius:10px;padding:1rem;margin-bottom:.75rem;display:flex;flex-direction:column;align-items:stretch;cursor:move;transition:transform .2s ease,opacity .2s ease,background-color .2s ease,border-color .2s ease;position:relative}.routine-item-row{display:flex;align-items:center;justify-content:space-between}.routine-item-prompt-row{margin-top:.5rem;padding-top:.5rem;border-top:1px solid rgba(255,255,255,.15)}.routine-item-prompt-row input{width:100%;box-sizing:border-box;padding:.4rem .6rem;border-radius:6px;border:1px solid rgba(255,255,255,.3);background:#ffffff14;color:#fff;font-size:.9rem}.routine-item-prompt-row input::placeholder{color:#ffffff80}.routine-item-journal-options{display:flex;flex-direction:column;gap:.5rem}.routine-item-duration-row{display:flex;align-items:center;flex-wrap:wrap}.routine-item-duration-row input{padding:.3rem .5rem;border-radius:6px;border:1px solid rgba(255,255,255,.3);background:#ffffff14;color:#fff;font-size:.9rem}.routine-item:hover{background-color:#ffffff26;border-color:#fff6;transform:translateY(-2px)}.routine-item.dragging{opacity:.5;transform:scale(.95);z-index:1000}.routine-item.drag-over{transform:translateY(10px);border-color:#fff9}.routine-item-number{background-color:#fff3;border-radius:50%;width:30px;height:30px;display:flex;align-items:center;justify-content:center;font-weight:700;margin-right:1rem}.routine-item-name{flex:1;color:#fff;font-size:1rem}.routine-item-remove{background:none;border:none;color:#fff;font-size:1.2rem;cursor:pointer;padding:.25rem .5rem;border-radius:5px;transition:background-color .3s}.routine-item-remove:hover{background-color:#fff3}.empty-routine{text-align:center;color:#fff9;padding:3rem 1rem;border:2px dashed rgba(255,255,255,.3);border-radius:10px}.routine-builder-container{display:flex;gap:2rem;margin-top:2rem}.routine-menu-panel{flex:0 0 300px;background-color:#ffffff1a;border-radius:15px;padding:1.5rem;max-height:70vh;overflow-y:auto}.routine-mobile-add{display:none}.routine-add-tool-trigger-btn{border-color:#22c55e!important;background-color:#22c55e66!important;color:#dcfce7!important}.routine-add-tool-trigger-btn:hover{border-color:#4ade80!important;background-color:#22c55e99!important;color:#fff!important}body[data-theme=light] .routine-add-tool-trigger-btn{border-color:#16a34a!important;background-color:#22c55e59!important;color:#166534!important}body[data-theme=light] .routine-add-tool-trigger-btn:hover{border-color:#22c55e!important;background-color:#22c55e80!important;color:#14532d!important}.routine-list-panel{flex:1;background-color:#ffffff1a;border-radius:15px;padding:1.5rem;min-height:70vh}.routine-item-drag-handle{flex-shrink:0;width:28px;margin-right:.5rem;padding:.25rem;display:flex;align-items:center;justify-content:center;cursor:grab;touch-action:none;border-radius:6px;color:#ffffffb3}.routine-item-drag-handle:active{cursor:grabbing}.routine-item-drag-handle-bars{display:flex;flex-direction:column;gap:3px;align-items:center}.routine-item-drag-handle-bars span{display:block;width:14px;height:2px;background:currentColor;border-radius:1px}body[data-theme=light] .routine-item-drag-handle{color:#00000080}.routine-add-tool-list{display:flex;flex-direction:column;gap:.25rem}.routine-add-tool-btn{background-color:#ffffff26;border:1px solid rgba(255,255,255,.3);border-radius:10px;color:inherit;cursor:pointer;font:inherit;transition:background-color .2s}.routine-add-tool-btn:hover{background-color:#ffffff40}body[data-theme=light] .routine-add-tool-btn{background-color:#fff9;border-color:#00000040}body[data-theme=light] .routine-add-tool-btn:hover{background-color:#ffffffbf}.menu-item-draggable{background-color:#ffffff26;border:1px solid rgba(255,255,255,.3);border-radius:10px;padding:.75rem 1rem;margin-bottom:.5rem;cursor:grab;transition:background-color .2s,transform .2s;color:#fff;-webkit-user-select:none;user-select:none;touch-action:none}.menu-item-draggable:hover{background-color:#ffffff40;transform:translate(5px)}.menu-item-draggable:active{cursor:grabbing}.menu-item-draggable.dragging{opacity:.5;transform:scale(.95)}.routine-drop-zone{min-height:400px;transition:all .2s}.routine-drop-zone.drag-over{background-color:#ffffff26;border:2px dashed rgba(255,255,255,.5);transform:scale(1.02)}.routine-builder-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;flex-wrap:wrap;gap:1rem}.routine-builder-title{color:#fff;font-size:1.5rem;margin:0}.routine-button-group{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}.routine-button-group .btn.btn-next,.routine-button-group .back-btn{height:40px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center}.routine-builder-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:var(--theme-gradient);z-index:1000;overflow:auto;padding:1rem}.routine-builder-content{max-width:1400px;margin:0 auto;padding-top:4rem;color:#fff}.routine-builder-content .form-section{background-color:transparent}.routine-player{position:relative;min-height:100vh;padding-top:0}.routine-player-bar{position:sticky;top:0;left:0;right:0;z-index:1002;background:#00000040;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid rgba(255,255,255,.15)}.routine-player-progress{height:4px;background:#ffffffe6;transition:width .3s ease}.routine-player-bar-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 1rem;max-width:880px;margin:0 auto}.routine-player-status{color:var(--tools-text);font-size:.95rem;font-weight:500}.routine-player-step-name{opacity:.9;font-weight:400}.routine-player-nav{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}.routine-player-btn{padding:.4rem .75rem!important;font-size:.9rem!important;min-height:auto!important}.routine-player-btn:disabled{opacity:.5;cursor:not-allowed}.routine-player-edit{background:#fff3!important}.routine-player-exit{background:#ff646440!important}.routine-player-tool{margin:0 auto;padding-top:1.5rem}.routine-player-tool .form-section{background-color:#ffffff1a}body[data-theme=light] .routine-player-tool .form-section{background-color:#fff9;border-color:#0003}body[data-theme=light] .routine-player-bar{background:#00000014;border-bottom-color:#00000026}@media (max-width: 768px){.routine-builder-container{flex-direction:column;gap:1rem}.routine-desktop-tools{display:none!important}.routine-mobile-add{display:block}.routine-menu-panel{flex:1;max-height:40vh;padding:1rem}.routine-list-panel{min-height:50vh;padding:1rem}.routine-drop-zone{min-height:300px}.routine-builder-header{flex-direction:column;align-items:stretch}.routine-builder-title{font-size:1.2rem}.routine-button-group{width:100%}.routine-button-group button{flex:1}.routine-builder-content{padding-top:1rem}}@media (max-width: 480px){.routine-menu-panel{max-height:35vh}.routine-list-panel{min-height:45vh}.routine-drop-zone{min-height:250px}}body[data-theme=light] .tools-container,body[data-theme=light] .tools-title,body[data-theme=light] .tool-btn,body[data-theme=light] .tool-btn:hover,body[data-theme=light] .tool-btn.selected,body[data-theme=light] .back-btn,body[data-theme=light] .back-btn:hover,body[data-theme=light] .form-section h2,body[data-theme=light] .btn-next,body[data-theme=light] .btn-next:hover,body[data-theme=light] .timer-display,body[data-theme=light] .timer-status,body[data-theme=light] .breathing-status,body[data-theme=light] .countdown-circle,body[data-theme=light] .round-counter,body[data-theme=light] .form-control,body[data-theme=light] .form-control::placeholder,body[data-theme=light] .form-control:focus,body[data-theme=light] .modal-content,body[data-theme=light] .modal-header h3,body[data-theme=light] .close-modal,body[data-theme=light] .modal-body,body[data-theme=light] .theme-button,body[data-theme=light] .theme-button:hover,body[data-theme=light] .available-tools h3,body[data-theme=light] .tool-chip,body[data-theme=light] .routine-item-name,body[data-theme=light] .routine-item-remove,body[data-theme=light] .empty-routine,body[data-theme=light] .routine-builder-title,body[data-theme=light] .routine-builder-content,body[data-theme=light] .menu-item-draggable{color:#1a1a1a}body[data-theme=light] .tools-title{text-shadow:0 1px 2px rgba(0,0,0,.1)}body[data-theme=light] .tool-btn,body[data-theme=light] .back-btn{border-color:#00000040;background-color:#fff9}body[data-theme=light] .tool-btn:hover,body[data-theme=light] .back-btn:hover{border-color:#0006;background-color:#ffffffbf}body[data-theme=light] .tool-btn.selected{border-color:#00000080;background-color:#ffffffd9}body[data-theme=light] .form-section{background-color:#fff9;border-color:#0003}body[data-theme=light] .btn-next{border-color:#00000040;background-color:#fff9}body[data-theme=light] .btn-next:hover{border-color:#0006;background-color:#ffffffbf}body[data-theme=light] .timer-status,body[data-theme=light] .round-counter{color:#333}body[data-theme=light] .duration-btn.selected{background-color:#ffffffd9;border-color:#0006}body[data-theme=light] .form-control{background-color:#fffc;border-color:#00000040}body[data-theme=light] .form-control::placeholder{color:#00000080}body[data-theme=light] .form-control:focus{background-color:#fffffff2;border-color:#0006;box-shadow:0 0 0 .2rem #00000026}body[data-theme=light] .countdown-circle-progress .countdown-circle-svg circle:first-of-type,body[data-theme=light] .countdown-circle-progress .countdown-circle-svg rect:first-of-type{stroke:#0003}body[data-theme=light] .countdown-circle-progress .countdown-circle-svg circle:last-of-type,body[data-theme=light] .countdown-circle-progress .countdown-circle-svg rect:last-of-type{stroke:#00000080}body[data-theme=light] .countdown-circle-progress .countdown-circle-value{color:#1a1a1a}body[data-theme=light] .close-modal:hover{background-color:#0000001a}body[data-theme=light] .theme-button{border-color:#00000040;background-color:#ffffffb3}body[data-theme=light] .theme-button:hover{border-color:#0006;background-color:#ffffffd9}body[data-theme=light] .color-option{border-color:#0000004d}body[data-theme=light] .color-option:hover{border-color:#00000080}body[data-theme=light] .color-option.selected{border-color:#1a1a1a}body[data-theme=light] .tool-chip{background-color:#ffffffb3;border-color:#00000040}body[data-theme=light] .tool-chip:hover{background-color:#ffffffd9}body[data-theme=light] .routine-item{background-color:#ffffff80;border-color:#0003}body[data-theme=light] .routine-item:hover{background-color:#ffffffa6;border-color:#00000059}body[data-theme=light] .routine-item.drag-over{border-color:#00000073}body[data-theme=light] .routine-item-prompt-row{border-top-color:#00000026}body[data-theme=light] .routine-item-prompt-row input{background:#0000000f;border-color:#00000040;color:#1a1a1a}body[data-theme=light] .routine-item-prompt-row input::placeholder{color:#666}body[data-theme=light] .routine-item-duration-row input{background:#0000000f;border-color:#00000040;color:#1a1a1a}body[data-theme=light] .routine-item-number{background-color:#00000026;color:#1a1a1a}body[data-theme=light] .routine-item-remove:hover{background-color:#0000001a}body[data-theme=light] .empty-routine{color:#555;border-color:#0000004d}body[data-theme=light] .routine-menu-panel,body[data-theme=light] .routine-list-panel{background-color:#ffffff80}body[data-theme=light] .menu-item-draggable{background-color:#fff9;border-color:#00000040}body[data-theme=light] .menu-item-draggable:hover{background-color:#ffffffbf}body[data-theme=light] .routine-drop-zone.drag-over{background-color:#fff6;border-color:#00000059}
