.habit-card{border-radius:var(--card-radius);background:var(--card);border:1px solid var(--border);flex-direction:column;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.habit-scrollable{padding:1rem;position:relative;overflow-y:auto}.habit-scrollable::-webkit-scrollbar{width:6px}.habit-scrollable::-webkit-scrollbar-track{background:0 0}.habit-scrollable::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:10px}.habit-item{cursor:pointer;border-radius:var(--card-radius);background:var(--surface);border:1px solid var(--border);transition:border-color var(--animation-speed) ease, background-color var(--animation-speed) ease;gap:.75rem;margin-bottom:.75rem;padding:.875rem;display:flex}.habit-item:hover{background:var(--card);border-color:var(--border-strong)}.habit-info{flex-direction:column;flex:1;justify-content:center;gap:.25rem;min-width:0;display:flex}.habit-title{-webkit-line-clamp:1;color:var(--foreground);-webkit-box-orient:vertical;font-size:.9375rem;font-weight:400;display:-webkit-box;overflow:hidden}.habit-description{-webkit-line-clamp:3;color:var(--muted);-webkit-box-orient:vertical;font-size:.8125rem;line-height:1.25rem;display:-webkit-box;overflow:hidden}.habit-description p{margin:0}.habit-footer{border-top:1px solid var(--border);padding:.875rem 1rem}.empty-habits{border-radius:var(--card-radius);background:var(--surface);border:1px dashed var(--border-strong);text-align:center;color:var(--foreground);flex-direction:column;justify-content:center;align-items:center;padding:3rem 1rem;display:flex;position:relative;overflow:hidden}.habit-grid{display:none}.empty-content{flex-direction:column;justify-content:center;align-items:center;gap:.75rem;display:flex}.heatmap-container{border-radius:calc(var(--card-radius) - 4px);height:100%;display:flex;overflow:hidden}.heatmap-weeks{gap:2px;display:flex}.heatmap-week{flex-direction:column;gap:2px;display:flex}.heatmap-day-wrapper{position:relative}.heatmap-day{background:var(--border-soft);border-radius:2px;width:.625rem;height:.625rem;transition:background .15s;display:flex}.heatmap-day.active{background:var(--success)}.button{border-radius:var(--button-radius);transition:background-color var(--animation-speed) ease, border-color var(--animation-speed) ease, color var(--animation-speed) ease;outline:none;justify-content:center;align-items:center;gap:.5rem;font-weight:400;display:inline-flex}.add-button{background:var(--button-bg);color:var(--button-text);border-radius:50%;padding:.625rem}.add-button:hover{background:var(--button-bg-hover)}.add-habit-button{background:var(--card);border:1px solid var(--border-strong);width:100%;color:var(--foreground);padding:.625rem 1rem}.add-habit-button:hover{background:var(--surface)}.complete-button{background:var(--button-bg);color:var(--button-text);padding:.375rem .75rem}.complete-button:hover{background:var(--button-bg-hover)}.undo-button{background:var(--card);border:1px solid var(--border-strong);color:var(--foreground);padding:.375rem .75rem}.undo-button:hover{background:var(--surface)}.menu-button{background:var(--card);border:1px solid var(--border-strong);color:var(--foreground);padding:.375rem}.menu-button:hover{background:var(--surface)}.submit-button{background:var(--button-bg);width:100%;color:var(--button-text);padding:.625rem .75rem;font-weight:400}.submit-button:hover{background:var(--button-bg-hover)}.save-button{border-radius:var(--button-radius);background:var(--button-bg);color:var(--button-text);padding:.5rem 1rem}.save-button:hover{background:var(--button-bg-hover)}.cancel-button{border-radius:var(--button-radius);color:var(--foreground);background:var(--card);border:1px solid var(--border-strong);padding:.5rem 1rem}.cancel-button:hover{background:var(--surface)}.modal-overlay{z-index:50;background:#17171752;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{border-radius:var(--card-radius);color:var(--foreground);background:var(--card);border:1px solid var(--border);width:100%;max-width:28rem;max-height:90vh;box-shadow:var(--shadow-dialog);margin:0 1rem;position:relative;overflow-y:auto}.modal-content::-webkit-scrollbar{width:6px}.modal-content::-webkit-scrollbar-thumb{background:var(--border-strong);border-radius:10px}.form-input{border-radius:var(--input-radius);background:var(--input-bg);border:1px solid var(--input-border);width:100%;color:var(--foreground);transition:border-color var(--animation-speed) ease, box-shadow var(--animation-speed) ease;outline:none;padding:.75rem 1rem}.form-input::placeholder{color:var(--muted-light)}.form-input:focus{border-color:var(--brand-deep);box-shadow:0 0 0 2px color-mix(in srgb, var(--accent) 45%, transparent)}.scroll-bar{scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent}.toggle-container{border-radius:var(--card-radius);background:var(--surface);border:1px solid var(--border);justify-content:space-between;align-items:center;padding:.875rem 1rem;display:flex}.toggle-switch{background:var(--border-strong);border-radius:9999px;flex-shrink:0;align-items:center;width:2.75rem;height:1.5rem;transition:background-color .2s;display:inline-flex;position:relative}.toggle-switch.active{background:var(--brand-deep)}.toggle-thumb{background:#fff;border-radius:9999px;width:1rem;height:1rem;transition:transform .2s;display:inline-block;transform:translate(.25rem);box-shadow:0 1px 2px #17171726}.toggle-switch.active .toggle-thumb{transform:translate(1.5rem)}.detail-container{flex-direction:column;gap:1rem;padding:1.5rem;display:flex}.detail-header{border-radius:var(--card-radius);background:var(--surface);border:1px solid var(--border);flex-direction:column;gap:.625rem;padding:.875rem;display:flex}.completion-info{width:100%;color:var(--muted);justify-content:space-between;align-items:center;gap:.625rem;font-size:.75rem;display:flex}.completion-bar{background:var(--border-soft);border-radius:9999px;flex:1;height:.25rem;overflow:hidden}.completion-fill{background:var(--success);height:100%;transition:width .3s}.detail-body{color:var(--foreground);flex-direction:column;gap:1rem;display:flex}.detail-title-row{justify-content:space-between;align-items:center;gap:.75rem;display:flex}.detail-title{-webkit-line-clamp:1;-webkit-box-orient:vertical;font-size:1.125rem;font-weight:400;display:-webkit-box;overflow:hidden}.detail-actions{align-items:center;gap:.5rem;display:flex}.dropdown-wrapper{position:relative}.dropdown-menu{border-radius:var(--card-radius);background:var(--card);border:1px solid var(--border);min-width:10rem;box-shadow:var(--shadow-dialog);z-index:20;margin-top:.375rem;position:absolute;top:100%;right:0;overflow:hidden}.dropdown-item{cursor:pointer;text-align:left;width:100%;color:var(--foreground);align-items:center;gap:.625rem;padding:.625rem .875rem;font-size:.875rem;transition:background-color .15s;display:flex}.dropdown-item:hover{background:var(--surface)}.dropdown-item.delete-item{color:var(--error)}.dropdown-item.delete-item:hover{background:var(--error-soft)}.dropdown-divider{background:var(--border);height:1px;margin:.25rem 0}.detail-content-box{border-radius:var(--card-radius);background:var(--surface);border:1px solid var(--border);padding:1rem}.detail-meta{margin-bottom:.5rem}.detail-description{color:var(--foreground);font-size:.875rem;line-height:1.5}.detail-markdown{color:var(--foreground);font-size:.875rem;line-height:1.6}.detail-markdown h1,.detail-markdown h2,.detail-markdown h3,.detail-markdown h4{color:var(--foreground);margin:.75rem 0 .25rem;font-weight:400}.detail-markdown p{margin:0 0 .5rem}.detail-markdown ul,.detail-markdown ol{margin:0 0 .5rem;padding-left:1.25rem}.detail-markdown ul{list-style:outside}.detail-markdown ol{list-style:decimal}.detail-markdown a{color:var(--brand-link);text-underline-offset:2px;text-decoration:underline}.detail-markdown code{background:var(--card);border:1px solid var(--border);font-size:.8125rem;font-family:var(--font-mono);border-radius:4px;padding:.1rem .3rem}.detail-markdown strong{font-weight:600}.detail-markdown blockquote{border-left:2px solid var(--border-strong);color:var(--muted);margin:0 0 .5rem;padding-left:.75rem}.edit-visibility{border-top:1px solid var(--border);color:var(--foreground);justify-content:space-between;align-items:center;margin-top:.75rem;padding-top:.75rem;font-size:.875rem;display:flex}.edit-actions{justify-content:flex-end;gap:.5rem;display:flex}.confetti-container{z-index:100;pointer-events:none;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.confetti{font-size:4rem;animation:2s ease-out forwards confetti-pop}@keyframes confetti-pop{0%{opacity:0;transform:scale(.5)}20%{opacity:1;transform:scale(1.2)}80%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1)}}@media (prefers-reduced-motion:reduce){.confetti{opacity:1;animation:none}.habit-item,.button,.completion-fill{transition:none}}