:root{font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;color-scheme:light dark;--accent: #2f9e63;--accent-strong: #248552;--accent-soft: color-mix(in srgb, var(--accent) 16%, transparent);--bg: #f3f5f4;--surface: #ffffff;--surface-2: #eef1ef;--border: #dde3df;--text: #17211b;--muted: #66726b;--danger: #d64545;--shadow: 0 1px 2px #0000000d, 0 4px 14px #0000000a;--radius: 14px}@media (prefers-color-scheme: dark){:root{--bg: #0d1210;--surface: #161d19;--surface-2: #1e2723;--border: #28332d;--text: #e9f0ec;--muted: #8c9a92;--accent: #3cb878;--accent-strong: #34a56b;--shadow: 0 1px 2px #0006, 0 6px 18px #0004}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}h1{letter-spacing:-.02em}.bar{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;gap:.5rem 1rem;flex-wrap:wrap;padding:.7rem 1rem;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}.bar strong{font-size:1.1rem;letter-spacing:-.02em}.bar strong:before{content:"🏠 "}.bar nav{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;color:var(--muted);font-size:.9rem}.card{max-width:28rem;margin:2rem auto;padding:1.5rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}form{display:grid;gap:.75rem}label{display:grid;gap:.3rem;font-size:.85rem;color:var(--muted)}input,select{padding:.65rem .8rem;font:inherit;color:inherit;background:var(--surface);border:1px solid var(--border);border-radius:10px;transition:border-color .15s,box-shadow .15s}input:focus-visible,select:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}button{padding:.6rem 1.1rem;font:inherit;font-weight:600;border:0;border-radius:10px;background:var(--accent);color:#fff;cursor:pointer;transition:background .15s,transform .1s,opacity .15s}button:hover:not(:disabled){background:var(--accent-strong)}button:active:not(:disabled){transform:scale(.97)}button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}button.secondary{background:var(--surface);color:inherit;border:1px solid var(--border);padding:.35rem .75rem;font-size:.85rem;font-weight:500}button.secondary:hover:not(:disabled){background:var(--surface-2)}button:disabled{opacity:.55;cursor:progress}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:.5rem .4rem;border-bottom:1px solid var(--border)}.actions{display:flex;gap:.3rem;flex-wrap:wrap}.error{color:var(--danger)}.list-page{max-width:40rem;margin:0 auto;padding:0 1rem 4rem}.list-head{display:flex;gap:.5rem;align-items:center;padding:1rem 0 .25rem}.list-head select{flex:1;min-width:0;font-weight:600;font-size:1.05rem}.add{position:sticky;top:3.4rem;z-index:10;padding:.5rem 0;background:linear-gradient(var(--bg) 75%,transparent)}.combo{position:relative}.combo input{width:100%;padding:.95rem 1rem .95rem 2.8rem;font-size:1.05rem;border-radius:14px;box-shadow:var(--shadow);background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' stroke='%2399a39d' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='9' cy='9' r='6'/%3E%3Cpath d='m14 14 4 4'/%3E%3C/svg%3E") no-repeat .95rem center}.options{position:absolute;left:0;right:0;margin:6px 0 0;padding:.3rem;list-style:none;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 12px 32px #00000040;max-height:60vh;overflow-y:auto;animation:pop .12s ease-out}@keyframes pop{0%{opacity:0;transform:translateY(-4px)}}.options li{display:flex;align-items:center;gap:.6rem;padding:.65rem .7rem;border-radius:10px;cursor:pointer}.options li.active{background:var(--accent-soft)}.options li.extra{color:var(--muted)}.options li.extra+li.extra{margin-top:0}.options .icon{width:1.6rem;text-align:center}.options .grow{flex:1}.options .cat{font-size:.72rem;color:var(--muted);text-align:right}.badge{font-size:.68rem;font-weight:600;padding:.12rem .5rem;border-radius:999px;background:var(--accent-soft);color:var(--accent);white-space:nowrap}.create{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin-top:.5rem;padding:.75rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius)}.status{display:flex;justify-content:space-between;gap:.5rem;min-height:1.4rem;font-size:.85rem;padding:.2rem .25rem;color:var(--muted)}.live{flex:none;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.live:before{content:"";display:inline-block;width:.5rem;height:.5rem;margin-right:.35rem;border-radius:50%;background:var(--muted)}.live.on:before{background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}.live.off:before{background:var(--danger)}.empty{text-align:center;color:var(--muted);padding:3rem 0}.empty:before{content:"🛒";display:block;font-size:2.5rem;margin-bottom:.5rem}.group h2{display:flex;gap:.45rem;align-items:center;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:1.2rem .25rem .5rem}.finished h2{justify-content:space-between}.group ul{list-style:none;margin:0;padding:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.entry{border-bottom:1px solid var(--border);animation:fade .18s ease-out}.entry:last-child{border-bottom:0}@keyframes fade{0%{opacity:0;transform:translateY(3px)}}.entry-main{display:flex;align-items:center;gap:.6rem;min-height:3.2rem;padding:0 .4rem 0 .8rem}.entry-main input[type=checkbox]{-moz-appearance:none;appearance:none;-webkit-appearance:none;flex:none;width:1.6rem;height:1.6rem;padding:0;border:2px solid var(--border);border-radius:50%;background:transparent;cursor:pointer;display:grid;place-content:center;transition:background .15s,border-color .15s}.entry-main input[type=checkbox]:hover{border-color:var(--accent)}.entry-main input[type=checkbox]:checked{background:var(--accent);border-color:var(--accent)}.entry-main input[type=checkbox]:checked:after{content:"";width:.35rem;height:.7rem;border:solid #fff;border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}.entry-label{flex:1;display:flex;flex-wrap:wrap;align-items:baseline;gap:.15rem .6rem;background:transparent;color:inherit;text-align:left;font-weight:500;padding:.65rem 0}.entry-label:hover:not(:disabled){background:transparent}.entry-label .qty{font-size:.75rem;font-weight:700;padding:.1rem .5rem;border-radius:999px;background:var(--accent-soft);color:var(--accent)}.entry-label .note{flex-basis:100%;font-size:.8rem;font-weight:400;color:var(--muted)}.entry.done .name{text-decoration:line-through;color:var(--muted)}.icon-btn{background:transparent;color:var(--muted);padding:.5rem .7rem;font-weight:400}.icon-btn:hover:not(:disabled){background:transparent;color:var(--danger)}.editor{padding:.25rem .8rem .9rem 3rem;animation:fade .15s ease-out}.qty-row{display:flex;gap:.4rem}.qty-row input:first-of-type{width:4rem;text-align:center}.qty-row input:last-of-type{flex:1;min-width:0}.editor-actions{display:flex;gap:.5rem}.catalog-editor .list-head h1{margin:0;font-size:1.4rem}.catalog-editor .grow{flex:1;min-width:0}.muted{color:var(--muted)}.tabs{display:flex;gap:.25rem;padding:.25rem;margin:.5rem 0 1rem;background:var(--surface-2);border-radius:12px}button.tab{flex:1;background:transparent;color:var(--muted)}button.tab:hover:not(:disabled){background:var(--surface)}button.tab[aria-selected=true]{background:var(--surface);color:var(--text);box-shadow:var(--shadow)}.catalog-tools{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap;margin-bottom:.75rem}.catalog-tools input{flex:1;min-width:10rem}.catalog-tools p{margin:0;font-size:.85rem}.catalog-rows{list-style:none;margin:0;padding:0;display:grid;gap:.4rem}.catalog-row{display:flex;align-items:center;gap:.4rem;padding:.5rem .7rem;background:var(--surface);border:1px solid var(--border);border-radius:12px;flex-wrap:wrap}.catalog-row .icon{font-size:1.3rem}.catalog-row .grow{flex:1 1 10rem}.catalog-form{padding:.8rem;margin-bottom:.5rem;background:var(--surface);border:1px solid var(--accent);border-radius:12px}button.secondary.danger{color:var(--danger)}.emoji-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(2.4rem,1fr));gap:.25rem;margin-top:.4rem}button.emoji-btn{padding:.3rem;font-size:1.25rem;line-height:1.2;background:var(--surface-2);border:1px solid transparent}button.emoji-btn:hover:not(:disabled){background:var(--accent-soft)}button.emoji-btn.selected{border-color:var(--accent);background:var(--accent-soft)}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}