:root{--demo-bg:#02050a;--demo-panel:#08111d;--demo-panel-2:#0c1827;--demo-line:rgba(255,255,255,.1);--demo-text:#f5f9fd;--demo-muted:#91a5b9;--demo-blue:#2f9fff;--demo-green:#35d397;--demo-orange:#ffad38;--demo-red:#ff6572}
*{box-sizing:border-box}.stock-demo-page{background:var(--demo-bg)!important;color:var(--demo-text);color-scheme:dark}.stock-demo-page main{background:radial-gradient(circle at 75% 0,rgba(27,108,220,.16),transparent 34%),var(--demo-bg)!important}.stock-demo-page.demo-lock{overflow:hidden}.stock-demo-shell{width:min(1220px,calc(100% - 36px));margin:0 auto;padding:52px 0 110px}.stock-demo-kicker{margin:0;color:#58b8fa;font-size:11px;font-weight:850;letter-spacing:.14em;text-transform:uppercase}
.stock-demo-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}.stock-demo-heading h1{margin:6px 0 8px;color:#f7fbff;font-size:clamp(38px,5vw,64px);line-height:1;letter-spacing:-.055em}.stock-demo-heading>div>p:last-child{max-width:720px;margin:0;color:var(--demo-muted);font-size:16px;line-height:1.5}.demo-reset,.demo-secondary-button{border:1px solid var(--demo-line);border-radius:13px;padding:11px 15px;background:#0b1725;color:#eaf4fd;font-weight:800}
.demo-quick-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:42px}.demo-quick-actions button{display:flex;align-items:center;gap:13px;padding:15px;border:1px solid var(--demo-line);border-radius:17px;background:linear-gradient(145deg,#0c1827,#07101b);color:#eef7ff;text-align:left;box-shadow:0 16px 38px rgba(0,0,0,.22)}.demo-quick-actions .quick-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:#102b45;color:#60bfff;font-size:20px}.demo-quick-actions strong,.demo-quick-actions small{display:block}.demo-quick-actions small{margin-top:2px;color:#7f96aa}
.demo-section-line{display:flex;align-items:end;justify-content:space-between;gap:18px;margin:0 0 16px}.demo-section-line.compact{align-items:center}.demo-section-line h2,.demo-section-line h3{margin:4px 0 0;color:#f4f9fd;font-size:26px;letter-spacing:-.035em}.demo-legend{display:flex;gap:13px;color:#8398ab;font-size:11px;font-weight:750}.demo-legend span{display:flex;align-items:center;gap:6px}.demo-legend i,.demo-tile-status i,.demo-tile-list i,.demo-consumable-state i{width:7px;height:7px;border-radius:50%}.demo-legend .green{background:var(--demo-green)}.demo-legend .orange{background:var(--demo-orange)}.demo-legend .red{background:var(--demo-red)}
.demo-location-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.demo-location-tile{position:relative;overflow:hidden;min-height:350px;padding:20px;border:1px solid var(--demo-line);border-radius:24px;color:#fff;text-align:left;box-shadow:0 22px 55px rgba(0,0,0,.27);transition:transform .18s ease,border-color .18s ease}.demo-location-tile:hover{transform:translateY(-2px);border-color:rgba(119,198,255,.34)}.demo-location-tile:after{content:"";position:absolute;z-index:0;width:220px;height:220px;right:-120px;top:-130px;border-radius:50%;background:rgba(255,255,255,.055)}.demo-location-tile[data-state=green]{background:linear-gradient(145deg,#071611,#0d3027 72%,#0b3d30)}.demo-location-tile[data-state=orange]{background:linear-gradient(145deg,#171006,#36220c 72%,#4b2d0b)}.demo-location-tile[data-state=red]{background:linear-gradient(145deg,#1c090d,#3a111a 72%,#501923)}.demo-location-tile[data-state=grey]{background:linear-gradient(145deg,#0d141c,#172431)}.demo-store-tile{grid-column:1/-1;min-height:330px;background:linear-gradient(125deg,#09182a,#0c2d4a 62%,#173b54)!important}.demo-store-tile[data-state=orange]{background:linear-gradient(125deg,#101827,#172b3c 58%,#4a300f)!important}.demo-store-tile[data-state=red]{background:linear-gradient(125deg,#131724,#2a2029 58%,#511b25)!important}
.demo-tile-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px}.demo-tile-status{display:inline-flex;align-items:center;gap:6px;width:max-content;padding:6px 9px;border:1px solid rgba(255,255,255,.09);border-radius:999px;background:rgba(0,0,0,.18);color:#dce9f4;font-size:10px;font-weight:820}.demo-tile-status i{background:var(--demo-green)}[data-state=orange] .demo-tile-status i{background:var(--demo-orange)}[data-state=red] .demo-tile-status i{background:var(--demo-red)}[data-state=grey] .demo-tile-status i{background:#8798aa}.demo-tile-kind{color:#89b8d8;font-size:10px;font-weight:850;letter-spacing:.12em;text-transform:uppercase}.demo-location-name{display:block;position:relative;z-index:1;margin:18px 0 14px;color:#fff;font-size:25px;line-height:1.05;letter-spacing:-.04em}.demo-store-tile .demo-location-name{font-size:40px}
.demo-tile-list{position:relative;z-index:1;display:grid;gap:0;margin:0;padding:0;list-style:none}.demo-store-tile .demo-tile-list{grid-template-columns:1fr 1fr;column-gap:28px}.demo-tile-list li{display:grid;grid-template-columns:7px minmax(0,1fr) auto;align-items:center;gap:8px;min-height:39px;border-top:1px solid rgba(255,255,255,.075);color:#c7d6e3;font-size:11px}.demo-tile-list li i{background:var(--demo-green)}.demo-tile-list li[data-state=orange] i{background:var(--demo-orange)}.demo-tile-list li[data-state=red] i{background:var(--demo-red)}.demo-tile-list li span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.demo-tile-list li strong{color:#f6fbff;font-size:11px;white-space:nowrap}.demo-more-items{display:block;position:relative;z-index:1;margin-top:9px;color:#7891a6;font-size:10px}.demo-room-summary,.demo-order-callout{display:block;position:absolute;z-index:1;left:20px;right:20px;bottom:17px;padding-top:12px;border-top:1px solid rgba(255,255,255,.1);color:#8fa5b8;font-size:10px;font-weight:700}.demo-order-callout{color:#b9c9d8}.demo-order-callout b{margin-right:7px;color:#ffc260;text-transform:uppercase;letter-spacing:.08em}
.demo-activity-panel{margin-top:42px;padding:22px;border:1px solid var(--demo-line);border-radius:23px;background:linear-gradient(145deg,#09131f,#060d16);box-shadow:0 18px 45px rgba(0,0,0,.23)}.demo-live-pill{padding:6px 9px;border-radius:999px;background:#0d2941;color:#6fc5ff;font-size:10px;font-weight:800}.demo-activity-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.demo-activity-row{display:flex;gap:10px;padding:13px;border:1px solid rgba(255,255,255,.05);border-radius:14px;background:#0c1724}.demo-activity-row>i{flex:0 0 auto;width:8px;height:8px;margin-top:5px;border-radius:50%;background:var(--demo-blue)}.demo-activity-row[data-tone=green]>i{background:var(--demo-green)}.demo-activity-row[data-tone=orange]>i{background:var(--demo-orange)}.demo-activity-row[data-tone=red]>i{background:var(--demo-red)}.demo-activity-row strong,.demo-activity-row span{display:block}.demo-activity-row strong{font-size:12px}.demo-activity-row span{margin-top:3px;color:#758ba0;font-size:10px;line-height:1.4}.demo-explainer{max-width:720px;margin:25px auto 0;color:#71879b;text-align:center;font-size:12px;line-height:1.55}
.demo-drawer[hidden],.demo-modal[hidden]{display:none}.demo-drawer{position:fixed;inset:0;z-index:9000;display:flex;justify-content:flex-end}.demo-drawer-scrim{position:absolute;inset:0;background:rgba(0,0,0,.7);backdrop-filter:blur(8px)}.demo-drawer-card{position:relative;width:min(680px,100%);height:100%;overflow:auto;padding:25px;background:#050c14;border-left:1px solid var(--demo-line);box-shadow:-30px 0 90px rgba(0,0,0,.45)}.demo-drawer-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}.demo-drawer-top h2{margin:4px 0 0;color:#f3f8fc;font-size:34px;letter-spacing:-.045em}.demo-drawer-actions{display:flex;gap:8px}.demo-icon-button{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--demo-line);border-radius:12px;background:#0c1826;color:#eaf5ff;font-size:19px}.demo-drawer-health{display:flex;align-items:baseline;gap:13px;margin-top:20px;padding:18px;border:1px solid var(--demo-line);border-radius:18px;background:#0c1c2b;color:#fff}.demo-drawer-health[data-state=green]{border-color:rgba(53,211,151,.32);background:#09251c}.demo-drawer-health[data-state=orange]{border-color:rgba(255,173,56,.34);background:#2b1b08}.demo-drawer-health[data-state=red]{border-color:rgba(255,101,114,.36);background:#301017}.demo-drawer-health strong{font-size:34px;letter-spacing:-.045em}.demo-drawer-health span{color:#d5e1ea;font-size:12px;font-weight:700}
.demo-chart-card,.demo-consumables{margin-top:14px;padding:18px;border:1px solid var(--demo-line);border-radius:19px;background:#09131f}.demo-chart-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}.demo-chart-head h3{margin:4px 0 0;color:#f0f6fb;font-size:19px}.demo-chart-head select{max-width:245px;padding:9px 10px;border:1px solid #26394d;border-radius:10px;background:#050c14;color:#eaf4fc;font-weight:700}.demo-chart{height:190px;margin-top:18px}.demo-bars{display:flex;align-items:flex-end;gap:9px;height:150px;border-bottom:1px solid #26384a}.demo-bar-column{display:flex;flex:1;height:100%;flex-direction:column;justify-content:flex-end;align-items:center}.demo-bar-column span{margin-bottom:5px;color:#8da3b7;font-size:10px;font-weight:800}.demo-bar-column i{width:min(34px,72%);min-height:8px;border-radius:7px 7px 2px 2px;background:linear-gradient(180deg,#43b6ff,#1d78c4)}.demo-bar-column small{margin-top:5px;color:#687d90;font-size:9px}.demo-chart-unit,.demo-chart-note{margin:7px 0 0;color:#6f8497;font-size:10px}.demo-chart-note{line-height:1.5}.demo-consumables>[data-drawer-items]{display:grid;gap:9px}.demo-consumable-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;align-items:center;gap:12px;padding:13px;border:1px solid rgba(255,255,255,.07);border-radius:14px;background:#0c1724}.demo-consumable-copy{min-width:0}.demo-consumable-copy>strong,.demo-consumable-copy>small{display:block}.demo-consumable-copy>strong{margin-top:4px;color:#eef6fd;font-size:13px}.demo-consumable-copy>small{margin-top:3px;color:#71879a;font-size:10px}.demo-consumable-state{display:flex;align-items:center;gap:5px;color:#80d9b4;font-size:9px;font-weight:850;text-transform:uppercase}.demo-consumable-state i{background:var(--demo-green)}.demo-consumable-row[data-state=orange] .demo-consumable-state{color:#ffc064}.demo-consumable-row[data-state=orange] .demo-consumable-state i{background:var(--demo-orange)}.demo-consumable-row[data-state=red] .demo-consumable-state{color:#ff8e98}.demo-consumable-row[data-state=red] .demo-consumable-state i{background:var(--demo-red)}.demo-current-target{display:flex;align-items:center;gap:6px;min-width:90px}.demo-current-target strong{color:#fff;font-size:31px;letter-spacing:-.05em}.demo-current-target span{color:#71879a;font-size:10px;line-height:1.25}.demo-replenish-button{min-width:110px;padding:10px;border:0;border-radius:10px;background:#218de4;color:#fff;font-size:10px;font-weight:850}.demo-replenish-button:disabled{background:#142334;color:#61788d;cursor:default}.demo-drawer-message{min-height:22px;margin:13px 0 0;color:#64bfff;font-size:11px;font-weight:750;line-height:1.5}
.demo-modal{position:fixed;inset:0;z-index:9200;display:grid;place-items:center;padding:18px;background:rgba(0,0,0,.76);backdrop-filter:blur(9px)}.demo-modal-card{width:min(540px,100%);max-height:90vh;overflow:auto;padding:24px;border:1px solid #26394d;border-radius:22px;background:#08121e;color:#eaf4fc;box-shadow:0 30px 90px rgba(0,0,0,.5)}.demo-modal-card h2{margin:5px 0 20px;font-size:28px}.demo-modal-card label{display:block;margin-top:12px;color:#9db0c2;font-size:11px;font-weight:800}.demo-modal-card input{display:block;width:100%;margin-top:6px;padding:11px;border:1px solid #263a4e;border-radius:10px;background:#040b12;color:#fff}.demo-target-setting{display:grid!important;grid-template-columns:minmax(0,1fr) 88px;align-items:center;gap:12px}.demo-target-setting input{margin:0}.demo-modal-actions{display:flex;gap:9px;margin-top:20px}.demo-modal-actions button{flex:1}.demo-primary-button{border:0;border-radius:12px;padding:12px;background:#168ce7;color:#fff;font-weight:850}.demo-mobile-nav{display:none}
@media(max-width:900px){.demo-location-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.demo-activity-list{grid-template-columns:1fr}.demo-store-tile{grid-column:1/-1}}
@media(max-width:620px){.stock-demo-shell{width:min(100% - 22px,1220px);padding:28px 0 100px}.stock-demo-heading{display:block;margin-bottom:18px}.stock-demo-heading h1{font-size:34px}.stock-demo-heading>div>p:last-child{font-size:13px}.demo-reset{margin-top:14px}.demo-quick-actions{display:flex;overflow:auto;margin:0 -11px 30px;padding:0 11px 9px;scrollbar-width:none}.demo-quick-actions button{flex:0 0 190px;padding:12px}.demo-section-line{align-items:flex-start}.demo-section-line h2{font-size:22px}.demo-legend{gap:8px;font-size:9px}.demo-location-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.demo-location-tile{min-height:330px;padding:13px;border-radius:18px}.demo-store-tile{grid-column:1/-1;min-height:385px}.demo-store-tile .demo-tile-list{grid-template-columns:1fr}.demo-store-tile .demo-location-name{font-size:29px}.demo-location-name{margin:13px 0 10px;font-size:16px}.demo-room-tile .demo-tile-head{display:block}.demo-room-tile .demo-tile-status{margin-top:8px}.demo-tile-list li{grid-template-columns:6px minmax(0,1fr);gap:6px;min-height:42px;font-size:9px}.demo-tile-list li strong{grid-column:2;font-size:9px}.demo-room-summary,.demo-order-callout{left:13px;right:13px;bottom:13px;font-size:9px}.demo-activity-panel{margin-top:28px;padding:15px}.demo-drawer-card{padding:17px 12px 90px}.demo-drawer-top h2{font-size:26px}.demo-drawer-health{display:block}.demo-drawer-health strong{display:block;font-size:29px}.demo-drawer-health span{display:block;margin-top:4px}.demo-chart-card,.demo-consumables{padding:14px}.demo-chart-head{display:block}.demo-chart-head select{width:100%;max-width:none;margin-top:9px}.demo-consumable-row{grid-template-columns:minmax(0,1fr) auto;padding:11px}.demo-replenish-button{grid-column:1/-1;width:100%}.demo-mobile-nav{position:fixed;z-index:8000;display:grid;grid-template-columns:repeat(3,1fr);left:0;right:0;bottom:0;padding:8px 7px calc(8px + env(safe-area-inset-bottom));border-top:1px solid #1c2b3c;background:rgba(4,10,17,.94);backdrop-filter:blur(20px)}.demo-mobile-nav button{display:grid;place-items:center;gap:2px;border:0;background:transparent;color:#71879a;font-size:9px;font-weight:750}.demo-mobile-nav button span{font-size:18px}.demo-mobile-nav button.active{color:#5ebfff}.stock-demo-page .v134-footer{padding-bottom:82px}}
@media(max-width:360px){.demo-location-grid{grid-template-columns:1fr}.demo-store-tile{grid-column:auto}.demo-location-tile{min-height:320px}}

/* v0.5 — editable STOCKROOM demo catalogue / room variables. */
.demo-settings-add-area{display:grid;gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid var(--demo-line)}
.demo-settings-add-button,.demo-settings-remove{border:1px solid #2d4358;border-radius:11px;background:#0d1d2c;color:#dcefff;font-weight:800}
.demo-settings-add-button{justify-self:start;padding:10px 13px;color:#7bcaff}
.demo-settings-remove{align-self:end;padding:10px 12px}
.demo-settings-additions{display:grid;gap:10px}
.demo-new-product-row{display:grid;grid-template-columns:1.4fr .8fr .7fr .8fr auto;gap:9px;align-items:end;padding:12px;border:1px solid #23384d;border-radius:14px;background:#07101a}
.demo-new-room-item-row{display:grid;grid-template-columns:minmax(0,1fr) 100px auto;gap:9px;align-items:end;padding:12px;border:1px solid #23384d;border-radius:14px;background:#07101a}
.demo-new-room-item-row select{display:block;width:100%;margin-top:6px;padding:11px;border:1px solid #263a4e;border-radius:10px;background:#040b12;color:#fff}
.demo-settings-note{margin:0;color:#8ea3b7;font-size:11px;line-height:1.5}
@media(max-width:620px){.demo-new-product-row,.demo-new-room-item-row{grid-template-columns:1fr}.demo-settings-remove{width:100%}}
.stockroom-demo-brand{display:block;width:min(310px,72vw);height:auto;margin:0 0 20px}


/* v0.6 — centred product identity and explicit receive-delivery workflow. */
.stock-demo-heading{position:relative!important;display:block!important;text-align:center!important;padding-inline:clamp(0px,8vw,110px)}
.stock-demo-heading>div{max-width:860px;margin:0 auto}
.stock-demo-heading .stockroom-demo-brand{margin:0 auto 20px!important}
.stock-demo-heading>div>p:last-child{margin-inline:auto!important}
.stock-demo-heading .demo-reset{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.demo-delivery-card{width:min(620px,100%)}
.demo-delivery-intro{margin:-8px 0 18px;color:#91a5b9;line-height:1.55;font-size:12px}
.demo-delivery-lines{display:grid;gap:9px}
.demo-delivery-line{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:#0b1724}
.demo-delivery-line strong,.demo-delivery-line small{display:block}.demo-delivery-line strong{color:#f2f8fd;font-size:13px}.demo-delivery-line small{margin-top:4px;color:#73899d;font-size:10px}
.demo-delivery-stepper{display:grid;grid-template-columns:36px 42px 36px;align-items:center;border:1px solid #31465b;border-radius:12px;overflow:hidden;background:#07111c}
.demo-delivery-stepper button{height:38px;border:0;background:transparent;color:#cfe6f8;font-size:19px}.demo-delivery-stepper button:hover{background:#10243a}.demo-delivery-stepper b{text-align:center;color:#fff;font-size:14px}
.demo-delivery-message{min-height:20px;margin:13px 0 0;color:#6bc4ff;font-size:11px;font-weight:750}
@media(max-width:620px){.stock-demo-heading{padding-inline:0}.stock-demo-heading .demo-reset{position:static;transform:none;margin-top:14px}.demo-delivery-line{grid-template-columns:1fr}.demo-delivery-stepper{justify-self:start}.stockroom-demo-brand{width:min(300px,82vw)!important}}

/* v0.6.2 — delivery sheet must fit Safari's dynamic viewport and keep its confirm action reachable. */
.demo-modal{
  height:100dvh;
  min-height:100dvh;
  overflow:hidden;
  padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom));
}
.demo-modal-card{
  max-height:calc(100dvh - max(24px,env(safe-area-inset-top)) - max(24px,env(safe-area-inset-bottom)));
  overflow-y:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
}
.demo-delivery-card .demo-modal-actions{
  position:sticky;
  z-index:3;
  bottom:-24px;
  margin:20px -24px -24px;
  padding:14px 24px calc(14px + env(safe-area-inset-bottom));
  border-top:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(8,18,30,.9),#08121e 26%);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
@media(max-width:620px){
  .demo-modal{place-items:stretch center;padding:8px 8px calc(8px + env(safe-area-inset-bottom))}
  .demo-modal-card{
    width:100%;
    max-height:calc(100dvh - 16px - env(safe-area-inset-bottom));
    border-radius:18px;
    padding:18px 14px;
  }
  .demo-delivery-card .demo-modal-actions{
    bottom:-18px;
    margin:18px -14px -18px;
    padding:12px 14px calc(12px + env(safe-area-inset-bottom));
  }
  .demo-modal-actions{gap:12px}
}

/* v0.6.5 — inline deliveries + editable exact quantities. */
.demo-deliveries-panel{margin:6px 0 36px;padding:22px;border:1px solid rgba(85,176,255,.18);border-radius:24px;background:linear-gradient(145deg,#081625,#0a1d31);box-shadow:0 20px 55px rgba(0,0,0,.18)}
.demo-deliveries-intro{max-width:720px;margin:8px 0 18px;color:#91a6ba;font-size:12px;line-height:1.55}
.demo-invoice-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.demo-invoice-card{padding:16px;border:1px solid rgba(255,255,255,.08);border-radius:17px;background:#0a1623}
.demo-invoice-card[data-complete=true]{border-color:rgba(72,211,157,.28);background:linear-gradient(145deg,#091a1a,#0b1a24)}
.demo-invoice-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.07)}
.demo-invoice-head strong,.demo-invoice-head small{display:block}.demo-invoice-head strong{color:#f2f8fd;font-size:13px}.demo-invoice-head small{margin-top:4px;color:#72879b;font-size:9px}
.demo-invoice-status{flex:0 0 auto;padding:6px 8px;border:1px solid rgba(255,186,88,.25);border-radius:999px;background:rgba(255,169,59,.08);color:#ffc36a;font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.demo-invoice-card[data-complete=true] .demo-invoice-status{border-color:rgba(72,211,157,.28);background:rgba(72,211,157,.08);color:#8ce9c4}
.demo-invoice-lines{display:grid;gap:8px;margin-top:12px}
.demo-invoice-line{display:flex;align-items:center;gap:9px;min-height:38px;padding:9px 10px;border:1px solid rgba(255,255,255,.055);border-radius:11px;background:#07111c;color:#dce9f4;font-size:10px;font-weight:750;cursor:pointer}
.demo-invoice-line input{width:17px;height:17px;margin:0;accent-color:#27a0ff}
.demo-invoice-line[data-received=true]{opacity:.62;color:#86d7b6;text-decoration:none}.demo-invoice-line[data-received=true] span::after{content:"  ✓";font-weight:900}
.demo-quantities-head{align-items:center}.demo-counts-button{flex:0 0 auto}
.demo-count-lines{display:grid;gap:9px}.demo-count-line{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:#0b1724}
.demo-count-line strong,.demo-count-line small{display:block}.demo-count-line strong{color:#f2f8fd;font-size:13px}.demo-count-line small{margin-top:4px;color:#73899d;font-size:10px}
.demo-count-input{width:42px!important;height:38px!important;margin:0!important;padding:0 2px!important;border:0!important;border-radius:0!important;background:transparent!important;color:#fff!important;text-align:center!important;font-size:14px!important;font-weight:800!important;-moz-appearance:textfield}
.demo-count-input::-webkit-outer-spin-button,.demo-count-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.demo-toast{position:fixed;z-index:10050;left:50%;bottom:max(24px,calc(18px + env(safe-area-inset-bottom)));transform:translate(-50%,18px);width:min(520px,calc(100% - 28px));padding:13px 16px;border:1px solid rgba(70,216,161,.28);border-radius:14px;background:rgba(7,31,26,.96);color:#c9ffea;text-align:center;font-size:11px;font-weight:850;box-shadow:0 20px 60px rgba(0,0,0,.45);opacity:0;transition:opacity .2s ease,transform .2s ease;pointer-events:none;backdrop-filter:blur(16px)}
.demo-toast.show{opacity:1;transform:translate(-50%,0)}
.demo-mobile-nav{grid-template-columns:repeat(2,1fr)!important}
@media(max-width:900px){.demo-invoice-list{grid-template-columns:1fr}}
@media(max-width:620px){
  .demo-deliveries-panel{margin-bottom:28px;padding:15px;border-radius:18px}
  .demo-invoice-list{grid-template-columns:1fr;gap:10px}
  .demo-invoice-card{padding:13px}
  .demo-invoice-head{display:block}.demo-invoice-status{display:inline-flex;margin-top:8px}
  .demo-count-line{grid-template-columns:1fr}.demo-delivery-stepper{justify-self:start}
  .demo-toast{bottom:calc(72px + env(safe-area-inset-bottom))}
}

/* v0.6.6 — Deliveries is a dashboard tile. Invoice lines open in a modal and can draft missing-item supplier emails. */
.demo-delivery-launch{margin:4px 0 34px}
.demo-deliveries-tile{display:grid;grid-template-columns:54px minmax(0,1fr) auto;align-items:center;gap:16px;width:100%;padding:20px 22px;border:1px solid rgba(76,174,255,.24);border-radius:22px;background:linear-gradient(135deg,#0a1a2c,#0b2944 66%,#113c5c);color:#fff;text-align:left;box-shadow:0 18px 46px rgba(0,0,0,.24);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.demo-deliveries-tile:hover{transform:translateY(-2px);border-color:rgba(99,193,255,.48);box-shadow:0 24px 56px rgba(0,0,0,.3)}
.demo-deliveries-icon{display:grid;place-items:center;width:54px;height:54px;border:1px solid rgba(104,197,255,.22);border-radius:16px;background:rgba(43,151,235,.13);color:#69c4ff;font-size:27px;font-weight:700}
.demo-deliveries-tile-copy{display:block;min-width:0}.demo-deliveries-tile-copy strong,.demo-deliveries-tile-copy small{display:block}.demo-deliveries-tile-copy strong{margin-top:4px;color:#f6fbff;font-size:25px;line-height:1;letter-spacing:-.035em}.demo-deliveries-tile-copy small{margin-top:7px;color:#91a9bd;font-size:11px;font-weight:650}.demo-deliveries-chevron{color:#70c7ff;font-size:34px;line-height:1}
.demo-deliveries-card{width:min(860px,100%)}
.demo-deliveries-modal-head{margin-bottom:8px}.demo-deliveries-modal-head .demo-icon-button{flex:0 0 auto}
.demo-invoice-list{grid-template-columns:1fr!important}
.demo-invoice-card{padding:17px 18px}
.demo-invoice-line{display:grid!important;grid-template-columns:26px minmax(0,1fr) auto!important;align-items:center;gap:10px;min-height:58px;padding:10px 12px;cursor:default}
.demo-invoice-check{display:grid;place-items:center;margin:0;cursor:pointer}.demo-invoice-check input{width:18px;height:18px;margin:0;accent-color:#27a0ff;cursor:pointer}
.demo-invoice-copy{display:block;min-width:0}.demo-invoice-copy strong,.demo-invoice-copy small{display:block}.demo-invoice-copy strong{color:#eaf4fc;font-size:11px}.demo-invoice-copy small{margin-top:4px;overflow:hidden;color:#70869a;font-size:8.5px;font-weight:600;text-overflow:ellipsis;white-space:nowrap}
.demo-invoice-line[data-received=true] span::after{content:none!important}.demo-invoice-line[data-received=true] .demo-invoice-copy strong::after{content:"  ✓";color:#6fd7ae;font-weight:900}
.demo-missing-button{justify-self:end;border:0;background:transparent;color:#42aaff;font-size:10px;font-weight:850;cursor:pointer;padding:8px 4px}.demo-missing-button:hover{text-decoration:underline}.demo-missing-button:focus-visible{outline:2px solid #42aaff;outline-offset:3px;border-radius:6px}
.demo-missing-card{width:min(650px,100%)}.demo-missing-summary{display:grid;gap:4px;margin:4px 0 18px;padding:13px 14px;border:1px solid rgba(72,174,255,.18);border-radius:13px;background:#071522}.demo-missing-summary strong{color:#edf7ff;font-size:13px}.demo-missing-summary span{color:#7f96aa;font-size:10px}
.demo-email-field{display:block!important;margin-top:13px!important;color:#9db0c2!important;font-size:10px!important;font-weight:800!important}.demo-email-field input,.demo-email-field textarea{display:block;width:100%;margin-top:6px;padding:11px 12px;border:1px solid #263a4e;border-radius:10px;background:#040b12;color:#eef7ff;font:inherit;line-height:1.5;resize:vertical}.demo-email-field textarea{min-height:210px;font-size:11px}.demo-email-field input{font-size:11px}
@media(max-width:620px){
  .demo-delivery-launch{margin:2px 0 27px}.demo-deliveries-tile{grid-template-columns:44px minmax(0,1fr) auto;gap:12px;padding:15px;border-radius:18px}.demo-deliveries-icon{width:44px;height:44px;border-radius:13px;font-size:23px}.demo-deliveries-tile-copy strong{font-size:20px}.demo-deliveries-tile-copy small{font-size:9px;line-height:1.35}.demo-deliveries-chevron{font-size:27px}
  .demo-deliveries-card{padding:16px 12px!important}.demo-invoice-card{padding:13px 11px}.demo-invoice-head{display:flex}.demo-invoice-status{display:inline-flex;margin-top:0}.demo-invoice-line{grid-template-columns:24px minmax(0,1fr) auto!important;gap:8px;padding:10px 8px}.demo-invoice-copy strong{font-size:10px}.demo-invoice-copy small{font-size:7.5px}.demo-missing-button{font-size:9px;padding:8px 2px}.demo-email-field textarea{min-height:240px}
}


/* v0.7.0 — one-gesture room stock counts. Each room item's slider is capped at its configured PAR target. */
.demo-consumable-row{grid-template-columns:minmax(0,1fr) auto minmax(230px,300px)!important;align-items:center}
.demo-inline-stock-controls{display:grid;gap:9px;min-width:230px}
.demo-store-controls{min-width:110px}
.demo-inline-count{padding:10px 11px 8px;border:1px solid rgba(88,178,246,.16);border-radius:12px;background:#07121e}
.demo-inline-count-head,.demo-inline-count-scale{display:flex;align-items:center;justify-content:space-between;gap:10px}
.demo-inline-count-head span{color:#7890a4;font-size:8.5px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.demo-inline-count-head strong{color:#dff2ff;font-size:10px}
.demo-inline-count-scale{margin-top:-1px;color:#61788d;font-size:8px;font-weight:750}
.demo-inline-count input[type=range]{display:block;width:100%;height:30px;margin:2px 0 0;padding:0;border:0;background:transparent;appearance:none;-webkit-appearance:none;cursor:pointer;touch-action:pan-y;accent-color:#2ba7ff}
.demo-inline-count input[type=range]::-webkit-slider-runnable-track{height:7px;border-radius:999px;background:linear-gradient(90deg,#2ba7ff 0 var(--range-progress,100%),#1a2b3d var(--range-progress,100%) 100%)}
.demo-inline-count input[type=range]::-webkit-slider-thumb{width:22px;height:22px;margin-top:-7.5px;border:3px solid #dff4ff;border-radius:50%;background:#168fe8;box-shadow:0 2px 10px rgba(0,0,0,.35);appearance:none;-webkit-appearance:none}
.demo-inline-count input[type=range]::-moz-range-track{height:7px;border:0;border-radius:999px;background:#1a2b3d}
.demo-inline-count input[type=range]::-moz-range-progress{height:7px;border-radius:999px;background:#2ba7ff}
.demo-inline-count input[type=range]::-moz-range-thumb{width:18px;height:18px;border:3px solid #dff4ff;border-radius:50%;background:#168fe8;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.demo-inline-count input[type=range]:focus-visible{outline:2px solid #6bc8ff;outline-offset:4px;border-radius:8px}
.demo-inline-stock-controls .demo-replenish-button{width:100%}
@media(max-width:760px){
  .demo-consumable-row{grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important}
  .demo-inline-stock-controls{grid-column:1/-1;min-width:0;width:100%}
  .demo-store-controls{grid-column:1/-1;min-width:0}
  .demo-inline-count{padding:11px 12px 9px}
  .demo-inline-count input[type=range]{height:38px}
  .demo-inline-count input[type=range]::-webkit-slider-thumb{width:26px;height:26px;margin-top:-9.5px}
  .demo-inline-count input[type=range]::-moz-range-thumb{width:22px;height:22px}
}

/* v0.7.1 — room-specific consumable membership controls. */
.demo-existing-room-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 12px;border:1px solid #23384d;border-radius:14px;background:#07101a;transition:opacity .18s,border-color .18s}
.demo-existing-room-item .demo-target-setting{margin:0!important}
.demo-existing-room-item .demo-room-remove{align-self:center;white-space:nowrap}
.demo-existing-room-item[data-removed="true"]{opacity:.48;border-style:dashed}.demo-existing-room-item[data-removed="true"] .demo-target-setting{text-decoration:line-through;text-decoration-color:#6c7d8d}
@media(max-width:620px){.demo-existing-room-item{grid-template-columns:1fr}.demo-existing-room-item .demo-room-remove{width:100%}}

/* v0.7.2 — room tile footer collision fix.
   Room summaries participate in normal flow instead of being absolutely
   pinned over the final consumable row. This lets cards grow with their
   configured room catalogue on both desktop and mobile. */
.demo-room-tile .demo-room-summary{
  position:relative;
  left:auto;
  right:auto;
  bottom:auto;
  width:100%;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid rgba(255,255,255,.1);
}
@media(max-width:620px){
  .demo-room-tile{
    min-height:330px;
    padding-bottom:14px;
  }
  .demo-room-tile .demo-room-summary{
    left:auto;
    right:auto;
    bottom:auto;
    margin-top:9px;
    padding-top:9px;
    font-size:9px;
    line-height:1.35;
  }
}