@import "https://fonts.googleapis.com/css2?family=Archivo+Black&family=Inter:wght@400;600;700&display=swap";:root{--bg-primary:#1a1a1a;--bg-block:#2d2d2d;--bg-elevated:#3a3a3a;--border-heavy:4px solid #000;--border-medium:3px solid #000;--text-primary:#f0f0f0;--text-secondary:#999;--font-heading:"Archivo Black", sans-serif;--font-body:"Inter", sans-serif;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background:var(--bg-primary);color:var(--text-primary);min-height:100dvh;padding-bottom:var(--safe-bottom);-webkit-text-size-adjust:100%;overflow-x:hidden}#confetti-canvas{pointer-events:none;z-index:9999;contain:strict;width:100vw;height:100vh;display:none;position:fixed;top:0;left:0}.app-header{background:var(--bg-block);border-bottom:var(--border-heavy);padding:1.5rem 2rem;padding-top:calc(1.5rem + var(--safe-top));padding-left:calc(2rem + var(--safe-left));padding-right:calc(2rem + var(--safe-right));justify-content:space-between;align-items:center;gap:.5rem;display:flex}.app-title{font-family:var(--font-heading);letter-spacing:-.02em;text-transform:uppercase;text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:clamp(1rem,5vw,1.8rem);overflow:hidden}.btn-brutal{font-family:var(--font-heading);border:var(--border-heavy);background:var(--bg-elevated);color:var(--text-primary);cursor:pointer;text-transform:uppercase;letter-spacing:.05em;touch-action:manipulation;-webkit-tap-highlight-color:transparent;flex-shrink:0;min-width:44px;min-height:44px;padding:.7rem 1.4rem;font-size:.85rem;transition:transform .1s,box-shadow .1s}.btn-brutal:hover{transform:translate(-2px,-2px);box-shadow:4px 4px #000}.btn-brutal:active{box-shadow:none;transform:translate(0)}.btn-add{color:#000;background:#0f8}.main-content{max-width:900px;padding:2rem;padding-left:calc(2rem + var(--safe-left));padding-right:calc(2rem + var(--safe-right));padding-bottom:calc(2rem + var(--safe-bottom));margin:0 auto}.habits-list{contain:layout style;flex-direction:column;gap:1rem;display:flex}.habit-card{background:var(--bg-block);border:var(--border-heavy);contain:content;min-height:130px;padding:1.2rem 1.5rem;transition:transform .15s;position:relative;overflow:hidden}.habit-card:before{content:"";background:var(--habit-color);width:6px;position:absolute;top:0;bottom:0;left:0}.habit-card.completed{border-color:var(--habit-color)}.habit-card.completed .btn-check{background:var(--habit-color);color:#000;animation:.4s ease-out checkPulse}@keyframes checkPulse{0%{transform:scale(1)}50%{transform:scale(1.3)}to{transform:scale(1)}}.habit-card.locked{opacity:.5;filter:grayscale(.7)}.habit-card-header{align-items:center;gap:.75rem;min-width:0;display:flex}.habit-icon{background:var(--bg-primary);border:var(--border-medium);flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.5rem;display:flex}.habit-info{flex-direction:column;flex:1;gap:.2rem;min-width:0;display:flex;overflow:hidden}.habit-name{font-family:var(--font-heading);text-transform:uppercase;text-overflow:ellipsis;white-space:nowrap;font-size:1.1rem;overflow:hidden}.habit-freq{color:var(--text-secondary);letter-spacing:.1em;font-size:.75rem}.habit-streak{text-align:right;flex-direction:column;flex-shrink:0;align-items:flex-end;display:flex}.streak-count{font-family:var(--font-heading);color:var(--habit-color);font-size:2rem;line-height:1}.streak-label{text-transform:uppercase;color:var(--text-secondary);letter-spacing:.1em;font-size:.65rem}.streak-best{color:var(--text-secondary);font-size:.65rem}.habit-card-actions{border-top:2px solid #000;flex-wrap:wrap;align-items:center;gap:.8rem;margin-top:1rem;padding-top:1rem;display:flex}.btn-check{border:var(--border-heavy);background:var(--bg-primary);width:48px;height:48px;color:var(--text-primary);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;justify-content:center;align-items:center;font-size:1.5rem;transition:all .15s;display:flex}.btn-check:hover{background:var(--bg-elevated)}.btn-check.checked{background:var(--habit-color);color:#000}.btn-icon{cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;background:0 0;border:2px solid #555;justify-content:center;align-items:center;width:44px;height:44px;font-size:1.1rem;transition:border-color .15s;display:flex}.btn-icon:hover{border-color:var(--text-primary)}.lock-badge{font-family:var(--font-heading);color:var(--text-secondary);letter-spacing:.05em;font-size:.8rem}.empty-state{text-align:center;background:var(--bg-block);border:var(--border-heavy);min-height:200px;padding:4rem 2rem}.empty-icon{color:#555;margin-bottom:1rem;font-size:4rem;display:block}.empty-state p{font-family:var(--font-heading);margin-bottom:.5rem;font-size:1.2rem}.empty-sub{color:var(--text-secondary);font-family:var(--font-body)!important;font-size:.9rem!important}.modal-overlay{z-index:1000;padding:var(--safe-top) var(--safe-right) var(--safe-bottom) var(--safe-left);contain:layout style;background:#000c;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.modal{background:var(--bg-block);border:var(--border-heavy);width:100%;max-width:500px;max-height:calc(90vh - var(--safe-top) - var(--safe-bottom));-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:2rem;overflow-y:auto}.modal-title{font-family:var(--font-heading);border-bottom:var(--border-heavy);margin-bottom:1.5rem;padding-bottom:1rem;font-size:1.5rem}.form-group{margin-bottom:1.2rem}.form-group label{font-family:var(--font-heading);letter-spacing:.1em;color:var(--text-secondary);margin-bottom:.5rem;font-size:.75rem;display:block}.input-brutal{border:var(--border-medium);background:var(--bg-primary);width:100%;color:var(--text-primary);font-family:var(--font-body);padding:.7rem 1rem;font-size:1rem}.input-brutal:focus{border-color:#0f8;outline:none}.input-small{width:80px}.icon-grid{grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:.4rem;display:grid}.icon-btn{aspect-ratio:1;background:var(--bg-primary);cursor:pointer;touch-action:manipulation;border:2px solid #555;justify-content:center;align-items:center;width:100%;min-height:44px;font-size:1.3rem;display:flex}.icon-btn.active{background:var(--bg-elevated);border-color:#0f8}.color-grid{grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:.4rem;display:grid}.color-btn{aspect-ratio:1;cursor:pointer;touch-action:manipulation;border:3px solid #0000;width:100%;min-height:44px}.color-btn.active{border-color:#fff}.freq-buttons{flex-wrap:wrap;gap:.5rem;display:flex}.btn-freq{font-family:var(--font-heading);color:var(--text-primary);cursor:pointer;letter-spacing:.05em;touch-action:manipulation;background:0 0;border:2px solid #555;min-height:44px;padding:.5rem 1rem;font-size:.7rem}.btn-freq.active{background:#00ff881a;border-color:#0f8}.freq-custom{align-items:center;gap:.5rem;margin-top:.8rem;display:flex}.freq-custom span{color:var(--text-secondary);font-size:.85rem}.hidden{display:none!important}.modal-actions{border-top:var(--border-heavy);gap:1rem;margin-top:1.5rem;padding-top:1.5rem;display:flex}.btn-cancel{flex:1}.btn-save{color:#000;background:#0f8;flex:1}.section-panel{background:var(--bg-block);border:var(--border-heavy);contain:layout style;margin-top:2rem;padding:1.5rem}.analytics-panel{contain:content;position:relative}.analytics-panel:before{content:"";background:var(--habit-color);height:4px;position:absolute;top:0;left:0;right:0}.analytics-title{font-family:var(--font-heading);text-transform:uppercase;margin-bottom:1.2rem;font-size:1.1rem}.stats-grid{grid-template-columns:repeat(3,1fr);gap:1rem;display:grid}.stat-block{background:var(--bg-primary);text-align:center;border:2px solid #000;flex-direction:column;gap:.3rem;min-height:72px;padding:1rem;display:flex}.stat-value{font-family:var(--font-heading);color:var(--habit-color,var(--text-primary));font-size:1.4rem}.stat-label{letter-spacing:.15em;color:var(--text-secondary);text-transform:uppercase;font-size:.6rem}.heatmap-grid{contain:content;grid-template-rows:repeat(7,1fr);grid-auto-columns:14px;grid-auto-flow:column;gap:3px;min-height:119px;padding:.5rem 0;display:grid;overflow-x:auto}.heatmap-day-labels{float:left;grid-template-rows:repeat(7,14px);gap:3px;margin-right:8px;display:grid}.heatmap-day-labels span{color:var(--text-secondary);align-items:center;font-size:.6rem;display:flex}.heatmap-cell{background:#161616;border:1px solid #333;width:14px;height:14px}.heatmap-cell--done{background:var(--habit-color);border-color:var(--habit-color);opacity:.9}.heatmap-cell--freeze{opacity:.6;background:#48f;border-color:#48f}.heatmap-cell--miss{background:#222;border-color:#333}.heatmap-cell--empty{background:0 0;border-color:#0000}@media (width<=600px){.app-header{padding:1rem;padding-top:calc(1rem + var(--safe-top));padding-left:calc(1rem + var(--safe-left));padding-right:calc(1rem + var(--safe-right))}.app-title{font-size:clamp(.9rem,4.5vw,1.2rem)}.main-content{padding:1rem;padding-left:calc(1rem + var(--safe-left));padding-right:calc(1rem + var(--safe-right));padding-bottom:calc(1rem + var(--safe-bottom))}.habit-card{padding:1rem}.habit-card-header{gap:.5rem}.habit-icon{width:40px;height:40px;font-size:1.2rem}.habit-name{font-size:.95rem}.streak-count{font-size:1.6rem}.stats-grid{grid-template-columns:repeat(2,1fr)}.modal{max-height:calc(85vh - var(--safe-bottom));border-bottom:none;border-left:none;border-right:none;padding:1.5rem}.modal-title{font-size:1.2rem}}@media (width<=360px){.app-header{padding:.75rem;padding-top:calc(.75rem + var(--safe-top))}.app-title{font-size:.9rem}.btn-brutal{padding:.6rem .8rem;font-size:.75rem}.main-content{padding:.75rem;padding-bottom:calc(.75rem + var(--safe-bottom))}.habit-card{padding:.8rem}.habit-card-header{gap:.4rem}.habit-icon{width:36px;height:36px;font-size:1rem}.habit-name{font-size:.85rem}.streak-count{font-size:1.3rem}.habit-card-actions{gap:.5rem}.btn-check{width:44px;height:44px;font-size:1.2rem}.stats-grid{grid-template-columns:1fr}.modal{padding:1rem}.freq-buttons{flex-direction:column}.btn-freq{text-align:center;width:100%}}@media (orientation:landscape) and (height<=500px){.app-header{padding-top:calc(.75rem + var(--safe-top));padding-bottom:.75rem}.main-content{padding-top:1rem;padding-bottom:calc(1rem + var(--safe-bottom))}.modal-overlay{align-items:center}.modal{max-height:calc(90vh - var(--safe-top) - var(--safe-bottom))}.habit-card-header{gap:.5rem}.empty-state{padding:2rem 1rem}}.pull-indicator{text-align:center;color:var(--text-secondary);font-size:.75rem;font-family:var(--font-heading);letter-spacing:.1em;text-transform:uppercase;opacity:0;padding:.5rem;transition:opacity .2s,transform .2s;transform:translateY(-100%)}.pull-indicator.visible,.pull-indicator.refreshing{opacity:1;transform:translateY(0)}.habit-card.swiping{transition:none}.habit-card .swipe-action{opacity:0;justify-content:center;align-items:center;width:80px;font-size:1.5rem;transition:opacity .15s;display:flex;position:absolute;top:0;bottom:0}.habit-card .swipe-action--left{background:#48f;left:0}.habit-card .swipe-action--right{background:var(--habit-color,#0f8);right:0}@media print{body{color:#000;background:#fff}#confetti-canvas,.btn-brutal,.btn-check,.btn-icon,.modal-overlay,.pull-indicator,.swipe-action{display:none!important}.app-header{background:0 0;border-bottom:2px solid #000;padding:.5rem 0}.app-title{color:#000}.habit-card{break-inside:avoid;color:#000;background:#fff;border:1px solid #333}.habit-card:before{-webkit-print-color-adjust:exact;print-color-adjust:exact}.section-panel{break-inside:avoid;background:#fff;border:1px solid #333}.heatmap-cell--done,.heatmap-cell--freeze{-webkit-print-color-adjust:exact;print-color-adjust:exact}.stats-grid{grid-template-columns:repeat(3,1fr)}.stat-value,.streak-count{color:#000}}