:root{--bg:#e8f2ef;--bg-deep:#d3e6e0;--surface:#fffcf8eb;--ink:#16302b;--muted:#5a726c;--line:#16302b1f;--accent:#0f7a62;--accent-ink:#f4fff9;--warn:#9a4a1f;--warn-soft:#f3e1d4;--shadow:0 12px 40px #16302b14;--radius:16px;--font-display:"Fraunces", Georgia, serif;--font-body:"Outfit", "Segoe UI", sans-serif;color:var(--ink);background:radial-gradient(1200px 600px at 10% -10%, #c9ebe0 0%, transparent 55%), radial-gradient(900px 500px at 100% 0%, #f0e6d4 0%, transparent 45%), linear-gradient(180deg, var(--bg), var(--bg-deep));font-family:var(--font-body);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#app{min-height:100%}body{margin:0}button,input,select{font:inherit}.app{width:min(920px,100% - 1.5rem);margin:0 auto;padding:1.25rem 0 4rem}.top{flex-wrap:wrap;justify-content:space-between;align-items:end;gap:1rem;margin-bottom:1.25rem;display:flex}.logo{font-family:var(--font-display);letter-spacing:-.03em;margin:0;font-size:clamp(2rem,5vw,2.75rem);font-weight:600;line-height:1}.tagline{color:var(--muted);margin:.35rem 0 0;font-size:.95rem}.export-bar{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.75rem;display:flex}.account{text-overflow:ellipsis;max-width:16rem;margin:0;font-size:.9rem;overflow:hidden}.auth-panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);margin-bottom:1rem;padding:1.25rem}.auth-panel h2{font-family:var(--font-display);margin:0 0 .6rem;font-size:1.35rem}.auth-panel p{color:var(--muted);margin:0 0 .75rem;line-height:1.45}.auth-panel a{color:var(--accent)}.auth-panel code{background:#0f7a6214;border-radius:6px;padding:.1rem .35rem;font-size:.88em}.auth-tabs{gap:.4rem;margin-bottom:1rem;display:flex}.auth-form{gap:.75rem;max-width:24rem;display:grid}.auth-form label{color:var(--muted);gap:.35rem;font-size:.85rem;display:grid}.auth-note{color:var(--accent)!important}.auth-error{color:var(--warn)!important}.auth-error.banner{background:var(--warn-soft);border-radius:12px;margin-bottom:.9rem;padding:.75rem .9rem}.add-row,.filters,.category,.recent{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.add-row{grid-template-columns:1.6fr 1fr auto auto auto;align-items:end;gap:.65rem;margin-bottom:.9rem;padding:.9rem;display:grid}.filters{margin-bottom:1rem;padding:.9rem}.field{border:1px solid var(--line);width:100%;color:var(--ink);background:#fff;border-radius:12px;padding:.7rem .8rem}.field:focus{border-color:var(--accent);outline:2px solid #0f7a6259}.days-field{color:var(--muted);gap:.25rem;font-size:.75rem;display:grid}.days-field .days{width:5.5rem}.check{color:var(--muted);white-space:nowrap;align-items:center;gap:.4rem;font-size:.9rem;display:inline-flex}.btn{cursor:pointer;border:0;border-radius:999px;padding:.7rem 1rem;font-weight:560;transition:transform .12s,background .12s,color .12s}.btn:active{transform:scale(.98)}.btn.primary{background:var(--accent);color:var(--accent-ink)}.btn.soft{color:var(--accent);background:#e4f3ee}.btn.soft.warn{background:var(--warn-soft);color:var(--warn)}.btn.ghost{color:var(--muted);background:0 0}.chips{flex-wrap:wrap;gap:.4rem;margin-top:.75rem;display:flex}.chip{border:1px solid var(--line);color:var(--muted);cursor:pointer;background:#fff;border-radius:999px;padding:.4rem .75rem}.chip.active{background:var(--ink);border-color:var(--ink);color:#f7fffb}.inventory{gap:.9rem;display:grid}.category,.recent{padding:.85rem .95rem .4rem}.category h2,.recent h2{font-family:var(--font-display);margin:0 0 .55rem;font-size:1.15rem;font-weight:600}.category ul,.recent ul{margin:0;padding:0;list-style:none}.item{border-top:1px solid var(--line);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;padding:.75rem 0;display:flex}.item.menu-open{z-index:5;position:relative}.category:has(.menu-open){z-index:5;position:relative}.item-main{flex:1;gap:.35rem;min-width:min(100%,240px);display:grid}.item-title{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.item-name{font-size:1.05rem;font-weight:600}.low-pill{border:1px dashed var(--line);color:var(--muted);cursor:pointer;background:0 0;border-radius:999px;padding:.2rem .55rem;font-size:.78rem}.low-pill.on{border-style:solid;border-color:var(--warn);background:var(--warn-soft);color:var(--warn)}.age{color:var(--muted);align-items:center;gap:.4rem;font-size:.9rem;display:inline-flex}.age-input{border:1px solid var(--line);background:#fff;border-radius:8px;width:3.4rem;padding:.25rem .35rem}.item-actions{flex-wrap:wrap;align-items:center;gap:.35rem;display:flex}.item-menu{position:relative}.menu-trigger{letter-spacing:.08em;min-width:2.5rem;padding-inline:.65rem}.item-menu-panel{z-index:30;border:1px solid var(--line);min-width:11rem;box-shadow:var(--shadow);background:#fff;border-radius:12px;gap:.15rem;padding:.35rem;display:grid;position:absolute;top:calc(100% + .3rem);right:0}.item-menu-panel button{color:var(--ink);text-align:left;cursor:pointer;background:0 0;border:0;border-radius:8px;padding:.55rem .7rem;font-weight:500}.item-menu-panel button:hover,.item-menu-panel button:focus-visible{background:#e4f3ee;outline:none}.item-menu-panel button.warn{color:var(--warn)}.item-menu-panel button.warn:hover,.item-menu-panel button.warn:focus-visible{background:var(--warn-soft)}.item-menu-panel button.current{color:var(--accent);font-weight:600}.item-menu-panel button.menu-back{color:var(--muted);font-size:.9rem}.recent li{border-top:1px solid var(--line);justify-content:space-between;gap:1rem;padding:.45rem 0;font-size:.95rem;display:flex}.muted,.empty{color:var(--muted)}.empty{text-align:center;margin:1.5rem 0}.toast{background:var(--ink);color:#f7fffb;box-shadow:var(--shadow);border-radius:999px;padding:.7rem 1rem;animation:.18s ease-out rise;position:fixed;bottom:1.25rem;left:50%;transform:translate(-50%)}@keyframes rise{0%{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%)}}@media (width<=760px){.add-row{grid-template-columns:1fr 1fr}.add-row .name,.add-row .btn.primary{grid-column:1/-1}.item-actions{width:100%}.item-actions>.btn{flex:1}.item-menu{flex:none}.item-menu-panel{left:auto;right:0}}
