body{background-image:radial-gradient(circle at 20% 20%,rgba(74,144,226,0.35),transparent 45%),radial-gradient(circle at 80% 10%,rgba(74,226,190,0.2),transparent 40%),radial-gradient(circle at 50% 90%,rgba(226,74,172,0.2),transparent 50%);background-color:#0e0e11;font-family:"Space Grotesk",sans-serif}.hidden{display:none !important}.pseudo-fullscreen-root{height:100% !important;overflow:hidden !important}.pseudo-fullscreen-body{height:100vh !important;overflow:hidden !important}.timer-display-box{display:flex;flex-direction:column;align-items:stretch;gap:0.5rem;text-align:center;width:clamp(6rem,30vw,7.5rem)}.timer-value{background:rgba(255,255,255,0.04);border-radius:1rem;font-size:clamp(2.5rem,7vw,4rem);font-weight:700;letter-spacing:-0.05em;padding:1.25rem 0}.timer-label{color:rgba(255,255,255,0.55);font-size:0.875rem;text-transform:uppercase;letter-spacing:0.2em}.primary-btn,.secondary-btn{display:inline-flex;align-items:center;justify-content:center;height:3.25rem;padding:0 2.5rem;border-radius:0.9rem;font-weight:600;letter-spacing:0.01em;transition:transform 0.15s ease,box-shadow 0.2s ease}.primary-btn{background:linear-gradient(135deg,#4a90e2,#7ab6ff);color:#ffffff;box-shadow:0 12px 24px rgba(74,144,226,0.35)}.primary-btn:hover{transform:translateY(-1px);box-shadow:0 14px 26px rgba(74,144,226,0.45)}.secondary-btn{background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.85)}.secondary-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,0.12)}.preset-btn{padding:0.35rem 0.95rem;border-radius:999px;border:1px solid transparent;background:rgba(255,255,255,0.05);color:rgba(255,255,255,0.75);transition:border-color 0.2s ease,background 0.2s ease}.preset-btn:hover{background:rgba(74,144,226,0.12);border-color:rgba(74,144,226,0.4)}.circle-btn{display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;border-radius:999px;background:rgba(255,255,255,0.05);color:rgba(255,255,255,0.9);transition:transform 0.15s ease,background 0.2s ease}.circle-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,0.1)}.circle-btn[aria-pressed="true"]{background:rgba(74,144,226,0.25);color:#fff;box-shadow:0 12px 28px rgba(74,144,226,0.35)}.circle-btn-primary{background:linear-gradient(135deg,#4a90e2,#618ffc);box-shadow:0 12px 24px rgba(74,144,226,0.35);color:#ffffff}.circle-btn-primary:hover{background:linear-gradient(135deg,#5aa0f2,#7aa7ff)}.range-input{appearance:none;height:0.4rem;border-radius:999px;background:rgba(255,255,255,0.12);outline:none}.range-input::-webkit-slider-thumb{appearance:none;width:14px;height:14px;border-radius:999px;background:#4a90e2;box-shadow:0 2px 8px rgba(74,144,226,0.45);cursor:pointer}.range-input::-moz-range-thumb{width:14px;height:14px;border-radius:999px;border:none;background:#4a90e2;box-shadow:0 2px 8px rgba(74,144,226,0.45);cursor:pointer}.playlist-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:0.85rem 1rem;border-radius:1rem;background:rgba(255,255,255,0.03);border:1px solid transparent;cursor:pointer;transition:transform 0.15s ease,background 0.2s ease,border-color 0.2s ease}.playlist-item:hover{transform:translateX(4px);background:rgba(74,144,226,0.12);border-color:rgba(74,144,226,0.35)}.playlist-item.active{background:linear-gradient(135deg,rgba(74,144,226,0.25),rgba(56,133,239,0.35));border-color:rgba(74,144,226,0.6);box-shadow:0 10px 22px rgba(74,144,226,0.25)}.playlist-item span{color:rgba(255,255,255,0.7);font-size:0.85rem}.playlist-item strong{font-weight:600;color:rgba(255,255,255,0.95);letter-spacing:0.01em}.playlist-item .icon{color:rgba(255,255,255,0.6)}.playlist-action-group{display:flex;align-items:center;gap:0.4rem;margin-left:0.75rem}.playlist-delete-btn{display:inline-flex;align-items:center;justify-content:center;width:2.1rem;height:2.1rem;border-radius:0.75rem;background:rgba(255,71,71,0.12);color:rgba(255,120,120,0.85);border:1px solid rgba(255,71,71,0.25);transition:transform 0.15s ease,background 0.2s ease,color 0.2s ease,border-color 0.2s ease}.playlist-delete-btn:hover,.playlist-delete-btn:focus-visible{transform:translateY(-1px);background:rgba(255,71,71,0.25);color:rgba(255,196,196,0.95);border-color:rgba(255,71,71,0.45)}.playlist-delete-btn:disabled{opacity:0.35;cursor:not-allowed;background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.35);border-color:rgba(255,255,255,0.12);transform:none;box-shadow:none}.playlist-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:0.2rem 0.55rem;font-size:0.65rem;letter-spacing:0.08em;text-transform:uppercase;background:rgba(74,144,226,0.2);color:rgba(165,208,255,0.95);border:1px solid rgba(74,144,226,0.35);margin-left:auto;white-space:nowrap}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.reminder-btn{position:relative;display:inline-flex;align-items:center;justify-content:space-between;width:3.4rem;height:2rem;border-radius:999px;background:rgba(0,0,0,0.65);color:rgba(255,255,255,0.9);border:1px solid rgba(255,255,255,0.08);transition:background 0.2s ease,transform 0.15s ease,box-shadow 0.2s ease;padding:0 0.25rem;gap:0.3rem}.reminder-btn:hover,.reminder-btn[aria-pressed="true"]{transform:translateY(-1px);background:rgba(74,144,226,0.85);box-shadow:0 12px 30px rgba(74,144,226,0.35)}.reminder-tooltip{position:absolute;bottom:calc(100% + 0.5rem);right:0;transform:translateY(10%) scale(0.95);padding:0.45rem 0.65rem;border-radius:0.55rem;background:rgba(0,0,0,0.88);color:rgba(255,255,255,0.85);font-size:0.68rem;letter-spacing:0.07em;text-transform:uppercase;pointer-events:none;opacity:0;max-width:min(70vw,240px);text-align:right;line-height:1.2;white-space:normal;transition:opacity 0.2s ease,transform 0.2s ease;border:1px solid rgba(255,255,255,0.12)}.reminder-btn:hover .reminder-tooltip,.reminder-btn:focus-visible .reminder-tooltip{opacity:1;transform:translateY(0) scale(1)}.reminder-row{display:flex;align-items:flex-start;gap:1rem;width:100%}.reminder-row > .reminder-btn{margin-left:auto}.reminder-row > div{min-width:0}.youtube-wrapper{width:100%;border-radius:1rem;border:1px solid rgba(255,255,255,0.08);overflow:hidden;background:rgba(0,0,0,0.5);aspect-ratio:16 / 9;display:none}.youtube-wrapper.active{display:block}.youtube-player{width:100%;height:100%}.add-track-btn{display:inline-flex;align-items:center;justify-content:center;width:2rem;height:2rem;border-radius:0.75rem;background:rgba(255,255,255,0.08);color:rgba(255,255,255,0.85);border:1px solid transparent;transition:background 0.2s ease,transform 0.15s ease,border-color 0.2s ease}.add-track-btn:hover,.add-track-btn:focus-visible,.add-track-btn[aria-expanded="true"]{transform:translateY(-1px);background:rgba(74,144,226,0.2);border-color:rgba(74,144,226,0.45);box-shadow:0 12px 26px rgba(74,144,226,0.25)}.modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;z-index:50}.modal.hidden{pointer-events:none;opacity:0;transition:opacity 0.2s ease}.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.6);backdrop-filter:blur(6px)}.modal-panel{position:relative;width:min(90vw,420px);border-radius:1.2rem;padding:1.75rem;background:linear-gradient(160deg,rgba(15,16,20,0.92),rgba(6,7,10,0.96));border:1px solid rgba(255,255,255,0.08);box-shadow:0 35px 65px rgba(0,0,0,0.55);display:flex;flex-direction:column;gap:1.25rem;z-index:1;transform:translateY(12px);opacity:0;transition:opacity 0.25s ease,transform 0.25s ease}.modal:not(.hidden) .modal-panel{transform:translateY(0);opacity:1}.modal-header{display:flex;align-items:center;justify-content:space-between;gap:1rem}.modal-header h2{font-size:1.25rem;font-weight:600;letter-spacing:0.02em;color:#f7f8fb}.modal-close{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;border-radius:999px;background:rgba(255,255,255,0.08);border:1px solid transparent;color:rgba(255,255,255,0.85);transition:background 0.2s ease,transform 0.15s ease}.modal-close:hover,.modal-close:focus-visible{transform:translateY(-1px);background:rgba(255,255,255,0.18)}.modal-form{display:flex;flex-direction:column;gap:1rem}.modal-field{display:flex;flex-direction:column;gap:0.4rem}.modal-label{font-size:0.85rem;letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.65)}.modal-input{width:100%;border-radius:0.85rem;border:1px solid rgba(90,125,220,0.2);background:linear-gradient(160deg,rgba(22,26,36,0.95),rgba(12,14,20,0.95));padding:0.75rem 0.95rem;color:#f0f4ff;font-size:0.95rem;transition:border-color 0.2s ease,box-shadow 0.2s ease,transform 0.2s ease}.modal-input::placeholder{color:rgba(200,210,235,0.4)}.modal-input:focus{outline:none;border-color:rgba(110,170,255,0.7);box-shadow:0 10px 28px -12px rgba(110,170,255,0.5),0 0 0 2px rgba(110,170,255,0.35);transform:translateY(-1px)}.modal-input.error{border-color:rgba(255,87,87,0.8);box-shadow:0 0 0 2px rgba(255,87,87,0.25),0 10px 18px -12px rgba(255,87,87,0.45)}.modal-error{min-height:1.1rem;font-size:0.75rem;color:#ff6b6b;letter-spacing:0.02em}.modal-actions{display:flex;gap:0.75rem}.modal-submit,.modal-cancel{flex:1;border-radius:0.85rem;padding:0.65rem 0.9rem;font-weight:600;font-size:0.9rem;border:1px solid transparent;transition:transform 0.15s ease,box-shadow 0.2s ease,background 0.2s ease}.modal-submit{background:linear-gradient(135deg,#4a90e2,#618ffc);color:#fff;box-shadow:0 12px 24px rgba(74,144,226,0.35)}.modal-submit:hover,.modal-submit:focus-visible{transform:translateY(-1px);box-shadow:0 18px 32px rgba(74,144,226,0.45)}.modal-cancel{background:rgba(255,255,255,0.1);color:rgba(255,255,255,0.85)}.modal-cancel:hover,.modal-cancel:focus-visible{transform:translateY(-1px);background:rgba(255,255,255,0.16)}.timer-fullscreen-only{display:none}.timer-controls-disabled{opacity:0.6;pointer-events:none}button:disabled{opacity:0.6;cursor:not-allowed;transform:none !important}.primary-btn:disabled,.secondary-btn:disabled{box-shadow:none}.preset-btn:disabled{opacity:0.4;border-color:transparent}input:disabled{opacity:0.5;cursor:not-allowed}#timer-section.fullscreen-active{position:relative;width:100vw;height:100vh;max-width:none;border:none;background:#000;box-shadow:none;gap:clamp(1.5rem,4vh,3rem);justify-content:center;align-items:center;padding:calc(env(safe-area-inset-top,0px) + 2rem) 1.5rem calc(env(safe-area-inset-bottom,0px) + 6rem)}#timer-section.fullscreen-active .timer-fullscreen-hidden{display:none !important}#timer-section.fullscreen-active .timer-fullscreen-only{display:flex}#timer-section.fullscreen-active .timer-display-box{width:clamp(8rem,18vw,20rem)}#timer-section.fullscreen-active .timer-display-row{gap:clamp(2rem,10vw,8rem)}#timer-section.fullscreen-active .timer-value{background:transparent;font-size:clamp(5rem,18vw,20rem);padding:0;line-height:1;box-shadow:none}#timer-section.fullscreen-active .timer-label{display:none}#timer-section.fullscreen-active .fullscreen-control-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(env(safe-area-inset-bottom,0px) + 3.5rem);display:flex;align-items:center;justify-content:space-between;gap:1rem;width:min(90vw,28rem);pointer-events:none;z-index:30}#timer-section.fullscreen-active .fullscreen-control-bar > *{pointer-events:auto}#timer-section.fullscreen-active .fullscreen-media-controls,#timer-section.fullscreen-active .fullscreen-timer-control{display:flex;align-items:center;gap:0.75rem;background:rgba(0,0,0,0.85);border:1px solid rgba(255,255,255,0.12);border-radius:999px;padding:0.55rem 0.75rem;box-shadow:0 18px 45px rgba(0,0,0,0.55);backdrop-filter:blur(18px)}#timer-section.fullscreen-active .fullscreen-timer-control{gap:0.5rem}.fullscreen-circle-btn{display:inline-flex;align-items:center;justify-content:center;width:2.35rem;height:2.35rem;border-radius:999px;color:rgba(255,255,255,0.9);background:rgba(0,0,0,0.95);transition:transform 0.15s ease,background 0.2s ease,box-shadow 0.2s ease,opacity 0.2s ease}.fullscreen-circle-btn:hover{transform:translateY(-1px);background:rgba(20,20,20,0.95);box-shadow:0 12px 26px rgba(74,144,226,0.35)}.fullscreen-circle-btn-primary{width:2.6rem;height:2.6rem;background:rgba(0,0,0,0.98);color:#fff;box-shadow:0 16px 34px rgba(74,144,226,0.4)}.fullscreen-circle-btn-primary:hover{background:rgba(15,15,15,0.98)}.fullscreen-skip-btn{display:none}.fullscreen-media-controls:hover .fullscreen-skip-btn,.fullscreen-media-controls:focus-within .fullscreen-skip-btn{display:inline-flex}#timer-section.fullscreen-active .fullscreen-timer-control .fullscreen-circle-btn-primary{width:2.6rem;height:2.6rem}body.fullscreen-timer{background:#000;background-image:none;overflow:hidden;padding-bottom:calc(env(safe-area-inset-bottom,0px) + 5rem)}.animate-complete{animation:timerPulse 0.75s ease-in-out 2}@keyframes timerPulse{0%{box-shadow:0 0 0 rgba(74,144,226,0.0)}50%{box-shadow:0 0 35px rgba(74,144,226,0.65)}100%{box-shadow:0 0 0 rgba(74,144,226,0.0)}}@media (max-width:1024px){body{padding-bottom:2rem}.timer-display-box{width:clamp(5.5rem,32vw,6.5rem)}#timer-section{padding:1.75rem}.add-track-form{padding:0.75rem}}@media (max-width:640px){body{padding:1.5rem 0.75rem 3rem}#timer-section{padding:1.5rem 1.25rem}#timer-section.fullscreen-active{gap:1rem;padding:calc(env(safe-area-inset-top,0px) + 1.5rem) 0.75rem calc(env(safe-area-inset-bottom,0px) + 5rem)}#timer-section.fullscreen-active .timer-display-row{gap:1rem}#timer-section.fullscreen-active .timer-value{font-size:clamp(4rem,22vw,6rem)}.timer-display-row{flex-direction:column;align-items:center;gap:1.25rem}.timer-display-box{width:min(80vw,12rem)}#timer-section.fullscreen-active .fullscreen-control-bar{width:calc(100% - 1.25rem);gap:0.6rem}#timer-section.fullscreen-active .fullscreen-media-controls,#timer-section.fullscreen-active .fullscreen-timer-control{gap:0.35rem;padding:0.45rem 0.55rem}.fullscreen-circle-btn{width:2.1rem;height:2.1rem}.fullscreen-circle-btn-primary,.fullscreen-timer-control .fullscreen-circle-btn-primary{width:2.25rem;height:2.25rem}#timer-section.fullscreen-active .fullscreen-media-controls .fullscreen-skip-btn{display:inline-flex;opacity:1;pointer-events:auto}}