:root{--font-sans: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "JetBrains Mono", "DM Mono", "Courier New", monospace;--bg-h: 228;--bg-s: 15%;--bg-l: 96%;--bg: hsl(var(--bg-h), var(--bg-s), var(--bg-l));--bg-alt: #ffffff;--text-h: 240;--text-s: 20%;--text-l: 12%;--text: hsl(var(--text-h), var(--text-s), var(--text-l));--text-muted: #5e5e75;--text-dim: #8e8ea3;--text-faint: #c3c5d2;--border: #e2e4ed;--border-alt: #ccd0de;--accent-h: 12;--accent-s: 76%;--accent-l: 50%;--accent: hsl(var(--accent-h), var(--accent-s), var(--accent-l));--accent-glow: rgba(224, 70, 34, .2);--accent-name: #b82d0d;--btn-text: #6b6b80;--badge-bg: #eaebf2;--badge-text: #5e5e75;--card-shadow: 0 4px 20px rgba(24, 24, 37, .04);--card-glow: rgba(224, 70, 34, .01);--glass-bg: rgba(255, 255, 255, .8);--glass-border: rgba(226, 228, 237, .7)}@media (prefers-color-scheme: dark){:root{--bg-h: 240;--bg-s: 25%;--bg-l: 4%;--bg: hsl(var(--bg-h), var(--bg-s), var(--bg-l));--bg-alt: #0a0a14;--text-h: 240;--text-s: 15%;--text-l: 93%;--text: hsl(var(--text-h), var(--text-s), var(--text-l));--text-muted: #a2a2b8;--text-dim: #6d6d82;--text-faint: #3c3c52;--border: #141424;--border-alt: #232338;--accent-h: 10;--accent-s: 100%;--accent-l: 64%;--accent: hsl(var(--accent-h), var(--accent-s), var(--accent-l));--accent-glow: rgba(255, 94, 58, .35);--accent-name: #ff9c85;--btn-text: #8989a3;--badge-bg: #141424;--badge-text: #a2a2b8;--card-shadow: 0 10px 30px rgba(0, 0, 0, .4);--card-glow: rgba(255, 94, 58, .06);--glass-bg: rgba(10, 10, 20, .75);--glass-border: rgba(35, 35, 56, .5)}}*{box-sizing:border-box}body{margin:0;background-color:var(--bg);color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;transition:background-color .4s ease,color .4s ease}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border-alt);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--text-dim)}.root-container{min-height:100dvh;background:var(--bg);color:var(--text);font-family:var(--font-sans);padding-bottom:80px}.center-container{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100dvh;background:var(--bg)}.loader-spinner{width:32px;height:32px;border-radius:50%;border:3px solid var(--border-alt);border-top-color:var(--accent);animation:spin .8s cubic-bezier(.5,.1,.4,.9) infinite;box-shadow:0 0 15px var(--accent-glow)}@keyframes spin{to{transform:rotate(360deg)}}.header-bar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--glass-bg);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);z-index:10;transition:all .3s ease}.logo-title{font-size:20px;font-weight:800;letter-spacing:.12em;color:var(--accent);text-transform:uppercase;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-sans);transition:transform .2s ease,text-shadow .2s ease}.logo-title:hover{transform:scale(1.02);text-shadow:0 0 12px var(--accent-glow)}.nav-group{display:flex;gap:8px;align-items:center}.primary-btn{background:var(--accent);border:none;color:#fff;padding:8px 18px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:600;font-family:inherit;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 12px var(--accent-glow);display:inline-flex;align-items:center;justify-content:center;gap:6px}.primary-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px var(--accent-glow);filter:brightness(1.08)}.primary-btn:active{transform:translateY(1px)}.primary-btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important;box-shadow:none!important}.ghost-btn{background:var(--bg-alt);border:1px solid var(--border-alt);color:var(--text-muted);padding:8px 18px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:500;font-family:inherit;transition:all .2s ease}.ghost-btn:hover{background:var(--border);color:var(--text);border-color:var(--text-dim)}.ghost-btn:active{transform:scale(.98)}.workout-list{padding:24px;display:flex;flex-direction:column;gap:12px;max-width:640px;margin:0 auto}.empty-view{text-align:center;padding:80px 0;color:var(--text-dim);line-height:1.8;font-size:15px}.workout-card{background:var(--bg-alt);border:1px solid var(--border);border-radius:12px;padding:16px 20px;cursor:pointer;position:relative;box-shadow:var(--card-shadow);transition:all .3s cubic-bezier(.4,0,.2,1)}.workout-card:hover{transform:translateY(-3px);border-color:var(--border-alt);box-shadow:0 12px 28px #00000014,0 0 20px var(--card-glow)}.workout-card:after{content:"";position:absolute;left:0;top:15px;bottom:15px;width:4px;background:var(--accent);border-radius:0 4px 4px 0;opacity:0;transition:opacity .2s ease}.workout-card:hover:after{opacity:1}.card-header-row{display:flex;justify-content:space-between;align-items:center}.card-title{font-size:18px;font-weight:700;color:var(--text);transition:color .2s ease}.workout-card:hover .card-title{color:var(--accent)}.card-actions-group{display:flex;gap:6px;align-items:center}.icon-action-btn{background:transparent;border:none;color:var(--btn-text);cursor:pointer;font-size:16px;padding:8px;border-radius:8px;transition:all .2s ease;display:flex;align-items:center;justify-content:center;min-width:36px;min-height:36px}.icon-action-btn:hover{background:var(--border);color:var(--text)}.icon-action-btn.play-btn{color:var(--accent)}.icon-action-btn.play-btn:hover{background:var(--accent-glow);transform:scale(1.1)}.icon-action-btn.delete-btn:hover{background:#ff4a4a26;color:#ff4a4a}.card-meta-row{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px;align-items:center}.badge-tag{font-size:11px;font-weight:500;padding:3px 10px;border-radius:6px;background:var(--badge-bg);color:var(--badge-text);border:1px solid var(--border);font-family:var(--font-sans);display:inline-flex;align-items:center;gap:4px}.form-container{max-width:640px;margin:24px auto 100px;padding:0 24px;display:flex;flex-direction:column;gap:12px}.form-label{font-size:11px;font-weight:600;color:var(--text-dim);letter-spacing:.1em;text-transform:uppercase;margin-top:10px;display:block}.text-input{background:var(--bg-alt);border:1px solid var(--border-alt);color:var(--text);border-radius:10px;padding:12px 14px;font-size:15px;outline:none;font-family:inherit;width:100%;transition:all .2s ease;box-shadow:inset 0 1px 3px #00000008}.text-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow),inset 0 1px 2px #00000008}.number-input-wrap{display:flex;align-items:center;gap:8px}.number-input{background:var(--bg-alt);border:1px solid var(--border-alt);color:var(--text);border-radius:10px;padding:10px 12px;font-size:15px;outline:none;font-family:var(--font-mono);width:90px;text-align:center}.number-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.empty-items-placeholder{text-align:center;padding:32px 0;color:var(--text-dim);font-size:13px;border:1px dashed var(--border-alt);border-radius:10px;background:#00000003}.add-item-dashed-btn{background:transparent;border:1px dashed var(--border-alt);color:var(--accent);padding:10px 16px;border-radius:10px;cursor:pointer;font-size:13px;font-weight:600;font-family:inherit;transition:all .2s ease;display:flex;align-items:center;justify-content:center;gap:6px;margin-top:8px}.add-item-dashed-btn:hover{background:var(--bg-alt);border-color:var(--accent);box-shadow:0 4px 12px #00000005}.presets-group{display:flex;gap:6px;margin-top:4px}.preset-pill-btn{background:var(--badge-bg);border:1px solid var(--border);color:var(--text-muted);font-size:11px;font-weight:600;padding:4px 10px;border-radius:100px;cursor:pointer;transition:all .15s ease;font-family:var(--font-mono)}.preset-pill-btn:hover{background:var(--accent-glow);color:var(--accent);border-color:var(--accent)}.preset-pill-btn:active{transform:scale(.95)}.item-row{display:flex;align-items:center;background:var(--bg-alt);border:1px solid var(--border);border-radius:12px;margin-bottom:8px;box-shadow:var(--card-shadow);transition:box-shadow .2s ease}.item-row:focus-within{border-color:var(--border-alt)}.item-drag{display:flex;align-items:center;justify-content:center;min-width:44px;height:80px;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;flex-shrink:0;border-right:1px solid var(--border);color:var(--text-faint);transition:color .2s ease}.item-drag:hover{color:var(--text-dim)}.item-drag:active{cursor:grabbing}.item-content{flex:1;min-width:0;display:flex;flex-direction:column;padding:12px 16px;gap:8px}.item-top{display:flex;align-items:center;gap:10px}.item-index-lbl{font-size:13px;font-weight:700;color:var(--text-dim);font-family:var(--font-mono)}.item-input-name{flex:1;background:transparent;border:none;border-bottom:1px solid transparent;color:var(--text);font-size:15px;font-weight:500;padding:4px 0;outline:none;font-family:inherit;transition:border-color .2s ease}.item-input-name:focus{border-color:var(--accent)}.remove-item-btn{background:transparent;border:none;color:var(--text-dim);cursor:pointer;font-size:18px;padding:6px;border-radius:6px;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.remove-item-btn:hover{background:#ff4a4a1a;color:#ff4a4a}.item-bottom{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.item-input-duration{background:var(--bg);border:1px solid var(--border);color:var(--text);border-radius:6px;padding:3px 6px;font-size:13px;font-weight:600;font-family:var(--font-mono);width:54px;text-align:center}.item-input-duration:focus{border-color:var(--accent);outline:none}.item-duration-unit{font-size:12px;color:var(--text-dim);font-weight:500}.drag-overlay-card{display:flex;align-items:center;background:var(--bg-alt);border:1px solid var(--accent);border-radius:12px;padding:12px 18px;box-shadow:0 10px 30px #00000026,0 0 20px var(--accent-glow);opacity:.98;transform:rotate(2deg)}.timeline-box{margin-top:24px;background:var(--bg-alt);border:1px solid var(--border);border-radius:12px;padding:20px;box-shadow:var(--card-shadow)}.timeline-header-title{font-size:11px;font-weight:600;color:var(--text-dim);letter-spacing:.1em;text-transform:uppercase;margin-bottom:14px}.timeline-row{display:flex;align-items:center;gap:12px;padding:6px 0}.timeline-marker{color:var(--accent);font-size:12px;width:20px;text-align:center;display:inline-block}.timeline-label-caps{font-size:12px;font-weight:800;color:var(--text-muted);letter-spacing:.08em}.timeline-exercise-txt{font-size:14px;font-weight:500;color:var(--text);flex:1}.timeline-time-val{font-size:13px;color:var(--accent);font-weight:700;font-family:var(--font-mono)}.timeline-interval-txt{font-size:12px;color:var(--text-dim);font-style:italic;font-weight:500}.timeline-total-duration{font-size:13px;color:var(--accent);margin-left:auto;font-weight:800;font-family:var(--font-mono)}.sticky-footer-bar{position:fixed;bottom:0;left:0;right:0;background:var(--glass-bg);border-top:1px solid var(--border);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding-bottom:env(safe-area-inset-bottom);z-index:10;box-shadow:0 -10px 30px #00000008}.sticky-footer-inner{max-width:640px;margin:0 auto;padding:14px 24px}.footer-actions-row{display:flex;gap:12px}.footer-save-btn{flex:1;background:var(--accent);border:none;color:#fff;padding:12px;border-radius:10px;cursor:pointer;font-size:14px;font-weight:700;font-family:inherit;transition:all .2s ease;box-shadow:0 4px 14px var(--accent-glow)}.footer-save-btn:hover{filter:brightness(1.08);box-shadow:0 6px 18px var(--accent-glow)}.footer-save-btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none!important}.player-container{display:flex;flex-direction:column;align-items:center;padding:32px 24px 100px;max-width:480px;margin:0 auto;min-height:100vh}.player-workout-title{font-size:12px;font-weight:700;color:var(--text-dim);letter-spacing:.15em;text-transform:uppercase;margin-bottom:16px;text-align:center}.sound-toggle-bar{display:flex;justify-content:center;margin-bottom:12px;width:100%}.sound-toggle-btn{background:var(--bg-alt);border:1px solid var(--border);border-radius:100px;padding:6px 14px;display:flex;align-items:center;gap:6px;cursor:pointer;font-family:inherit;font-size:11px;font-weight:600;color:var(--text-muted);transition:all .2s ease}.sound-toggle-btn.sound-on{border-color:var(--accent);color:var(--accent);background:var(--accent-glow)}.sound-toggle-btn:hover{transform:translateY(-1px)}.spotify-status-bar{display:flex;align-items:center;gap:12px;background:var(--bg-alt);border:1px solid var(--border);border-radius:12px;padding:8px 14px;margin-bottom:20px;width:100%;box-shadow:var(--card-shadow);position:relative;overflow:hidden}.spotify-status-bar:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#1db954}.spotify-album-art{border-radius:6px;flex-shrink:0;box-shadow:0 2px 8px #00000026;animation:pulse-countdown 4s linear infinite}.spotify-track-info{flex:1;min-width:0}.spotify-song-name{font-size:13px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.spotify-artist-name{font-size:11px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.spotify-muted-lbl{font-size:12px;font-weight:600;color:var(--text-dim);flex:1}.spotify-disconnect-btn{background:transparent;border:none;color:var(--text-dim);cursor:pointer;font-size:14px;padding:6px;border-radius:6px;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.spotify-disconnect-btn:hover{background:var(--border);color:#ff4a4a}.spotify-connect-btn{background:transparent;border:1px solid #1db954;color:#1db954;padding:6px 16px;border-radius:20px;cursor:pointer;font-size:11px;font-weight:700;font-family:inherit;margin-bottom:20px;transition:all .2s ease;display:flex;align-items:center;gap:6px}.spotify-connect-btn:hover{background:#1db9541a;transform:translateY(-1px)}.spotify-connect-btn:active{transform:translateY(1px)}.spotify-controls-group{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;margin-top:4px}.spotify-media-btn{background:transparent;border:none;color:var(--btn-text);cursor:pointer;padding:6px;border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .2s ease;min-width:32px;min-height:32px}.spotify-media-btn:hover{background:var(--border);color:var(--text);transform:scale(1.1)}.spotify-media-btn.playpause-btn{color:#1db954;background:#1db95414}.spotify-media-btn.playpause-btn:hover{background:#1db95426;box-shadow:0 0 10px #1db95433}.donut-timer-wrap{margin-bottom:24px;position:relative;transition:transform .2s cubic-bezier(.175,.885,.32,1.275)}.donut-timer-wrap.pulsing{animation:pulse-countdown 1s ease-in-out infinite}@keyframes pulse-countdown{0%{transform:scale(1)}50%{transform:scale(1.05);filter:brightness(1.05)}to{transform:scale(1)}}.segment-title-big{font-size:26px;font-weight:800;color:var(--text);text-align:center;letter-spacing:-.02em}.segment-type-caps{font-size:11px;font-weight:700;color:var(--text-dim);letter-spacing:.12em;text-transform:uppercase;margin-top:6px;text-align:center}.next-up-box{font-size:13px;color:var(--text-muted);margin-top:10px;text-align:center;background:var(--badge-bg);padding:4px 14px;border-radius:100px;border:1px solid var(--border)}.next-up-name-txt{color:var(--accent-name);font-weight:700}.total-remaining-txt{font-size:12px;font-weight:500;color:var(--text-dim);margin-top:12px;text-align:center}.player-scrolling-list{width:100%;margin-top:28px;border-top:1px solid var(--border);max-height:200px;overflow-y:auto;box-shadow:inset 0 8px 10px -10px #0000000d}.player-seg-item{display:flex;justify-content:space-between;padding:10px 14px;border-left:3px solid transparent;transition:all .25s ease;align-items:center}.player-seg-name{font-size:13px;font-weight:500;color:var(--text-muted)}.player-seg-time{font-size:12px;color:var(--text-dim);font-family:var(--font-mono)}.player-bottom-controls{position:fixed;bottom:0;left:0;right:0;display:flex;gap:12px;padding:24px;background:linear-gradient(to top,var(--bg) 65%,transparent);justify-content:center;z-index:5}.play-large-btn{flex:1;max-width:200px;background:var(--accent);border:none;color:#fff;padding:14px 24px;border-radius:12px;cursor:pointer;font-size:16px;font-weight:700;font-family:inherit;transition:all .2s cubic-bezier(.4,0,.2,1);box-shadow:0 4px 16px var(--accent-glow)}.play-large-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px var(--accent-glow);filter:brightness(1.08)}.play-large-btn:active{transform:translateY(0)}.stop-large-btn{background:var(--bg-alt);border:1px solid rgba(255,74,74,.5);color:#ff4a4a;padding:14px 24px;border-radius:12px;cursor:pointer;font-size:14px;font-weight:600;font-family:inherit;transition:all .2s ease}.stop-large-btn:hover{background:#ff4a4a1a;border-color:#ff4a4a}.stop-large-btn:active{transform:scale(.98)}.done-screen-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px 24px;min-height:80vh;width:100%;position:relative;text-align:center}.congrats-emoji{font-size:64px;margin-bottom:16px;display:inline-block;animation:bounce-emoji 2s infinite ease-in-out}@keyframes bounce-emoji{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-12px) scale(1.08)}}.congrats-title{font-size:28px;font-weight:800;color:var(--accent);margin-bottom:8px;font-family:var(--font-sans)}.congrats-subtitle{font-size:14px;color:var(--text-muted);margin-bottom:32px}.summary-card{background:var(--bg-alt);border:1px solid var(--border);border-radius:16px;padding:24px;width:100%;max-width:380px;box-shadow:var(--card-shadow);margin-bottom:40px;position:relative;overflow:hidden}.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.summary-item{display:flex;flex-direction:column;align-items:center}.summary-val{font-size:24px;font-weight:800;color:var(--accent);font-family:var(--font-mono)}.summary-lbl{font-size:11px;font-weight:600;color:var(--text-dim);text-transform:uppercase;margin-top:4px;letter-spacing:.05em}.confetti-overlay{position:absolute;top:0;left:0;width:100%;height:100%;overflow:hidden;pointer-events:none;z-index:100}.confetti-particle{position:absolute;top:-20px;width:10px;height:16px;opacity:.85;border-radius:2px;animation:confetti-fall 3.5s linear infinite,confetti-shake 1.5s ease-in-out infinite alternate}@keyframes confetti-fall{0%{top:-20px;transform:translateY(0)}to{top:105%;transform:translateY(0)}}@keyframes confetti-shake{0%{margin-left:0;transform:rotate(0)}to{margin-left:40px;transform:rotate(180deg)}}
