:root{--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;--bg-app:#fcfcfd;--bg-surface:#fff;--bg-surface-subtle:#f4f4f6;--border-subtle:#e5e5ea;--border-strong:#d1d1d6;--text-primary:#1c1c1e;--text-secondary:#636366;--text-tertiary:#8e8e93;--btn-primary-bg:#1c1c1e;--btn-primary-text:#fff;--btn-primary-hover:#2c2c2e;--btn-secondary-bg:#f2f2f7;--btn-secondary-text:#1c1c1e;--btn-secondary-hover:#e5e5ea;--day-done-bg:#1c1c1e;--day-done-text:#fff;--day-pending-bg:transparent;--day-pending-border:#e5e5ea;--day-pending-text:#8e8e93;--space-xs:4px;--space-sm:8px;--space-md:16px;--space-lg:24px;--space-xl:32px;--space-2xl:48px;--radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-full:9999px;--shadow-sm:0 1px 2px #0000000a;--shadow-modal:0 20px 40px #00000014, 0 1px 3px #0000000d;--transition-fast:.15s ease;--transition-normal:.2s ease}@media (prefers-color-scheme:dark){:root{--bg-app:#0e0e10;--bg-surface:#17171a;--bg-surface-subtle:#1f1f23;--border-subtle:#29292e;--border-strong:#383840;--text-primary:#f2f2f7;--text-secondary:#a1a1aa;--text-tertiary:#71717a;--btn-primary-bg:#f2f2f7;--btn-primary-text:#0e0e10;--btn-primary-hover:#e5e5ea;--btn-secondary-bg:#1f1f23;--btn-secondary-text:#f2f2f7;--btn-secondary-hover:#29292e;--day-done-bg:#f2f2f7;--day-done-text:#0e0e10;--day-pending-bg:transparent;--day-pending-border:#29292e;--day-pending-text:#71717a;--shadow-sm:0 1px 2px #0000004d;--shadow-modal:0 20px 40px #00000080, 0 1px 3px #0000004d}}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-app);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;line-height:1.5}#root{flex-direction:column;min-height:100vh;display:flex}.app-container{width:100%;max-width:480px;padding:var(--space-lg) var(--space-md);flex-direction:column;min-height:100vh;margin:0 auto;display:flex}.app-header{padding-bottom:var(--space-xl);border-bottom:1px solid var(--border-subtle);margin-bottom:var(--space-xl);justify-content:space-between;align-items:center;display:flex}.brand-title{letter-spacing:-.01em;color:var(--text-primary);font-size:15px;font-weight:600}.nav-links{gap:var(--space-xs);background-color:var(--bg-surface-subtle);border-radius:var(--radius-md);border:1px solid var(--border-subtle);padding:3px;display:flex}.nav-btn{color:var(--text-secondary);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;align-items:center;gap:6px;padding:6px 12px;font-family:inherit;font-size:13px;font-weight:500;display:inline-flex}.nav-btn:hover{color:var(--text-primary)}.nav-btn.active{background-color:var(--bg-surface);color:var(--text-primary);box-shadow:var(--shadow-sm)}.nav-badge{background-color:var(--border-subtle);color:var(--text-secondary);border-radius:var(--radius-full);padding:1px 6px;font-size:11px;font-weight:600}.app-main{flex-direction:column;flex:1;display:flex}.title-large{letter-spacing:-.02em;color:var(--text-primary);font-size:28px;font-weight:600;line-height:1.25}.title-medium{letter-spacing:-.01em;color:var(--text-primary);font-size:20px;font-weight:600}.text-meta{color:var(--text-secondary);font-size:14px}.text-subtle{color:var(--text-tertiary);font-size:13px}.btn{justify-content:center;align-items:center;gap:var(--space-sm);border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-fast);border:none;width:100%;padding:14px 20px;font-family:inherit;font-size:15px;font-weight:500;text-decoration:none;display:inline-flex}.btn:active{transform:scale(.99)}.btn-primary{background-color:var(--btn-primary-bg);color:var(--btn-primary-text)}.btn-primary:hover:not(:disabled){background-color:var(--btn-primary-hover)}.btn-secondary{background-color:var(--btn-secondary-bg);color:var(--btn-secondary-text);border:1px solid var(--border-subtle)}.btn-secondary:hover:not(:disabled){background-color:var(--btn-secondary-hover)}.btn-ghost{color:var(--text-secondary);padding:var(--space-sm) var(--space-md);background:0 0;width:auto;font-size:13px}.btn-ghost:hover{color:var(--text-primary)}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.radial-container{margin:var(--space-xl) 0;justify-content:center;align-items:center;display:flex}.radial-interactive-btn{cursor:pointer;transition:transform var(--transition-normal);-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:50%;outline:none;padding:0;display:block}.radial-interactive-btn.is-actionable:hover{transform:scale(1.02)}.radial-interactive-btn.is-actionable:active{transform:scale(.98)}.radial-interactive-btn.is-actionable:hover .radial-pip.today-target{stroke-width:3.2px}.radial-interactive-btn.is-actionable:focus-visible{outline:2px solid var(--text-primary);outline-offset:8px}.radial-interactive-btn.is-done{cursor:default}.radial-wrapper{justify-content:center;align-items:center;width:260px;height:260px;display:flex;position:relative}.radial-svg{width:100%;height:100%;display:block;overflow:visible}.radial-pip{fill:#0000;stroke:var(--border-strong);stroke-width:1.5px;transition:all var(--transition-fast)}.radial-pip.filled{fill:var(--day-done-bg);stroke:var(--day-done-bg)}.radial-pip.today-target{stroke:var(--text-primary);stroke-width:2.2px}.radial-center-content{text-align:center;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.radial-stat-row{align-items:baseline;gap:4px;display:flex}.radial-count{letter-spacing:-.04em;color:var(--text-primary);font-variant-numeric:tabular-nums;font-size:56px;font-weight:700;line-height:1}.radial-total{letter-spacing:-.01em;color:var(--text-tertiary);font-size:18px;font-weight:500}.radial-label{letter-spacing:.04em;text-transform:uppercase;color:var(--text-secondary);margin-top:6px;font-size:12px;font-weight:600}.active-screen{text-align:center;flex-direction:column;flex:1;align-items:center;display:flex}.active-header{margin-bottom:var(--space-md);text-align:center}.active-undo-container{margin-top:var(--space-md);justify-content:center;display:flex}.create-screen{padding:var(--space-xl) 0;flex-direction:column;flex:1;justify-content:center;display:flex}.create-form{gap:var(--space-lg);margin-top:var(--space-lg);flex-direction:column;display:flex}.text-input{border-radius:var(--radius-md);border:1px solid var(--border-strong);background-color:var(--bg-surface);color:var(--text-primary);transition:border-color var(--transition-fast);outline:none;width:100%;padding:14px 16px;font-family:inherit;font-size:18px}.text-input:focus{border-color:var(--text-primary)}.form-error{color:#dc2626;margin-top:-8px;font-size:13px}.past-screen{gap:var(--space-lg);flex-direction:column;display:flex}.past-list{gap:var(--space-md);flex-direction:column;display:flex}.past-card{background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:var(--space-md);gap:var(--space-sm);box-shadow:var(--shadow-sm);flex-direction:column;display:flex}.past-card-header{justify-content:space-between;align-items:flex-start;gap:var(--space-md);display:flex}.past-card-title{color:var(--text-primary);font-size:16px;font-weight:600}.status-tag{border-radius:var(--radius-sm);background-color:var(--bg-surface-subtle);color:var(--text-secondary);border:1px solid var(--border-subtle);white-space:nowrap;padding:3px 8px;font-size:12px;font-weight:600}.past-card-meta{color:var(--text-secondary);justify-content:space-between;align-items:center;font-size:13px;display:flex}.empty-state{text-align:center;justify-content:center;align-items:center;gap:var(--space-md);padding:var(--space-2xl) var(--space-md);flex-direction:column;flex:1;display:flex}.modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);padding:var(--space-md);z-index:100;background-color:#00000073;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background-color:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-xl);width:100%;max-width:420px;box-shadow:var(--shadow-modal);gap:var(--space-lg);text-align:center;flex-direction:column;display:flex}.modal-pretitle{letter-spacing:.08em;text-transform:uppercase;color:var(--text-secondary);font-size:12px;font-weight:700}.modal-actions{gap:var(--space-sm);margin-top:var(--space-sm);flex-direction:column;display:flex}
