:root{--bg: #fff6ec;--card: #ffffff;--ink: #3d3229;--muted: #8a7a6b;--primary: #ff8a5c;--primary-dark: #e9764c;--done: #58c08a;--done-bg: #eaf9f0;--accent: #ffd66b;--danger: #d9534f;--radius: 20px;--shadow: 0 4px 16px rgba(120, 80, 40, .1)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:17px;line-height:1.45;-webkit-font-smoothing:antialiased}.screen{max-width:480px;margin:0 auto;padding:20px 16px calc(40px + env(safe-area-inset-bottom));min-height:100dvh;display:flex;flex-direction:column;gap:16px}.screen.center{align-items:center;justify-content:center;text-align:center}h1{font-size:1.5rem;line-height:1.25;margin:0}.muted{color:var(--muted);margin:0}.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}.pet{width:clamp(140px,42vw,190px);margin:0 auto;animation:floaty 3.5s ease-in-out infinite}.pet img{display:block;width:100%;height:auto;filter:drop-shadow(0 10px 18px rgba(120,80,40,.2))}.pet.cheer{animation:cheer .7s ease,floaty 3.5s ease-in-out .7s infinite}.pet-level{margin:0;font-size:.85rem;font-weight:600;color:var(--muted)}.big-emoji{font-size:4rem;line-height:1;animation:floaty 3.5s ease-in-out infinite}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes cheer{0%{transform:scale(1)}30%{transform:scale(1.12) rotate(-3deg)}60%{transform:scale(.96) rotate(2deg)}to{transform:scale(1)}}.head{text-align:center;display:flex;flex-direction:column;gap:6px}.hello{margin:4px 0 0;color:var(--muted);font-weight:600}.reason{margin:0;color:var(--muted)}.today{text-align:center}.date{margin:0 0 12px;font-weight:700;color:var(--primary-dark)}.mood{font-size:2.4rem;line-height:1;margin:-6px 0 10px}.day-note{margin:-8px 0 12px;font-size:.85rem;font-weight:600;color:var(--muted)}.bar{height:16px;border-radius:999px;background:#f3e6d7;overflow:hidden}.bar-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--primary));transition:width .5s ease}.count{margin:10px 0 0}.all-done{margin:10px 0 0;font-weight:700;color:var(--done);animation:rise .4s ease}.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.steps li{display:flex;align-items:center;gap:8px}.step{flex:1;display:flex;align-items:center;gap:12px;min-height:64px;padding:12px 16px;border:2px solid transparent;border-radius:var(--radius);background:var(--card);box-shadow:var(--shadow);font:inherit;font-weight:600;color:var(--ink);text-align:left;cursor:pointer;transition:transform .12s ease,background .2s ease;-webkit-tap-highlight-color:transparent}.step:not(:disabled):active{transform:scale(.97)}.step:disabled{cursor:default}.step.done{background:var(--done-bg);border-color:var(--done);color:var(--ink)}.step-check{flex:none;width:32px;height:32px;border-radius:50%;border:2.5px solid #e8d9c8;display:grid;place-items:center;font-size:19px;color:#fff;background:transparent;transition:all .2s ease}.step.done .step-check{background:var(--done);border-color:var(--done);animation:pop .35s ease}.step-name{flex:1}.step-state{flex:none;font-size:.8rem;font-weight:700;color:var(--done);text-transform:lowercase}.undo{flex:none;border:none;background:none;font:inherit;font-size:.8rem;color:var(--muted);text-decoration:underline;cursor:pointer;padding:8px 2px}@keyframes pop{0%{transform:scale(.4)}60%{transform:scale(1.25)}to{transform:scale(1)}}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 20px;border:none;border-radius:999px;background:var(--primary);color:#fff;font:inherit;font-weight:700;text-decoration:none;cursor:pointer;transition:transform .12s ease;-webkit-tap-highlight-color:transparent}.button:active{transform:scale(.97)}.button:disabled{opacity:.6;cursor:default}.button.ghost{background:transparent;color:var(--primary-dark)}.button.small{min-height:40px;padding:8px 14px;font-size:.9rem}.banner{background:#fff3d6;border-radius:var(--radius);padding:14px 16px;box-shadow:var(--shadow)}.banner p{margin:0 0 10px}.banner-actions{display:flex;gap:8px;flex-wrap:wrap}.form{display:flex;flex-direction:column;gap:16px}.form label{display:flex;flex-direction:column;gap:6px;font-weight:700;font-size:.95rem}.form input,.form textarea,.form select{font:inherit;font-weight:500;color:var(--ink);background:#fbf6ef;border:2px solid #eadfd2;border-radius:14px;padding:12px 14px;outline:none;width:100%}.form input:focus,.form textarea:focus,.form select:focus{border-color:var(--primary)}.form textarea{resize:vertical}.steps-field{border:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.steps-field legend{font-weight:700;font-size:.95rem;padding:0;margin-bottom:4px}.hint{margin:0;font-size:.85rem;color:var(--muted);font-weight:500}.history-title{margin:0 0 12px;font-size:1rem}.history-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(34px,1fr));gap:6px}.day-cell{aspect-ratio:1;display:flex;align-items:center;justify-content:center;padding:0;border:2px solid #eadfd2;border-radius:10px;background:#fbf6ef;font:inherit;font-size:.78rem;font-weight:600;color:var(--muted);cursor:pointer}.day-cell.part{background:#ffe3c2;border-color:#ffc38f;color:var(--primary-dark)}.day-cell.full{background:var(--done);border-color:var(--done);color:#fff}.day-cell.today{border-color:var(--primary)}.day-cell.future{opacity:.35;cursor:default}.day-details{text-align:center}.day-details h2{margin:0 0 4px}.day-steps{list-style:none;margin:12px 0 16px;padding:0;display:flex;flex-direction:column;gap:8px;text-align:left}.day-steps li{display:flex;align-items:center;gap:10px;font-weight:600}.day-step-mark{flex:none;width:26px;height:26px;display:flex;align-items:center;justify-content:center;border:2px solid #eadfd2;border-radius:50%;font-size:.8rem;color:var(--muted)}.day-steps li.done .day-step-mark{background:var(--done);border-color:var(--done);color:#fff}.step-row{display:flex;gap:8px;align-items:center}.remove-step{flex:none;width:40px;height:40px;border:none;border-radius:50%;background:#f3e6d7;color:var(--muted);font-size:20px;line-height:1;cursor:pointer}.pet-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.pet-option{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 6px;border:2px solid #eadfd2;border-radius:14px;background:#fbf6ef;font:inherit;font-weight:600;font-size:.85rem;color:var(--ink);cursor:pointer;transition:transform .12s ease,border-color .2s ease,background .2s ease;-webkit-tap-highlight-color:transparent}.pet-option img{width:100%;max-width:84px;height:auto}.pet-option:active{transform:scale(.96)}.pet-option.selected{border-color:var(--primary);background:#fff;box-shadow:var(--shadow)}.growth{border:2px solid #eadfd2;border-radius:14px;padding:12px 14px}.growth summary{font-weight:700;font-size:.95rem;cursor:pointer}.growth label{margin-top:12px}.form-error{margin:0;color:var(--danger);font-weight:600}.foot{margin-top:auto;text-align:center}.edit-link{color:var(--muted);font-size:.85rem;text-decoration:none}.edit-link:hover{text-decoration:underline}.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%);background:var(--ink);color:#fff;padding:12px 22px;border-radius:999px;font-weight:700;box-shadow:0 6px 20px #3c281440;animation:toast-in .3s ease;max-width:min(92vw,440px);text-align:center;z-index:10}@keyframes toast-in{0%{opacity:0;transform:translate(-50%) translateY(12px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.modal-overlay{position:fixed;inset:0;background:#3d322973;display:grid;place-items:center;padding:20px;z-index:20;animation:fade-in .25s ease}.modal-card{background:var(--card);border-radius:var(--radius);box-shadow:0 12px 40px #3c28144d;padding:24px 20px;width:min(92vw,400px);max-height:calc(100dvh - 40px);overflow-y:auto;animation:modal-in .35s cubic-bezier(.2,1.4,.4,1)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-in{0%{opacity:0;transform:scale(.8) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.celebration{text-align:center;display:flex;flex-direction:column;align-items:center;gap:8px}.celebration h2{margin:0;font-size:1.35rem}.celebration p{margin:0 0 8px;color:var(--muted);font-weight:600}.celebration .button{min-width:160px}.confetti-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:21}.confetti-piece{position:absolute;top:-16px;border-radius:2px;animation:confetti-fall 3s linear forwards}.confetti-piece.round{border-radius:50%}@keyframes confetti-fall{0%{transform:translate3d(0,-20px,0) rotate(0);opacity:1}85%{opacity:1}to{transform:translate3d(var(--drift),105dvh,0) rotate(var(--spin));opacity:0}}.loader{font-size:2rem;color:var(--muted);animation:floaty 1.2s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.pet,.pet.cheer,.big-emoji,.loader,.modal-overlay,.modal-card{animation:none}.confetti-layer{display:none}}