/* Approved Stitch palette/typography; continuous categories + dense paper are the
   1 Oct approved visual refinement. Domain screens keep their existing geometry. */
html{--appearance-bg:#fcfaf8;--appearance-soft:#f9f7f3;--appearance-nav:#e3d7c3}
html[data-skin=rose]{--appearance-bg:#fcf6f7;--appearance-soft:#fbf1f3;--appearance-nav:#e9b8c2}
html[data-skin=green]{--appearance-bg:#f6faf7;--appearance-soft:#f1f7f3;--appearance-nav:#b7d6c3}
html[data-skin=blue]{--appearance-bg:#f6f9fc;--appearance-soft:#f1f6fa;--appearance-nav:#b9d0e8}
html[data-skin=lavender]{--appearance-bg:#faf8fc;--appearance-soft:#f7f4fa;--appearance-nav:#d7c7e5}
html{--bg:var(--appearance-bg);--soft:var(--appearance-soft);--nav:var(--appearance-nav)}
html[data-theme=night]{--appearance-bg:#211d19;--appearance-soft:#37312b;--appearance-nav:#191714;--bg:var(--appearance-bg);--soft:var(--appearance-soft);--nav:var(--appearance-nav)}
html[data-theme=night][data-skin=rose]{--appearance-bg:#261d1c;--appearance-soft:#3d302d;--appearance-nav:#231317}
html[data-theme=night][data-skin=green]{--appearance-bg:#1d231d;--appearance-soft:#303a2e;--appearance-nav:#102019}
html[data-theme=night][data-skin=blue]{--appearance-bg:#1b2228;--appearance-soft:#2c3842;--appearance-nav:#101e2e}
html[data-theme=night][data-skin=lavender]{--appearance-bg:#231e28;--appearance-soft:#39313f;--appearance-nav:#1c1728}
/* One common header, not three cards. No simulated device/status chrome. */
/* The list occupies the available phone width; other screens keep their layout. */
[data-screen=list]{margin-left:-16px;margin-right:-16px;padding-bottom:18px;--list-paper:#fff;--list-text:#252923;--list-muted:#666a62;--list-soft:#f7f6f2}
html[data-theme=night] [data-screen=list]{--list-paper:#29241f;--list-text:#f3eee7;--list-muted:#c9c1b7;--list-soft:#312b25}
[data-screen=list] .category-strip{display:flex;gap:0;overflow-x:auto;margin:0;padding:0;scroll-snap-type:x proximity;border-radius:0;background:var(--soft);scrollbar-width:thin}
[data-screen=list] .category-button{flex:0 0 70px;width:70px;min-height:70px;padding:6px 2px 5px;gap:3px;border:0;border-radius:0;box-shadow:inset 0 -1px #0002;background:linear-gradient(var(--cat-angle),var(--cat-top) 0%,var(--cat-middle) 50%,var(--cat-bottom) 100%);color:var(--cat-ink);transition:box-shadow .15s}
.category-button span{font-size:12px;font-weight:650;line-height:1.1;color:inherit!important}
[data-screen=list] .category-icon{display:block;flex:none;width:30px;height:30px;background:currentColor;mask:var(--category-icon) center/contain no-repeat;-webkit-mask:var(--category-icon) center/contain no-repeat}
[data-screen=list] .category-button.active{box-shadow:inset 0 -3px currentColor}.category-button:focus-visible{outline:2px solid currentColor;outline-offset:-3px}
[data-screen=list] .composer{display:grid;grid-template-columns:minmax(0,1fr) 44px 44px;gap:0;margin:0 0 3px;background:var(--list-paper);border-bottom:1px solid var(--line)}[data-screen=list] .composer input{height:46px;border:0;border-radius:0;padding:8px 10px;background:transparent;color:var(--list-text);font-size:16px}[data-screen=list] .composer button{height:46px;width:44px;border:0;border-radius:0;padding:0;font-size:27px}[data-screen=list] #voiceButton{background:#303238!important;border-radius:0;padding:0}[data-screen=list] #voiceButton svg{width:25px;height:25px}
[data-screen=list] .paper-card{background:var(--list-paper);color:var(--list-text);border:0;border-radius:0;box-shadow:none;width:100%;overflow:visible}[data-screen=list] .shopping-list{padding:3px 0}
[data-screen=list] .shopping-row{grid-template-columns:30px minmax(0,1fr) 138px 32px!important;grid-template-rows:auto;gap:4px;padding:2px 8px;min-height:48px;border:0!important;align-items:center}
[data-screen=list] .shopping-row .item-thumb{grid-column:1;grid-row:1;width:30px;height:30px;border-radius:7px;align-self:center;background:transparent}
[data-screen=list] .shopping-row .item-name{grid-column:2;grid-row:1;white-space:normal;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;text-overflow:ellipsis;overflow-wrap:anywhere;font-size:16px;line-height:1.15;letter-spacing:-.015em;color:var(--list-text)}
[data-screen=list] .shopping-row .quantity-editor{grid-column:3;grid-row:1;display:grid;grid-template-columns:28px 42px 28px 40px;gap:0;align-items:center;width:138px;min-width:138px;flex-wrap:nowrap}
[data-screen=list] .shopping-row .qty-step{height:44px;width:28px;min-width:28px;padding:0;border:0;border-radius:0;font-size:21px;line-height:1;background:transparent;color:var(--list-text)}
[data-screen=list] .shopping-row .qty-input{height:34px;width:42px;min-width:0;max-width:42px;padding:2px 0;border:0;border-radius:4px;background:var(--list-soft);color:var(--list-text);font-size:14px;text-align:center}
[data-screen=list] .shopping-row .unit-label{display:block;min-width:0;margin:0}[data-screen=list] .shopping-row .unit-input{height:44px;width:40px;min-width:40px;padding:0;border:0;border-radius:0;font-size:12px;color:var(--list-muted);background:transparent;appearance:auto}
[data-screen=list] .shopping-row .check-button{grid-column:4;grid-row:1;width:32px;height:44px;min-width:32px;border:0;border-radius:0;margin:0;background:transparent}[data-screen=list] .shopping-row .check-button:before{inset:12px 6px;border:1.5px solid var(--list-muted);border-radius:4px;line-height:17px;font-size:16px}[data-screen=list] .shopping-row .check-button.checked:before{background:var(--green-dark);border-color:var(--green-dark)}
[data-screen=list] .shopping-row.done .item-name{color:var(--list-muted)}[data-screen=list] .list-summary{padding:5px 8px;font-size:13px;border-top:0;min-height:44px;background:var(--list-paper);color:var(--list-muted);gap:4px}[data-screen=list] #selectAllButton{padding:0;min-height:44px;font-size:13px;color:var(--list-muted);gap:6px}.fake-check{width:20px;height:20px;flex:0 0 20px}
[data-screen=list] .bought-tab-wrap{padding:0 8px;margin:0;background:var(--list-paper)}[data-screen=list] .bought-tab{min-height:44px;padding:8px 20px;font-size:14px;border-radius:0 0 12px 12px}
[data-screen=list] #categoryCatalog{margin:0;border:0;border-radius:0;box-shadow:none;padding:8px 10px}.catalog-options button{min-height:32px}
/* Persistent navigation: white active destination, subdued inactive ones. */
.bottom-nav{background:var(--nav);gap:0;min-height:70px;padding:4px 4px calc(4px + env(safe-area-inset-bottom));border-top:0;border-radius:0!important}.bottom-nav button{min-height:58px;gap:4px;color:#e1dad2;font-weight:500}.bottom-nav svg{width:29px;height:29px;stroke-width:1.8;flex:none}.bottom-nav small{font-size:12px;font-weight:500}.bottom-nav button.active{color:#fff}.bottom-nav button.active small{color:#fff;font-weight:750}.bottom-nav button.active svg{stroke-width:2.3}
/* All skins share geometry; selection itself is a plain accessible radio group. */
.skin-options{border:0;border-top:1px solid var(--line);padding:12px 0;margin:10px 0 16px}.skin-options legend{font-weight:650;padding:0;font-size:16px}.skin-choices{display:flex;flex-wrap:wrap;gap:2px 10px}.skin-choice{display:flex;align-items:center;gap:8px;min-height:44px;font-size:14px;cursor:pointer}.skin-choice input{accent-color:var(--green-dark);width:18px;height:18px;margin:0}.skin-swatch{width:21px;height:21px;border-radius:50%;background:var(--swatch);border:1px solid #7778;flex:none}#skinStatus:empty{display:none}
.account-card label.skin-choice{display:flex;margin:0;font-weight:500}
.account-card .skin-choice input[type=radio]{width:18px;min-width:18px;height:18px;min-height:18px;padding:0;margin:0;border:0;background:transparent;flex:none}
@media(max-width:350px){[data-screen=list]{margin-left:-10px;margin-right:-10px}}
@media(min-width:560px){[data-screen=list] .shopping-row{grid-template-columns:36px minmax(0,1fr) 154px 36px!important;padding:3px 12px;gap:6px;min-height:48px}[data-screen=list] .shopping-row .item-thumb{width:36px;height:36px}[data-screen=list] .shopping-row .quantity-editor{grid-template-columns:32px 46px 32px 44px;width:154px;min-width:154px}[data-screen=list] .shopping-row .qty-step{width:32px;min-width:32px}[data-screen=list] .shopping-row .qty-input{width:46px;max-width:46px}[data-screen=list] .shopping-row .unit-input{width:44px;min-width:44px}[data-screen=list] .shopping-row .check-button{width:36px;min-width:36px}}

/* Native details keep expanding content in page flow; categories never add items. */
[data-screen=list] .catalog-options{display:block;margin-top:8px}
.catalog-branch{border-bottom:1px solid var(--line);width:100%}
.catalog-branch summary{display:flex;justify-content:space-between;align-items:center;gap:8px;min-height:44px;padding:6px 4px;cursor:pointer;list-style:none;font-weight:650;color:var(--text)}
.catalog-branch summary::-webkit-details-marker{display:none}
.catalog-chevron{transform:rotate(-90deg);transition:transform .15s;flex:none}
.catalog-branch[open]>summary .catalog-chevron{transform:rotate(0)}
.catalog-children{margin-left:12px;border-left:1px solid var(--line);padding-left:8px;min-width:0}
.catalog-options .catalog-product{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;min-height:44px;padding:8px 6px;border:0;border-radius:0;background:transparent;text-align:left;color:var(--text)}
.catalog-product span:first-child{overflow-wrap:anywhere}
.catalog-product span:last-child{font-size:22px;flex:none}
.catalog-branch summary:focus-visible,.catalog-product:focus-visible{outline:2px solid var(--green-dark);outline-offset:-2px}
.bottom-nav button.active{position:relative}.bottom-nav button.active:after{content:'';position:absolute;bottom:0;width:24px;height:3px;background:#fff;border-radius:2px}

/* The expanded root owns one opaque 20% LIGHT-catalogue tint (80% white).
   Every depth inherits it; no accumulating alpha layers or list-skin beige.
   All summaries and products share the root tint at every depth. */
[data-screen=list] #categoryCatalog{background:var(--catalog-tint);color:#152019;--text:#152019;--surface:#fff}
#categoryCatalog .catalog-branch>summary{background:var(--catalog-tint);color:#152019}
#categoryCatalog .catalog-branch[open]>summary,
#categoryCatalog .catalog-branch[open]>.catalog-children{background:var(--catalog-tint);color:#152019}
#categoryCatalog .catalog-product{background:var(--catalog-tint);color:#152019}
/* Suppress native blue touch flashes only here; preserve keyboard focus. */
#categoryCatalog summary,#categoryCatalog button{-webkit-tap-highlight-color:transparent}
#categoryCatalog summary:active,#categoryCatalog button:active{background:var(--catalog-tint);color:#152019}
#categoryCatalog summary:focus-visible,#categoryCatalog button:focus-visible{outline:2px solid #152019;outline-offset:-2px}

/* Search and quick choices retain the same product buttons and row geometry. */
#categoryCatalog .catalog-search{width:100%;max-width:100%;box-sizing:border-box;background:#fff;color:#152019;border:1px solid var(--line)}
#categoryCatalog .catalog-quick-label,#categoryCatalog .catalog-search-status{color:#152019;font-size:13px}
#categoryCatalog .catalog-search-results:empty{display:none}
#catalogSuggestions{display:block;background:var(--catalog-tint,#fff);color:#152019;--text:#152019;--surface:#fff;--line:#d9d9d9;max-width:100%;overflow-wrap:anywhere}
#catalogSuggestions[hidden]{display:none}
#catalogSuggestions .catalog-product{display:flex;justify-content:space-between;align-items:center;gap:10px;min-height:44px;width:100%;padding:8px 6px;background:transparent;border:0;color:#152019;text-align:left;border-bottom:1px solid var(--line);-webkit-tap-highlight-color:transparent}
#catalogSuggestions .catalog-product:focus-visible{outline:2px solid #152019;outline-offset:-2px}

/* NS MASTER v7. Shared chrome only; domain-page propagation awaits approval. */
html{--skin-primary:#4f614f}html[data-skin=rose]{--skin-primary:#873747}html[data-skin=green]{--skin-primary:#276347}html[data-skin=blue]{--skin-primary:#315f8b}html[data-skin=lavender]{--skin-primary:#675086}
[data-screen=list]{--list-paper:#fff;--list-text:#252923;--list-muted:#62665f;--list-soft:#f5f5f3}
html[data-theme=night] [data-screen=list]{--list-paper:#fff;--list-text:#252923;--list-muted:#62665f;--list-soft:#f5f5f3}
[data-screen=list] #addItemButton,[data-screen=list] .bought-tab{background:var(--skin-primary);color:#fff}
[data-screen=list] .shopping-row .check-button.checked:before{background:var(--skin-primary);border-color:var(--skin-primary)}
[data-screen=list] #voiceButton{background:#303238!important;color:#fff;opacity:.72;touch-action:manipulation}
[data-screen=list] #voiceButton.recording{opacity:1;outline:3px solid #fff;outline-offset:-4px;background:#050505!important;box-shadow:inset 0 -4px var(--skin-primary)}
[data-screen=list] #voiceButton:focus-visible{opacity:1;outline:2px solid var(--skin-primary);outline-offset:2px}
.bottom-nav{height:auto;min-height:70px}.bottom-nav button{color:rgb(255 255 255 / .75);padding:4px 2px;min-width:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px}.bottom-nav small{line-height:1.15;min-height:28px;display:flex;align-items:center;justify-content:center;text-align:center;max-width:100%;text-wrap:balance}.bottom-nav svg{width:26px;height:26px}.bottom-nav button.active{color:#fff}.bottom-nav button.active:after{bottom:0}
.household-choice{display:flex;justify-content:space-between;align-items:center;gap:8px;border-bottom:1px solid var(--line);padding:8px 0}.household-choice div{min-width:0;overflow-wrap:anywhere}.household-choice button{min-height:44px;flex:none}.household-choice[aria-current=true]{border-left:3px solid var(--green-dark);padding-left:8px}
[data-screen=list]{--text:var(--list-text);--muted:var(--list-muted);--surface:var(--list-paper);--paper:var(--list-paper);--line:#dededb;--green:var(--skin-primary);--green-dark:var(--skin-primary)}

/* v8: root aliases must outrank legacy :root tokens, in both day/night. */
html:root[data-skin]{--bg:var(--appearance-bg);--soft:var(--appearance-soft);--nav:var(--appearance-nav)}
html{background:var(--appearance-bg)}
body,.app-shell{background:var(--appearance-bg)}
.bottom-nav{background:var(--appearance-nav)}
html{--skin-icon:#746049}
html[data-skin=rose]{--skin-icon:#873747}html[data-skin=green]{--skin-icon:#276347}html[data-skin=blue]{--skin-icon:#315f8b}html[data-skin=lavender]{--skin-icon:#675086}
html[data-theme=night]{--skin-icon:#c7b597}
html[data-theme=night][data-skin=rose]{--skin-icon:#e6a6b1}html[data-theme=night][data-skin=green]{--skin-icon:#9fcab3}html[data-theme=night][data-skin=blue]{--skin-icon:#a3c5e8}html[data-theme=night][data-skin=lavender]{--skin-icon:#c7b3e3}
.bottom-nav button{color:rgb(255 255 255 / .50)}
.bottom-nav button.active,.bottom-nav button.active small{color:#fff}

/* v9: light day chrome, neutral logo/title; night mode retains its night palette. */
.bottom-nav button,.bottom-nav button small{color:#62665f}
.bottom-nav button.active,.bottom-nav button.active small{color:var(--skin-primary)}
.bottom-nav button.active:after{background:var(--skin-primary)}
html[data-theme=night] .bottom-nav button,html[data-theme=night] .bottom-nav button small{color:rgb(255 255 255 / .50)}
html[data-theme=night] .bottom-nav button.active,html[data-theme=night] .bottom-nav button.active small{color:#fff}
html[data-theme=night] .bottom-nav button.active:after{background:#fff}
[data-screen=list] .bought-tab-wrap{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 12px;margin-top:0}
[data-screen=list] .bought-tab-wrap button{width:100%;min-width:0;min-height:56px;border-radius:0;display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 6px;font-size:14px}
[data-screen=list] .empty-list{background:#fff;color:#62665f;border:1px solid #8b8d86;font-weight:600}
[data-screen=list] .bought-tab{border:1px solid var(--skin-primary);margin:0}
.bought-tab-wrap svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.bought-tab-wrap button:focus-visible{outline:2px solid var(--skin-primary);outline-offset:2px}
.bought-tab-wrap button:disabled{opacity:.55;cursor:wait}

/* v10: footer only; approved header/outer Skin tints unchanged. */
[data-screen=list] .composer{grid-template-columns:44px minmax(0,1fr) 44px}
.app-shell:has([data-screen=list].active){padding-bottom:calc(78px + env(safe-area-inset-bottom))}
[data-screen=list]{padding-bottom:2px}
.field-dictation,#addStockButton{background:#303238!important;color:#fff!important;border:1px solid #303238!important;border-radius:0!important;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px}
.field-dictation svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8}
.field-dictation.recording,#voiceButton.recording,#addStockButton.recording{outline:3px solid var(--skin-icon);outline-offset:2px;box-shadow:inset 0 -4px #fff}
.core-confirm{padding:20px;border:1px solid var(--skin-icon);border-radius:0;max-width:min(420px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow:auto;background:var(--appearance-bg);color:var(--text);font:inherit;box-shadow:0 8px 32px #0003}
.core-confirm::backdrop{background:#0005}.core-confirm h2{font-size:1.25rem;margin:0 0 12px}.core-confirm p{line-height:1.45}.core-confirm-actions{display:flex;gap:10px;margin-top:20px}.core-confirm button{border-radius:0;min-height:48px;padding:10px 14px;font:inherit;flex:1;border:1px solid var(--skin-icon);background:var(--paper);color:var(--text)}.core-confirm .danger{background:#983e46;border-color:#983e46;color:#fff}.core-confirm button:focus-visible{outline:3px solid var(--skin-icon);outline-offset:2px}
.account-card #password.password-ok{background:#edf7ef;color:#252923;border-color:#44794d}.password-ok-status{color:#32683b!important;font-weight:650}
.member-row{display:flex;gap:8px;align-items:center}.member-row input{min-width:0}.member-row .field-dictation{flex:none}.member-row .field-dictation span{display:none}
.shopping-row{touch-action:pan-y}.shopping-row.swiping{background:var(--appearance-soft)}
.swipe-undo{position:fixed;bottom:calc(82px + env(safe-area-inset-bottom));left:16px;right:16px;margin:auto;max-width:608px;padding:10px 12px;border:1px solid var(--skin-icon);background:var(--paper);color:var(--text);z-index:55;display:flex;align-items:center;gap:10px;font-size:14px}.swipe-undo span{flex:1}.swipe-undo button{background:var(--skin-primary);color:#fff;border:0;border-radius:0;min-height:44px;padding:8px 12px;font:inherit}

html{--footer-active:var(--skin-primary)}html[data-skin=blue]{--footer-active:#2c557d}html[data-skin=lavender]{--footer-active:#5d4879}
.bottom-nav button,.bottom-nav button small{color:#50534d}
.bottom-nav button.active,.bottom-nav button.active small{color:var(--footer-active)}
.bottom-nav button.active:after{background:var(--footer-active)}
html[data-theme=night] .bottom-nav button,html[data-theme=night] .bottom-nav button small{color:rgb(255 255 255 / .50)}
html[data-theme=night] .bottom-nav button.active,html[data-theme=night] .bottom-nav button.active small{color:#fff}
html[data-theme=night] .bottom-nav button.active:after{background:#fff}

[data-screen=list] #voiceButton.recording,.field-dictation.recording,#addStockButton.recording{background:#202126!important}

/* v11 catalogue: one shared right action column at every tree depth. */
#categoryCatalog .catalog-branch>summary,
#categoryCatalog .catalog-product,
#catalogSuggestions .catalog-product{
 display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:8px;padding-right:8px;
}
#categoryCatalog .catalog-chevron,
#categoryCatalog .catalog-product>span:last-child,
#catalogSuggestions .catalog-product>span:last-child{
 color:#276347;display:flex;align-items:center;justify-content:center;min-width:44px;font-size:22px;
}
#categoryCatalog #closeCatalog{
 color:#252923;background:#fff;border:1px solid #767b78;border-radius:0;
 min-width:44px;min-height:44px;font-size:28px;line-height:1;
}
