:root{--cream:#fcf6ea;--ink:#1a2622;--green:#3b5a4a;--green-d:#2b4437;--line:#e4dac4;--card:#fffdf8;--warn:#fff1cf;--warn-b:#e8c872;--ok:#e3f1e6;--bad:#fbe3df}
*{box-sizing:border-box}
body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
header{display:flex;align-items:center;gap:12px;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--card);position:sticky;top:0;z-index:5}
header img{height:34px}
header nav{margin-left:auto;display:flex;gap:6px}
header nav a{padding:8px 12px;border-radius:999px;text-decoration:none;color:var(--ink);font-weight:600;font-size:15px}
header nav a.on{background:var(--green);color:#fff}
.subnav{display:flex;gap:6px;padding:8px 16px;border-bottom:1px solid var(--line);overflow-x:auto;max-width:760px;margin:0 auto}
.subnav a{padding:6px 14px;border-radius:999px;text-decoration:none;color:var(--green-d);font-weight:600;font-size:14px;border:1.5px solid var(--line);white-space:nowrap}
.subnav a.on{background:var(--green);color:#fff;border-color:var(--green)}
main{max-width:760px;margin:0 auto;padding:16px}
h1{font-size:22px;margin:6px 0 14px}h2{font-size:17px;margin:22px 0 8px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px;margin:12px 0}
.btn,button{display:inline-block;background:var(--green);color:#fff;border:0;border-radius:12px;padding:12px 18px;font:inherit;font-weight:600;text-decoration:none;cursor:pointer}
.btn.big{display:block;text-align:center;padding:22px 16px;font-size:18px;margin:12px 0}
.btn.ghost,button.ghost{background:transparent;color:var(--green-d);border:1.5px solid var(--green)}
button.danger{background:#a4372c}
button:disabled{opacity:.5}
input[type=number],input[type=text],input[type=search],input[type=password],textarea{width:100%;font:inherit;padding:12px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
textarea{min-height:150px;line-height:1.5}
label{font-weight:600;font-size:14px;display:block;margin:12px 0 4px}
label.req::after{content:" *";color:#a4372c}
.req-note{margin:0 0 4px;font-size:13px}
.row{display:flex;gap:8px}.row>input{flex:1}
ul.list{list-style:none;margin:0;padding:0}
ul.list li a{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:13px 4px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink)}
.pill{font-size:12px;padding:3px 9px;border-radius:999px;background:var(--ok);color:#24562f;white-space:nowrap}
.pill.none{background:#eee6d3;color:#6b6350}
.flash{background:var(--ok);border:1px solid #b9d9bf;border-radius:12px;padding:10px 14px;margin:10px 0}
.warn{background:var(--warn);border:1px solid var(--warn-b);border-radius:12px;padding:10px 14px;margin:10px 0}
.err{background:var(--bad);border:1px solid #e3aaa2;border-radius:12px;padding:10px 14px;margin:10px 0}
.muted{color:#6b6350;font-size:14px}
.thumbs{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0}
.thumbs img{height:90px;border-radius:8px;border:1px solid var(--line)}
.preview{background:#fff;border:1px dashed var(--line);border-radius:12px;padding:10px 12px;margin-top:8px}
.check{display:flex;gap:10px;align-items:center;padding:11px 2px;border-bottom:1px solid var(--line);font-weight:500;margin:0}
.check input{width:22px;height:22px;accent-color:var(--green)}
.sticky{position:sticky;bottom:0;background:linear-gradient(transparent,var(--cream) 30%);padding:18px 0 10px}
.sticky button{width:100%;padding:15px;font-size:17px}
code{background:#eee6d3;padding:1px 5px;border-radius:5px;font-size:13px}
.spin{display:inline-block;width:16px;height:16px;border:3px solid #fff5;border-top-color:#fff;border-radius:50%;animation:s .8s linear infinite;vertical-align:-3px;margin-right:8px}
@keyframes s{to{transform:rotate(360deg)}}
a{color:var(--green-d)}
details summary{cursor:pointer}
select{width:100%;font:inherit;padding:12px;border:1.5px solid var(--line);border-radius:12px;background:#fff;color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}
.chip{display:inline-block;padding:6px 12px;border:1.5px solid var(--green);border-radius:999px;color:var(--green-d);text-decoration:none;font-size:14px}
.chip.on{background:var(--green);color:#fff}
.lbl-edit{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;margin-top:10px}
.lbl-edit details[open]{flex:1 1 100%}
.lbl-edit summary{list-style:none;display:inline-block}
.lbl-edit summary::-webkit-details-marker{display:none}
.lbl-edit details form{margin-top:8px}
.stack{display:flex;flex-direction:column;gap:8px}
button.ghost.danger{background:transparent;color:#9b2c1f;border:1.5px solid #c9776c}
button.ghost.danger:hover{background:#fbeceb}

.bell{position:relative}
.bell summary{list-style:none;cursor:pointer;padding:6px 8px;font-size:18px;position:relative}
.bell summary::-webkit-details-marker{display:none}
.badge{position:absolute;top:0;right:0;background:#a4372c;color:#fff;font-size:11px;font-weight:700;border-radius:999px;min-width:17px;height:17px;line-height:17px;text-align:center}
.bell-list{position:absolute;right:0;top:100%;width:min(320px,calc(100vw - 24px));background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 6px 20px #0002;padding:6px;z-index:10}
.bell-list a,.bell-list span{display:block;padding:10px;border-radius:10px;text-decoration:none;color:var(--ink);font-size:14px}
.bell-list a.bad{background:var(--bad)}.bell-list a.warn{background:var(--warn)}.bell-list a+a{margin-top:4px}
.temp{font-size:34px;font-weight:700;line-height:1.1}
.pill.bad{background:var(--bad);color:#8c2a1f}.pill.warn{background:var(--warn);color:#6b4b00}
table.days{width:100%;border-collapse:collapse;font-size:14px}
table.days th,table.days td{padding:7px 5px;border-bottom:1px solid var(--line);text-align:left;white-space:nowrap}
.scroll{overflow-x:auto}
@media(max-width:560px){header{flex-wrap:wrap;row-gap:4px}header nav{order:3;width:100%;margin-left:0;overflow-x:auto}header nav a{padding:7px 10px;font-size:14px;white-space:nowrap}.bell{margin-left:auto}}
@media(min-width:561px){.bell{margin-left:4px}}
.plot{position:relative}
.plot svg{width:100%;height:190px;display:block;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.tip{position:absolute;top:0;transform:translateX(-50%);background:var(--ink);color:#fff;font-size:13px;padding:4px 9px;border-radius:8px;white-space:nowrap;pointer-events:none;z-index:2}
.chips button.chip{background:transparent;font:inherit;font-size:14px;padding:6px 12px;cursor:pointer}
.chips button.chip.on{background:var(--green);color:#fff}

/* pricing page */
.pr-table{width:100%;border-collapse:collapse;margin:8px 0}
.pr-table td{padding:6px 2px;border-bottom:1px solid var(--line);vertical-align:top}
.pr-table td:last-child{text-align:right}
.pr-override{margin-top:10px}
.pr-override button{white-space:nowrap}

/* Channels, takings and Check (prefix ch-/tk-/rp-) */
.ch-weeknav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:4px 0 10px;text-align:center}
.ch-weeknav .btn{padding:10px 18px;font-size:20px}
.ch-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ch-line{display:grid;grid-template-columns:1fr 1fr;gap:6px 10px;padding:10px 0;border-top:1px solid var(--line)}
.ch-name{grid-column:1/-1;font-weight:600}
.ch-f{margin:0}
.ch-rev{align-self:end;text-align:right;font-weight:600;padding-bottom:12px}
.ch-tick{display:flex;align-items:center;gap:8px;margin:0;min-height:44px}
.ch-tick input{width:24px;height:24px;accent-color:var(--green)}
.ch-total{display:flex;justify-content:space-between;border-top:2px solid var(--line);padding-top:10px;font-size:17px}
.ch-manage{display:flex;flex-direction:column;gap:8px}
.tk-methods{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tk-m{margin:0;position:relative}
.tk-m input{position:absolute;opacity:0}
.tk-m span{display:block;text-align:center;padding:14px 8px;border:1.5px solid var(--green);border-radius:12px;font-weight:600;color:var(--green-d)}
.tk-m input:checked+span{background:var(--green);color:#fff}
.tk-m input:focus-visible+span{outline:3px solid var(--warn-b)}
.tk-amount{font-size:24px;padding:14px}
.tk-save{width:100%;padding:16px;font-size:18px;margin-top:14px}
.tk-row{display:flex;gap:8px;align-items:center;padding:10px 0;border-top:1px solid var(--line)}
.tk-info{flex:1}
.tk-row .btn,.tk-row button{padding:12px 14px}
.rp-flag{background:var(--bad)}
.card.rp-flag{border-color:#e3aaa2}
table.days tr.rp-total td{font-weight:700;border-top:2px solid var(--line)}

/* sales trading (tr-*): products, week view, day entry */
.tr-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.tr-off{opacity:.6}
.tr-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.tr-actions form{margin:0}.tr-actions button{padding:10px 14px}
.tr-found{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:8px 0}
.tr-weeknav{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}
.tr-weeknav>div{text-align:center}.tr-weeknav h1{font-size:19px}
.tr-days{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:10px 0}
.tr-days .btn{padding:12px 4px;text-align:center;font-size:14px}.tr-sub{font-weight:400;font-size:12px}
.tr-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:10px 0}
.tr-cell{display:flex;flex-direction:column;align-items:center;padding:8px 2px;border:1.5px solid var(--green);border-radius:12px;text-decoration:none;color:var(--ink);font-size:12px}
.tr-cell b{font-size:20px}.tr-cell.none{border-color:var(--line);color:#6b6350}.tr-cell.bad{background:var(--bad);border-color:#c9776c}
.tr-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:4px;font-size:13px}
.tr-stats span{display:block;color:#6b6350;font-size:11px}.tr-stats b{font-size:14px}
.tr-closing{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}.tr-closing button{padding:8px 12px;font-size:14px}
.tr-plan{margin-top:10px}.tr-plan-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.tr-saved{color:var(--green-d);font-size:12px;font-weight:400}
.tr-tabs{display:flex;gap:6px;flex-wrap:wrap}.tr-tabs .chip{flex:1;text-align:center;padding:10px 4px}
.tr-open{margin:4px 0 8px}
.tr-field{display:grid;grid-template-columns:78px 56px 1fr 56px;gap:8px;align-items:center;margin:8px 0}
.tr-field span{font-weight:600;font-size:14px}
.tr-field .tr-step{padding:0;height:56px;font-size:28px;line-height:1}
.tr-field input{height:56px;font-size:24px;text-align:center;padding:4px;min-width:0}
.tr-soldline{font-size:18px;margin-top:6px}.tr-sold{font-size:26px}.tr-sold.bad{color:#9b2c1f}
.tr-row.entered{border-color:var(--green)}
@media(max-width:380px){.tr-stats{grid-template-columns:repeat(3,1fr)}}

/* bake: plan, stock take, shopping list (bk- prefix) */
.bk-week{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:6px 0 12px}
.bk-week .chip{padding:8px 16px;font-size:16px}
.bk-name{font-weight:700;font-size:17px}
.bk-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:6px 0}
.bk-fields input{font-size:18px}
.bk-status{min-height:20px;font-size:13px;color:#6b6350}
.bk-status.ok{color:#24562f}.bk-status.bad{color:#a4372c}
.bk-itemhead{font-size:16px}
.bk-edit{margin-top:6px}
.bk-line{align-items:flex-start;gap:10px;font-weight:500}
.bk-line input{flex:none;margin-top:2px}
.bk-lname{flex:1}
.bk-amt{font-weight:700;white-space:nowrap}
.bk-cost{min-width:52px;text-align:right;color:#6b6350;font-size:14px;white-space:nowrap}
.bk-note{color:#6b4b00;font-size:13px}
.bk-total{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px}
.bk-crow{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--line);font-size:14px;flex-wrap:wrap}
.bk-printonly{display:none}
@media print{
  header,.subnav,footer,.bk-noprint,.flash{display:none !important}
  body{background:#fff}main{max-width:none;padding:0}
  .bk-printonly{display:block;margin-bottom:6px}
  .card{border:0;padding:0;margin:0 0 6px;background:#fff}
  .bk-line input{width:14px;height:14px}
  .bk-line{border-bottom:1px solid #ccc;break-inside:avoid}
  .bk-secthead{break-after:avoid;margin:12px 0 4px}
  .bk-covered{display:none}
}
