@import "https://fonts.googleapis.com/css2?family=Rajdhani:wght@400;500;600;700&display=swap";[data-theme=dark]{--bg-app:#0a0a0a;--bg-card:#0f172a;--bg-inset:#080e1a;--bg-hover:#1a2744;--bg-deep:#060b14;--border:#151f2e;--border-sub:#151f2e;--text-head:#fff;--text-body:#a0b4c8;--text-sec:#a0b4c8;--text-muted:#5a7490;--text-faint:#3a5068;--ghost-bg:transparent;--ghost-bd:#00aaff4d;--ghost-text:#0af;--ghost-hov:#00aaff14;--ghost-hovt:#0af;--adj-bg:#080e1a;--adj-input:#0f172a;--adj-bd:#64aaff4d;--adj-col:#59c;--adj-hov:#00aaff1a;--seg-run-bg:#0c1a10;--seg-start:#34d399;--seg-end:#5a7490;--seg-run-end:#6ee7b7;--card-shadow:none;--picker-shadow:0 8px 24px #0009;--timer-idle:#3a5068;--timer-stop:#0af;--dot-sep:#151f2e;--scrollbar:#1e3347;--brand:#0af}[data-theme=light]{--bg-app:#f0f4f8;--bg-card:#fff;--bg-inset:#f5f8fb;--bg-hover:#e2e8f0;--bg-deep:#f0f4f8;--border:#dce6ef;--border-sub:#eaf0f5;--text-head:#0f172a;--text-body:#1e293b;--text-sec:#475569;--text-muted:#64748b;--text-faint:#94a3b8;--ghost-bg:#f5f8fb;--ghost-bd:#dce6ef;--ghost-text:#475569;--ghost-hov:#e2e8f0;--ghost-hovt:#0f172a;--adj-bg:#f5f8fb;--adj-input:#fff;--adj-bd:#64aaff4d;--adj-col:#59c;--adj-hov:#00aaff1a;--seg-run-bg:#f0fdf4;--seg-start:#059669;--seg-end:#64748b;--seg-run-end:#047857;--card-shadow:0 1px 3px #00000014, 0 1px 2px #0000000a;--picker-shadow:0 8px 24px #00000026;--timer-idle:#64748b;--timer-stop:#0af;--dot-sep:#dce6ef;--scrollbar:#cbd5e1;--brand:#0af}*,:before,:after{box-sizing:border-box}body{background:var(--bg-app);color:var(--text-body);min-height:100vh;margin:0;font-family:Rajdhani,system-ui,sans-serif;transition:background .2s,color .2s}#root{flex-direction:column;min-height:100vh;display:flex}.app{flex-direction:column;flex:1;width:100%;max-width:1200px;margin:0 auto;padding:16px 12px 40px;display:flex}.mt4{margin-top:4px}button{cursor:pointer;white-space:nowrap;border:none;border-radius:5px;align-items:center;gap:5px;padding:7px 13px;font-family:Rajdhani,system-ui,sans-serif;font-size:13px;font-weight:600;transition:opacity .15s,transform .1s,background .15s,color .15s;display:inline-flex}button:active:not(:disabled){transform:scale(.97)}button:disabled{opacity:.35;cursor:not-allowed;transform:none!important}.btn-primary{color:#000a14;background:#0af;border-radius:5px;font-weight:700}.btn-primary:hover:not(:disabled){background:#3bf}.btn-success{color:#052e16;background:#22c55e;border-radius:5px}.btn-success:hover:not(:disabled){background:#16a34a}.btn-danger{color:#fff;background:#ef4444;border-radius:5px}.btn-danger:hover:not(:disabled){background:#dc2626}.btn-ghost{color:#0af;background:0 0;border:1px solid #00aaff4d;border-radius:5px}.btn-ghost:hover:not(:disabled){color:#0af;background:#00aaff14;border-color:#0af9}.btn-lap{color:#0af;background:#00aaff1a;border:1px solid #00aaff4d;border-radius:5px}.btn-lap:hover:not(:disabled){background:#00aaff2e}.btn-stop{color:#000;background:#f59e0b;border-radius:5px}.btn-stop:hover:not(:disabled){background:#d97706}.btn-reset{color:#3a5068;background:0 0;border:1px solid #1e3347;border-radius:5px;padding:5px 10px;font-size:12px}.btn-reset:hover:not(:disabled){background:var(--bg-hover);color:var(--text-sec)}.btn-adj{color:#59c;background:0 0;border:1px solid #64aaff4d;border-radius:5px;padding:5px 10px;font-size:12px}.btn-adj:hover:not(:disabled){background:#00aaff1a}.btn-adj.active{background:#00aaff1a;border-color:#59c}.app-header{border-bottom:1px solid var(--border-sub);flex-flow:row;justify-content:space-between;align-items:center;gap:10px;padding-bottom:14px;display:flex}.app-header-row1,.app-header-row2{display:contents}.app-title{color:var(--text-head);letter-spacing:-.3px;font-size:19px;font-weight:700}.header-actions{flex-wrap:nowrap;flex-shrink:0;align-items:center;gap:8px;display:flex}.hdr-btn,.exclusive-toggle,.theme-toggle{box-sizing:border-box;height:36px}.view-toggle{font-size:12px}.hdr-overflow{display:none;position:relative}.hdr-overflow-btn{letter-spacing:1px;font-size:16px;line-height:1}.hdr-overflow-menu{z-index:200;background:var(--bg-card);border:1px solid #00aaff40;border-radius:8px;flex-direction:column;gap:2px;min-width:150px;padding:6px;display:flex;position:absolute;top:calc(100% + 6px);right:0;box-shadow:0 8px 24px #00000059}.hdr-overflow-menu button{text-align:left;width:100%;color:var(--text-body);cursor:pointer;background:0 0;border:none;border-radius:5px;padding:8px 12px;font-family:Rajdhani,system-ui,sans-serif;font-size:14px;font-weight:600;transition:background .12s,color .12s}.hdr-overflow-menu button:hover:not(:disabled){color:#0af;background:#00aaff1a}.hdr-overflow-menu button:disabled{color:var(--text-faint);cursor:default}.exclusive-toggle{color:var(--ghost-text);cursor:pointer;-webkit-user-select:none;user-select:none;background:var(--ghost-bg);border:1px solid var(--ghost-bd);border-radius:5px;align-items:center;gap:6px;padding:0 11px;font-size:12px;font-weight:600;transition:color .15s,background .15s;display:flex}.exclusive-toggle:has(input:checked){color:#0af;background:#00aaff14;border-color:#0af6}[data-theme=light] .exclusive-toggle:has(input:checked){color:#07c;background:#e6f4ff;border-color:#0af}.exclusive-toggle input{accent-color:#0af}.theme-toggle{background:var(--ghost-bg);border:1px solid var(--ghost-bd);color:var(--text-muted);border-radius:5px;justify-content:center;align-items:center;padding:0 10px;line-height:1;display:flex}.theme-toggle:hover{background:var(--ghost-hov)}.takt-wordmark{align-items:center;gap:10px;text-decoration:none;display:flex}.takt-wordmark-text{color:#fff;letter-spacing:1px;font-family:Rajdhani,system-ui,sans-serif;font-size:26px;font-weight:700;line-height:1}[data-theme=light] .takt-wordmark-text{color:#0a0a0a}.pages-bar{border-bottom:1px solid var(--border);align-items:stretch;margin-bottom:16px;display:flex}.pages-tabs{flex-wrap:wrap;flex:1;align-items:stretch;gap:2px;padding-top:8px;display:flex}.page-tab{color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border:1px solid #0000;border-bottom:none;border-radius:5px 5px 0 0;align-items:center;gap:6px;padding:6px 13px;font-size:13px;font-weight:600;transition:color .15s,background .15s;display:flex;position:relative;bottom:-1px}.page-tab:hover{color:var(--text-sec);background:var(--bg-card)}.page-tab.active{color:var(--text-head);background:var(--bg-card);border-color:var(--border);border-bottom-color:var(--bg-card)}.page-tab-input{color:var(--text-head);background:0 0;border:none;outline:none;width:90px;padding:0;font-family:Rajdhani,system-ui,sans-serif;font-size:13px;font-weight:600}.page-tab-x{color:var(--text-faint);background:0 0;border-radius:4px;min-width:auto;padding:0 3px;font-size:16px;line-height:1}.page-tab-x:hover{background:var(--bg-hover);color:#ef4444}.page-add-btn{color:var(--text-faint);border:1px dashed var(--border);background:0 0;border-bottom:none;border-radius:5px 5px 0 0;align-self:flex-end;margin-bottom:-1px;padding:6px 12px;font-size:12px}.page-add-btn:hover{color:var(--text-sec);border-color:var(--text-faint);background:var(--bg-card)}.page-dots{justify-content:center;gap:8px;padding:12px 0 4px;display:flex}.page-dot{background:var(--border);border:none;border-radius:50%;width:8px;min-width:auto;height:8px;padding:0;transition:background .2s,transform .2s}.page-dot.active{background:#0af;transform:scale(1.3)}.stopwatches{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));align-items:start;gap:14px;display:grid}.sw-card{background:var(--bg-card);border:1px solid #00aaff26;border-left:3px solid var(--sw-color,#0af);box-shadow:var(--card-shadow);border-radius:10px;flex-direction:column;gap:11px;padding:16px;transition:opacity .2s,box-shadow .2s;display:flex}.sw-card.sw-dragging{opacity:.3}.sw-card.sw-drag-over{box-shadow:0 0 0 2px var(--sw-color,#0af)}.sw-card.sw-locked{opacity:.75}.sw-card.sw-locked .sw-timer{color:var(--text-faint)!important}.sw-card.sw-running{border-color:#0af6;box-shadow:0 0 0 1px #00aaff59,0 0 18px #00aaff1f}.sw-header{align-items:center;gap:7px;display:flex}.sw-drag-handle{color:var(--text-faint);cursor:grab;touch-action:none;border-radius:4px;flex-shrink:0;padding:2px 3px;font-size:15px}.sw-drag-handle:hover{color:var(--text-sec);background:var(--bg-hover)}.sw-drag-handle:active{cursor:grabbing}.sw-drag-handle.hidden{opacity:0;pointer-events:none}.sw-row-handle{color:var(--border);padding:6px 8px;font-size:18px}.sw-color-wrap{flex-shrink:0;position:relative}.color-dot{cursor:pointer;border:2px solid #00000026;border-radius:50%;width:16px;min-width:auto;height:16px;padding:0;transition:transform .15s,border-color .15s}[data-theme=dark] .color-dot{border-color:#fff3}.color-dot:hover{transform:scale(1.2)}.color-picker{background:var(--bg-inset);border:1px solid var(--border);z-index:200;box-shadow:var(--picker-shadow);border-radius:10px;grid-template-columns:repeat(4,1fr);gap:6px;padding:8px;display:grid;position:absolute;top:24px;left:0}.color-swatch{cursor:pointer;border:2px solid #0000;border-radius:50%;width:20px;min-width:auto;height:20px;padding:0;transition:transform .15s}.color-swatch:hover{transform:scale(1.15)}.color-swatch.active{border-color:var(--text-head)}.sw-name-input{background:var(--bg-inset);border:1px solid var(--border);color:var(--text-head);border-radius:6px;outline:none;flex:1;min-width:0;padding:5px 8px;font-family:Rajdhani,system-ui,sans-serif;font-size:13px;font-weight:600;transition:border-color .15s}.sw-name-input:focus{border-color:var(--sw-color,#0af)}.sw-name-input:disabled{opacity:.5}.sw-lock-btn{color:var(--text-faint);background:0 0;border-radius:5px;min-width:auto;padding:3px 5px;font-size:14px;line-height:1}.sw-lock-btn:hover{background:var(--bg-hover)}.sw-lock-btn.locked{color:#f59e0b}.sw-remove{color:var(--text-faint);background:0 0;border-radius:5px;flex-shrink:0;min-width:auto;padding:3px 6px;font-size:15px;line-height:1}.sw-remove:hover:not(:disabled){background:var(--bg-hover);color:#ef4444}.sw-timer{font-variant-numeric:tabular-nums;color:var(--timer-idle);letter-spacing:-1px;text-align:center;padding:4px 0;font-family:ui-monospace,Consolas,monospace;font-size:34px;font-weight:700;line-height:1;transition:color .2s}.sw-timer.running{color:#f59e0b}.sw-timer.stopped{color:#0af}.sw-controls{gap:7px;display:flex}.sw-controls button{flex:1;justify-content:center}.sw-controls-sec{flex-wrap:wrap;gap:6px;display:flex}.sw-controls-sec button{flex:1;justify-content:center;font-size:12px}.adj-panel{background:var(--adj-bg);border:1px solid var(--adj-bd);border-radius:10px;flex-direction:column;gap:10px;padding:12px;display:flex}.adj-row{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.adj-field{flex-direction:column;align-items:center;gap:3px;display:flex}.adj-label{color:var(--adj-col);text-transform:uppercase;letter-spacing:.8px;font-size:10px;font-weight:700}.adj-input{background:var(--adj-input);border:1px solid var(--adj-bd);width:52px;color:var(--text-head);text-align:center;border-radius:6px;outline:none;padding:6px 4px;font-family:ui-monospace,Consolas,monospace;font-size:16px;font-weight:700;transition:border-color .15s}.adj-input:focus{border-color:var(--adj-col)}.adj-input::-webkit-inner-spin-button{-webkit-appearance:none}.adj-input::-webkit-outer-spin-button{-webkit-appearance:none}.adj-input[type=number]{-moz-appearance:textfield}.adj-actions{gap:6px;display:flex}.adj-actions button{flex:1;justify-content:center}.sw-collapsible{flex-direction:column;gap:4px;display:flex}.sw-section-title{text-transform:uppercase;letter-spacing:.9px;color:var(--text-faint);margin-bottom:2px;font-size:10px;font-weight:700}.sw-toggle-btn{color:var(--text-muted);background:0 0;justify-content:flex-start;min-width:auto;padding:2px 0;font-size:11px;font-weight:600}.sw-toggle-btn:hover{color:var(--text-sec)}.sw-laps{flex-direction:column;gap:2px;max-height:190px;display:flex;overflow-y:auto}.lap-header{text-transform:uppercase;letter-spacing:.6px;color:var(--text-faint);grid-template-columns:22px 1fr 1fr 1fr;gap:5px;padding:2px 5px;font-size:10px;font-weight:700;display:grid}.lap-row{background:var(--bg-inset);font-variant-numeric:tabular-nums;border-radius:5px;grid-template-columns:22px 1fr 1fr 1fr;align-items:center;gap:5px;padding:4px 5px;font-size:11px;display:grid}.lap-num{color:var(--text-faint);font-weight:700}.lap-elapsed{color:var(--sw-color,#0af);font-family:ui-monospace,Consolas,monospace;font-weight:600}.lap-split{color:var(--text-sec);font-family:ui-monospace,Consolas,monospace}.lap-time{color:var(--text-muted);text-align:right;font-size:10px}.sw-history-list{flex-direction:column;gap:2px;max-height:160px;display:flex;overflow-y:auto}.seg-header{text-transform:uppercase;letter-spacing:.6px;color:var(--text-faint);grid-template-columns:22px 1fr 1fr 70px;gap:5px;padding:2px 5px;font-size:10px;font-weight:700;display:grid}.seg-row{background:var(--bg-inset);border-radius:5px;grid-template-columns:22px 1fr 1fr 70px;align-items:center;gap:5px;padding:4px 5px;font-size:11px;display:grid}.seg-row.running-seg{background:var(--seg-run-bg)}.seg-num{color:var(--text-faint);font-weight:700}.seg-start{color:var(--seg-start)}.seg-end{color:var(--seg-end)}.seg-dur{color:var(--text-muted);font-family:ui-monospace,Consolas,monospace;font-size:11px}.running-seg .seg-start{color:var(--sw-color,var(--seg-start))}.running-seg .seg-end{color:var(--seg-run-end);font-style:italic}.sw-list{flex-direction:column;gap:4px;display:flex}.sw-row{background:var(--bg-card);border:1px solid #00aaff26;border-left:3px solid var(--sw-color,#0af);box-shadow:var(--card-shadow);border-radius:10px;transition:box-shadow .15s;overflow:hidden}.sw-row.row-running{box-shadow:0 0 0 1px #0af6,0 0 12px #00aaff1a}.sw-row.sw-locked{opacity:.72}.sw-row-main{align-items:center;gap:10px;min-height:44px;padding:8px 12px;display:flex}.sw-row-color{border-radius:50%;flex-shrink:0;width:10px;height:10px}.sw-row-name{color:var(--text-head);text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-size:13px;font-weight:600;overflow:hidden}.sw-row-name em{color:var(--text-faint);font-style:normal}.sw-row-timer{font-variant-numeric:tabular-nums;color:var(--text-muted);letter-spacing:-.5px;flex-shrink:0;font-family:ui-monospace,Consolas,monospace;font-size:15px;font-weight:700}.sw-row-timer.running{color:#f59e0b}.sw-row-timer.stopped{color:#0af}.sw-row-btns{flex-shrink:0;gap:5px;display:flex}.sw-row-btns button{border-radius:5px;padding:6px 9px;font-size:12px}.row-expand{padding:5px 7px;font-size:11px}.sw-row-detail{border-top:1px solid var(--border);flex-direction:column;gap:8px;padding:4px 12px 12px;display:flex}.empty{text-align:center;color:var(--text-faint);flex:1;padding:56px 24px}.empty h2{color:var(--text-muted);margin-bottom:8px;font-size:17px;font-weight:600}.empty p{margin-bottom:18px;font-size:13px}.export-bar{border-top:1px solid var(--border-sub);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-top:20px;padding-top:14px;display:flex}.export-bar-info{color:var(--text-muted);flex-wrap:wrap;align-items:center;gap:8px;font-size:12px;display:flex}.export-bar-info strong{color:var(--text-sec)}.dot{color:var(--dot-sep)}.sw-laps::-webkit-scrollbar{width:4px}.sw-history-list::-webkit-scrollbar{width:4px}.sw-laps::-webkit-scrollbar-track{background:0 0}.sw-history-list::-webkit-scrollbar-track{background:0 0}.sw-laps::-webkit-scrollbar-thumb{background:var(--scrollbar);border-radius:4px}.sw-history-list::-webkit-scrollbar-thumb{background:var(--scrollbar);border-radius:4px}@media (width<=768px){.app{padding:10px 8px 32px}.app-header{flex-direction:column;align-items:stretch;gap:6px;padding-bottom:10px}.app-header-row1,.app-header-row2{align-items:center;display:flex}.takt-wordmark-text{font-size:20px}.takt-wordmark{gap:7px}.header-actions{gap:5px}.hdr-btn,.exclusive-toggle,.theme-toggle{height:36px;font-size:12px}.hdr-btn{padding:0 10px}.exclusive-toggle{gap:5px;padding:0 10px}.desktop-only{display:none!important}.hdr-overflow{display:block}.btn-success{white-space:nowrap}.stopwatches{grid-template-columns:1fr;gap:6px}.sw-card{border-radius:10px;gap:8px;padding:10px 12px}.sw-timer{padding:2px 0;font-size:24px}.sw-controls button{padding:6px 8px;font-size:12px}.sw-controls-sec button{padding:5px 7px;font-size:11px}.lap-row,.seg-row{padding:3px 5px;font-size:10px}.lap-elapsed{font-size:10px}.sw-row-main{gap:7px;padding:7px 10px}.sw-row-timer{font-size:13px}.sw-row-btns button{padding:5px 7px;font-size:11px}.sw-row-name{font-size:12px}.pages-tabs{-webkit-overflow-scrolling:touch;flex-wrap:nowrap;overflow-x:auto}.pages-tabs::-webkit-scrollbar{display:none}.page-dots{display:flex}}@media (width>=641px){.page-dots{display:none}}.pwa-banner{z-index:1000;background:#0f172a;border-top:1px solid #00aaff4d;align-items:center;gap:12px;padding:14px 16px;animation:.3s ease-out pwa-slide-up;display:flex;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -4px 24px #00000080,0 -1px #00aaff26}@keyframes pwa-slide-up{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.pwa-banner-body{flex:1;align-items:center;gap:12px;min-width:0;display:flex}.pwa-banner-icon{flex-shrink:0}.pwa-banner-msg{color:#a0b4c8;font-family:Rajdhani,system-ui,sans-serif;font-size:15px;font-weight:600;line-height:1.3}.pwa-banner-actions{flex-shrink:0;align-items:center;gap:8px;display:flex}.pwa-dismiss{color:#5a7490;cursor:pointer;background:0 0;border:1px solid #0af3;border-radius:5px;padding:7px 13px;font-family:Rajdhani,system-ui,sans-serif;font-size:14px;font-weight:600;transition:border-color .15s,color .15s}.pwa-dismiss:hover{color:#a0b4c8;border-color:#0af6}.pwa-add{padding:7px 16px;font-size:14px}[data-theme=light] .pwa-banner{background:#fff;border-top-color:#0088cc40;box-shadow:0 -4px 20px #0000001a}[data-theme=light] .pwa-banner-msg{color:#334155}[data-theme=light] .pwa-dismiss{color:#64748b;border-color:#08c3}[data-theme=light] .pwa-dismiss:hover{color:#1e3a5f;border-color:#0088cc80}.pwa-banner-ios{flex-wrap:wrap;gap:10px;position:fixed;bottom:0}.pwa-banner-ios:after{content:"";border-top:8px solid #0af6;border-left:8px solid #0000;border-right:8px solid #0000;position:absolute;bottom:-8px;left:50%;transform:translate(-50%)}.pwa-ios-text{flex-direction:column;gap:4px;display:flex}.pwa-ios-hint{color:#5a7490;align-items:center;gap:2px;font-family:Rajdhani,system-ui,sans-serif;font-size:13px;font-weight:500;display:flex}.pwa-ios-hint strong{color:#0af;font-weight:700}.pwa-share-icon{vertical-align:middle;flex-shrink:0;display:inline-block}.pwa-ios-close{color:#5a7490;cursor:pointer;background:0 0;border:none;flex-shrink:0;margin-left:auto;padding:4px 6px;font-size:16px;line-height:1;transition:color .15s}.pwa-ios-close:hover{color:#a0b4c8}[data-theme=light] .pwa-ios-hint{color:#64748b}[data-theme=light] .pwa-ios-hint strong{color:#07c}[data-theme=light] .pwa-ios-close{color:#94a3b8}[data-theme=light] .pwa-ios-close:hover{color:#334155}[data-theme=light] .pwa-banner-ios:after{border-top-color:#0077cc59}
