:root{--ps-green:#33153c;--ps-green-light:#f1ebe7;--ps-yellow:#f1d878;--ps-ink:#231129}
html.ps-app{scroll-padding-top:84px}
body.ps-app-shell{padding-bottom:calc(82px + env(safe-area-inset-bottom));background:#f8f6f5}
.ps-app-header{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px max(16px,env(safe-area-inset-left));background:var(--ps-green);color:#fff;box-shadow:0 2px 12px #220f2822}
.ps-app-header>span{font-size:.88rem;font-weight:650;letter-spacing:.01em}
.ps-app-brand{display:flex;align-items:center;min-height:34px}
.ps-app-brand img{display:block;width:218px;height:auto}
.ps-app-intro{max-width:790px;margin:22px auto 12px;padding:0 20px}
.ps-app-eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:#63456c;font-weight:750}
.ps-app-intro h1{margin:5px 0 6px;font-size:clamp(1.45rem,5vw,2.05rem);line-height:1.13;color:var(--ps-ink)}
.ps-app-intro p{margin:0;max-width:650px;line-height:1.48;color:#563e5e}
.ps-app-shell .wrap{max-width:980px;padding-left:14px;padding-right:14px}
.ps-app-shell .ps-app-more{max-width:760px;margin:20px auto;padding:20px;background:#fff;border:1px solid #e5dfdb;border-radius:18px;box-shadow:0 8px 28px #3118390a}
.ps-app-more h2{margin:0 0 5px;color:var(--ps-green)}
.ps-app-muted{font-size:.91rem;color:#674a70;line-height:1.5}
.ps-app-more-actions{display:grid;gap:12px;margin:16px 0}
.ps-app-more nav{display:flex;flex-wrap:wrap;gap:16px;margin:18px 0}
.ps-app-more nav a{color:#452250;font-weight:650}
.ps-app-tabs{position:fixed;z-index:50;inset:auto 0 0;display:grid;grid-template-columns:repeat(4,1fr);padding:7px 8px calc(8px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid #e5dfdb;box-shadow:0 -5px 18px #31183910}
.ps-app-tabs a{min-height:54px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;text-decoration:none;color:#775681;font-size:.72rem;font-weight:650;border-radius:12px}
.ps-app-tabs a[aria-current=page]{color:var(--ps-green);background:var(--ps-green-light)}
.ps-app-tabs svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
body.ps-app-shell:not([data-app-view=more]) #acct{display:none!important}
body.ps-app-shell[data-app-view=more] #view-recipes,body.ps-app-shell[data-app-view=more] #view-ingredients{display:none!important}
body.ps-app-shell[data-app-view=prices] #view-recipes{display:none!important}
body.ps-app-shell[data-app-view=prices] #view-ingredients{display:block!important}
body.ps-app-shell[data-app-view=recipes] #view-ingredients{display:none!important}
body.ps-app-shell[data-app-view=recipes] #ps-app-more,body.ps-app-shell[data-app-view=prices] #ps-app-more,body.ps-app-shell[data-app-view=calculator] #ps-app-more{display:none!important}
body.ps-app-shell[data-app-view=calculator] #view-ingredients{display:none!important}
body.ps-app-shell[data-app-view=calculator] .ps-app-intro{display:none}
body.ps-app-shell .view-tabs{display:none!important}
body.ps-app-shell .sitefoot,body.ps-app-shell .ps-footer{display:none!important}
body.ps-app-shell .whatchanged,body.ps-app-shell [aria-labelledby=scaling-guide],body.ps-app-shell details,body.ps-app-shell .faq,body.ps-app-shell .price-report{display:none!important}
body.ps-app-shell #view-ingredients .card{overflow-x:auto}
body.ps-app-shell #view-ingredients table{min-width:620px}
/* plus-appfix-v1 (10 Oct 2026): on phones (412px, 360px) the recipe ingredient table and the pricebook stack as cards, so no
   column is cut off or needs a sideways scroll. CSS only; the column labels come from ::before. */
@media(max-width:640px){
 body.ps-app-shell .ingredients-card table,body.ps-app-shell #view-ingredients table{min-width:0!important;width:100%;table-layout:auto}
 body.ps-app-shell #view-ingredients .card{overflow-x:visible}
 body.ps-app-shell .ingredients-card>table>thead{display:none}
 body.ps-app-shell #rows,body.ps-app-shell #ing-rows{display:block}
 body.ps-app-shell #rows>tr,body.ps-app-shell #ing-rows>tr:not(.ing-hist-row){position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 10px;margin:0 0 10px;padding:10px 12px;background:#fff;border:1px solid #e5dfdb;border-radius:12px}
 body.ps-app-shell #rows>tr>td,body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td{display:block;width:auto!important;min-width:0;padding:0;border:0;text-align:left;background:transparent!important}
 body.ps-app-shell #rows>tr>td input,body.ps-app-shell #rows>tr>td select,body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td input{width:100%!important;min-width:0!important;max-width:none!important;box-sizing:border-box}
 body.ps-app-shell #rows>tr>td::before,body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td::before{display:block;margin:0 0 3px;font-size:.72rem;font-weight:650;color:#674a70;line-height:1.2}
 body.ps-app-shell #rows>tr>td:nth-child(1){grid-column:1/-1;padding-right:44px}
 body.ps-app-shell #rows>tr>td:nth-child(1)::before{content:"Ingredient"}
 body.ps-app-shell #rows>tr>td:nth-child(2)::before{content:"Pack price (£)"}
 body.ps-app-shell #rows>tr>td:nth-child(3)::before{content:"Pack size"}
 body.ps-app-shell #rows>tr>td:nth-child(4)::before{content:"Used"}
 body.ps-app-shell #rows>tr>td:nth-child(5)::before{content:"Unit"}
 body.ps-app-shell #rows>tr>td:nth-child(6)::before{content:"Cost"}
 body.ps-app-shell #rows>tr>td:nth-child(6){font-weight:700;align-self:end;padding-bottom:8px}
 body.ps-app-shell #rows>tr>td:nth-child(7){position:absolute;top:8px;right:8px}
 body.ps-app-shell #rows>tr>td:nth-child(7)::before{content:none}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(1){grid-column:1/-1;font-weight:700}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(1){order:0}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(1)::before{content:"Ingredient"}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(4){order:1}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(4)::before{content:"Pack price (£)"}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(3){order:2}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(3)::before{content:"Pack size"}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(2){order:3}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(2)::before{content:"Unit"}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(5){order:4}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(5)::before{content:"Updated"}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(6){order:5}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(6)::before{content:"Dishes"}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(7){order:6;align-self:end}
 body.ps-app-shell #ing-rows>tr:not(.ing-hist-row)>td:nth-child(7)::before{content:none}
 body.ps-app-shell #ing-rows>tr.ing-hist-row:not([hidden]){display:block;margin:-6px 0 10px}
 body.ps-app-shell #ing-rows>tr.ing-hist-row>td{display:block;padding:0}
 body.ps-app-shell #ing-rows .ing-hist{overflow-x:auto}
 body.ps-app-shell #ing-rows .ing-hist table{width:100%;min-width:0!important;font-size:.85rem}
}
body.ps-app-shell .acct{margin:14px 0;padding:16px;border:1px solid #e5dfdb;border-radius:16px;background:#fff}
body.ps-app-shell .data-card{margin-top:10px}
body.ps-app-shell[data-app-view=more] .data-card{padding:0;border:0;box-shadow:none}
body.ps-app-shell[data-app-view=more] .data-card h2{font-size:1.02rem}
body.ps-app-shell[data-app-view=more] .data-card .hint{font-size:.82rem}
body.ps-app-shell .ps-app-more[hidden]{display:none!important}
@media(min-width:760px){
 .ps-app-header{padding-left:max(24px,calc((100vw - 980px)/2));padding-right:max(24px,calc((100vw - 980px)/2))}
 .ps-app-intro{padding:0 24px}
 .ps-app-shell .wrap{padding-left:24px;padding-right:24px}
 .ps-app-tabs{left:50%;right:auto;width:min(560px,calc(100% - 32px));transform:translateX(-50%);bottom:14px;border:1px solid #e5dfdb;border-radius:18px;padding-bottom:7px}
}
@media print{.ps-app-header,.ps-app-intro,.ps-app-tabs,.ps-app-more{display:none!important}body.ps-app-shell{padding:0}}

/* council r6: states + focus + GP status (coral is never a focus ring, text on cream or a status colour) */
:root{--cs-night:#241028;--cs-gp-under:#B3261E;--cs-gp-close:#8A5A00;--cs-gp-ok:#46712F}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:2px solid #3B1B45!important;outline-offset:2px!important;box-shadow:none!important}
.ps-header-dark :focus-visible,.cs-rename :focus-visible,.psc :focus-visible,.ps-footer :focus-visible,.chef-note :focus-visible,.app-top :focus-visible,.appbar :focus-visible,[data-surface="dark"] :focus-visible{outline-color:#F6EFE2!important}
.btn:not(.alt):not(.btn-outline):not(:disabled):not([aria-disabled="true"]):hover,.btn:not(.alt):not(.btn-outline):not(:disabled):active,.btn-primary:not(:disabled):hover,.btn-primary:not(:disabled):active{background:#241028!important;border-color:#241028!important;color:#F6EFE2!important}
button:disabled,.btn:disabled,.btn[aria-disabled="true"],.home-button[aria-disabled="true"],input[type=submit]:disabled{background:#E4DBD1!important;border:2px solid #8A7A90!important;color:#5E4A66!important;opacity:1!important;cursor:not-allowed;box-shadow:none!important}
.gp-flag{border:1px solid transparent;font-weight:600}
.gp-flag.bad{background:#fff;color:#B3261E;border-color:#B3261E}.gp-flag.bad::before{content:"▼ "}
.gp-flag.close{background:#fff;color:#8A5A00;border-color:#8A5A00}.gp-flag.close::before{content:"◆ "}
.gp-flag.ok{background:#fff;color:#46712F;border-color:#46712F}.gp-flag.ok::before{content:"✓ "}
.plus-alert{background:#fff;color:#B3261E;border-color:#B3261E}
#r-fc.good{color:#46712F}#r-fc.warn{color:#8A5A00}#r-fc.bad{color:#B3261E}
#r-fc[data-gp]::after{display:block;width:max-content;margin-top:4px;padding:1px 8px;font-size:13px;font-weight:600;line-height:1.5;background:#fff;border:1px solid;border-radius:999px;white-space:nowrap}
#r-fc[data-gp="good"]::after{content:"✓ On target";color:#46712F}
#r-fc[data-gp="close"]::after{content:"◆ Close to target";color:#8A5A00}
#r-fc[data-gp="bad"]::after{content:"▼ Under target";color:#B3261E}
.byline a,.byline a:visited{text-decoration:underline;text-underline-offset:3px}
.f{color:#F6EFE2}
.ps-alerts table.alert-dishes tr.below td:nth-child(3)::before{content:"▼ "}


/* ChefSums brand tokens, palette B Aubergine & Coral. Generated by build/final_stockpot.py. Working name, staging only.
   Drop into PrepSheet Builder as-is. Rule: --cs-accent is decoration only. NEVER use it for errors, warnings or status; use --cs-alert. Dark-mode alert changed from #E58A7A to #F76D8C so it stays clear of the coral and of SUMS error #E07A63. */
:root {
  --cs-brand: #3B1B45;          /* tile, primary buttons, header */
  --cs-brand-ink: #3B1B45;       /* wordmark and headings on light */
  --cs-accent: #F28C84;       /* the lid; small highlights only; never errors or status */
  --cs-on-brand: #F6EFE2;       /* text and icons on --cs-brand */
  --cs-paper: #F6EFE2;         /* page background */
  --cs-surface: #FFFFFF;  /* cards, inputs */
  --cs-text: #3B1B45;
  --cs-text-muted: #6B5A70;
  --cs-border: #DCD2CB;
  --cs-alert: #BD3D32;         /* under-target GP, errors (unchanged) */
  --cs-alert-on: #FFFFFF;
  --cs-focus: #F28C84;
  --cs-radius-tile: 22%;             /* icon corner radius (112 / 512) */
  --cs-font-brand: "Bricolage Grotesque", system-ui, sans-serif;  /* wordmark is outlined; this is for headings only */
  /* color-scheme omitted on the site: no dark layout yet */
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --cs-brand: #3B1B45;
    --cs-brand-ink: #F6EFE2;
    --cs-on-brand: #F6EFE2;
    --cs-paper: #241028;
    --cs-surface: #2E1536;
    --cs-text: #F6EFE2;
    --cs-text-muted: #C9B8CC;
    --cs-border: #4A2E52;
    --cs-alert: #F76D8C;
    --cs-alert-on: #241028;
  }
}
:root[data-theme="dark"] {
  --cs-brand: #3B1B45;
  --cs-brand-ink: #F6EFE2;
  --cs-on-brand: #F6EFE2;
  --cs-paper: #241028;
  --cs-surface: #2E1536;
  --cs-text: #F6EFE2;
  --cs-text-muted: #C9B8CC;
  --cs-border: #4A2E52;
  --cs-alert: #F76D8C;
  --cs-alert-on: #241028;
}

/* legacy alias of the kit token --cs-accent (decoration only; never errors or status) */
:root{--brand-accent:var(--cs-accent)}