:root{--bg:#0e0a14;--bg-elev:#1a1224;--bg-card:#221733;--text:#f3edff;--text-dim:#a08ec0;--accent:#ff2e88;--accent-2:#00f6c0;--chill:#6b5b95;--soon:#ffb142;--crisis:#ff2e4d;--crisis-bg:#2a0010;--border:#3a2855;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0;padding:0}body{background:radial-gradient(circle at 20% 0%, #ff2e881f, transparent 40%), radial-gradient(circle at 80% 100%, #00f6c014, transparent 40%), var(--bg);background-attachment:fixed}button{cursor:pointer;border:none;border-radius:10px;padding:.7em 1.2em;font-family:inherit;font-size:1rem;font-weight:600;transition:transform 80ms,filter .15s}button:hover{filter:brightness(1.1)}button:active{transform:scale(.97)}input,select,textarea{background:var(--bg-elev);color:var(--text);border:1px solid var(--border);border-radius:8px;outline:none;padding:.6em .8em;font-family:inherit;font-size:1rem}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #ff2e8833}a{color:var(--accent-2)}.app{max-width:720px;margin:0 auto;padding:2rem 1rem 6rem}.brand{letter-spacing:-.03em;background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:2rem;font-weight:900}.brand-line{justify-content:space-between;align-items:center;gap:1rem;display:flex}.subtitle{color:var(--text-dim);margin:.25rem 0 1.5rem;font-size:.9rem}.btn-primary{background:linear-gradient(135deg, var(--accent), #ff5fa8);color:#fff;box-shadow:0 6px 20px #ff2e8866}.btn-secondary{background:var(--bg-elev);color:var(--text);border:1px solid var(--border)}.btn-ghost{color:var(--text-dim);background:0 0}.btn-block{width:100%}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;margin-bottom:1rem;padding:1.25rem}.center{text-align:center;padding:3rem 1rem}.login-hero{text-align:center;padding:4rem 1rem 2rem}.login-hero .logo{margin-bottom:.5rem;font-size:4rem}.login-hero h1{letter-spacing:-.04em;background:linear-gradient(135deg, var(--accent), var(--accent-2));color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:3rem;font-weight:900}.login-hero p{color:var(--text-dim);margin:.5rem 0 2rem;font-size:1.1rem}.household-row{background:var(--bg-card);border:1px solid var(--border);cursor:pointer;border-radius:12px;justify-content:space-between;align-items:center;margin-bottom:.75rem;padding:1rem 1.25rem;transition:border-color .15s,transform 80ms;display:flex}.household-row:hover{border-color:var(--accent)}.household-row:active{transform:scale(.99)}.household-row .name{font-size:1.05rem;font-weight:600}.household-row .role{color:var(--text-dim);font-size:.85rem}.invite-pill{background:var(--bg-elev);color:var(--accent-2);border:1px dashed var(--border);border-radius:6px;padding:.25rem .6rem;font-family:JetBrains Mono,ui-monospace,monospace;font-size:.85rem;display:inline-block}.tabs{gap:.5rem;margin-bottom:1rem;display:flex}.tab{background:var(--bg-elev);color:var(--text-dim);cursor:pointer;border:1px solid #0000;border-radius:8px;padding:.5rem 1rem;font-size:.9rem;font-weight:600}.tab.active{color:var(--text);border-color:var(--accent)}.crisis-banner{background:linear-gradient(135deg, var(--crisis), #ff5b75);color:#fff;text-align:center;letter-spacing:.02em;border-radius:12px;margin-bottom:1.5rem;padding:1rem 1.25rem;font-weight:700;animation:1.6s ease-in-out infinite pulse}@keyframes pulse{0%,to{box-shadow:0 0 #ff2e4d80}50%{box-shadow:0 0 0 12px #ff2e4d00}}.section-block{margin-bottom:1.5rem}.section-header{color:var(--text-dim);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);align-items:center;gap:.5rem;margin:0 0 .5rem;padding-bottom:.4rem;font-size:.95rem;font-weight:700;display:flex}.section-header .emoji{font-size:1.2rem}.item-row{background:var(--bg-card);border:1px solid var(--border);cursor:pointer;border-radius:10px;align-items:center;gap:.75rem;margin-bottom:.5rem;padding:.75rem 1rem;transition:border-color .15s,opacity .2s;display:flex}.item-row:hover{border-color:var(--accent-2)}.item-row.urgency-out_of_milk{border-color:var(--crisis);background:var(--crisis-bg)}.item-row .name{flex:1;font-weight:500}.item-row .notes{color:var(--text-dim);margin-top:.15rem;font-size:.8rem}.urgency-badge{text-transform:uppercase;letter-spacing:.06em;border-radius:999px;padding:.25rem .55rem;font-size:.7rem;font-weight:800}.urgency-badge.chill{color:#b9a9d8;background:#6b5b9540}.urgency-badge.soon{color:var(--soon);background:#ffb14233}.urgency-badge.out_of_milk{background:var(--crisis);color:#fff;animation:1.2s steps(2,start) infinite blink}@keyframes blink{to{visibility:hidden}}.empty-state{text-align:center;color:var(--text-dim);padding:3rem 1rem;font-size:1.05rem;font-style:italic}.add-form{grid-template-columns:1fr;gap:.6rem;margin-top:.5rem;display:grid}.add-form .row{grid-template-columns:1fr 1fr;gap:.6rem;display:grid}.add-fab{background:linear-gradient(135deg, var(--accent), #ff5fa8);color:#fff;cursor:pointer;z-index:10;border:none;border-radius:999px;padding:.9rem 1.6rem;font-size:1rem;font-weight:700;position:fixed;bottom:1.5rem;right:50%;transform:translate(50%);box-shadow:0 8px 24px #ff2e8880}@media (width>=768px){.add-fab{right:calc(50% - 360px + 1.5rem);transform:none}}.modal-backdrop{z-index:100;background:#000000b3;justify-content:center;align-items:flex-end;padding:1rem;display:flex;position:fixed;inset:0}.modal{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;width:100%;max-width:480px;margin-bottom:0;padding:1.5rem}@media (width>=768px){.modal-backdrop{align-items:center}}.modal h3{margin:0 0 1rem;font-size:1.3rem}.modal-actions{gap:.5rem;margin-top:1rem;display:flex}.error{background:var(--crisis-bg);border:1px solid var(--crisis);color:#ffb0bf;border-radius:10px;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}.spinner{border:2px solid var(--text-dim);border-top-color:var(--accent);vertical-align:middle;border-radius:50%;width:1em;height:1em;animation:.7s linear infinite spin;display:inline-block}@keyframes spin{to{transform:rotate(360deg)}}