:root{--dt-bg: #0b1a14;--dt-surface: rgba(34, 197, 94, .04);--dt-surface-active: rgba(34, 197, 94, .08);--dt-accent: #22c55e;--dt-accent-light: #86efac;--dt-accent-muted: rgba(74, 222, 128, .55);--dt-border: rgba(34, 197, 94, .1);--dt-border-active: rgba(34, 197, 94, .2);--dt-text: #e2e8f0;--dt-text-muted: #94a3b8;--dt-danger: rgba(239, 68, 68, .08);--dt-danger-border: rgba(239, 68, 68, .15);--dt-danger-text: #fca5a5;--dt-break: rgba(59, 130, 246, .08);--dt-break-accent: #60a5fa;--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 20px;--sp-6: 24px;--sp-8: 32px;--sp-10: 40px;--sp-12: 48px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-pill: 9999px;--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--duration-fast: .15s;--duration-normal: .25s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%}body{background:var(--dt-bg);color:var(--dt-text);font-family:Inter,system-ui,-apple-system,Arial,sans-serif;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none}.app-shell{display:flex;flex-direction:column;height:100%;max-width:480px;margin:0 auto;overflow:hidden}.app-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--dt-border);flex-shrink:0}.app-header h1{font-size:13px;font-weight:700;letter-spacing:.1em;color:var(--dt-accent-light);text-transform:uppercase}.app-header .settings-btn{background:transparent;border:1px solid var(--dt-border);color:var(--dt-text-muted);border-radius:var(--radius-sm);min-height:44px;min-width:44px;padding:var(--sp-2) var(--sp-3);cursor:pointer;font-size:13px;transition:color var(--duration-fast) ease,border-color var(--duration-fast) ease,background var(--duration-fast) ease}.app-header .settings-btn:hover{color:var(--dt-accent-light);border-color:var(--dt-border-active);background:var(--dt-surface)}.error-banner{background:var(--dt-danger);border:1px solid var(--dt-danger-border);color:var(--dt-danger-text);padding:var(--sp-3) var(--sp-5);font-size:13px;flex-shrink:0}.timer-section{display:flex;flex-direction:column;align-items:center;padding:var(--sp-8) var(--sp-5) var(--sp-6);flex-shrink:0}.timer-ring-container{position:relative;display:flex;align-items:center;justify-content:center;width:200px;height:200px;border-radius:50%;background:var(--dt-surface);border:1px solid var(--dt-border);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 0 40px #22c55e0f,inset 0 1px #22c55e14;transition:box-shadow var(--duration-normal) ease}.timer-ring-container svg{position:absolute;top:0;right:0;bottom:0;left:0}.timer-ring-time{position:relative;z-index:1;font-size:40px;font-weight:700;letter-spacing:-.02em;color:var(--dt-text);font-variant-numeric:tabular-nums;line-height:1}.timer-ring-container.warning{box-shadow:0 0 40px #ef444426,inset 0 1px #ef44441a}.timer-ring-container.warning .timer-ring-time{color:var(--dt-danger-text)}.timer-ring-container.break-mode{background:var(--dt-break);border-color:#60a5fa33;box-shadow:0 0 40px #3b82f614,inset 0 1px #60a5fa1a}.timer-label{display:flex;flex-direction:column;align-items:center;gap:var(--sp-1);margin-top:var(--sp-5);text-align:center}.timer-task-name{font-size:14px;font-weight:500;color:var(--dt-text)}.timer-session-info{font-size:12px;color:var(--dt-text-muted);letter-spacing:.03em}.action-bar{display:flex;flex-direction:column;gap:0;padding:var(--sp-4) var(--sp-5);border-top:1px solid var(--dt-border);border-bottom:1px solid var(--dt-border);flex-shrink:0;justify-content:center}button{cursor:pointer;font-family:inherit;font-size:13px;font-weight:600;border:none;border-radius:var(--radius-sm);min-height:44px;padding:var(--sp-2) var(--sp-5);transition:transform var(--duration-fast) var(--ease-spring),box-shadow var(--duration-fast) ease,background var(--duration-fast) ease,opacity var(--duration-fast) ease}button:disabled{opacity:.4;cursor:not-allowed;transform:none!important}.btn-primary{background:var(--dt-accent);color:#0b1a14;letter-spacing:.02em}.btn-primary:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 6px 20px #22c55e4d}.btn-primary:not(:disabled):active{transform:translateY(1px) scale(.98);box-shadow:none}.btn-danger{background:var(--dt-danger);border:1px solid var(--dt-danger-border);color:var(--dt-danger-text)}.btn-danger:not(:disabled):hover{transform:translateY(-2px);box-shadow:0 6px 16px #ef44442e}.btn-danger:not(:disabled):active{transform:translateY(1px) scale(.98);box-shadow:none}.btn-ghost{background:var(--dt-surface);border:1px solid var(--dt-border);color:var(--dt-text-muted)}.btn-ghost:not(:disabled):hover{transform:translateY(-2px);border-color:var(--dt-border-active);color:var(--dt-text);box-shadow:0 4px 12px #22c55e14}.btn-ghost:not(:disabled):active{transform:translateY(1px) scale(.98);box-shadow:none}.btn-wide{width:100%;justify-content:center;text-align:center}.task-list{flex:1;overflow-y:auto;padding:var(--sp-4) var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-2);scrollbar-width:thin;scrollbar-color:var(--dt-border) transparent}.task-list::-webkit-scrollbar{width:4px}.task-list::-webkit-scrollbar-track{background:transparent}.task-list::-webkit-scrollbar-thumb{background:var(--dt-border);border-radius:var(--radius-pill)}.task-list-heading{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--dt-text-muted);text-transform:uppercase;margin-bottom:var(--sp-2);flex-shrink:0}.task-card{display:flex;align-items:center;gap:var(--sp-3);padding:var(--sp-3) var(--sp-4);border-radius:var(--radius-md);background:var(--dt-surface);border:1px solid var(--dt-border);cursor:pointer;min-height:44px;transition:border-color var(--duration-fast) ease,background var(--duration-fast) ease,transform var(--duration-fast) var(--ease-spring);outline:none}.task-card:hover:not(.task-completed){border-color:var(--dt-border-active);background:var(--dt-surface-active)}.task-card:focus-visible{outline:2px solid var(--dt-accent);outline-offset:2px}.task-card.task-active{border-color:var(--dt-border-active);background:var(--dt-surface-active);box-shadow:0 0 0 1px var(--dt-accent) inset}.task-card.task-completed{opacity:.55;cursor:default}.task-card.task-completed .task-title{text-decoration:line-through;color:var(--dt-text-muted)}.task-indicator{font-size:14px;color:var(--dt-text-muted);flex-shrink:0;width:16px;text-align:center;line-height:1}.task-card.task-active .task-indicator{color:var(--dt-accent)}.task-card.task-completed .task-indicator{color:var(--dt-accent-muted)}.task-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.task-title{font-size:14px;font-weight:500;color:var(--dt-text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.task-meta{font-size:11px;color:var(--dt-text-muted)}.task-badge{flex-shrink:0;font-size:11px;font-weight:600;letter-spacing:.04em;padding:2px var(--sp-2);border-radius:var(--radius-pill);background:var(--dt-surface-active);border:1px solid var(--dt-border-active);color:var(--dt-accent-light)}.task-badge-done{background:transparent;border-color:var(--dt-border);color:var(--dt-text-muted)}.task-empty{font-size:13px;color:var(--dt-text-muted);text-align:center;padding:var(--sp-8) 0}.skeleton-container{flex:1;padding:var(--sp-4) var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-2)}.skeleton{height:56px;border-radius:var(--radius-md);background:linear-gradient(90deg,var(--dt-surface) 25%,rgba(34,197,94,.07) 50%,var(--dt-surface) 75%);background-size:200% 100%;animation:shimmer 1.6s infinite}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.day-overview{display:grid;grid-template-columns:repeat(3,1fr);padding:var(--sp-4) var(--sp-5);border-top:1px solid var(--dt-border);flex-shrink:0;background:var(--dt-surface)}.stat{display:flex;flex-direction:column;align-items:center;gap:2px;padding:var(--sp-2) 0;border-right:1px solid var(--dt-border)}.stat:last-child{border-right:none}.stat-value{font-size:16px;font-weight:700;color:var(--dt-accent-light);font-variant-numeric:tabular-nums;line-height:1.2}.stat-label{font-size:10px;font-weight:500;letter-spacing:.08em;color:var(--dt-text-muted);text-transform:uppercase}.bottom-nav{display:flex;align-items:center;justify-content:space-around;padding:var(--sp-2) var(--sp-5);border-top:1px solid var(--dt-border);flex-shrink:0;background:var(--dt-bg)}.nav-btn{background:transparent;border:none;color:var(--dt-text-muted);font-size:20px;min-height:44px;min-width:44px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);transition:color var(--duration-fast) ease,background var(--duration-fast) ease}.nav-btn:hover{color:var(--dt-accent-light);background:var(--dt-surface)}.nav-btn.nav-active{color:var(--dt-accent)}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.skeleton{animation:none;background:var(--dt-surface)}}.view-content{flex:1;overflow-y:auto;display:flex;flex-direction:column}.action-bar-primary{display:flex;gap:var(--sp-3);justify-content:center;width:100%}.action-bar-secondary{display:flex;gap:var(--sp-3);justify-content:center;width:100%;padding-top:var(--sp-3);border-top:1px solid var(--dt-border);margin-top:var(--sp-3)}.btn-icon{background:var(--dt-surface);border:1px solid var(--dt-border);color:var(--dt-text-muted);width:40px;height:40px;min-width:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-sm);cursor:pointer;transition:color var(--duration-fast) ease,border-color var(--duration-fast) ease,background var(--duration-fast) ease,transform var(--duration-fast) var(--ease-spring)}.btn-icon:not(:disabled):hover{color:var(--dt-accent-light);border-color:var(--dt-border-active);background:var(--dt-surface-active);transform:translateY(-1px)}.btn-icon:not(:disabled):active{transform:translateY(1px) scale(.96)}.btn-icon:disabled{opacity:.3;cursor:not-allowed}.btn{display:inline-flex;align-items:center;gap:var(--sp-2)}.admin-panel{padding:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-5)}.admin-heading{font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--dt-accent-muted);margin:0}.admin-section{background:var(--dt-surface);border:1px solid var(--dt-border);border-radius:var(--radius-md);padding:var(--sp-4)}.admin-section-title{font-size:13px;font-weight:600;color:var(--dt-text);margin-bottom:var(--sp-4);display:flex;align-items:center;justify-content:space-between}.toggle-row{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);padding:var(--sp-3);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--duration-fast) ease}.toggle-row:hover{background:var(--dt-surface-active)}.toggle-label{display:flex;align-items:center;gap:var(--sp-3);color:var(--dt-text)}.toggle-label-title{font-size:14px;font-weight:500}.toggle-label-desc{font-size:12px;color:var(--dt-text-muted);margin-top:2px}.toggle-switch{width:44px;height:24px;background:var(--dt-border);border-radius:var(--radius-pill);position:relative;flex-shrink:0;transition:background var(--duration-normal) ease}.toggle-switch:after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:var(--dt-text-muted);transition:transform var(--duration-normal) var(--ease-spring),background var(--duration-normal) ease}.toggle-switch.toggle-active{background:var(--dt-accent)}.toggle-switch.toggle-active:after{transform:translate(20px);background:#0b1a14}.toggle-switch.toggle-saving{opacity:.5}.config-table{display:flex;flex-direction:column;gap:1px}.config-row{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-2) var(--sp-3);border-radius:var(--radius-sm);transition:background var(--duration-fast) ease}.config-row:hover{background:var(--dt-surface-active)}.config-key{font-size:12px;font-family:SF Mono,Fira Code,monospace;color:var(--dt-accent-muted)}.config-value{font-size:12px;font-family:SF Mono,Fira Code,monospace;color:var(--dt-text);text-align:right}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spin{animation:spin 1s linear infinite}