:root{color-scheme:light dark;--color-accent: #e8590c;--color-accent-strong: #c2410c;--color-on-accent: #ffffff;--color-bg: #fff8f1;--color-surface: #ffffff;--color-text: #1c1917;--color-text-muted: #78716c;--color-border: #e7e0d8;--color-error: #b91c1c;--radius-sm: 10px;--radius-md: 14px;--radius-pill: 999px;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-6: 24px;--tap: 44px;--font-size: 17px;--add-bar-height: calc(var(--tap) + 2 * var(--space-3))}@media (prefers-color-scheme: dark){:root{--color-accent: #fb8c3c;--color-accent-strong: #fdba74;--color-on-accent: #1c1917;--color-bg: #151311;--color-surface: #24201d;--color-text: #f5f0eb;--color-text-muted: #a8a29e;--color-border: #3a332e;--color-error: #f87171}}*{box-sizing:border-box}body{margin:0;background:var(--color-bg);color:var(--color-text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:var(--font-size);-webkit-tap-highlight-color:transparent}button,input{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.35}:focus-visible{outline:3px solid var(--color-accent);outline-offset:2px}.app-name{margin:0;font-size:1.375rem;font-weight:800;letter-spacing:-.01em;color:var(--color-accent)}.primary-button{min-height:var(--tap);padding:0 var(--space-4);border:none;border-radius:var(--radius-pill);background:var(--color-accent);color:var(--color-on-accent);font-weight:700}.primary-button:active{background:var(--color-accent-strong)}input[type=text],input[type=password]{min-height:var(--tap);padding:0 var(--space-4);border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-surface)}.login-screen{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);min-height:100dvh;padding:var(--space-6)}.login-screen .app-name{font-size:2rem}.login-icon{border-radius:var(--radius-md)}.login-form{display:flex;flex-direction:column;gap:var(--space-3);width:100%;max-width:360px;margin-top:var(--space-4)}.login-error{margin:0;color:var(--color-error);text-align:center}.shopping-list{max-width:560px;margin:0 auto;min-height:100dvh}.app-bar{position:sticky;top:0;z-index:1;padding:calc(env(safe-area-inset-top) + var(--space-3)) var(--space-4) var(--space-3);background:var(--color-bg)}.notices-line{margin:var(--space-1) 0 0;font-size:.875rem;color:var(--color-text-muted)}.notices-button{margin:var(--space-1) 0 0;padding:0 var(--space-3);min-height:calc(var(--tap) - var(--space-2));border:none;border-radius:var(--radius-pill);background:var(--color-accent);color:var(--color-on-accent);font-size:.875rem;font-weight:600}.list-switcher{margin-top:var(--space-3);position:relative}.list-chips{display:flex;gap:var(--space-2);overflow-x:auto}.list-chip[aria-pressed=true]{border-color:var(--color-accent);background:var(--color-accent);color:var(--color-on-accent)}.list-chip-wrap{display:flex;align-items:center;gap:var(--space-1);flex:none}.list-settings-button{min-width:var(--tap);min-height:var(--tap);border:none;background:transparent;font-size:1rem;line-height:1;color:var(--color-text)}.list-settings-panel{position:absolute;z-index:2;display:flex;flex-direction:column;gap:var(--space-2);width:min(300px,90vw);margin-top:var(--space-2);padding:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.list-remove-confirm{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-2)}.list-remove-confirm p{flex:1 1 100%;margin:0}.list-action-danger{color:var(--color-error)}.list-group{margin-top:var(--space-2)}.list-group-label{display:block;margin-bottom:var(--space-1);font-size:.75rem;color:var(--color-text-muted)}.list-name-form{display:flex;align-items:center;gap:var(--space-2);margin-top:var(--space-1)}.list-private-toggle{display:flex;align-items:center;gap:var(--space-1);font-size:.875rem}.list-action{min-height:calc(var(--tap) - var(--space-2));padding:0 var(--space-2);border:none;background:transparent;color:var(--color-accent);font-size:.875rem;font-weight:600}.list-name-input{flex:1;min-width:0}.list-error{margin:var(--space-1) 0 0;font-size:.875rem;color:var(--color-error)}.list-body{padding:0 var(--space-4) calc(var(--add-bar-height) + env(safe-area-inset-bottom) + var(--space-6))}.empty-state{margin:var(--space-6) 0;color:var(--color-text-muted);text-align:center}.items{list-style:none;margin:0;padding:0;background:var(--color-surface);border-radius:var(--radius-md);overflow:hidden}.items:empty{display:none}.item{display:flex;align-items:center;gap:var(--space-2);min-height:calc(var(--tap) + var(--space-2));padding:0 var(--space-1);border-bottom:1px solid var(--color-border)}.item:last-child{border-bottom:none}.item-check{-webkit-appearance:none;-moz-appearance:none;appearance:none;flex-shrink:0;position:relative;width:var(--tap);height:var(--tap);margin:0;cursor:pointer}.item-check:before{content:"";position:absolute;top:9px;right:9px;bottom:9px;left:9px;border:2px solid var(--color-text-muted);border-radius:50%}.item-check:checked:before{border-color:var(--color-accent);background:var(--color-accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12.5l4 4 8-9' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 70% no-repeat}.item-text{flex:1;min-width:0;overflow-wrap:anywhere}.item-text.done{text-decoration:line-through;color:var(--color-text-muted)}.stepper{display:flex;align-items:center;flex-shrink:0}.stepper-button{width:var(--tap);height:var(--tap);padding:0;border:none;border-radius:50%;background:transparent;color:var(--color-accent);font-size:1.375rem;line-height:1}.stepper-button:active:not(:disabled){background:var(--color-border)}.item-quantity-value{min-width:1.5rem;text-align:center;font-variant-numeric:tabular-nums}.drag-grip{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:var(--tap);height:var(--tap);color:var(--color-text-muted);font-size:1.125rem;touch-action:none}.item-dragging{transform:scale(1.02);opacity:.6;position:relative;touch-action:none;z-index:1}.done-group{margin-top:var(--space-6)}.done-header{display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-1) var(--space-2);border-bottom:1px solid var(--color-border);margin-bottom:var(--space-2)}.done-header h2{margin:0;font-size:.875rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--color-text-muted)}.clear-done{min-height:var(--tap);padding:0 var(--space-3);border:none;background:transparent;color:var(--color-accent);font-weight:700}.add-form{position:fixed;left:0;right:0;bottom:0;z-index:2;display:flex;flex-direction:column;gap:var(--space-2);max-width:560px;margin:0 auto;padding:var(--space-3) var(--space-3) calc(var(--space-3) + env(safe-area-inset-bottom));background:var(--color-surface);border-top:1px solid var(--color-border)}.add-row{display:flex;align-items:center;gap:var(--space-2)}.history-chips{display:flex;gap:var(--space-2);overflow-x:auto}.chip{flex-shrink:0;min-height:calc(var(--tap) - var(--space-2));padding:0 var(--space-3);border:1px solid var(--color-border);border-radius:var(--radius-pill);background:var(--color-surface);font-weight:600;white-space:nowrap}.chip:active{background:var(--color-border)}.add-text{flex:1;min-width:0}.stepper-input{width:2.25rem;min-height:var(--tap);padding:0;border:none;background:transparent;text-align:center;font-variant-numeric:tabular-nums;-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield}.stepper-input::-webkit-outer-spin-button,.stepper-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.add-button{flex-shrink:0}.app-bar-top{display:flex;align-items:center;justify-content:space-between}.menu{position:relative}.menu-button{min-width:var(--tap);min-height:var(--tap);border:none;background:transparent;font-size:1.5rem;line-height:1;color:var(--color-text)}.menu-panel{position:absolute;top:calc(100% + var(--space-1));right:0;z-index:2;display:flex;flex-direction:column;gap:var(--space-2);width:min(300px,90vw);padding:var(--space-3);background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md)}.menu-signed-in{margin:0;color:var(--color-text-muted);font-size:.875rem}.invite-link{display:flex;gap:var(--space-2)}.invite-link input{flex:1;min-width:0;font-size:.8rem}.person{padding:var(--space-3) 0;border-bottom:1px solid var(--color-border)}.person-header{display:flex;align-items:center;justify-content:space-between}.person-header h2{margin:0;font-size:1rem}.devices{list-style:none;margin:var(--space-2) 0 0;padding:0}.device{display:flex;align-items:center;justify-content:space-between;padding:var(--space-1) 0}.device-name{color:var(--color-text-muted)}.secondary-button{min-height:var(--tap);padding:0 var(--space-4);border:1px solid var(--color-accent);border-radius:var(--radius-pill);background:transparent;color:var(--color-accent);font-weight:700}.passkey-sign-in{display:flex;flex-direction:column;gap:var(--space-3);width:100%;max-width:360px}.passkeys-heading{margin:var(--space-3) 0 0;font-size:.875rem;color:var(--color-text-muted)}.passkey-offer{text-align:center}