:root{color-scheme:light;--bg: #f4f1ea;--bg-elevated: #fffcf8;--text: #1c1917;--text-secondary: #44403c;--text-muted: #78716c;--text-faint: #8a837c;--text-ghost: #57534e;--text-placeholder: #a8a29e;--border: #e7e0d6;--border-subtle: #efe9e0;--primary: #2a9d6e;--primary-hover: #238a5f;--primary-soft: #e6f6ee;--primary-ink: #fff;--danger: #e24b3b;--danger-soft: #fde8e6;--danger-text: #c2410c;--btn-secondary-bg: #efe9e0;--btn-icon-hover: #efe9e0;--category-checked: #7a756e;--overlay: rgba(28, 25, 23, .4);--shadow: 0 1px 2px rgba(28, 25, 23, .05);--shadow-md: 0 8px 24px rgba(28, 25, 23, .08);--shadow-lg: 0 12px 32px rgba(28, 25, 23, .12);--shadow-xl: 0 16px 40px rgba(28, 25, 23, .16);--radius: 14px;--radius-sm: 10px;--header-bg: color-mix(in srgb, var(--bg) 86%, transparent);--cat-0: #2a9d6e;--cat-1: #0e7490;--cat-2: #7c3aed;--cat-3: #c2410c;--cat-4: #0369a1;--cat-5: #a16207;--cat-6: #be185d;--cat-7: #3f6212}html[data-theme=dark]{color-scheme:dark;--bg: #121614;--bg-elevated: #1c221f;--text: #f0ede6;--text-secondary: #d6d3cc;--text-muted: #a8a29e;--text-faint: #8b8680;--text-ghost: #c4c0b8;--text-placeholder: #7a756e;--border: #2e3832;--border-subtle: #252c28;--primary: #4fcb8b;--primary-hover: #63d69a;--primary-soft: #1a3328;--primary-ink: #0d1a14;--danger: #f07167;--danger-soft: #3a2220;--danger-text: #ffb4a8;--btn-secondary-bg: #252c28;--btn-icon-hover: #252c28;--category-checked: #6b736e;--overlay: rgba(0, 0, 0, .62);--shadow: 0 1px 2px rgba(0, 0, 0, .35);--shadow-md: 0 8px 24px rgba(0, 0, 0, .4);--shadow-lg: 0 12px 32px rgba(0, 0, 0, .45);--shadow-xl: 0 16px 40px rgba(0, 0, 0, .5);--cat-0: #4fcb8b;--cat-1: #38bdf8;--cat-2: #c4b5fd;--cat-3: #fb923c;--cat-4: #7dd3fc;--cat-5: #fbbf24;--cat-6: #f9a8d4;--cat-7: #a3e635}*{margin:0;padding:0;box-sizing:border-box}html,body{min-height:100%;min-height:100dvh;background:var(--bg);color:var(--text)}body{font-family:Segoe UI Variable,Segoe UI,system-ui,-apple-system,BlinkMacSystemFont,Roboto,sans-serif;font-size:16px;line-height:1.45;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}::placeholder{color:var(--text-placeholder);opacity:1}.icon{display:block;flex-shrink:0}.icon-flip{transform:scaleX(-1)}.app{max-width:600px;margin:0 auto;padding:0 14px 88px}.app-header{display:flex;align-items:center;gap:10px;padding:14px 0 12px;position:sticky;top:0;z-index:10;background:var(--header-bg);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);flex-wrap:wrap;align-items:flex-start}.app-toolbar{margin-left:auto}@media(max-width:400px){.btn-tool-label{display:none}.btn-tool-danger{width:40px;padding:0}}.app-brand{flex:1;min-width:0;display:flex;align-items:flex-start;gap:10px}.app-logo{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--primary);color:var(--primary-ink);flex-shrink:0;box-shadow:0 6px 16px color-mix(in srgb,var(--primary) 35%,transparent)}.app-header-main{flex:1;min-width:0}.app-header h1{font-size:1.12rem;font-weight:750;letter-spacing:-.03em;line-height:1.2}.app-magasin-btn{display:inline-flex;align-items:center;gap:6px;max-width:100%;margin-top:6px;padding:5px 10px 5px 8px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:999px;font-size:.82rem;font-weight:600;color:var(--text-secondary);cursor:pointer;box-shadow:var(--shadow)}.app-magasin-btn .icon{color:var(--primary)}.app-magasin-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.app-magasin-caret{color:var(--text-faint)}.app-toolbar{display:flex;align-items:center;gap:6px;flex-shrink:0}.btn-tool{width:40px;height:40px;display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid var(--border);border-radius:12px;background:var(--bg-elevated);color:var(--text-ghost);cursor:pointer;box-shadow:var(--shadow);transition:background .15s,color .15s,transform .15s}.btn-tool:hover:not(:disabled){background:var(--btn-icon-hover);color:var(--text)}.btn-tool:active:not(:disabled){transform:scale(.96)}.btn-tool:disabled{opacity:.45;cursor:not-allowed}.btn-tool-danger{width:auto;padding:0 12px;color:var(--danger-text);background:var(--danger-soft);border-color:transparent}.btn-tool-label{font-size:.78rem;font-weight:700}.btn-tool.is-spinning .icon{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.magasin-pick{flex:1;min-width:0;display:flex;align-items:center;gap:8px;background:none;border:none;padding:0;text-align:left;cursor:pointer;font:inherit;color:inherit}.magasin-pick.is-current .rayon-name{font-weight:650}.magasin-current-mark{flex-shrink:0;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--primary);background:var(--primary-soft);padding:3px 8px;border-radius:999px}.switch-actions{display:flex;flex-direction:column;gap:8px}.switch-help{font-size:.8rem;color:var(--text-muted);margin:-4px 0 8px}.empty-cta{display:inline-flex;margin:16px auto 0;width:auto;max-width:280px}.empty-key{color:var(--text);font-weight:700}.btn{border:none;border-radius:var(--radius-sm);padding:11px 16px;font-size:.95rem;cursor:pointer;font-weight:650;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:opacity .2s,transform .15s,background .15s}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:var(--primary-ink);width:100%;box-shadow:0 8px 18px color-mix(in srgb,var(--primary) 28%,transparent)}.btn-primary:hover:not(:disabled){background:var(--primary-hover)}.btn-secondary{background:var(--btn-secondary-bg);color:var(--text);width:100%}.btn-danger{background:var(--danger);color:#fff}.btn-ghost{background:transparent;color:var(--text-ghost);padding:8px 12px;box-shadow:none}.btn-sm{padding:8px 12px;font-size:.85rem}.btn-icon{background:none;border:none;cursor:pointer;padding:6px;border-radius:8px;color:var(--text-muted);display:inline-flex;align-items:center;justify-content:center;transition:background .15s,color .15s}.btn-icon:hover:not(:disabled){background:var(--btn-icon-hover);color:var(--text)}.btn-icon:disabled{opacity:.35;cursor:not-allowed}.btn-icon-danger:hover:not(:disabled){background:var(--danger-soft);color:var(--danger-text)}.btn-icon-ok:hover:not(:disabled){background:var(--primary-soft);color:var(--primary)}.add-items{margin-bottom:18px}.add-textarea{width:100%;padding:14px;border:1px solid var(--border);border-radius:var(--radius);font-size:1rem;font-family:inherit;resize:vertical;margin-bottom:8px;background:var(--bg-elevated);color:var(--text);box-shadow:var(--shadow);transition:border-color .2s,box-shadow .2s}.add-textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-soft)}.add-suggest-wrap{position:relative;margin-bottom:8px}.add-suggest-wrap .add-textarea{margin-bottom:0}.suggestions{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:20;list-style:none;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);max-height:220px;overflow:auto;padding:4px}.suggestions-item{display:flex;align-items:center;gap:4px;padding:9px 8px 9px 12px;cursor:pointer;font-size:.95rem;border-radius:10px}.suggestions-label{flex:1;min-width:0;word-break:break-word}.suggestions-dismiss{flex-shrink:0;color:var(--text-placeholder)}.suggestions-dismiss:hover{background:var(--danger-soft);color:var(--danger-text)}.suggestions-item.active,.suggestions-item:hover{background:var(--primary-soft)}.shopping-list{margin-top:4px}.shopping-list.is-reordering{-webkit-user-select:none;user-select:none;touch-action:none}.drag-ghost{position:fixed;z-index:50;pointer-events:none;background:var(--bg-elevated);border-radius:var(--radius);padding:12px 14px;box-shadow:var(--shadow-xl);font-size:1rem;font-weight:600;opacity:.96;box-sizing:border-box}.category-group{margin-bottom:18px}.category-title{--cat: var(--primary);font-size:.72rem;font-weight:750;color:var(--cat);background:color-mix(in srgb,var(--cat) 14%,transparent);padding:7px 12px;border-radius:999px;margin-bottom:8px;text-transform:uppercase;letter-spacing:.08em;display:inline-block}.category-title[data-tone="0"]{--cat: var(--cat-0)}.category-title[data-tone="1"]{--cat: var(--cat-1)}.category-title[data-tone="2"]{--cat: var(--cat-2)}.category-title[data-tone="3"]{--cat: var(--cat-3)}.category-title[data-tone="4"]{--cat: var(--cat-4)}.category-title[data-tone="5"]{--cat: var(--cat-5)}.category-title[data-tone="6"]{--cat: var(--cat-6)}.category-title[data-tone="7"]{--cat: var(--cat-7)}.category-title[data-tone=checked]{--cat: var(--category-checked)}.category-group-checked{opacity:.92}.shopping-item{background:var(--bg-elevated);border-radius:var(--radius);padding:10px 10px 10px 8px;margin-bottom:6px;display:flex;flex-wrap:wrap;align-items:center;gap:4px;transition:opacity .2s,transform .15s;box-shadow:var(--shadow);border:1px solid var(--border-subtle)}.shopping-item.checked{opacity:.58}.shopping-item.checked .item-label{text-decoration:line-through;color:var(--text-placeholder)}.shopping-item.dragging{opacity:.32}.drag-handle{cursor:grab;touch-action:none;color:var(--text-placeholder);padding:6px 2px}.shopping-item.dragging .drag-handle{cursor:grabbing}.item-edit{flex:1;display:flex;align-items:center;gap:4px;min-width:0}.item-edit-input{flex:1;min-width:0;padding:8px 10px;border:1.5px solid var(--primary);border-radius:10px;font-size:1rem;font-family:inherit;background:var(--bg-elevated);color:var(--text)}.item-main{flex:1;display:flex;align-items:center;gap:10px;cursor:pointer;min-width:0;-webkit-tap-highlight-color:transparent;padding:2px 0}.item-check{width:22px;height:22px;border-radius:50%;border:2px solid var(--border);flex-shrink:0;display:grid;place-items:center;background:var(--bg-elevated);color:var(--primary-ink);transition:background .15s,border-color .15s,transform .15s}.item-check.checked{background:var(--primary);border-color:var(--primary);transform:scale(1.04)}.item-label{font-size:.98rem;font-weight:550;word-break:break-word}.item-actions{display:flex;gap:1px;flex-shrink:0;align-items:center}.qty-stepper{display:inline-flex;flex-shrink:0;margin-right:2px;border:1px solid var(--border);border-radius:9px;overflow:hidden}.qty-stepper .qty-btn{padding:0;width:28px;height:28px;border-radius:0}.qty-stepper .qty-btn+.qty-btn{border-left:1px solid var(--border)}.qty-stepper .qty-btn:disabled{opacity:.35;cursor:not-allowed}.qty-stepper .qty-btn:disabled:hover{background:none}.category-select{width:100%;display:flex;gap:8px;padding-top:8px;align-items:center}.category-select select{flex:1;padding:9px 10px;border:1px solid var(--border);border-radius:10px;font-size:.9rem;background:var(--bg);color:var(--text);font-family:inherit}.loading,.empty{text-align:center;padding:36px 20px;color:var(--text-muted);font-size:.98rem}.empty p{max-width:320px;margin:0 auto;line-height:1.5}.empty-illu{width:64px;height:64px;margin:0 auto 14px;border-radius:20px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary)}@media(min-width:640px){.app{padding:0 20px 48px}.app-header h1{font-size:1.28rem}}.gate{min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px 16px}.gate-card{width:100%;max-width:420px;background:var(--bg-elevated);border-radius:22px;padding:28px 22px;box-shadow:var(--shadow-md);border:1px solid var(--border-subtle)}.gate-logo{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;background:var(--primary);color:var(--primary-ink);margin-bottom:16px;box-shadow:0 10px 24px color-mix(in srgb,var(--primary) 32%,transparent)}.gate-card h1{font-size:1.45rem;font-weight:750;letter-spacing:-.03em;margin-bottom:8px}.gate-lead{color:var(--text-secondary);margin-bottom:20px}.gate-label{display:block;font-size:.8rem;font-weight:700;margin-bottom:6px;letter-spacing:.02em}.gate-input{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:12px;font-size:1rem;font-family:inherit;margin-bottom:12px;background:var(--bg);color:var(--text)}.gate-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-soft)}.gate-error{color:var(--danger);font-size:.9rem;margin-bottom:8px}.gate-hint{margin-top:16px;font-size:.8rem;color:var(--text-faint);line-height:1.45}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:var(--overlay);z-index:30;display:flex;align-items:flex-end;justify-content:center}.modal{background:var(--bg-elevated);width:100%;max-width:600px;max-height:85vh;overflow:auto;border-radius:22px 22px 0 0;padding:10px 16px 20px}.modal:before{content:"";display:block;width:36px;height:4px;background:var(--border);border-radius:999px;margin:4px auto 10px}.modal-header{display:flex;align-items:center;gap:8px;margin-bottom:8px}.modal-header h2{flex:1;font-size:1.15rem;font-weight:750;letter-spacing:-.02em}.modal-hint{font-size:.85rem;color:var(--text-muted);margin-bottom:12px;line-height:1.45}.rayon-list{list-style:none}.rayon-row{display:flex;align-items:center;gap:8px;padding:11px 6px;border-bottom:1px solid var(--border-subtle)}.rayon-name{flex:1;font-size:.95rem;min-width:0;word-break:break-word}.rayon-edit{flex:1;display:flex;align-items:center;gap:4px;min-width:0}.rayon-edit-input{flex:1;margin-bottom:0;padding:8px;font-size:.95rem}.rayon-actions{display:flex;gap:1px}.empty-rayons{color:var(--text-placeholder);font-size:.9rem;margin-bottom:12px}.rayon-add{display:flex;gap:8px;align-items:flex-start;margin-top:12px}.rayon-add-input{flex:1;margin-bottom:0}.rayon-add .btn{width:auto;flex-shrink:0}@media(min-width:640px){.modal-overlay{align-items:center}.modal{border-radius:20px;max-height:70vh;padding:16px 18px 20px}.modal:before{display:none}}.settings-section{background:var(--bg-elevated);border-radius:16px;padding:16px;margin-bottom:12px;box-shadow:var(--shadow);border:1px solid var(--border-subtle)}.settings-title{font-size:.75rem;font-weight:750;color:var(--primary);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}.settings-hint{font-size:.85rem;color:var(--text-muted);line-height:1.45;margin-bottom:12px}.settings-current-key{font-size:.95rem;margin-bottom:12px;word-break:break-all}.settings-key-form .gate-input{margin-bottom:12px}.settings-check{display:flex;align-items:flex-start;gap:12px;cursor:pointer}.settings-check+.settings-check{margin-top:16px}.settings-check input{width:20px;height:20px;margin-top:2px;flex-shrink:0;accent-color:var(--primary)}.settings-check-text{display:flex;flex-direction:column;gap:4px;min-width:0}.settings-check-text strong{font-size:.95rem;font-weight:650}.settings-check-text .settings-hint{margin-bottom:0}.theme-options{display:flex;gap:8px}.theme-option{flex:1;padding:12px 8px;border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:12px;font-size:.85rem;font-weight:650;cursor:pointer;font-family:inherit;display:flex;flex-direction:column;align-items:center;gap:6px}.theme-option.is-active{border-color:var(--primary);background:var(--primary-soft);color:var(--primary);box-shadow:0 0 0 3px var(--primary-soft)}