:root{--bg: #f2f5fa;--card: #ffffff;--text: #172033;--muted: #6b7688;--accent: #4f6ef7;--border: #e3e8f2;--danger: #e5484d;--ok: #22a06b;--shadow: 0 6px 20px rgba(23, 32, 51, .07)}*{box-sizing:border-box}body{margin:0;font:16px/1.45 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent}main{max-width:480px;margin:0 auto;padding:20px 16px 48px}:focus-visible{outline:3px solid #9db4ff;outline-offset:2px}.loading{text-align:center;color:var(--muted);padding:48px 0}.hero{margin-bottom:18px}.hero .date{margin:0;color:var(--muted);font-size:13px;text-transform:capitalize}.hero h1{margin:2px 0 0;font-size:26px;letter-spacing:-.02em}.progress-card{background:linear-gradient(135deg,#4f6ef7,#7c5cf0);color:#fff;border-radius:20px;padding:16px 18px;box-shadow:var(--shadow);margin-bottom:20px}.progress-row{display:flex;align-items:baseline;gap:8px}.progress-row strong{font-size:22px}.progress-row span{opacity:.85;font-size:13px}.progress-row .pct{margin-left:auto;font-weight:700}.bar{height:10px;background:#ffffff40;border-radius:999px;overflow:hidden;margin-top:10px}.bar-fill{height:100%;background:#fff;border-radius:999px;transition:width .3s ease}.motivation{margin:10px 0 0;font-size:13.5px;opacity:.9}.section-title{font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 4px 10px}.habit-list{list-style:none;margin:0;padding:0}.habit{display:flex;align-items:center;flex-wrap:wrap;background:var(--card);border-radius:16px;box-shadow:var(--shadow);margin-bottom:10px;padding:6px 6px 6px 10px}.habit-main{flex:1;min-width:0;display:flex;align-items:center;gap:12px;background:none;border:0;padding:8px 4px;text-align:left;cursor:pointer;font:inherit;color:inherit}.habit-emoji{width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;font-size:22px;border-radius:12px}.habit-info{display:flex;flex-direction:column;gap:6px;min-width:0}.habit-name{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.habit-main[aria-pressed=true] .habit-name{color:var(--muted)}.week{display:flex;gap:4px}.week span{width:14px;height:6px;border-radius:3px;background:var(--border)}.week span.on{background:var(--c, var(--accent))}.week span.now{box-shadow:0 0 0 1.5px var(--muted)}.streak{flex-shrink:0;font-size:13px;font-weight:600;color:#c2410c;background:#fff1e6;border-radius:999px;padding:4px 8px}.habit-check{width:26px;height:26px;flex-shrink:0;border-radius:50%;border:2px solid var(--border);display:grid;place-items:center;font-size:14px;font-weight:700;color:transparent;transition:all .15s ease}.habit-main[aria-pressed=true] .habit-check{background:var(--ok);border-color:var(--ok);color:#fff}.habit-delete{border:0;background:none;color:var(--muted);font-size:15px;padding:10px 8px;cursor:pointer;flex-shrink:0}.habit-delete:hover{color:var(--danger)}.confirm{display:flex;align-items:center;gap:8px;width:100%;padding:4px 10px 10px;font-size:14px;color:var(--danger)}.empty{background:var(--card);border-radius:20px;box-shadow:var(--shadow);text-align:center;padding:32px 20px}.empty-emoji{font-size:40px}.empty p{color:var(--muted);margin:10px 0 18px}.empty-actions{display:flex;flex-direction:column;gap:10px}.add-btn{width:100%;padding:14px;border-radius:14px;border:2px dashed #c6d0e4;background:transparent;color:var(--accent);font-weight:600;font-size:15px;cursor:pointer;margin-top:6px;font-family:inherit}.add-btn:hover{background:#edf1fd}.add-card{background:var(--card);border-radius:20px;box-shadow:var(--shadow);padding:18px;margin-top:16px}.add-card h2{margin:0 0 12px;font-size:18px}.add-card label,.add-card legend{display:block;font-size:13px;font-weight:600;color:var(--muted);margin-bottom:6px;padding:0}.add-card fieldset{border:0;padding:0;margin:14px 0 0}.add-card input[type=text]{width:100%;padding:12px 14px;border-radius:12px;border:1.5px solid var(--border);font:inherit;background:var(--bg)}.add-card input[type=text]:focus{border-color:var(--accent);outline:none}.emoji-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(36px,1fr));gap:6px}.emoji-grid button{aspect-ratio:1;border-radius:10px;border:2px solid transparent;background:var(--bg);font-size:18px;cursor:pointer;padding:0}.emoji-grid button[aria-pressed=true]{border-color:var(--accent);background:#eef1ff}.color-row{display:flex;gap:10px}.color-row button{width:28px;height:28px;border-radius:50%;border:3px solid transparent;cursor:pointer;padding:0}.color-row button[aria-pressed=true]{border-color:var(--text)}.form-actions{display:flex;gap:10px;margin-top:18px}.btn{padding:12px 18px;border:0;border-radius:12px;font-size:15px;font-weight:600;cursor:pointer;font-family:inherit}.btn:disabled{opacity:.5;cursor:default}.btn-primary{background:var(--accent);color:#fff}.btn-ghost{background:var(--bg);color:var(--text)}.btn-danger{background:var(--danger);color:#fff}.btn-sm{padding:7px 12px;font-size:13px;border-radius:9px}.error{color:var(--danger);text-align:center;font-size:14px}.note{text-align:center;color:var(--muted);font-size:12.5px;margin-top:28px}@media(prefers-reduced-motion:reduce){*{transition:none!important}}