:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font:18px/145% system-ui,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80}}*,:before,:after{box-sizing:border-box}body{margin:0}#root{flex-direction:column;width:100%;max-width:900px;min-height:100svh;margin:0 auto;display:flex}.app{flex:1;min-height:0;display:flex;position:relative}.sidebar{border-right:1px solid var(--border);background:var(--bg);flex-direction:column;flex-shrink:0;gap:12px;width:220px;padding:16px 12px;display:flex}.add-timer{gap:6px;display:flex}.add-timer-input{border:2px solid var(--border);background:var(--bg);min-width:0;color:var(--text-h);border-radius:6px;outline:none;flex:1;padding:7px 10px;font-size:14px;transition:border-color .2s}.add-timer-input:focus{border-color:var(--accent)}.add-timer-input::placeholder{color:var(--text);opacity:.6}.btn-add{background:var(--accent);color:#fff;cursor:pointer;border:none;border-radius:6px;flex-shrink:0;padding:6px 14px;font-size:18px;font-weight:600;transition:opacity .2s}.btn-add:hover{opacity:.85}.timer-nav{flex-direction:column;flex:1;gap:4px;display:flex;overflow-y:auto}.empty-hint{color:var(--text);opacity:.5;margin:0;padding:8px 0;font-size:14px}.timer-nav-item{text-align:left;width:100%;color:var(--text);cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;gap:8px;padding:8px 10px;font-size:15px;transition:background .15s,color .15s;display:flex}.timer-nav-item:hover{background:var(--accent-bg);color:var(--text-h)}.timer-nav-item.active{background:var(--accent-bg);color:var(--accent);font-weight:600}.timer-nav-item.dragging{outline:2px dashed var(--accent-border);outline-offset:-2px;cursor:grabbing;color:#0000!important;background:var(--accent-bg)!important}.timer-nav-item.dragging .nav-name,.timer-nav-item.dragging .nav-time{visibility:hidden}.timer-nav-item.dragging+.timer-nav-item--mirror.dragging{border-top-left-radius:0;border-top-right-radius:0;margin-top:-4px}.timer-nav-item.dragging:has(+.timer-nav-item--mirror.dragging){border-bottom-right-radius:0;border-bottom-left-radius:0}.timer-nav-item--mirror.dragging{outline:2px dashed var(--accent-border);outline-offset:-2px;color:#0000!important;background:var(--accent-bg)!important}.timer-nav-item--mirror.dragging .nav-name,.timer-nav-item--mirror.dragging .nav-time{visibility:hidden}.drop-slot{border-radius:2px;height:3px;margin:0 4px;transition:background .15s}.drop-slot.active:not(.drop-slot--bottom){background:var(--accent);animation:.8s ease-in-out infinite dropPulse}.drop-slot--bottom{flex:1;min-height:4px;position:relative}.drop-slot--bottom:before{content:"";border-radius:2px;height:3px;transition:background .15s;position:absolute;top:0;left:4px;right:4px}.drop-slot--bottom.active:before{background:var(--accent);animation:.8s ease-in-out infinite dropPulse}@keyframes dropPulse{0%,to{opacity:.6}50%{opacity:1}}.nav-name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.nav-time{color:var(--text);font-variant-numeric:tabular-nums;text-align:right;flex-shrink:0;min-width:3.5ch;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:13px;font-weight:500}.timer-nav-item.running .nav-time{color:#22c55e}.timer-nav-item--mirror{font-size:14px;font-style:italic}.timer-nav-item--mirror .nav-name{padding-left:18px}.timer-nav-item--mirror .nav-name:before{content:"↳ ";opacity:.5;font-size:12px;font-style:normal}.main{flex-direction:column;flex:1;justify-content:center;align-items:center;min-width:0;padding:32px;display:flex}.no-selection{color:var(--text);opacity:.5;font-size:18px}.timer-card{border:2px solid var(--border);border-radius:12px;width:100%;max-width:480px;padding:24px 28px 20px;transition:border-color .3s}.timer-card.running{border-color:var(--accent-border)}.timer-header{justify-content:space-between;align-items:center;min-height:30px;margin-bottom:8px;display:flex}.timer-name{color:var(--text-h);cursor:pointer;border-radius:4px;padding:2px 6px;font-size:18px;font-weight:600;transition:background .15s}.timer-name:hover{background:var(--accent-bg)}.timer-name--placeholder{color:var(--text);opacity:.45;font-style:italic;font-weight:400}.timer-name-input{border:2px solid var(--accent);background:var(--bg);color:var(--text-h);border-radius:4px;outline:none;width:200px;padding:2px 6px;font-size:18px;font-weight:600}.timer-card .timer-display{letter-spacing:1px;color:var(--text-h);font-variant-numeric:tabular-nums;text-align:center;padding:8px 0 16px;font-family:ui-monospace,Consolas,Courier New,monospace;font-size:56px;font-weight:300}.timer-controls{justify-content:center;gap:10px;display:flex}.btn{cursor:pointer;border:none;border-radius:8px;padding:8px 22px;font-size:15px;font-weight:500;transition:opacity .2s,transform .1s,background .2s}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.3;cursor:default}.btn-start{color:#fff;background:#22c55e}.btn-start:hover:not(:disabled){background:#16a34a}.btn-stop{color:#fff;background:#ef4444}.btn-stop:hover:not(:disabled){background:#dc2626}.btn-reset{color:var(--text);border:2px solid var(--border);background:0 0}.btn-reset:hover:not(:disabled){border-color:var(--text);color:var(--text-h)}.btn-delete{color:var(--text);opacity:.4;background:0 0;padding:0 4px;font-size:22px;line-height:1;transition:opacity .15s,color .15s}.btn-delete:hover{opacity:1;color:#ef4444}.mirror-card.running{border-color:#22c55e}.mirror-label-header{color:var(--text);opacity:.6;text-align:center;text-transform:uppercase;letter-spacing:.5px;margin-bottom:4px;font-size:13px}.mirror-toggle{color:var(--text);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:5px;padding:0 4px;font-size:13px;display:flex}.mirror-toggle input{cursor:pointer}.btn-mirror-start{color:#fff;background:#ef4444}.btn-mirror-start:hover:not(:disabled){background:#dc2626}.btn-mirror-pause{color:#fff;background:#22c55e}.btn-mirror-pause:hover:not(:disabled){background:#16a34a}.hamburger{z-index:10;cursor:pointer;background:0 0;border:none;flex-direction:column;gap:5px;padding:10px 8px;display:none;position:absolute;top:12px;left:12px}.hamburger span{background:var(--text-h);border-radius:2px;width:22px;height:2.5px;transition:transform .2s;display:block}.sidebar-backdrop{display:none}@media (width<=640px){#root{max-width:100%}.hamburger{display:flex}.sidebar{z-index:20;transition:transform .25s;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);box-shadow:2px 0 12px #00000026}.sidebar--open{transform:translate(0)}.sidebar-backdrop{z-index:19;background:#00000059;display:block;position:fixed;inset:0}.main{padding:52px 16px 24px}.timer-card{max-width:100%;padding:20px 20px 16px}.timer-card .timer-display{padding:4px 0 12px;font-size:42px}.timer-name{font-size:16px}.timer-name-input{width:160px;font-size:16px}.btn{padding:10px 24px;font-size:16px}.btn-delete{padding:0 6px;font-size:24px}.mirror-label-header{font-size:12px}.mirror-toggle{font-size:14px}.timer-nav-item{padding:10px 12px;font-size:16px}.timer-nav-item--mirror{font-size:15px}.add-timer-input{padding:10px 12px;font-size:16px}.btn-add{padding:8px 16px;font-size:20px}}