:root{--slate-900:#0f172a;--slate-800:#1e293b;--slate-700:#334155;--slate-600:#8b98b0;--slate-500:#9faec8;--slate-400:#94a3b8;--slate-200:#e2e8f0;--white:#fff;--amber-500:#f59e0b;--green-500:#10b981;--red-500:#ef4444;--ink:var(--white);--ink-muted:var(--slate-400);--bg:var(--slate-900);--surface:var(--slate-800);--rule:var(--slate-700);--accent:var(--amber-500);--accent-ink:var(--slate-900);--font-display:"DM Sans", system-ui, sans-serif;--font-mono:"JetBrains Mono", "Courier New", monospace;--space-1:4px;--space-2:6px;--space-3:8px;--space-4:12px;--space-5:16px;--space-6:24px;--space-7:32px;--space-8:48px;--measure:60ch;scrollbar-color:var(--slate-600) var(--slate-800);caret-color:var(--accent);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}@media (prefers-color-scheme:dark){:root{--slate-950:#020617;--slate-900:#0f172a;--slate-800:#1e293b;--slate-700:#334155;--slate-600:#8b98b0;--slate-500:#9faec8;--slate-400:#94a3b8;--slate-200:#e2e8f0;--white:#fff;--amber-400:#fbbf24;--green-500:#10b981;--red-500:#ef4444;--ink:var(--white);--ink-muted:var(--slate-400);--bg:var(--slate-900);--surface:var(--slate-800);--rule:var(--slate-700);--accent:var(--amber-400);--accent-ink:var(--slate-900);scrollbar-color:var(--slate-600) var(--slate-800);caret-color:var(--accent);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*,:before,:after{box-sizing:border-box}html{overflow-x:clip}body{font-family:var(--font-display);-webkit-font-smoothing:antialiased;color:var(--ink);background:var(--bg);margin:0;line-height:1.5}#root,.screen{flex-direction:column;min-height:100vh;display:flex}p{text-wrap:pretty}h1,h2,h3{text-wrap:balance}::selection{color:var(--white);background:#f59e0b33}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}a{color:var(--accent);text-underline-offset:.18em}.num{font-variant-numeric:tabular-nums}button,[role=button],summary,select,input[type=checkbox],input[type=radio]{min-height:44px}button{min-width:44px}input,select,textarea{font:inherit;font-size:max(1rem,16px)}img,video,canvas,svg{max-width:100%;height:auto}pre{overflow-x:auto}.app{flex-direction:column;flex:1;width:100%;max-width:1440px;margin:0 auto;display:flex}.header{padding:var(--space-6) var(--space-7);border-bottom:1px solid var(--rule);justify-content:space-between;align-items:center;display:flex}.page-title{text-transform:uppercase;letter-spacing:.05em;font-size:28px;font-weight:700}.tabs{gap:var(--space-6);display:flex}.tab{color:var(--slate-600);font-family:var(--font-display);text-transform:uppercase;letter-spacing:.05em;padding:var(--space-3) 0;cursor:pointer;background:0 0;border:none;font-size:16px;font-weight:600;transition:color .15s ease-out;position:relative}.tab:hover{color:var(--slate-400)}.tab.active{color:var(--white)}.tab.active:after{content:"";background:var(--accent);height:3px;position:absolute;bottom:-1px;left:0;right:0}.main{padding:var(--space-7);flex:1;overflow-y:auto}.habit-card{background:var(--surface);border:1px solid var(--rule);margin-bottom:var(--space-5);cursor:pointer;transition:background .15s ease-out}.habit-card:hover{background:var(--slate-700)}.habit-card-segment{padding:var(--space-4);border-bottom:1px solid var(--rule)}.habit-card-segment:last-child{border-bottom:none}.habit-card-top{justify-content:space-between;align-items:center;gap:var(--space-4);display:flex}.habit-name{flex:1;font-size:18px;font-weight:600}.checkbox{border:2px solid var(--slate-600);background:0 0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;transition:all .15s ease-out;display:flex}.checkbox.checked{background:var(--green-500);border-color:var(--green-500)}.checkbox svg{width:14px;height:14px;stroke:var(--white);stroke-width:3px;fill:none}.habit-card-middle{text-align:center}.streak-counter{font-family:var(--font-mono);color:var(--slate-400);font-size:20px;font-weight:600}.streak-counter.active{color:var(--accent)}.habit-card-bottom{text-align:center;font-family:var(--font-mono);color:var(--slate-500);letter-spacing:.1em;text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.gate-board{width:100%}.board-header{gap:var(--space-5);padding:var(--space-4);border-bottom:1px solid var(--rule);grid-template-columns:1fr auto 200px;display:grid}.board-header-cell{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-muted);font-size:12px;font-weight:600}.board-row{gap:var(--space-5);padding:var(--space-4);border-bottom:1px solid var(--rule);cursor:pointer;grid-template-columns:1fr auto 200px;align-items:center;transition:background .15s ease-out;display:grid}.board-row:hover{background:var(--surface)}.board-habit-name{font-size:16px;font-weight:500}.board-streak{font-family:var(--font-mono);color:var(--slate-400);text-align:right;font-size:16px;font-weight:600}.board-streak.active{color:var(--accent)}.weekly-grid{gap:var(--space-2);justify-content:flex-end;display:flex}.day-square{border:1px solid var(--rule);background:0 0;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;display:flex}.day-square.completed{background:var(--green-500);border-color:var(--green-500)}.day-square.today{border-color:var(--accent);border-width:2px}.day-square svg{width:12px;height:12px;stroke:var(--white);stroke-width:3px;fill:none}.btn{font-family:var(--font-display);text-transform:uppercase;letter-spacing:.08em;padding:var(--space-4) var(--space-6);cursor:pointer;border:none;border-radius:0;min-width:44px;min-height:44px;font-size:14px;font-weight:600;transition:all .15s ease-out}.btn-primary{background:var(--accent);color:var(--accent-ink)}.btn-primary:hover{background:#fbbf24}.btn-secondary{background:var(--slate-700);color:var(--white)}.btn-secondary:hover{background:var(--slate-600)}.btn-danger{background:var(--red-500);color:var(--white)}.btn-danger:hover{background:#dc2626}.form{max-width:600px}.form-group{margin-bottom:var(--space-5)}.form-label{text-transform:uppercase;letter-spacing:.08em;color:var(--ink-muted);margin-bottom:var(--space-3);font-size:14px;font-weight:600;display:block}.form-input,.form-select{width:100%;font-family:var(--font-display);padding:var(--space-4);background:var(--surface);color:var(--ink);border:1px solid var(--slate-600);border-radius:0;min-height:44px;font-size:max(1rem,16px)}.form-input:focus,.form-select:focus{border:2px solid var(--accent);padding:calc(var(--space-4) - 1px);outline:none}.form-actions{gap:var(--space-4);margin-top:var(--space-6);display:flex}.empty-state{text-align:center;padding:var(--space-8) var(--space-6)}.empty-state-title{text-transform:uppercase;letter-spacing:.05em;color:var(--slate-400);margin-bottom:var(--space-4);font-size:24px;font-weight:700}.empty-state-text{color:var(--slate-500);margin-bottom:var(--space-6);font-size:16px}.action-bar{margin-bottom:var(--space-6);justify-content:flex-end;display:flex}.modal-backdrop{z-index:1000;padding:var(--space-6);background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border:1px solid var(--rule);width:100%;max-width:600px;max-height:90vh;padding:var(--space-7);overflow-y:auto}.modal-title{text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--space-6);font-size:24px;font-weight:700}.color-grid{gap:var(--space-3);grid-template-columns:repeat(auto-fill,minmax(44px,1fr));display:grid}.color-option{cursor:pointer;border:2px solid #0000;width:44px;min-width:44px;height:44px;min-height:44px;transition:border-color .15s ease-out}.color-option:hover{border-color:var(--slate-400)}.color-option.selected{border-color:var(--accent)}@media (width<=767px){.header{padding:var(--space-5)}.page-title{font-size:24px}.main{padding:var(--space-5);padding-bottom:calc(var(--space-8) + 50px)}.tabs{background:var(--surface);border-top:1px solid var(--rule);padding:var(--space-3);z-index:100;justify-content:space-around;position:fixed;bottom:0;left:0;right:0}.tab:after{top:-1px;bottom:auto}.board-header,.board-row{grid-template-columns:1fr auto}.board-header-cell:last-child,.weekly-grid{display:none}}@media (width<=480px){.screen{padding-inline:0}}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}.streak-counter.pulse{animation:.4s cubic-bezier(.34,1.56,.64,1) pulse}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}@media (width<=480px){body,.container,[class*=container],section,header,footer,nav,main,article{padding-inline:max(1rem,16px)}}p,li,dt,dd,blockquote,figcaption,td,th{max-width:min(75ch,100%)}