:root{--bg-color: #e0e5ec;--text-main: #4d5b6d;--text-sub: #a3b1c6;--text-gray: #64748b;--shadow-light: #ffffff;--shadow-dark: #a3b1c6;--primary-green: #22c55e;--primary-blue: #3b82f6;--dark-green: #14532d;--warn-yellow: #f59e0b}.dark{--bg-color: #1a1a2e;--text-main: #f4f4f5;--text-sub: #a3b1c6;--text-gray: #64748b;--shadow-light: #1e293b;--shadow-dark: #0f172a;--primary-green: #22c55e;--primary-blue: #3b82f6;--dark-green: #14532d;--warn-yellow: #f59e0b}.neomorphic-dark{--bg-color: #1e1e2e;--text-main: #f4f4f5;--text-sub: #a3b1c6;--text-gray: #64748b;--shadow-light: #2d2d42;--shadow-dark: #0f0f17;--primary-green: #22c55e;--primary-blue: #3b82f6;--dark-green: #14532d;--warn-yellow: #f59e0b}.neomorphic-dark .bg-gradient-to-t.from-black\/10.to-transparent,.dark .bg-gradient-to-t.from-black\/10.to-transparent{background:linear-gradient(to top,rgba(0,0,0,.25),transparent)}.ui-container{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;padding:30px;box-sizing:border-box;z-index:10}@media(max-width:768px){.ui-container{padding:20px}}@media(max-width:480px){.ui-container{padding:15px}}.neu-out{background:var(--bg-color);border-radius:16px;box-shadow:8px 8px 16px var(--shadow-dark),-8px -8px 16px var(--shadow-light);border:1px solid rgba(255,255,255,.2);color:var(--text-main)}.neu-out.dark-mode,.neu-out.neomorphic-dark-mode{background:var(--bg-color);box-shadow:8px 8px 16px var(--shadow-dark),-8px -8px 16px var(--shadow-light);border:1px solid rgba(255,255,255,.1);color:var(--text-main)}.neomorphic-dark .timer-text{color:#f4f4f5}.neomorphic-dark .status-text,.neomorphic-dark .preset-btn{color:var(--text-sub)}.neomorphic-dark .preset-btn:hover,.neomorphic-dark .preset-btn.active{color:var(--text-main)}.neomorphic-dark .audio-btn{color:var(--text-sub)}.neomorphic-dark .audio-btn:hover{color:var(--primary-green)}.neomorphic-dark .highlight-num,.neomorphic-dark .seed-option{color:var(--text-main)}.neomorphic-dark .selector-title{color:var(--text-sub)}.neomorphic-dark .audio-item{color:var(--text-main)}.neomorphic-dark .audio-item:hover,.neomorphic-dark .audio-item.selected{color:var(--primary-green)}.neomorphic-dark .exit-btn,.neomorphic-dark .help-btn{color:var(--text-main)}.stats-bar{display:flex;gap:20px;flex-wrap:wrap;justify-content:flex-start;width:100%;margin-left:0;margin-top:0}.stats-panel{pointer-events:auto;padding:12px 24px;display:flex;align-items:center;gap:12px;font-weight:600;font-size:14px;cursor:pointer;transition:transform .2s ease;color:var(--text-main);width:auto;max-width:100%}.stats-panel:hover{transform:translateY(-2px);background:var(--bg-color)}.stats-panel:active{transform:scale(.98)}.neomorphic-dark .stats-panel{color:var(--text-main)}.highlight-num{font-size:18px;font-weight:800;color:var(--text-main);text-shadow:none}@media(max-width:768px){.stats-panel{padding:10px 20px;font-size:12px;gap:8px}.highlight-num{font-size:16px}.stats-bar{gap:10px}}@media(max-width:480px){.stats-panel{padding:8px 16px;font-size:11px;gap:6px}.highlight-num{font-size:14px}.stats-bar{gap:8px;flex-direction:column;align-items:flex-start}}.stats-combined{display:flex;align-items:center;gap:12px}.highlight-num.edit-mode{display:flex;align-items:center}.edit-input{font-size:18px;font-weight:800;color:var(--text-main);background:transparent;border:none;outline:none;width:60px;text-align:center;padding:2px 6px;border-radius:8px;box-shadow:inset 2px 2px 5px var(--shadow-dark),inset -2px -2px 5px var(--shadow-light)}.edit-input:focus{box-shadow:inset 3px 3px 6px var(--shadow-dark),inset -3px -3px 6px var(--shadow-light)}.preset-input{font-size:13px;font-weight:600;color:var(--text-main);background:transparent;border:none;outline:none;width:60px;text-align:center;padding:8px 16px;border-radius:20px;box-shadow:inset 3px 3px 6px var(--shadow-dark),inset -3px -3px 6px var(--shadow-light)}.preset-input:focus{box-shadow:inset 4px 4px 8px var(--shadow-dark),inset -4px -4px 8px var(--shadow-light)}.seed-selector{pointer-events:auto;position:absolute;top:100px;max-height:calc((100vh - 140px)/2);right:30px;width:160px;padding:15px;display:flex;flex-direction:column;gap:10px;overflow-y:auto;transition:all .4s cubic-bezier(.34,1.56,.64,1);transform:translate(0);opacity:1;z-index:100;min-width:140px}@media(max-width:768px){.seed-selector{top:80px;right:20px;width:140px;min-width:120px;padding:12px}.selector-title{font-size:11px}.seed-option{gap:6px;padding:6px 10px}.seed-icon{font-size:14px;width:18px}.seed-name{font-size:10px}}@media(max-width:480px){.seed-selector{top:60px;right:10px;width:120px;min-width:100px;padding:10px;max-height:calc(100vh - 120px)}.selector-title{font-size:10px;margin-bottom:3px}.seed-option{gap:5px;padding:5px 8px;font-size:10px}.seed-icon{font-size:12px;width:16px}.seed-name{font-size:9px}@media(max-height:600px){.seed-selector{position:fixed;top:auto;bottom:10px;right:50%;transform:translate(50%);width:90%;max-width:300px}}}.seed-selector.hidden{transform:translate(150%);opacity:0;pointer-events:none}.seed-selector::-webkit-scrollbar{width:0px}.selector-title{font-size:12px;color:var(--text-sub);font-weight:700;margin-bottom:5px;text-transform:uppercase;letter-spacing:1px;text-align:center}.seed-option{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:50px;cursor:pointer;transition:all .2s ease;background:var(--bg-color);box-shadow:4px 4px 8px var(--shadow-dark),-4px -4px 8px var(--shadow-light);color:var(--text-main)}.seed-option:hover{transform:translateY(-2px)}.seed-option:active{transform:scale(.98)}.seed-option.active{box-shadow:inset 3px 3px 6px var(--shadow-dark),inset -3px -3px 6px var(--shadow-light);color:var(--text-main);font-weight:700;transform:none}.neomorphic-dark .seed-option{color:var(--text-main)}.neomorphic-dark .seed-option:hover,.neomorphic-dark .seed-option.active{color:var(--primary-green)}.seed-number{font-size:10px;font-weight:700;width:15px;text-align:center;color:var(--text-sub)}.seed-icon{font-size:16px;width:20px;text-align:center}.seed-name{font-size:11px;font-weight:600}.controls{pointer-events:none;align-self:center;text-align:center;display:flex;flex-direction:column;align-items:center;gap:35px;margin-top:auto;margin-bottom:80px;position:fixed;bottom:0;left:50%;transform:translate(-50%);z-index:20;background:transparent}@media(max-width:768px){.controls{margin-bottom:60px}}@media(max-width:480px){.controls{margin-bottom:50px;gap:25px}}.controls .focus-ring-container,.controls .controls-row{pointer-events:auto}.focus-ring-container{position:relative;width:280px;height:280px;border-radius:50%;background:var(--bg-color);box-shadow:20px 20px 60px var(--shadow-dark),-20px -20px 60px var(--shadow-light);display:flex;justify-content:center;align-items:center;cursor:pointer;transition:transform .2s cubic-bezier(.34,1.56,.64,1),box-shadow .2s;z-index:20}.focus-ring-container:hover{transform:scale(1.02) translateY(-5px)}.exit-btn{width:40px;height:40px;border-radius:50%;background:var(--bg-color);box-shadow:5px 5px 10px var(--shadow-dark),-5px -5px 10px var(--shadow-light);display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .2s ease;font-size:20px;font-weight:700;color:var(--text-main);pointer-events:auto}.exit-btn:hover{transform:scale(1.1)}.help-btn{position:absolute;top:30px;left:30px;width:40px;height:40px;border-radius:50%;background:var(--bg-color);box-shadow:5px 5px 10px var(--shadow-dark),-5px -5px 10px var(--shadow-light);display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .2s ease;z-index:100;font-size:20px;font-weight:700;color:var(--text-main);pointer-events:auto}.help-btn:hover{transform:scale(1.1)}.guide-card{position:absolute;top:80px;left:30px;width:300px;max-height:60vh;padding:20px;z-index:100;pointer-events:auto;transform:translate(-120%);opacity:0;transition:all .4s cubic-bezier(.34,1.56,.64,1);overflow-y:auto}.guide-card.show{transform:translate(0);opacity:1}.guide-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}.guide-header h3{margin:0;font-size:16px;font-weight:700}.guide-close{background:none;border:none;font-size:20px;cursor:pointer;color:var(--text-main);padding:0;width:30px;height:30px;border-radius:50%;display:flex;justify-content:center;align-items:center;transition:all .2s ease}.guide-close:hover{background:#ffffff1a}.guide-content{font-size:14px}.guide-content h4{margin:15px 0 10px;font-size:14px;font-weight:700}.guide-content ul{margin:0;padding-left:20px}.guide-content li{margin-bottom:8px}.preset-btn{width:40px;height:40px;padding:0;border-radius:50%;background:var(--bg-color);box-shadow:4px 4px 8px var(--shadow-dark),-4px -4px 8px var(--shadow-light);border:none;color:var(--text-main);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;justify-content:center;align-items:center}.preset-btn:hover{transform:translateY(-2px)}.preset-btn.active{box-shadow:inset 3px 3px 6px var(--shadow-dark),inset -3px -3px 6px var(--shadow-light)}.controls-row{display:flex;justify-content:center;align-items:center;gap:10px}.audio-dropdown button{width:40px;height:40px;padding:0;border-radius:50%;background:var(--bg-color);box-shadow:4px 4px 8px var(--shadow-dark),-4px -4px 8px var(--shadow-light);border:none;color:var(--text-main);font-size:13px;font-weight:600;cursor:pointer;transition:all .2s ease;display:flex;justify-content:center;align-items:center}.audio-dropdown{position:relative}.progress-ring{transform:rotate(-90deg);width:100%;height:100%}.progress-ring__circle-bg{fill:none;stroke:#1e40af33;stroke-width:8}.progress-ring__circle{fill:none;stroke:#2563eb;stroke-width:8;stroke-linecap:round;transition:stroke-dashoffset 1s ease-linear}.focusing{animation:pulse 2s infinite}.paused{animation:pause-pulse 1s infinite}@keyframes pulse{0%{box-shadow:0 0 #22c55e66}70%{box-shadow:0 0 0 20px #22c55e00}to{box-shadow:0 0 #22c55e00}}@keyframes pause-pulse{0%{box-shadow:0 0 #f59e0b66}70%{box-shadow:0 0 0 20px #f59e0b00}to{box-shadow:0 0 #f59e0b00}}.center-plate{position:absolute;width:240px;height:240px;border-radius:50%;background:var(--bg-color);box-shadow:4px 4px 8px var(--shadow-dark),-4px -4px 8px var(--shadow-light);display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}.timer-text{font-size:48px;font-weight:700;color:var(--text-main);margin-bottom:10px;line-height:1}.status-text{font-size:14px;color:var(--text-sub);line-height:1}.ring-groove{position:absolute;width:260px;height:260px;border-radius:50%;background:var(--bg-color);box-shadow:inset 6px 6px 12px var(--shadow-dark),inset -6px -6px 12px var(--shadow-light);display:flex;justify-content:center;align-items:center}.dark .progress-ring__circle-bg{stroke:#1e40af4d}.dark .progress-ring__circle{stroke:#2563eb}.neomorphic-dark .progress-ring__circle-bg{stroke:#1e40af4d}.neomorphic-dark .progress-ring__circle{stroke:#2563eb}.neomorphic-dark .progress-ring__circle-bg,.neomorphic-dark .progress-ring__circle{filter:none}.hidden{display:none!important}