:root{
  --primary:#004438;
  --primary-container:#1a5c4e;
  --on-primary:#ffffff;
  --on-primary-container:#93d2c0;
  --bg:#f8faf7;
  --surface:#ffffff;
  --surface-low:#f2f4f1;
  --surface-high:#e7e9e6;
  --surface-container:#eceeec;
  --text:#191c1b;
  --muted:#4a5551;
  --outline:#707975;
  --border:#bfc9c4;
  --sage-wash:#e8f0ed;
  --success:#1a5c4e;
  --danger:#ba1a1a;
  --warning:#8c5a00;
  --radius:10px;
  --radius-sm:6px;
  --font:'DM Sans',system-ui,sans-serif;
  --font-d:var(--font);
  --font-b:var(--font);
  --font-login:var(--font);
  --sidebar:220px;
  --bottom:90px;
  --fs:0.875rem;
  --fs-sm:0.75rem;
  --fs-lg:1.125rem;
}
body.dark{
  --primary:#748485;
  --primary-container:#495455;
  --on-primary:#2b3232;
  --on-primary-container:#dfe2e3;
  --bg:#121514;
  --surface:#1d2121;
  --surface-low:#181c1b;
  --surface-high:#2b3232;
  --surface-container:#232728;
  --text:#f2f4f3;
  --muted:#9aa3a0;
  --outline:#8a938f;
  --border:#2b3232;
  --sage-wash:rgba(116, 132, 133,.14);
  --success:#c1c8c9;
  --danger:#eabcb7;
  --warning:#ddc48b;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
html,body{height:100%;width:100%;overflow:hidden;font-family:var(--font);font-size:var(--fs);background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}
/* Hide scrollbars everywhere, keep scroll */
*{scrollbar-width:none;-ms-overflow-style:none}
*::-webkit-scrollbar{width:0;height:0;display:none}
button,input,select,textarea{font:inherit;color:inherit}
.hidden{display:none!important}
.flex-row{display:flex;gap:10px;align-items:center}
.num{text-align:right;font-variant-numeric:tabular-nums}

#loader{position:fixed;inset:0;z-index:100000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;background:var(--bg)}
#loader.hidden{display:none!important}
.boot-spin{width:42px;height:42px;border:3px solid var(--border);border-top-color:var(--primary-container);border-radius:50%;animation:spin .75s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.boot-txt{font-size:11px;font-weight:700;letter-spacing:.12em;color:var(--muted);text-transform:uppercase}
.loader-retry-box{display:none;text-align:center;max-width:280px}
.loader-retry-btn{margin-top:10px;padding:10px 16px;border:0;border-radius:var(--radius);background:var(--primary-container);color:#fff;font-weight:700;cursor:pointer}

.toast-container{position:fixed;top:16px;left:50%;transform:translateX(-50%);z-index:99999;display:flex;flex-direction:column;gap:8px;width:min(420px,92vw)}
.toast{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;font-size:.85rem;font-weight:600}
.toast.success{border-left:4px solid var(--success)}
.toast.danger,.toast.error{border-left:4px solid var(--danger)}
.toast.warning{border-left:4px solid var(--warning)}

.app-view{display:none;position:absolute;inset:0;flex-direction:column;background:var(--bg)}
.app-view.active{display:flex}

/* ===== LOGIN (centered, no hero image) ===== */
#loginView{
  background:var(--bg);
  background-image:
    radial-gradient(at 80% 10%, color-mix(in srgb, var(--primary-container) 12%, transparent) 0, transparent 45%),
    radial-gradient(at 10% 90%, color-mix(in srgb, var(--primary) 8%, transparent) 0, transparent 42%);
}
#loginView.active{
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:24px 16px;
}
.login-visual{display:none!important}
.login-panel{
  flex:0 1 auto;
  width:100%;
  max-width:28rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:stretch;
  position:relative;
  min-height:0;
}
.login-theme-fab{
  position:fixed;top:20px;right:20px;z-index:2;width:40px;height:40px;border-radius:999px;border:0;
  background:var(--surface);color:var(--muted);cursor:pointer;display:grid;place-items:center;
  border:1px solid var(--border);box-shadow:0 4px 14px rgba(0,0,0,.06);
}
.login-theme-fab:hover{background:var(--surface-high);color:var(--text)}
.login-sheet{
  background:var(--surface);
  border-radius:var(--radius);
  padding:28px 22px 30px;
  border:1px solid var(--border);
  box-shadow:0 12px 40px rgba(25,28,27,.08);
}
body.dark .login-sheet{background:var(--surface);border-color:var(--border);box-shadow:0 12px 40px rgba(0, 0, 0,.35)}
.login-sheet-inner{width:100%;max-width:28rem;margin:0 auto}
.login-brand{font-family:var(--font);font-size:2.5rem;font-weight:800;letter-spacing:-.02em;color:var(--primary);line-height:1;text-align:center}
.login-sub{margin-top:6px;font-family:var(--font-login);font-size:1.1rem;font-weight:600;color:var(--muted);text-align:center}
.login-tag{margin:10px 0 28px;color:var(--outline);font-size:.875rem;text-align:center}
.field{margin-bottom:20px}
.field label{display:block;font-size:.75rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.branch-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.branch-card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  padding:14px 8px;text-align:center;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;
  transition:border-color .15s,background .15s;
}
.branch-card i{color:var(--muted);font-size:1.25rem}
.branch-card span{font-size:.72rem;font-weight:700;color:var(--muted)}
.branch-card.active{background:var(--primary-container);border-color:var(--primary-container)}
.branch-card.active i,.branch-card.active span{color:#fff}
.input-wrap{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:var(--radius);padding:0 14px;background:var(--surface)}
.input-wrap i{color:var(--outline)}
.input,.input-wrap input,select,textarea{width:100%;border:1px solid var(--border);border-radius:var(--radius);padding:14px;background:var(--surface)}
.input-wrap input{border:0;padding:14px 0;outline:none;background:transparent}
.input:focus,select:focus,textarea:focus,.input-wrap:focus-within{border-color:var(--primary-container);box-shadow:0 0 0 1px color-mix(in srgb,var(--primary-container) 35%,transparent)}
.btn,.btn-login,.btn-secondary,.btn-danger,.btn-add{border:0;border-radius:var(--radius);padding:14px 16px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:background .15s,color .15s,border-color .15s}
.btn,.btn-login{background:var(--primary-container);color:#fff;width:100%}
.btn:hover,.btn-login:hover{background:var(--primary);color:#fff}
.btn-secondary,.btn.btn-secondary{background:var(--surface);border:1px solid var(--border);color:var(--text)!important}
.btn-secondary:hover,.btn.btn-secondary:hover{background:var(--surface-high)!important;color:var(--text)!important;border-color:var(--outline)}
.btn-danger{background:var(--danger);color:#fff}
.btn-danger:hover{background:#93000a;color:#fff}
.btn-save-price{background:var(--primary-container);color:#fff}
.btn-save-price:hover{background:var(--primary);color:#fff}
.btn-add{background:var(--primary-container);color:#fff;height:40px;padding:0 14px;width:auto;flex-shrink:0;font-size:.75rem;letter-spacing:.02em;white-space:nowrap}
.btn-add:hover{background:var(--primary);color:#fff}
.btn-add--export{background:#1d6f42}
.btn-add--export:hover{background:#155a35;color:#fff}
.btn-add.btn-icon-only{width:40px;padding:0}
.add-label{display:inline}
.input:disabled,select:disabled,textarea:disabled{
  background:var(--surface-low);color:var(--muted);cursor:not-allowed;opacity:1;border-style:dashed;
}
.modal.modal-readonly .form-group:not(.is-editable) label::after{content:' · locked';font-weight:500;opacity:.7;text-transform:none;letter-spacing:0}
.modal.modal-readonly .form-group.is-editable label::after{content:' · editable';color:var(--success);font-weight:600;text-transform:none;letter-spacing:0}
.modal-note{
  display:flex;align-items:flex-start;gap:8px;margin-bottom:12px;padding:10px 12px;
  border-radius:var(--radius-sm);border:1px solid color-mix(in srgb,var(--warning) 35%,var(--border));
  background:color-mix(in srgb,var(--warning) 12%,var(--surface));color:var(--text);font-size:var(--fs-sm);font-weight:600;line-height:1.35;
}
.modal-note i{color:var(--warning);margin-top:2px}
.food-cost-badge{
  border-radius:6px;padding:3px 10px;font-weight:700;font-size:var(--fs-sm);
  background:var(--surface-high);color:var(--text);border:1px solid var(--border);
}
button.food-cost-badge{cursor:pointer;width:auto;font:inherit;line-height:inherit}
.food-cost-badge.is-good{background:color-mix(in srgb,var(--success) 16%,var(--surface));color:var(--success);border-color:color-mix(in srgb,var(--success) 35%,var(--border))}
.food-cost-badge.is-bad{background:color-mix(in srgb,var(--danger) 12%,var(--surface));color:var(--danger);border-color:color-mix(in srgb,var(--danger) 30%,var(--border))}
.food-cost-badge.is-empty{background:var(--surface-low);color:var(--muted)}
.summary-line-text{color:var(--muted);font-weight:600}
.summary-line > span:last-child{color:var(--text);font-weight:700;font-variant-numeric:tabular-nums}
/* mobile type polish */
@media(max-width:767px){
  .topbar{height:48px;padding:0 12px}
  .topbar h1{font-size:1.05rem}
  .topbar .sub,#cms-user-display{display:none!important}
  .top-actions{gap:14px}
  .top-actions i{font-size:1.1rem}
  .branch-bar{padding:6px 12px;font-size:.75rem}
  .item-card{padding:9px 12px;gap:8px}
  .item-card .name{font-size:.9rem}
  .item-card .meta{font-size:.7rem;margin-top:2px}
  .item-card .val{font-size:.84rem}
  .item-card .badge{padding:1px 6px;font-size:.6rem}
  .tab-toolbar{padding:8px;gap:8px;margin-bottom:10px;flex-wrap:wrap}
  .tab-toolbar .list-filter-row{order:0;width:100%;flex:1 1 100%}
  .tab-toolbar .list-filter{flex:1 1 0;width:auto;min-width:0;max-width:none;height:38px}
  .tab-toolbar .search-wrap{order:1;flex:1 1 0;min-width:0;height:38px}
  .tab-toolbar .btn-add{order:2;width:38px;padding:0;height:38px;flex-shrink:0}
  .add-label{display:none}
  .search-wrap{height:38px}
  .search-wrap input{font-size:.85rem}
  .stock-panel{border-radius:12px;overflow:hidden;background:var(--surface)}
  #tab-menu .stock-panel{border-radius:12px!important}
  .nav-item{font-size:.62rem;padding:8px 10px;min-width:58px}
  .summary-line{font-size:.86rem;padding:8px 0;gap:10px}
  .big-val,#cFinalPrice{font-size:1.6rem}
  .workspace-product-title{font-size:1.22rem;margin-bottom:10px}
  .card,.recipe-cart,.summary-box{padding:14px}
  .cost-params-row{gap:10px;flex-wrap:wrap}
  .cost-params-row .form-group{flex:1 1 100%}
  .nf-label{max-width:100%}
  .modal{align-items:flex-end;padding:0}
  .modal-content{max-width:100%;min-width:0;width:100%;border-radius:18px 18px 0 0;max-height:88vh;padding:18px 16px 22px}
}
@media(min-width:768px){.add-label{display:inline}}

@media(min-width:768px){
  #loginView.active{
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:40px 24px;
    background:var(--bg);
    background-image:
      radial-gradient(at 85% 5%, color-mix(in srgb, var(--primary-container) 14%, transparent) 0, transparent 48%),
      radial-gradient(at 5% 95%, color-mix(in srgb, var(--primary) 9%, transparent) 0, transparent 45%);
  }
  .login-visual{display:none!important}
  .login-panel{
    flex:0 1 auto;width:100%;max-width:30rem;justify-content:center;align-items:stretch;padding:0;
    background:transparent;
  }
  body.dark .login-panel{background:transparent}
  .login-sheet{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:36px 32px 34px;max-width:30rem;width:100%}
  .login-brand{font-size:3rem}
  .branch-grid{grid-template-columns:repeat(3,1fr)}
}

/* ===== APP SHELL (Stitch Stock) ===== */
#appView.active{flex-direction:row}
.sidebar{display:none;width:var(--sidebar);flex-shrink:0;background:var(--surface);border-right:1px solid var(--border);padding:24px 12px 16px;flex-direction:column}
.side-brand{font-family:var(--font);font-size:1.75rem;font-weight:700;letter-spacing:-.02em;padding:0 12px;line-height:1;color:var(--primary)}
.side-sub{font-size:.8125rem;color:var(--muted);font-weight:400;margin:6px 0 28px;padding:0 12px}
.side-nav{display:flex;flex-direction:column;gap:4px;flex:1;padding:0 4px}
.desk-nav-btn{
  display:flex;align-items:center;gap:12px;border:0;background:transparent;color:var(--muted);
  font-weight:600;font-size:.875rem;letter-spacing:.01em;padding:11px 12px;border-radius:4px;cursor:pointer;text-align:left;width:100%;
  border-left:4px solid transparent;margin-left:0;
}
.desk-nav-btn i{font-size:1.2rem;width:22px;text-align:center}
.desk-nav-btn:hover{background:var(--surface-high);color:var(--text)}
.desk-nav-btn.active{background:var(--surface-high);color:var(--primary);font-weight:700;border-left-color:var(--primary)}
.side-foot{margin-top:auto;padding-top:12px;display:flex;flex-direction:column;gap:4px;border-top:0}
.user-chip{display:flex;align-items:center;gap:10px;padding:10px 12px;margin-top:8px}
.avatar{width:32px;height:32px;border-radius:999px;background:var(--surface-high);color:var(--muted);display:grid;place-items:center;font-size:.75rem;font-weight:700}

.main{flex:1;min-width:0;min-height:0;display:flex;flex-direction:column;position:relative;background:var(--bg)}
.topbar{height:64px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-bottom:1px solid var(--border);background:var(--bg);flex-shrink:0;gap:12px}
.topbar h1{font-family:var(--font);font-size:1.25rem;font-weight:700;letter-spacing:-.01em;color:var(--text)}
.topbar .sub{font-size:.75rem;color:var(--muted);font-weight:500}
.top-actions{display:flex;align-items:center;gap:16px;color:var(--muted)}
.top-actions i{cursor:pointer;font-size:1.25rem}
.top-actions i:hover{color:var(--primary)}
.top-actions i.danger{color:var(--danger)}
.branch-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 16px;border-bottom:1px solid var(--border);background:var(--surface-low);font-size:.8rem;font-weight:600;flex-shrink:0;min-width:0}
#branch-select-wrapper{min-width:0;display:flex;align-items:center;gap:8px}
.cms-branch-display{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.cms-branch-select{width:auto;max-width:min(240px,100%);border:1px solid var(--border);border-radius:4px;padding:6px 8px;background:var(--surface)}

.content-area{flex:1;min-height:0;overflow:auto;-webkit-overflow-scrolling:touch;padding:14px;padding-bottom:calc(var(--bottom) + 12px)}
.tab-content{display:none}
.tab-content.active{display:block}
.tab-toolbar{display:flex;margin-bottom:16px;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:8px;gap:8px;flex-wrap:wrap;align-items:center;min-width:0}
.search-wrap{flex:1 1 180px;display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:4px;padding:0 12px;background:var(--surface);min-width:0;height:40px;overflow:hidden}
.search-wrap i{flex-shrink:0;color:var(--muted);font-size:.85rem;width:1em;text-align:center}
.search-wrap input{border:0;outline:none;padding:0;flex:1 1 auto;width:auto;min-width:0;background:transparent;font-size:.875rem}
.list-filter{height:40px;width:auto;border:1px solid var(--border);border-radius:4px;padding:0 10px;background:var(--surface);color:var(--text);font-size:.8rem;font-weight:600;min-width:108px;max-width:160px;cursor:pointer;flex:0 1 auto}
.list-filter-row{display:flex;gap:8px;width:auto;flex-wrap:nowrap;flex:0 1 auto;min-width:0;align-items:center}

/* Stock / menu lists — mobile cards (Stitch mobile) */
.stock-panel{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden}
#ingList,#prodList{display:flex;flex-direction:column;overflow:visible;max-height:none}
/* page scrolls; panel itself clips cards to the rounded corners */
.stock-table-wrap,#tab-stock,#tab-menu{overflow:visible;max-height:none}
.item-card{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:12px 14px;background:var(--surface);border:0;border-bottom:1px solid var(--border);border-radius:0;cursor:pointer;
}
.item-card:last-child{border-bottom:0}
.item-card:hover{background:var(--sage-wash)}
.item-card.menu-selected,.item-card.selected{background:var(--sage-wash);box-shadow:inset 3px 0 0 var(--primary)}
.item-card .info{min-width:0;flex:1}
.item-card .name{display:block;font-weight:600;font-size:.9375rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.item-card .meta{display:block;font-size:.75rem;color:var(--muted);margin-top:3px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.3}
.item-card .code-chip{font-size:.72rem;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--outline)}
.item-card .price-info{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:4px;text-align:right;flex-shrink:0}
.item-card .val{font-weight:700;font-variant-numeric:tabular-nums;font-size:.9rem;line-height:1.2}
.item-card .unit{display:block;font-size:.7rem;color:var(--muted)}
.item-card .badge{display:inline-block;border-radius:999px;padding:2px 8px;font-size:.65rem;font-weight:700}
.item-card .badge.success{background:var(--sage-wash);color:var(--primary)}
.item-card .badge.danger{background:#ffdad6;color:#93000a}
.item-card .badge.virtual,.badge.virtual{
  display:inline-block;border-radius:999px;padding:2px 8px;font-size:.65rem;font-weight:700;
  background:color-mix(in srgb,var(--warning) 18%,var(--surface));
  color:var(--warning);
  border:1px solid color-mix(in srgb,var(--warning) 35%,var(--border));
  vertical-align:middle;
}
.card-edit-btn{border:0;background:var(--surface-low);width:32px;height:32px;border-radius:8px;cursor:pointer;color:var(--muted);flex-shrink:0;margin-right:4px}
.cat-pill{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:600;background:var(--surface-high);color:var(--text)}

/* Unified data tables (stock + cost) */
.stock-table-wrap{display:none;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:visible}
.stock-table,.cost-table{width:100%;border-collapse:collapse;text-align:left;font-size:var(--fs);font-family:var(--font)}
.stock-table{min-width:720px}
.stock-table thead{position:sticky;top:0;background:var(--surface-low);z-index:1}
.cost-table thead{position:static;background:var(--surface-low)}
.stock-table th,.cost-table th{
  padding:10px 12px;font-size:var(--fs-sm);font-weight:600;color:var(--muted);
  border-bottom:1px solid var(--border);text-transform:uppercase;letter-spacing:.04em;
}
.stock-table td,.cost-table td{
  padding:10px 12px;font-size:var(--fs);border-bottom:1px solid var(--border);vertical-align:middle;
}
.cost-table .cost-row-sub{font-size:var(--fs-sm);color:var(--muted);font-weight:500;margin-top:2px}
.recipe-item .ri-name{font-size:var(--fs);font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.recipe-item .ri-meta{font-size:var(--fs-sm);font-weight:500;color:var(--muted);margin-top:2px}
.recipe-item-empty{font-size:var(--fs-sm);color:var(--muted);font-weight:600;padding:10px 0}
.live-sell-box{margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}
.live-sell-box .live-sell-input-row{margin-bottom:10px}
.live-pnl.is-profit{color:var(--success)!important}
.live-pnl.is-loss{color:var(--danger)!important}
.live-pnl.is-flat{color:var(--muted)!important}
.stock-table tbody tr{cursor:pointer;height:42px}
.stock-table tbody tr:hover,.stock-table tbody tr.is-active{background:var(--sage-wash)}
.stock-table .mono,.cost-table .num,.stock-table .price{font-variant-numeric:tabular-nums;font-weight:500}
.stock-table .price{text-align:right;font-weight:600}
.cost-table .num{text-align:right}
.total-row td{background:var(--sage-wash);font-weight:700}
.branch-tag{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 4px;border-radius:4px;background:var(--surface-container);font-size:10px;font-weight:700;color:var(--muted);margin-right:4px}

.workspace-empty{text-align:center;padding:48px 16px;color:var(--muted);font-size:var(--fs)}
.workspace-empty-icon{font-size:2rem;opacity:.5;display:block;margin-bottom:12px}
.workspace-product-title{font-family:var(--font);font-size:1.25rem;font-weight:700;letter-spacing:-.01em;margin-bottom:12px}
.workspace-product-title.is-empty{opacity:.45}
.workspace-product-title--mobile{display:block}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px;margin-bottom:12px}
.ws-section-title{font-size:var(--fs-sm);font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.ws-yield-desc{font-size:var(--fs-sm);color:var(--muted)}
.rb-yield-input{width:88px;text-align:center}
.recipe-toolbar{display:flex;gap:8px;margin-bottom:12px;align-items:center;min-width:0;position:relative}
.recipe-toolbar .search-wrap{flex:1 1 auto;min-width:0}
.btn-wa-import{border:1px solid #25d366;color:#128c7e;background:transparent;border-radius:var(--radius);padding:10px 12px;font-weight:700;cursor:pointer;white-space:nowrap;height:40px}
.recipe-search{position:static;flex:1 1 auto;min-width:0}
.rb-search-results{
  position:absolute;z-index:80;left:0;right:0;top:calc(100% + 6px);width:auto;
  max-height:320px;overflow:auto;
  background:#ffffff;border:2px solid #004438;border-radius:var(--radius);
  box-shadow:0 18px 40px rgba(0,30,24,.35);
}
body.dark .rb-search-results{background:#1f2324;border-color:#bfc7c8;box-shadow:0 18px 40px rgba(0, 0, 0,.55)}
.rb-search-head{
  position:sticky;top:0;z-index:1;padding:8px 12px;
  font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:#ffffff;background:#004438;border-bottom:0;
}
body.dark .rb-search-head{background:#495455;color:#ffffff}
.rb-hit{
  display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;text-align:left;
  border:0;border-bottom:1px solid #d7ddd9;background:#ffffff;
  padding:10px 12px;cursor:pointer;color:#191c1b;
}
.rb-hit:nth-child(even){background:#f3f7f5}
.rb-hit:hover,.rb-hit:focus{background:#dceae4;outline:none}
body.dark .rb-hit{background:#1f2324;color:#f2f4f1;border-bottom-color:#373e3f}
body.dark .rb-hit:nth-child(even){background:#292e2f}
body.dark .rb-hit:hover,body.dark .rb-hit:focus{background:#3a4242}
.rb-hit-main{flex:1;min-width:0}
.rb-hit-name{display:block;font-weight:700;font-size:var(--fs);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text)}
.rb-hit-meta{display:block;margin-top:3px;font-size:.72rem;font-weight:600;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rb-hit-side{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0;min-width:72px}
.rb-hit-unit{
  background:var(--primary-container);color:#fff;border-radius:999px;
  padding:3px 8px;font-size:.68rem;font-weight:700;letter-spacing:.03em;
}
.rb-hit-code{font-size:.68rem;font-weight:700;color:var(--muted);letter-spacing:.02em}
.rb-search-empty{padding:12px;font-size:var(--fs-sm);font-weight:600;color:var(--muted)}
.recipe-cart{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px}
.recipe-cart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.rb-cart-count{color:var(--primary-container);font-weight:700;font-size:var(--fs-sm)}
.workspace-action-row{display:flex;gap:8px;margin-top:12px}
.workspace-action-row .btn,.workspace-action-row .btn-secondary{flex:1;width:auto}
.cost-params-row{display:flex;flex-wrap:nowrap;gap:10px;align-items:flex-end;margin-bottom:14px}
.cost-params-row .form-group{flex:1 1 0;margin:0;min-width:0}
.form-group{margin-bottom:14px}
.form-group label{display:block;font-size:var(--fs-sm);font-weight:700;color:var(--muted);margin-bottom:6px;letter-spacing:.04em;text-transform:uppercase}
.form-group .input, .form-group select, .form-group textarea{display:block;width:100%}
.summary-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:14px;margin-bottom:12px}
.summary-line{display:flex;justify-content:space-between;gap:12px;padding:8px 0;font-size:var(--fs);border-bottom:1px solid color-mix(in srgb,var(--border) 70%,transparent)}
.summary-line:last-child{border-bottom:0}
.price-hero{margin-top:8px;padding:14px;border-radius:var(--radius);background:linear-gradient(135deg,var(--sage-wash),color-mix(in srgb,var(--primary-container) 12%,var(--surface)));border:1px solid color-mix(in srgb,var(--primary-container) 25%,var(--border))}
.big-val,#cFinalPrice{font-family:var(--font);font-size:1.5rem;font-weight:700;color:var(--primary);letter-spacing:-.02em}
.desktop-side-tabs,.desktop-side-header,#deskProductTitle{display:none!important}
#deskProductTitle.is-empty{opacity:.45}

.bottom-nav{position:absolute;left:0;right:0;bottom:0;height:var(--bottom);background:rgba(255,255,255,.92);backdrop-filter:blur(16px);border-top:1px solid var(--border);display:flex;justify-content:center;z-index:50;padding:10px 12px 18px}
body.dark .bottom-nav{background:rgba(29, 33, 33,.92)}
.nav-inner{position:relative;display:flex;width:100%;max-width:480px;justify-content:space-around;align-items:center}
.nav-indicator{display:none}
.nav-item{border:0;background:transparent;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 14px;font-size:.62rem;font-weight:700;letter-spacing:.04em;cursor:pointer;border-radius:16px;min-width:64px}
.nav-item i{font-size:1.2rem}
.nav-item.active{background:var(--primary-container);color:#fff}
.nav-item.nav-perm-hide,.desk-nav-btn.nav-perm-hide{display:none!important}
body.branch-no-cost .col-unit-price{display:none!important}
body.branch-no-cost #tab-cost,
body.branch-ops #tab-label{display:none!important}
body.branch-no-cost #deskTabCost{display:none!important}
.desktop-side-tabs.desk-tabs-recipe-only #deskTabCost{display:none!important}
.desktop-side-tabs.desk-tabs-recipe-only{grid-template-columns:1fr}

.modal{display:none;position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.45);align-items:flex-end;justify-content:center;padding:0}
.modal.active{display:flex}
.modal{padding:12px}
.modal-content{background:var(--surface);width:clamp(280px,92vw,560px);min-width:0;max-width:560px;max-height:min(88vh,860px);overflow:auto;border-radius:14px;padding:16px 18px;border:1px solid var(--border);margin:auto;box-shadow:0 12px 40px rgba(0,0,0,.18)}
@media(min-width:480px){.modal-content{min-width:min(420px,92vw)}}
.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;gap:12px;padding-bottom:2px}
.modal-title{font-family:var(--font);font-weight:700;font-size:1.05rem}
.modal-close{border:0;background:transparent;font-size:1.35rem;cursor:pointer;color:var(--muted);line-height:1;flex-shrink:0}
.modal .form-group{margin-bottom:10px}
.modal .form-group label{margin-bottom:4px;font-size:.68rem}
.modal .input,.modal select,.modal textarea{padding:10px 12px;font-size:.875rem}
.modal .flex-row{gap:10px;align-items:flex-end;flex-wrap:wrap;margin-bottom:2px}
.modal .flex-row > .form-group{min-width:120px;flex:1 1 140px;margin-bottom:10px}
.modal .flex-row > .btn,.modal .flex-row > button{flex:1 1 110px;min-width:96px;width:auto!important;margin-top:2px;padding:11px 14px;font-size:.8125rem}
.modal #f-calorie-group{align-items:flex-end}
.modal #f-calorie-group .btn{width:auto!important;flex:0 0 auto;padding:8px 12px;height:40px}
.toast.warning.inline{display:flex;align-items:center;gap:8px}
.allowed-chip{border:1px solid var(--border);background:var(--bg);border-radius:999px;padding:6px 10px;font-size:.72rem;font-weight:700;cursor:pointer}
.allowed-chip.active{background:var(--primary-container);border-color:var(--primary-container);color:#fff}
.allowed-chip:disabled{opacity:.5;cursor:not-allowed}

.desk-only-col-head{display:none}
.ws-panel{min-width:0}

@media(min-width:768px){
  /* Fixed shell: viewport height; only list / page body scrolls */
  html,body,#appView{height:100%;height:100dvh;max-height:100dvh;overflow:hidden}
  #appView.active{height:100%;height:100dvh}
  .main{height:100%;max-height:100%;overflow:hidden}
  .sidebar{display:flex;height:100%;max-height:100%;overflow:hidden}
  .bottom-nav,.nav-desk-hide,.mobile-logout,.mobile-only{display:none!important}
  .top-actions #theme-toggle-btn{display:none}
  .content-area{
    padding:16px 24px 24px;padding-bottom:24px;
    overflow:hidden;display:flex;flex-direction:column;min-height:0;flex:1;
  }
  .content-area > .tab-content{display:none;flex:1;min-height:0;flex-direction:column}
  .content-area > .tab-content.active{display:flex}
  .workspace-product-title--mobile{display:block}
  .modal{align-items:center;justify-content:center;padding:24px}
  .modal-content{border-radius:16px;min-width:420px;max-width:min(720px,92vw)}
  .topbar{background:var(--bg);padding:0 24px;flex-shrink:0}
  .branch-bar{padding:8px 24px;flex-shrink:0}

  /* Legacy split chrome — unused on PC full pages */
  .desktop-side-tabs,#deskProductTitle{display:none!important}

  #tab-stock.active,
  #tab-menu.active{
    display:grid!important;
    grid-template-columns:272px minmax(0,1fr);
    grid-template-rows:minmax(0,1fr);
    gap:16px;
    align-items:stretch;
    min-height:0;
  }
  #tab-stock .stock-panel{display:none}
  #tab-stock .tab-toolbar,
  #tab-menu .tab-toolbar{
    display:flex;flex-direction:column;align-items:stretch;align-content:flex-start;
    flex-wrap:nowrap;gap:10px;margin:0;padding:14px;min-height:0;height:100%;max-height:100%;overflow:auto;
  }
  #tab-stock .tab-toolbar .search-wrap,
  #tab-menu .tab-toolbar .search-wrap{
    flex:0 0 auto;width:100%;min-width:0;max-width:none;height:40px;
  }
  #tab-stock .list-filter-row,
  #tab-menu .list-filter-row{
    flex-direction:column;width:100%;flex:0 0 auto;gap:10px;
  }
  #tab-stock .list-filter,
  #tab-menu .list-filter{
    width:100%;max-width:none;min-width:0;flex:0 0 auto;height:40px;
  }
  #tab-stock .btn-add,
  #tab-menu .btn-add{
    width:100%;flex:0 0 auto;height:40px;justify-content:center;
  }
  #tab-stock .stock-table-wrap{
    display:block;min-width:0;min-height:0;height:100%;overflow:auto;
    border:1px solid var(--border);border-radius:8px;background:var(--surface);
  }
  #tab-stock .stock-table{min-width:0;width:100%}

  #tab-menu .stock-panel{
    min-width:0;min-height:0;height:100%;overflow:auto;display:flex;flex-direction:column;
    border:1px solid var(--border);border-radius:8px;
  }
  #tab-menu #prodList{overflow:visible;max-height:none;flex:0 0 auto}

  #tab-recipe.active,#tab-cost.active{overflow:auto;-webkit-overflow-scrolling:touch}
  #tab-label.active{overflow:hidden;min-height:0}
  #tab-label .label-page{flex:1;min-height:0;height:100%;width:100%}
  #tab-label .label-workspace{min-height:0}
}

/* Wide PC: Recipe | Cost | Price — equal columns */
@media(min-width:1100px){
  .desk-only-col-head{
    display:block;font-family:var(--font);font-size:0.8125rem;font-weight:700;
    letter-spacing:.06em;text-transform:uppercase;margin:0 0 12px;color:var(--muted);
  }
  .content-area.desk-workspace-mode{
    display:grid!important;
    grid-template-columns:1fr 1fr 1fr;
    grid-template-rows:auto 1fr;
    gap:12px;
    overflow:hidden;
    align-content:stretch;
  }
  .content-area.desk-workspace-mode > #deskProductTitle{
    display:block!important;grid-column:1 / -1;grid-row:1;margin:0;
    font-family:var(--font);font-size:1.25rem;font-weight:700;
  }
  .content-area.desk-workspace-mode > #desktopSideTabs,
  .content-area.desk-workspace-mode > #tab-stock,
  .content-area.desk-workspace-mode > #tab-menu{display:none!important}

  .content-area.desk-workspace-mode > #tab-recipe{
    display:flex!important;flex-direction:column;grid-column:1;grid-row:2;
    min-height:0;overflow:auto;padding:14px;background:var(--surface);
    border:1px solid var(--border);border-radius:var(--radius);
  }
  .content-area.desk-workspace-mode > #tab-recipe .workspace-product-title--mobile{display:none!important}

  .content-area.desk-workspace-mode > #tab-cost{
    display:contents;
  }
  .content-area.desk-workspace-mode > #tab-cost > #costEmpty{
    grid-column:2 / -1;grid-row:2;min-height:0;overflow:auto;
    background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);
  }
  .content-area.desk-workspace-mode > #tab-cost > #costDashboard.hidden{display:none!important}
  .content-area.desk-workspace-mode > #tab-cost > #costDashboard:not(.hidden){
    display:contents;
  }
  .content-area.desk-workspace-mode #mobileCostTitle{display:none!important}

  .content-area.desk-workspace-mode .ws-panel-cost,
  .content-area.desk-workspace-mode .ws-panel-price{
    grid-row:2;min-height:0;overflow:auto;padding:14px;background:var(--surface);
    border:1px solid var(--border);border-radius:var(--radius);
  }
  .content-area.desk-workspace-mode .ws-panel-cost{grid-column:2}
  .content-area.desk-workspace-mode .ws-panel-price{grid-column:3}
  /* Price inputs stay in one row on wide PC */
  .content-area.desk-workspace-mode .cost-params-row{
    display:flex;flex-wrap:nowrap;gap:8px;align-items:flex-end;margin-bottom:12px;
  }
  .content-area.desk-workspace-mode .cost-params-row .form-group{
    flex:1 1 0;min-width:0;margin:0;
  }
  .content-area.desk-workspace-mode .cost-params-row .form-group label{
    font-size:0.65rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  .content-area.desk-workspace-mode .cost-params-row .input{padding:10px 8px;font-size:0.8125rem}
  .content-area.desk-workspace-mode.desk-workspace-no-cost{
    grid-template-columns:1fr;
  }
  .content-area.desk-workspace-mode.desk-workspace-no-cost > #tab-recipe{grid-column:1}
}

/* Mid desktop (tablet landscape): keep single pages, no triple */
@media(min-width:768px) and (max-width:1099px){
  .desk-only-col-head{display:none!important}
}

.nf-label{background:#fff;color:#111;border:2px solid #111;border-radius:0;padding:8px 10px;margin:12px 0 4px;font-family:Arial,Helvetica,sans-serif;max-width:320px;line-height:1.2}
.nf-label.nf-dual{max-width:420px}
.nf-label h4{font-size:1.55rem;font-weight:900;letter-spacing:-.03em;border-bottom:10px solid #111;padding-bottom:2px;margin:0 0 4px;font-family:Arial Black,Arial,sans-serif;line-height:1}
.nf-servings{font-size:.78rem;font-weight:700;margin:0}
.nf-serving{font-size:.85rem;font-weight:700;padding-bottom:4px;border-bottom:1px solid #111;margin-bottom:2px}
.nf-cols{display:grid;grid-template-columns:1fr auto auto;gap:4px 8px;font-size:.68rem;font-weight:700;border-bottom:4px solid #111;padding:2px 0 4px;text-align:right}
.nf-cols span:first-child{text-align:left}
.nf-cals{display:flex;justify-content:space-between;align-items:baseline;font-weight:900;border-bottom:4px solid #111;padding:2px 0 4px;margin-bottom:2px}
.nf-cals .nf-cals-label{font-size:1.05rem}
.nf-cals .nf-cals-val{font-size:2rem;line-height:1}
.nf-cals.nf-cals-dual{display:grid;grid-template-columns:1fr auto auto;gap:4px 8px;align-items:end}
.nf-cals.nf-cals-dual .nf-cals-val{font-size:1.55rem;text-align:right}
.nf-dvhead{display:flex;justify-content:flex-end;font-size:.72rem;font-weight:700;border-bottom:4px solid #111;padding:2px 0}
.nf-row{display:flex;justify-content:space-between;gap:8px;padding:2px 0;border-bottom:1px solid #bbb;font-size:.78rem}
.nf-row.nf-dual-row{display:grid;grid-template-columns:1fr auto auto;gap:4px 8px}
.nf-row.nf-dual-row > span{text-align:right;font-variant-numeric:tabular-nums}
.nf-row.nf-dual-row > .nf-name{text-align:left}
.nf-row.thick{border-bottom-width:4px;border-bottom-color:#111}
.nf-row.bar{border-bottom:8px solid #111}
.nf-row.indent{padding-left:12px;font-weight:400}
.nf-row.indent2{padding-left:22px;font-weight:400}
.nf-row b{font-weight:700}
.nf-micro{border-top:4px solid #111;margin-top:2px}
.nf-dv{font-size:.62rem;color:#333;margin-top:6px;line-height:1.3;border-top:1px solid #111;padding-top:4px}
.nf-ai-seal{
  margin-top:8px;padding:8px;border:2px dashed #b45309;background:#fff7ed;color:#9a3412;
  font-size:.65rem;line-height:1.35;font-weight:700;text-align:center;text-transform:uppercase;letter-spacing:.03em;
}
.nf-actions{display:flex;gap:8px;margin-top:8px;max-width:420px}
.nf-actions .btn,.nf-actions .btn-secondary{flex:1;width:auto;padding:10px 12px;font-size:.75rem}
.ai-sticker{
  display:flex;gap:10px;align-items:flex-start;margin-top:16px;padding:12px 14px;
  border:1px dashed color-mix(in srgb,var(--warning) 55%,var(--border));
  background:color-mix(in srgb,var(--warning) 10%,var(--surface));border-radius:var(--radius);color:var(--text);
}
.ai-sticker i{color:var(--warning);font-size:1.1rem;margin-top:2px}
.ai-sticker strong{display:block;font-size:.8rem;margin-bottom:4px;color:var(--warning)}
.ai-sticker span{font-size:.72rem;line-height:1.4;color:var(--muted);font-weight:500}

/* WhatsApp recipe import modal */
.wa-modal-box{max-width:min(720px,96vw)!important;width:min(720px,96vw)!important}
.wa-help{font-size:.82rem;color:var(--muted);margin-bottom:10px;line-height:1.4}
.wa-textarea{min-height:180px;font-size:.875rem;line-height:1.45;resize:vertical}
.wa-summary{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px}
.wa-chip{display:inline-flex;align-items:center;gap:6px;padding:3px 8px;border-radius:999px;font-size:.68rem;font-weight:700;border:1px solid var(--border);background:var(--surface-low)}
.wa-chip.ok{background:color-mix(in srgb,var(--success) 14%,var(--surface));color:var(--success);border-color:color-mix(in srgb,var(--success) 35%,var(--border))}
.wa-chip.miss{background:color-mix(in srgb,var(--warning) 14%,var(--surface));color:var(--warning);border-color:color-mix(in srgb,var(--warning) 40%,var(--border))}
.wa-miss-note{font-size:.75rem;color:var(--muted);margin:0 0 8px;line-height:1.35}
.wa-lines{max-height:min(48vh,420px);overflow:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
.wa-line{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) 72px 96px minmax(120px,1fr) 92px;
  gap:8px;align-items:center;
  padding:7px 10px;border-bottom:1px solid var(--border);
}
.wa-line:last-child{border-bottom:0}
.wa-line.is-match{background:color-mix(in srgb,var(--success) 6%,transparent)}
.wa-line.is-miss{background:color-mix(in srgb,var(--warning) 8%,transparent)}
.wa-line-head{
  position:sticky;top:0;z-index:1;
  background:var(--surface-low);color:var(--muted);
  font-size:.66rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  padding:6px 10px;
}
.wa-line-text{display:flex;gap:8px;align-items:flex-start;min-width:0}
.wa-line-no{flex:0 0 1.5rem;font-variant-numeric:tabular-nums;color:var(--muted);font-weight:700;font-size:.75rem;line-height:1.25}
.wa-line-name{font-weight:700;font-size:.84rem;line-height:1.25;word-break:break-word}
.modal .wa-line .wa-qty,
.modal .wa-line .wa-unit{
  width:100%;height:30px;margin:0;padding:0 8px;
  border:1px solid var(--border);border-radius:8px;
  background-color:var(--surface);color:var(--text);
  font-size:.8rem;line-height:28px;box-sizing:border-box;
}
.modal .wa-line .wa-qty{text-align:center;font-variant-numeric:tabular-nums}
.modal .wa-line .wa-unit{
  appearance:none;-webkit-appearance:none;
  padding:0 26px 0 10px;text-align:left;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'><path d='M1 1l4 4 4-4' fill='none' stroke='%23707975' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;
  background-position:right 8px center;
  background-size:10px 6px;
}
.wa-stock-name{font-weight:700;font-size:.8rem;line-height:1.25;word-break:break-word}
.wa-stock-name.is-miss{color:var(--warning)}
.wa-stock-code{display:block;margin-top:1px;font-size:.66rem;font-weight:600;color:var(--muted)}
.wa-lookup-btn{
  height:30px;width:auto;padding:0 8px;border-radius:8px;
  border:1px solid var(--border);background:var(--surface);color:var(--text);
  font-size:.7rem;font-weight:700;cursor:pointer;white-space:nowrap;
  display:inline-flex;align-items:center;justify-content:center;gap:5px;
  justify-self:end;
}
.wa-lookup-btn:hover,.wa-lookup-btn:focus{background:var(--surface-high);outline:none}
.wa-footer-actions{margin-top:12px}
.wa-lookup-box{max-width:min(440px,96vw)!important;width:min(440px,96vw)!important}
.wa-lookup-search{margin-bottom:8px}
.wa-lookup-list{max-height:min(52vh,420px);overflow:auto;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface)}
.wa-lookup-item{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:7px 10px;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--text);text-align:left;cursor:pointer;font:inherit}
.wa-lookup-item:last-child{border-bottom:0}
.wa-lookup-item:hover,.wa-lookup-item:focus{background:var(--surface-low);outline:none}
.wa-lookup-item .wa-lu-name{font-weight:700;font-size:.82rem}
.wa-lookup-item .wa-lu-meta{font-size:.66rem;color:var(--muted);margin-top:1px}
.wa-lookup-empty{padding:20px 12px;text-align:center;color:var(--muted);font-size:.8rem}
@media(max-width:720px){
  .wa-modal-box{max-width:100%!important;width:100%!important}
  .wa-line-head{display:none}
  .wa-line{
    grid-template-columns:72px 96px minmax(0,1fr) auto;
    grid-template-areas:"name name name name" "qty unit stock btn";
  }
  .wa-line-text{grid-area:name}
  .wa-qty{grid-area:qty}
  .wa-unit{grid-area:unit}
  .wa-stock{grid-area:stock}
  .wa-lookup-btn{grid-area:btn}
}

.label-status-log{
  margin:0;padding:8px 10px;border-radius:var(--radius-sm);
  border:1px solid var(--border);background:var(--surface-low);
  color:var(--text);font-size:.75rem;font-weight:600;
  line-height:1.35;white-space:normal;word-break:break-word;
}
.label-status-log.is-error{border-color:color-mix(in srgb,var(--danger) 45%,var(--border));background:color-mix(in srgb,var(--danger) 8%,var(--surface))}
.label-status-log.is-ok{border-color:color-mix(in srgb,var(--success) 40%,var(--border));background:color-mix(in srgb,var(--success) 8%,var(--surface))}
.cal-portion-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  margin-top:2px;padding:10px 12px;border-radius:10px;border:1.5px dashed color-mix(in srgb,var(--primary) 45%,var(--border));
  background:color-mix(in srgb,var(--primary) 8%,var(--surface));color:var(--primary);
  font:inherit;text-align:left;cursor:pointer;transition:background .15s,border-color .15s,color .15s
}
.cal-portion-row:hover{background:color-mix(in srgb,var(--primary) 14%,var(--surface))}
.cal-portion-row:disabled{opacity:.75;cursor:wait}
.cal-portion-label{display:flex;align-items:center;gap:8px;font-weight:700;font-size:var(--fs)}
.cal-portion-hint{font-size:var(--fs-sm);font-weight:600;opacity:.7;text-transform:uppercase;letter-spacing:.04em}
.cal-portion-value-wrap{display:inline-flex;align-items:center;gap:8px}
.cal-portion-value{font-weight:800;font-variant-numeric:tabular-nums;font-size:var(--fs-lg)}
.cal-portion-spin{font-size:.85rem}
.cal-portion-row.is-idle{color:var(--primary)}
.cal-portion-row.is-loading{
  border-style:solid;
  border-color:color-mix(in srgb,#c9a227 70%,var(--border));
  background:color-mix(in srgb,#eab308 16%,var(--surface));
  color:#a16207
}
body.dark .cal-portion-row.is-loading{
  border-color:color-mix(in srgb,#d3ba69 55%,var(--border));
  background:color-mix(in srgb,#d3ba69 14%,var(--surface));
  color:#e0d194
}
.cal-portion-row.is-ok{
  border-style:solid;border-color:color-mix(in srgb,var(--success) 50%,var(--border));
  background:color-mix(in srgb,var(--success) 10%,var(--surface));color:var(--success)
}
.cal-portion-row.is-ok .cal-portion-hint{opacity:.85}
.cal-portion-row.is-error{
  border-style:solid;border-color:color-mix(in srgb,var(--danger) 55%,var(--border));
  background:color-mix(in srgb,var(--danger) 8%,var(--surface));color:var(--danger)
}
.cal-portion-row.is-error .cal-portion-hint{opacity:.9}
.label-page{display:flex;flex-direction:column;gap:12px;min-height:0;flex:1;width:100%}
.label-picker-col{display:flex;flex-direction:column;gap:10px;min-height:0;flex:0 0 auto}
.label-search-top{flex:0 0 auto;width:100%;height:40px}
.label-picker{display:flex;flex-direction:column;min-height:0;flex:0 0 auto;margin-bottom:0}
.label-product-list{max-height:160px;overflow:auto;border:1px solid var(--border);border-radius:var(--radius-sm);flex:0 1 auto;min-height:0}
.label-product-list .item-card{cursor:pointer}
.label-side-actions{display:flex;flex-direction:column;gap:8px;flex:0 0 auto}
.label-side-actions .btn{width:100%}
.label-note-label{font-size:.72rem;font-weight:700;color:var(--muted);line-height:1.35}
.label-note{width:100%;min-height:92px;max-height:180px;resize:vertical;border:1px solid var(--border);border-radius:8px;padding:8px 10px;font:inherit;font-size:.8rem;line-height:1.4;background:var(--bg);color:var(--text)}
.label-cal-table tr.is-suspect td{background:color-mix(in srgb,var(--danger) 10%,var(--surface));color:var(--danger)}
.label-workspace{display:flex;flex-direction:column;min-height:0;overflow:auto}
.label-result-row{display:grid;grid-template-columns:minmax(280px,360px) minmax(0,1fr);align-items:start;gap:16px}
.label-result-row .nf-label{margin:0}
.label-cal-board{min-width:0;width:100%;align-self:start;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);overflow:auto}
.label-cal-board .ws-section-title{margin:0;padding:10px 12px;border-bottom:1px solid var(--border);background:var(--surface-low)}
.label-cal-table{width:100%;border-collapse:collapse;font-size:var(--fs)}
.label-cal-table th{text-align:left;padding:8px 10px;font-size:.68rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);border-bottom:1px solid var(--border)}
.label-cal-table td{padding:8px 10px;border-bottom:1px solid var(--border);vertical-align:middle}
.label-cal-table td.num,.label-cal-table th.num{text-align:right;font-variant-numeric:tabular-nums}
.label-cal-table tr:last-child td{border-bottom:0}
.label-cal-table .total-row td{background:var(--sage-wash);font-weight:700}
#nutritionFactsPanel{display:block;margin-top:0;align-self:start}
#nutritionFactsPanel.hidden{display:none!important}
@media(min-width:768px){
  .label-page{
    display:grid;grid-template-columns:272px minmax(0,1fr);grid-template-rows:minmax(0,1fr);
    gap:16px;align-items:stretch;flex:1;min-height:0;height:100%;
  }
  .label-picker-col{
    margin:0;align-self:stretch;min-height:0;max-height:100%;overflow:auto;
    padding:14px;background:var(--surface);border:1px solid var(--border);border-radius:8px;
  }
  .label-workspace{
    margin:0;min-height:0;max-height:100%;overflow:auto;align-self:stretch;
    padding:16px 18px;
  }
  .label-picker{flex:1 1 auto;min-height:0;overflow:hidden;margin:0;padding:0;border:0;background:transparent;box-shadow:none}
  .label-product-list{max-height:none;flex:1 1 auto;min-height:0}
  .label-workspace.card{margin:0}
}
@media(max-width:767px){
  .label-result-row{grid-template-columns:1fr}
}
body.dark .nf-label{background:#fafafa;color:#111111}
body.dark .nf-ai-seal{background:#fbf8f3;color:#8b4128}
#printArea{display:none!important}

/* PDF preview modal */
#pdfPreviewModal .modal-content{max-width:992px;width:min(992px,76.8vw);max-height:92vh;display:flex;flex-direction:column;padding-bottom:12px;overflow:hidden}
.pdf-preview-toolbar{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin-bottom:10px}
.pdf-preview-toolbar .pdf-hint{font-size:.75rem;color:var(--muted);font-weight:600}
.pdf-preview-scroll{flex:1;min-height:0;overflow:auto;border:1px solid var(--border);border-radius:8px;background:#e8ebe9;padding:16px}
.pdf-preview-actions{display:flex;gap:8px;margin-top:12px}
#pdfPreviewModal.is-brief .modal-content{height:auto;width:min(880px,76.8vw);max-width:880px;padding:8px 10px 10px}
#pdfPreviewModal.is-brief .modal-header{display:none}
#pdfPreviewModal.is-brief .pdf-preview-toolbar{display:none}
#pdfPreviewModal.is-brief .pdf-preview-scroll{flex:0 1 auto;max-height:calc(92vh - 64px);padding:12px;overflow:auto;background:#d7ddd9;border:1px solid #c5cfc9}
#pdfPreviewModal.is-brief .pdf-preview-actions{margin-top:8px}
.pdf-preview-actions .btn{width:auto;flex:1}

/* Sheet design (preview + PDF capture) — always light for print fidelity */
.pdf-sheet{
  background:#fff;color:#111;width:100%;max-width:none;margin:0 auto;
  padding:14px 16px;font-family:'DM Sans',system-ui,sans-serif;box-shadow:0 8px 28px rgba(0,0,0,.12);
}
.pdf-sheet *{color:inherit;box-sizing:border-box}
.pdf-sheet .pdf-brand{font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#004438;margin-bottom:2px}
.pdf-sheet .pdf-title{font-size:16px;font-weight:800;letter-spacing:-.02em;margin:0 0 1px;color:#111}
.pdf-name-box{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 8px;padding:8px 10px;border:1px solid #111;background:#fff}
.pdf-name-box .pdf-title{margin:0;font-size:15px}
.pdf-name-box .pdf-sell{font-size:16px;font-weight:800;color:#004438;white-space:nowrap}
.pdf-ing-col{flex:1 1 auto;min-width:0}
.pdf-name-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pdf-sheet .pdf-name-tag{width:auto;padding:6px 10px;border:1px solid #004438;border-radius:999px;background:#fff;color:#004438;font-weight:600;font-size:12px;cursor:pointer;font-family:'DM Sans',system-ui,sans-serif}
.pdf-sheet.pdf-brief{width:100%;height:auto;padding:10px 12px;margin:0;box-sizing:border-box;box-shadow:0 2px 12px rgba(0,0,0,.14);background:#fff;direction:ltr}
.brief-fit{width:100%}
.pdf-sheet.pdf-brief .brief-name{font-size:20px;font-weight:800;color:#111;line-height:1.15;margin:0 0 12px;padding:0;border:0}
.brief-cols{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:12px;align-items:start}
.brief-recipe{grid-column:1;grid-row:1;border:1px solid #c5cfc9;border-radius:8px;padding:8px 10px;background:#fff}
.brief-facts{grid-column:2;grid-row:1;min-width:0}
.brief-bits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin-top:8px}
.brief-bits div{border:1px solid;border-radius:8px;padding:6px 8px}
.brief-bits span{display:block;font-size:10px;font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.brief-bits b{display:block;margin-top:1px;font-size:15px;font-weight:800;line-height:1.1}
.brief-bits .bit-kcal{border-color:#E87722;background:#FFF4EA}
.brief-bits .bit-kcal span,.brief-bits .bit-kcal b{color:#C65A00}
.brief-bits .bit-protein{border-color:#1565C0;background:#E8F2FC}
.brief-bits .bit-protein span,.brief-bits .bit-protein b{color:#1565C0}
.brief-bits .bit-fat{border-color:#E0A100;background:#FFF8E1}
.brief-bits .bit-fat span,.brief-bits .bit-fat b{color:#8A6200}
.brief-bits .bit-sugar{border-color:#C2185B;background:#FDEAF2}
.brief-bits .bit-sugar span,.brief-bits .bit-sugar b{color:#C2185B}
.brief-copy{margin-top:12px}
.brief-copy h4{margin:8px 0 2px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#004438}
.brief-copy h4:first-child{margin-top:0}
.brief-plain{margin:0 0 6px;font-size:13px;line-height:1.45;color:#191c1b;white-space:pre-wrap}
.brief-plain:last-child{margin-bottom:0}
.brief-extra,.brief-names{margin-top:10px;border:1px solid #c5cfc9;border-radius:8px;padding:8px 10px 10px;background:#fff}
.brief-extra h4,.brief-names h4{margin:0 0 6px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#004438}
.brief-extra-pad{min-height:56px}
.brief-name-row{display:flex;flex-wrap:wrap;gap:6px}
.brief-prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.brief-prices article{border:1px solid #004438;border-radius:8px;padding:8px 10px;background:#f7fbf9}
.brief-prices i{display:block;font-style:normal;font-size:11px;font-weight:800;letter-spacing:.03em;text-transform:uppercase;color:#004438}
.brief-prices b{display:block;margin:2px 0 0;font-size:18px;font-weight:800;color:#111;line-height:1.1}
.brief-prices .with-tax{display:block;margin:1px 0 4px;font-size:11px;font-weight:700;color:#004438}
.brief-prices em{display:block;font-style:normal;font-size:11px;font-weight:600;line-height:1.3;color:#4a5551}
.pdf-sheet.pdf-brief .nf-label{max-width:none;width:100%;margin:0;padding:6px 8px}
.pdf-sheet.pdf-brief .nf-label h4{font-size:1.2rem;border-bottom-width:6px;margin-bottom:2px}
.pdf-sheet.pdf-brief .nf-row{font-size:.74rem;padding:1px 0}
.pdf-sheet.pdf-brief .nf-cals .nf-cals-val{font-size:1.45rem}
.pdf-sheet.pdf-brief .nf-dv{font-size:.6rem;margin-top:4px}
.pdf-sheet.pdf-brief .nf-ai-seal{margin-top:4px;padding:4px;font-size:8px}
.pdf-sheet.pdf-brief .brief-recipe-table{font-size:13px;margin:0}
.pdf-sheet.pdf-brief .brief-recipe-table th,.pdf-sheet.pdf-brief .brief-recipe-table td{padding:5px 6px;text-align:left}
.pdf-sheet.pdf-brief .pdf-name-tag{padding:6px 10px;font-size:12px}
.name-input-row{display:flex;align-items:center;gap:8px}
.name-input-row .input{flex:1;min-width:0;width:auto}
.name-suggest-btn{width:auto!important;flex:0 0 auto;padding:8px 10px;font-size:.75rem;white-space:nowrap}
.name-note{margin-top:8px;min-height:52px;resize:vertical}
.name-suggest{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.name-suggest button{width:auto;text-align:center;padding:6px 10px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text);font-weight:600;cursor:pointer;font-size:.82rem}
.name-suggest button:hover{border-color:var(--primary)}
.pdf-sheet .pdf-sub{font-size:11px;font-weight:600;color:#4a5551;margin-bottom:8px}
.pdf-sheet .pdf-meta{display:grid;grid-template-columns:1fr 1fr;gap:3px 12px;padding:8px 10px;background:#f2f4f1;border:1px solid #bfc9c4;border-radius:6px;margin-bottom:10px;font-size:10px}
.pdf-sheet .pdf-meta strong{color:#004438;font-weight:700}
.pdf-sheet table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:10px}
.pdf-sheet thead th{background:#004438;color:#fff!important;text-align:left;padding:8px 10px;font-weight:700;font-size:11px;letter-spacing:.03em;text-transform:uppercase}
.pdf-sheet thead th.num{text-align:right}
.pdf-sheet tbody td{padding:8px 10px;border-bottom:1px solid #d7ddd9;vertical-align:middle}
.pdf-sheet tbody td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pdf-sheet tbody tr:nth-child(even){background:#f8faf7}
.pdf-sheet .pdf-summary{width:100%;max-width:280px;margin-left:auto;border:1px solid #bfc9c4;border-radius:6px;overflow:hidden;margin-bottom:8px}
.pdf-sheet .pdf-summary tr td{padding:5px 8px;border-bottom:1px solid #e7e9e6;font-size:10px}
.pdf-sheet .pdf-summary tr:last-child td{border-bottom:0;background:#e8f0ed;font-weight:800;color:#004438;font-size:11px}
.pdf-sheet .pdf-summary td:last-child{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.pdf-sheet .pdf-foot{margin-top:4px;padding-top:6px;border-top:1px solid #d7ddd9;font-size:9px;color:#707975;font-weight:600}
.pdf-sheet .pdf-empty{text-align:center;color:#707975;padding:12px;font-weight:600}
.pdf-sheet.pdf-label-wrap{max-width:none;padding:16px}
.pdf-label-pair{display:flex;flex-wrap:nowrap;align-items:flex-start;gap:28px;width:100%}
.pdf-label-pair .nf-label{flex:0 0 320px;width:320px;max-width:320px;margin:0}
.pdf-label-pair .label-cal-table{width:100%;min-width:0}
