*{box-sizing:border-box}body{color:#fff;background:radial-gradient(circle at 100% 0,#ff2f92,#0000 28%),linear-gradient(135deg,#03001e,#3b0764,#8a0f5a);min-height:100vh;margin:0;font-family:Arial,sans-serif}.app{width:90%;max-width:1000px;margin:auto;padding:35px 0}.hero{text-align:center;margin-bottom:30px}.hero h1{color:#ff5fc8;text-shadow:0 0 18px #ff5fc8cc;margin:0;font-size:56px}.hero h1:before{content:"💕 "}.hero h1:after{content:" 💕"}.hero p{color:#f5d0fe;font-size:18px}.card,.stat-card{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#14002d8c;border:2px solid #39ff14;border-radius:18px;padding:22px;box-shadow:0 0 18px #39ff144d}.card{margin-bottom:22px}.stats-grid{grid-template-columns:repeat(3,1fr);gap:18px;margin-bottom:22px;display:grid}.stat-card{text-align:center;border-color:#c026d3}.stat-card h3{color:#fff;margin:0 0 12px}.stat-card p{color:#ff4fb8;text-shadow:0 0 12px #ff4fb8cc;margin:0;font-size:44px;font-weight:700}h2{color:#ff4fb8;margin-top:0}.habit-form{grid-template-columns:1fr 180px 180px;gap:14px;display:grid}input,select{color:#fff;background:#050019b3;border:2px solid #d946ef;border-radius:10px;padding:14px}input::placeholder{color:#d8b4fe}button{cursor:pointer;color:#fff;background:linear-gradient(135deg,#ff4fb8,#db2777);border:none;border-radius:10px;padding:14px;font-weight:700}button:hover{opacity:.9}.secondary-btn{color:#d8b4fe;background:#3c145acc;border:1px solid #c084fc}.delete-btn{color:#ff4fb8;background:0 0;border:1px solid #ff4fb8}.section-header{justify-content:space-between;align-items:center;display:flex}.habit-list{gap:12px;display:grid}.habit-item{background:#28004680;border:1px solid #d946ef80;border-radius:12px;justify-content:space-between;align-items:center;padding:16px;display:flex}.habit-item h3{color:#fff;margin:0 0 6px}.habit-item p{color:#d8b4fe;margin:0}.actions{gap:10px;display:flex}.actions button:first-child{color:#39ff14;background:0 0;border:1px solid #39ff14}@media (width<=768px){.stats-grid,.habit-form{grid-template-columns:1fr}.habit-item{flex-direction:column;align-items:flex-start;gap:12px}.actions{width:100%}.actions button{flex:1}.hero h1{font-size:40px}}
