/* Reports and printable-document views */
.report-filters{margin-bottom:14px;padding:12px}.period-buttons{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.period-buttons button,.period-buttons a{min-height:42px}.date-field{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:var(--text-xs)}.date-field input{min-height:42px;width:145px;padding:8px;border:1px solid var(--line);border-radius:8px;color:var(--ink);background:white}.report-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px}.report-stat{display:flex;flex-direction:column;gap:8px}.report-stat>span{font-size:var(--text-xs);color:var(--muted)}.report-stat strong{font-size:var(--text-xl);line-height:1;color:var(--ink)}.report-stat small{color:var(--muted)}.positive{color:#0e9f6e!important}.negative{color:#cf3d48!important}.report-charts{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);gap:12px;margin-bottom:12px}.trend-chart{display:block;width:100%;height:150px;overflow:visible}.chart-grid{fill:none;stroke:#e7edf5;stroke-width:1}.trend-line{fill:none;stroke:#3478f6;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.trend-chart circle{fill:#3478f6;stroke:#fff;stroke-width:2}.trend-chart text{font:10px Arial,sans-serif;fill:#74849a;text-anchor:middle}.report-category{display:grid;grid-template-columns:12px 1fr auto 46px;align-items:center;gap:9px;padding:6px 0;font-size:var(--text-xs)}.report-category small{color:var(--muted);text-align:right}.report-dot{width:10px;height:10px;border-radius:50%;background:#3478f6}.tone-1.report-dot{background:#e94d86}.tone-2.report-dot{background:#45bf83}.tone-3.report-dot{background:#eda73f}.report-shortcuts{margin-bottom:12px}.report-category-buttons{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:7px}.report-category-buttons button{display:flex;align-items:center;justify-content:center;gap:7px;min-height:43px;font-size:var(--text-xs);padding:6px}.report-category-buttons .icon{width:19px;height:19px;flex:none}.document-previews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.document-card{min-width:0}.document-title{display:flex;align-items:center;gap:10px;margin-bottom:12px}.document-title>.icon{color:var(--blue)}.document-title h2{font-size:var(--text-base);margin:0}.document-title p{font-size:var(--text-xs);color:var(--muted);margin:3px 0 0}.paper-preview{min-height:250px;background:#fff;border:1px solid #e5eaf1;box-shadow:0 3px 14px #20395a12;padding:18px;margin-bottom:10px;color:#14233e;font-size:var(--text-xs)}.paper-preview header{display:flex;justify-content:space-between;align-items:center;font-size:var(--text-base)}.paper-preview header span{color:#bd2529;font-weight:700}.paper-preview hr{border:0;border-top:3px solid #d8aa3d;margin:10px 0 12px}.paper-preview h3{font-size:var(--text-base);margin:0 0 6px}.paper-preview>p{color:#69758a;font-size:var(--text-xs)}.preview-bars>div{display:grid;grid-template-columns:100px 1fr 30px;align-items:center;gap:7px;margin:6px 0;font-size:var(--text-xs)}.preview-bars i{height:7px;background:linear-gradient(90deg,#397bfa var(--bar),#edf1f7 var(--bar));border-radius:5px}.paper-preview footer{display:block;border-top:2px solid #d8aa3d;margin-top:14px;padding-top:7px;font-size:10px;color:#52617a}.document-card>.primary,.document-card>.secondary{min-height:43px;width:100%;justify-content:center;text-decoration:none}.receipt-preview{height:250px;display:grid;grid-template-rows:1fr 1fr;position:relative;background:white;border:1px solid #e5eaf1;box-shadow:0 3px 14px #20395a12;margin-bottom:10px;padding:12px 18px}.receipt-preview:after{content:'';position:absolute;left:15px;right:15px;top:50%;border-top:1px dashed #8c9bb0}.receipt-preview>div{display:flex;flex-direction:column;gap:10px;padding:2px 0 12px}.receipt-preview>div+div{padding:12px 0 0}.receipt-preview b{align-self:flex-start;padding:4px 9px;border-radius:6px;background:#eaf1ff;color:#2860df;font-size:var(--text-xs)}.receipt-preview>div+div b{background:#fff0f0;color:#b83237}.receipt-preview strong{font-size:var(--text-sm)}.receipt-preview span{margin-top:auto;border:1px solid #dfe5ee;border-radius:5px;padding:7px;color:#6e7b8d;font-size:var(--text-xs)}.delivery-panel{margin-bottom:12px}.delivery-panel>.primary{min-height:46px;margin-top:10px}.delivery-lines{display:grid;gap:6px;margin-bottom:12px}.delivery-line{display:grid;grid-template-columns:30px 1fr auto 40px;align-items:center;gap:8px;padding:7px;border-bottom:1px solid var(--line);font-size:var(--text-sm)}.delivery-line>.icon,.delivery-line>span>.icon{width:23px;color:var(--blue)}.delivery-line small{display:block;color:var(--muted);font-weight:400;margin-top:2px}.delivery-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.delivery-fields label{font-size:var(--text-xs);color:var(--muted)}.delivery-fields input{display:block;width:100%;margin-top:5px;min-height:43px;padding:9px;border:1px solid var(--line);border-radius:8px}.receipt-link{display:flex;gap:7px;align-items:center;margin-top:12px;color:var(--blue);font-size:var(--text-sm);font-weight:600}.receipt-link .icon{width:18px}
@media(max-width:1000px){.report-category-buttons{grid-template-columns:repeat(4,minmax(0,1fr))}.report-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.report-charts,.document-previews{grid-template-columns:1fr}.report-charts{gap:9px}.report-filters{padding:9px}.period-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.period-buttons .date-field{grid-column:span 1;display:block}.date-field input{display:block;width:100%;margin-top:4px}.period-buttons>a,.period-buttons>#report-refresh{grid-column:span 3;justify-content:center}.report-category-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}.report-kpis{gap:8px}.report-stat{padding:10px}.report-stat strong{font-size:var(--text-lg)}.delivery-fields{grid-template-columns:1fr}.delivery-line{grid-template-columns:26px 1fr auto 38px}.paper-preview{padding:14px}.report-charts .panel{padding:11px}}
.donut-layout{display:grid;grid-template-columns:120px minmax(0,1fr);align-items:center;gap:10px}.donut-chart{width:112px;height:112px;border-radius:50%;display:grid;place-items:center;background:var(--donut,#e8edf5);position:relative}.donut-chart:after{content:'';position:absolute;inset:19px;border-radius:50%;background:#fff}.donut-chart strong{position:relative;z-index:1;font-size:var(--text-base);color:var(--ink)}.donut-legend{min-width:0}.donut-legend .report-category{padding:4px 0}
@media(max-width:700px){.donut-layout{grid-template-columns:102px minmax(0,1fr);gap:8px}.donut-chart{width:96px;height:96px}.donut-chart:after{inset:16px}.donut-legend .report-category{grid-template-columns:10px 1fr auto;gap:6px;font-size:var(--text-xs)}.donut-legend .report-category small{display:none}}
.receipt-history{margin-top:12px}.receipt-list{display:grid;gap:6px}.receipt-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)}.receipt-number{display:grid;place-items:center;width:32px;height:32px;border-radius:8px;background:#edf3ff;color:var(--blue)}.receipt-number .icon{width:18px}.receipt-row strong{display:block;font-size:var(--text-sm)}.receipt-row small{display:block;margin-top:3px;color:var(--muted);font-size:var(--text-xs)}.receipt-row>a{text-decoration:none;justify-content:center;min-height:40px}.receipt-history>#older-receipts{margin-top:10px;min-height:42px}
@media(max-width:620px){.receipt-row{grid-template-columns:30px minmax(0,1fr)}.receipt-row>a{grid-column:2;justify-self:start}.receipt-row{gap:7px}.receipt-history{padding:11px}}
.profile-blue{--profile:#2864e8}.profile-violet{--profile:#8055d9}.profile-green{--profile:#1ca778}.profile-orange{--profile:#e58a24}.profile-rose{--profile:#df5c86}.profile-teal{--profile:#179eaa}.profile-dot{display:inline-block;width:11px;height:11px;border-radius:50%;background:var(--profile,#2864e8);vertical-align:middle;flex:none}.avatar[class*="profile-"]{background:color-mix(in srgb,var(--profile) 13%,white);color:var(--profile)}.admin-people,.audit-panel,.leadership{margin-top:18px}.user-create{display:flex;align-items:end;gap:14px;flex-wrap:wrap;padding:16px 0;border-bottom:1px solid var(--line,#e6ebf4)}.user-create label{display:grid;gap:7px;min-width:min(100%,260px);font-weight:600}.user-create input,.temporary-password input{min-height:44px;padding:10px 12px;border:1px solid #d9e2f0;border-radius:9px;font:inherit}.user-create fieldset{border:0;padding:0;margin:0}.user-create legend{font-size:13px;font-weight:600;margin-bottom:8px}.color-choices{display:flex;gap:9px}.color-choice{height:30px;width:30px;padding:0;border:3px solid white;border-radius:50%;background:var(--profile);box-shadow:0 0 0 1px #d8e0ec;cursor:pointer}.color-choice.selected{box-shadow:0 0 0 2px var(--profile)}.user-list,.audit-list{display:grid}.user-row,.audit-row{display:flex;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--line,#e6ebf4)}.user-row>div,.audit-row>div{display:grid;gap:4px;flex:1;min-width:0}.user-row small,.audit-row small{color:#6f7f9d}.user-row.inactive{opacity:.62}.user-row button{min-height:40px}.audit-row{align-items:flex-start}.audit-row>div{gap:5px}.audit-row strong span{font-weight:500;color:#405574}.leadership{display:grid;grid-template-columns:1.3fr 1fr 1fr;align-items:center;gap:16px}.leadership h2{margin:5px 0}.leadership p{margin:0;line-height:1.65}.leadership small{grid-column:1/-1;color:#71809b}.temporary-password{display:flex;gap:8px}.temporary-password input{flex:1;font-family:ui-monospace,monospace;letter-spacing:.03em}.undo-disabled{opacity:.5;cursor:not-allowed}.account .avatar{background:color-mix(in srgb,var(--profile) 13%,white)}@media(max-width:760px){.user-create{align-items:stretch}.user-create>label,.user-create fieldset,.user-create>button{width:100%}.user-row{flex-wrap:wrap}.user-row>div{flex-basis:calc(100% - 36px)}.user-row button{flex:1}.leadership{grid-template-columns:1fr}.leadership small{grid-column:auto}.temporary-password{flex-wrap:wrap}.temporary-password input{min-width:100%}}

.profile-text{color:var(--profile);font-weight:650}
/* Final responsive corrections for the existing NJC Stock interface. */
.color-choices{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-width:0}
.user-create fieldset{min-width:0;flex:0 0 auto}
.color-choice,.color-choice.selected{box-sizing:border-box!important;display:block!important;flex:0 0 34px!important;width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;max-width:34px!important;max-height:34px!important;inline-size:34px!important;block-size:34px!important;min-inline-size:34px!important;min-block-size:34px!important;max-inline-size:34px!important;max-block-size:34px!important;aspect-ratio:1/1!important;padding:0!important;border:3px solid #fff!important;border-radius:50%!important;background:var(--profile)!important;box-shadow:0 0 0 1px #d8e0ec;line-height:1}
.color-choice.selected{box-shadow:0 0 0 2px var(--profile)}
.color-choice:focus-visible{outline:3px solid #89a9ff;outline-offset:4px}
.search{min-width:0}
.search input{min-width:0;width:100%;text-overflow:ellipsis}
.search input::placeholder{text-overflow:ellipsis}
.stock-panel,.stock-toolbar,.filter-row,.table-scroll{min-width:0;max-width:100%}
.filter-row{overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:#cbd7ec transparent}
.filter-row .chip{flex:0 0 auto;white-space:nowrap}
.user-row,.audit-row{min-width:0}
.user-row>div,.audit-row>div{overflow-wrap:anywhere}
.audit-row strong{line-height:1.35}
.leadership{min-width:0}
.leadership p{min-width:0;overflow-wrap:anywhere}
.profile-text{color:var(--profile);font-weight:650}

@media (min-width:1000px){
  .content{width:100%;max-width:1600px}
  .admin-people,.audit-panel,.leadership{margin-top:16px}
  .audit-list{max-height:min(62vh,680px);overflow:auto;overscroll-behavior:contain;padding-right:4px}
}

@media (min-width:621px) and (max-width:999px){
  .settings-grid{grid-template-columns:minmax(0,1fr)}
  .user-create{align-items:end;gap:12px}
  .user-create>label{flex:1 1 230px}
  .user-create fieldset{flex:0 0 auto}
  .user-create>button{flex:0 0 auto}
  .leadership{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .leadership>div{grid-column:1/-1}
  .leadership small{grid-column:1/-1}
  .user-row{flex-wrap:wrap}
  .user-row>div{flex-basis:calc(100% - 30px)}
  .topbar,.content{min-width:0}
}

@media (max-width:620px){
  .sidebar{height:calc(68px + env(safe-area-inset-bottom,0px));padding:4px max(5px,env(safe-area-inset-right,0px)) max(5px,env(safe-area-inset-bottom,0px)) max(5px,env(safe-area-inset-left,0px))}
  .sidebar nav{grid-template-columns:repeat(7,minmax(0,1fr));align-items:center}
  .nav-button{min-width:0;min-height:56px;padding:5px 0;gap:3px;overflow:hidden}
  .nav-button .mobile-label{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;line-height:1.15}
  .main{padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))}
  #toast{bottom:calc(82px + env(safe-area-inset-bottom,0px));max-width:calc(100vw - 28px)}
  .content{padding-bottom:20px}
  .user-create{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-items:stretch}
  .user-create>label,.user-create fieldset,.user-create>button{width:100%;min-width:0}
  .user-create input{width:100%;min-width:0}
  .color-choices{flex-wrap:nowrap;justify-content:flex-start;gap:13px;min-height:40px}
  .color-choice,.color-choice.selected{flex:0 0 34px!important;width:34px!important;height:34px!important;min-width:34px!important;min-height:34px!important;max-width:34px!important;max-height:34px!important;inline-size:34px!important;block-size:34px!important;min-inline-size:34px!important;min-block-size:34px!important;max-inline-size:34px!important;max-block-size:34px!important}
  .user-list,.audit-list{min-width:0}
  .user-row{gap:9px}
  .user-row>div{flex:1 1 calc(100% - 28px);min-width:0}
  .user-row button{flex:1 1 100%;width:100%;white-space:normal;line-height:1.2}
  .audit-row{gap:9px;align-items:flex-start}
  .audit-row>div{min-width:0}
  .audit-row small{line-height:1.35}
  .leadership{grid-template-columns:minmax(0,1fr);gap:12px}
  .leadership>div,.leadership small{grid-column:1}
  .leadership p{padding-top:2px}
  .stock-toolbar{display:grid;grid-template-columns:minmax(0,1fr);gap:8px}
  .search{width:100%;max-width:none;min-width:0}
  .search input{padding-inline:38px 10px}
  .filter-row{margin-inline:-2px;padding:2px 2px 8px;scroll-snap-type:x proximity}
  .filter-row .chip{scroll-snap-align:start}
  .stock-status{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none}
  .stock-status::-webkit-scrollbar{display:none}
  .table-item{min-width:0}
  .table-item>div{min-width:0}
  .table-item strong,.table-item small{overflow-wrap:anywhere}
  .leadership,.admin-people,.audit-panel{scroll-margin-bottom:100px}
}

@media (max-width:380px){
  .nav-button .mobile-label{font-size:10px;letter-spacing:-.1px}
  .sidebar nav{grid-template-columns:repeat(7,minmax(0,1fr))}
  .color-choices{gap:10px}
  .user-row button{font-size:var(--text-xs)}
}

/* v1.2 · restrained frosted-glass surfaces and data-first dashboard */
:root{--glass-white:rgba(255,255,255,.78);--glass-edge:rgba(255,255,255,.88);--glass-shadow:0 12px 34px rgba(34,54,91,.075)}
body{background:radial-gradient(ellipse at 12% 0%,rgba(190,211,255,.34),transparent 36%),radial-gradient(ellipse at 88% 14%,rgba(227,216,255,.25),transparent 35%),#f3f6fc}
.panel,.topbar,.workspace,.stock-panel,.summary,.login-card,.delivery-panel{background:var(--glass-white);border-color:rgba(255,255,255,.78);box-shadow:var(--glass-shadow);backdrop-filter:blur(18px) saturate(1.22);-webkit-backdrop-filter:blur(18px) saturate(1.22)}
.sidebar{background:rgba(255,255,255,.82);backdrop-filter:blur(24px) saturate(1.2);-webkit-backdrop-filter:blur(24px) saturate(1.2);border-color:rgba(255,255,255,.8)}
.nav-toggle{display:none}
.topbar{border-bottom-color:rgba(215,225,243,.65)}
.metric{background:linear-gradient(145deg,rgba(255,255,255,.91),rgba(247,250,255,.72))}
.premium-dashboard{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch}
.chart-card{min-width:0;overflow:hidden}
.chart-card .section-heading{align-items:flex-start}
.chart-card .section-heading .eyebrow{font-size:10px;letter-spacing:.12em;color:#8795ad;font-weight:700}
.chart-card .section-heading h2{margin:4px 0;font-size:var(--text-lg)}
.chart-total{font-size:var(--text-lg);font-weight:750;color:#182844;white-space:nowrap}.chart-total small{font-size:var(--text-xs);font-weight:500;color:#8190a8}
.donut-layout,.status-chart-layout{display:grid;grid-template-columns:minmax(120px, .82fr) minmax(0,1fr);align-items:center;gap:16px;min-height:190px}
.donut-chart{display:block;width:min(100%,190px)!important;height:190px!important;max-height:190px;flex:none;margin:auto;overflow:visible;position:static;background:none;border-radius:0;transform:rotate(-90deg)}.donut-chart:after{display:none!important}
.donut-chart circle{transition:stroke-dasharray .25s ease}
.donut-chart text{transform:rotate(90deg);transform-origin:60px 60px;font-family:inherit;fill:#172743}.donut-chart .donut-number{font-size:17px;font-weight:750}.donut-chart .donut-caption{font-size:8px;fill:#8491a5}
.chart-legend{display:grid;gap:10px;min-width:0}.chart-legend>div{display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:8px;font-size:var(--text-sm);color:#64738a}.chart-legend i{width:8px;height:8px;border-radius:50%;background:#8491a5}.chart-legend i.chart-color-0{background:#3166f5}.chart-legend i.chart-color-1{background:#8b5cf6}.chart-legend i.chart-color-2{background:#e44f87}.chart-legend i.chart-color-3{background:#15a985}.chart-legend i.chart-color-4{background:#f49a32}.chart-legend i.chart-color-5{background:#18a6aa}.chart-legend i.chart-color-6{background:#ef675d}.chart-legend i.chart-color-7{background:#7d8ba5}.chart-legend i.chart-available{background:#20b486}.chart-legend i.chart-low{background:#f2a136}.chart-legend i.chart-empty{background:#ec6680}.chart-legend strong{font-variant-numeric:tabular-nums;color:#263752}
.status-donut{display:block;width:min(100%,176px);height:176px;max-height:176px;margin:auto;overflow:visible}.status-donut .status-number{font-family:inherit;fill:#1a2b47;font-size:17px;font-weight:750}.status-donut .status-caption{font-family:inherit;fill:#8190a8;font-size:8px}
.trend-chart{padding:8px 0 0}.trend-chart svg{width:100%;height:150px;overflow:visible}.trend-chart .trend-grid{fill:none;stroke:#e8edf5;stroke-width:1;stroke-dasharray:3 5}.trend-chart polygon{fill:rgba(56,105,244,.1)}.trend-chart polyline{fill:none;stroke:#3869f4;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.trend-chart circle{fill:#fff;stroke:#3869f4;stroke-width:2}.trend-labels{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;color:#8290a6;font-size:10px;text-transform:capitalize}
.top-items{display:grid;gap:15px;padding:8px 0}.top-item>div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:var(--text-sm);color:#52627a}.top-item strong{color:#1e2f4b;font-variant-numeric:tabular-nums}.top-track{height:8px;margin-top:7px;border-radius:99px;overflow:hidden}.top-track svg{display:block;width:100%;height:8px}
.recent-card{grid-column:1/-1}
.leadership-premium{position:relative;overflow:hidden;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:16px;margin:0 0 16px;padding:20px 24px;background:linear-gradient(115deg,#101827,#1b2940 72%,#243958)!important;color:#fff!important;border:1px solid rgba(255,255,255,.12)!important;box-shadow:0 18px 42px rgba(15,27,48,.2)!important}
.leadership-premium:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:5%;top:-175px;background:radial-gradient(circle,rgba(111,151,255,.22),transparent 68%);pointer-events:none}
.leadership-premium .eyebrow,.leadership-premium small{color:#aab8d0}.leadership-premium h2{font-size:var(--text-lg);margin:5px 0 0;color:#fff}.leadership-premium p{margin:0;line-height:1.65;color:#dbe3f0}.leadership-premium p strong{font-size:var(--text-sm);color:#fff}.leadership-premium>small{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.14);padding-top:10px}
@media(min-width:1000px){.premium-dashboard{grid-template-columns:repeat(2,minmax(0,1fr))}.premium-dashboard>.recent-card{grid-column:1/-1}.chart-card{padding:20px}.donut-layout,.status-chart-layout{min-height:210px}}
@media(max-width:620px){.premium-dashboard{grid-template-columns:minmax(0,1fr);gap:10px}.recent-card{grid-column:auto}.chart-card{padding:14px}.donut-layout,.status-chart-layout{grid-template-columns:minmax(105px,.75fr) minmax(0,1fr);gap:12px;min-height:150px}.donut-chart{width:min(100%,145px)!important;height:145px!important;max-width:145px;max-height:145px}.status-donut{width:min(100%,132px);height:132px;max-height:132px}.trend-chart svg{height:124px}.chart-legend{gap:8px}.chart-legend>div{font-size:var(--text-xs);gap:6px}.leadership-premium{grid-template-columns:minmax(0,1fr);gap:10px;padding:16px;margin-bottom:12px}.leadership-premium>small{grid-column:1}.leadership-premium p{font-size:var(--text-sm)}}
@media(prefers-reduced-transparency:reduce){.panel,.topbar,.workspace,.stock-panel,.summary,.login-card,.delivery-panel,.sidebar{backdrop-filter:none;-webkit-backdrop-filter:none;background:#fff}}
@media(max-width:620px){.sidebar{height:calc(72px + env(safe-area-inset-bottom,0px));padding-top:5px}.sidebar nav{height:62px}.nav-toggle{position:absolute;display:grid;place-items:center;z-index:4;right:10px;top:-17px;width:40px;height:32px;min-height:32px;padding:0;border:1px solid rgba(214,225,243,.9);border-radius:12px 12px 0 0;background:rgba(255,255,255,.9);color:#365fc7;box-shadow:0 -5px 15px rgba(40,60,100,.08)}.nav-toggle .icon{width:17px;height:17px}.mobile-nav-compact .nav-button .mobile-label{display:none}.mobile-nav-compact .nav-button{min-height:50px}.mobile-nav-compact{height:calc(58px + env(safe-area-inset-bottom,0px))}.mobile-nav-compact nav{height:52px}.mobile-nav-expanded .nav-button .mobile-label{display:block}}


/* v1.3.0 — compact, safe-area-aware mobile navigation and page-fit polish. */
.primary-nav,.mobile-secondary-menu{display:contents}
.nav-toggle{display:none}
html,body,#app{min-height:100%;max-width:100%;overflow-x:clip}
body{-webkit-text-size-adjust:100%;text-size-adjust:100%}
.main{min-width:0;min-height:100dvh}
.content{min-width:0;width:100%}
@media(max-width:620px){
  .sidebar{inset:auto 0 0;height:auto;min-height:calc(64px + env(safe-area-inset-bottom,0px));width:100%;padding:5px max(10px,env(safe-area-inset-right,0px)) env(safe-area-inset-bottom,0px) max(10px,env(safe-area-inset-left,0px));border:1px solid rgba(255,255,255,.86);border-bottom:0;border-radius:22px 22px 0 0;background:rgba(250,252,255,.78);backdrop-filter:blur(24px) saturate(1.45);-webkit-backdrop-filter:blur(24px) saturate(1.45);box-shadow:0 -8px 30px rgba(30,54,94,.14);overflow:visible}
  .sidebar nav{position:static;display:grid;grid-template-columns:minmax(0,1fr) 48px;align-items:center;gap:4px;height:56px;margin:0;overflow:visible}
  .primary-nav{grid-column:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;min-width:0}
  .nav-button{min-width:0;min-height:50px;padding:5px 1px;gap:3px;margin:0;border-radius:13px;flex-direction:column;justify-content:center;overflow:hidden}
  .nav-button .icon{width:20px;height:20px}
  .nav-button>span:not(.mobile-label){display:none}
  .nav-button .mobile-label{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;line-height:1.15}
  .nav-button small{display:none}
  .nav-button.active:before{display:none}
  .nav-button.active{background:rgba(45,99,235,.12);color:#2458e6}
  .nav-toggle{grid-column:2;position:static;display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;border:1px solid rgba(220,229,244,.9);border-radius:14px;background:rgba(255,255,255,.74);color:#4169c4;box-shadow:0 2px 8px rgba(35,61,103,.08)}
  .nav-toggle .icon{width:19px;height:19px}
  .nav-toggle.has-active:after{content:'';position:absolute;width:7px;height:7px;margin:-28px 0 0 28px;border:1.5px solid white;border-radius:50%;background:#2864e8}
  .mobile-secondary-menu{position:absolute;right:max(10px,env(safe-area-inset-right,0px));bottom:calc(100% + 9px);display:none;grid-template-columns:minmax(0,1fr);gap:3px;width:min(218px,calc(100vw - 28px));padding:8px;border:1px solid rgba(255,255,255,.94);border-radius:18px;background:rgba(252,253,255,.82);backdrop-filter:blur(28px) saturate(1.5);-webkit-backdrop-filter:blur(28px) saturate(1.5);box-shadow:0 14px 38px rgba(28,48,82,.2);transform-origin:bottom right;animation:nav-pop-in .16s ease-out}
  .mobile-nav-expanded .mobile-secondary-menu{display:grid}
  .mobile-secondary-menu .nav-button{flex-direction:row;justify-content:flex-start;gap:12px;min-height:48px;padding:8px 10px;text-align:left;border-radius:12px}
  .mobile-secondary-menu .nav-button .icon{width:20px;height:20px}
  .mobile-secondary-menu .nav-button .mobile-label{font-size:14px;line-height:1.2;text-overflow:clip}
  .main{padding:0 0 calc(78px + env(safe-area-inset-bottom,0px))}
  .content{padding:14px max(12px,env(safe-area-inset-right,0px)) 18px max(12px,env(safe-area-inset-left,0px))}
  .topbar{min-width:0;padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))}
  .breadcrumb{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .page-heading,.page-heading>div,.stock-panel,.stock-toolbar,.search{min-width:0;max-width:100%}
  .search input{min-width:0;max-width:100%;font-size:16px}
  input,select,textarea{font-size:16px}
  #toast{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
}
@keyframes nav-pop-in{from{opacity:0;transform:translateY(5px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media(prefers-reduced-motion:reduce){.mobile-secondary-menu{animation:none}}
@media(prefers-reduced-transparency:reduce){@media(max-width:620px){.sidebar,.mobile-secondary-menu{backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(255,255,255,.97)}}}
@media(min-width:621px){.sidebar nav{min-width:0}.primary-nav,.mobile-secondary-menu{display:contents}.mobile-secondary-menu[aria-hidden="true"] .nav-button{display:flex}}
@media(max-width:620px){.mobile-nav-compact .primary-nav .nav-button .mobile-label{display:block}}
@media(max-width:620px){.nav-toggle{position:relative}.mobile-nav-compact .primary-nav .nav-button .mobile-label{display:block}}
@media(max-width:620px){.nav-toggle{display:grid}}
@media(max-width:620px){.nav-toggle{top:auto;align-self:center;transform:none;margin:0}}

/* Logout is reachable from compact navigation on phones and tablets. */
@media(min-width:621px) and (max-width:900px){.account{flex-direction:column;align-items:center;justify-content:center;gap:9px;padding-top:14px}.account-logout{display:grid;place-items:center;width:36px;min-width:36px;height:36px;min-height:36px;margin:0;padding:0;border-radius:50%;font-size:0}.account-logout .icon{width:17px;height:17px}.account-logout>span{display:none}}
@media(max-width:620px){.mobile-secondary-menu .mobile-logout{display:flex!important;color:var(--theme-muted,#68778d)}.mobile-secondary-menu .mobile-logout .mobile-label{display:block}}
html[data-theme="dark"] .mobile-logout{color:var(--theme-muted,#a9b7cc)!important}

/* v1.5.0 — detailed stock-out analytics within Vue d’ensemble. */
.overview-tabs{display:flex;gap:7px;margin:0 0 14px;padding:5px;width:max-content;max-width:100%;border:1px solid var(--theme-line);border-radius:14px;background:var(--theme-surface);box-shadow:var(--theme-shadow);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.overview-tabs button{min-height:42px;padding:8px 16px;border-radius:10px;background:transparent;color:var(--theme-muted);font-size:var(--text-sm);font-weight:650;white-space:nowrap}.overview-tabs button.active{background:linear-gradient(135deg,#3475f6,#2458df);color:#fff;box-shadow:0 5px 13px #2864e833}
.outflow-filters{margin-bottom:12px;padding:14px}.outflow-periods{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:12px}.outflow-periods button{min-height:38px;padding:6px 11px;font-size:var(--text-xs)}#outflow-filter-form{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;align-items:end}#outflow-filter-form label{display:grid;gap:5px;color:var(--theme-muted);font-size:var(--text-xs);font-weight:600;min-width:0}#outflow-filter-form input,#outflow-filter-form select{width:100%;min-width:0;min-height:42px;padding:8px 9px;border:1px solid var(--theme-line);border-radius:10px;background:var(--theme-raised);color:var(--theme-ink);font:inherit;font-size:var(--text-xs)}#outflow-filter-form button{min-height:42px}.outflow-search{grid-column:span 2}
.outflow-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:10px}.outflow-kpis .report-stat{padding:15px}.outflow-kpis .report-stat strong{font-size:var(--text-xl)}.outflow-charts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.outflow-charts .chart-card{min-width:0}.outflow-trend{width:100%;height:135px;overflow:visible}.outflow-trend text{font:9px Arial,sans-serif;fill:var(--theme-muted);text-anchor:middle}.outflow-category-layout{display:grid;grid-template-columns:minmax(100px,.7fr) minmax(0,1fr);align-items:center;gap:10px;min-height:142px}.outflow-donut{width:min(100%,136px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;margin:auto;position:relative}.outflow-donut:before{content:'';position:absolute;inset:24%;border-radius:50%;background:var(--theme-raised)}.outflow-donut>span{z-index:1;display:grid;text-align:center;font-size:var(--text-lg);font-weight:750;color:var(--theme-ink)}.outflow-donut small{font-size:10px;color:var(--theme-muted);font-weight:500}.outflow-legend{display:grid;gap:7px}.outflow-legend>div{display:grid;grid-template-columns:9px minmax(0,1fr) auto;align-items:center;gap:7px;font-size:var(--text-xs);color:var(--theme-muted)}.outflow-legend i{width:8px;height:8px;border-radius:50%;background:var(--outflow-color)}.outflow-legend strong{color:var(--theme-ink)}.outflow-top{grid-column:auto}.outflow-top-row{display:grid;grid-template-columns:minmax(0,1fr) 44px;gap:6px 12px;align-items:center;padding:6px 0;color:var(--theme-muted);font-size:var(--text-xs)}.outflow-top-row strong{text-align:right;color:var(--theme-ink)}.outflow-top-row>i{grid-column:1/-1;height:7px;border-radius:99px;background:var(--theme-line);overflow:hidden}.outflow-top-row>i>b{display:block;height:100%;border-radius:inherit}
.outflow-table-panel{padding:14px}.outflow-table-panel>.section-heading{align-items:center;margin-bottom:10px}.outflow-table-panel>.section-heading>.primary{min-height:42px;white-space:nowrap}.outflow-table{min-width:950px}.outflow-table td{vertical-align:top}.outflow-table td small{display:block;max-width:200px;margin-top:3px;color:var(--theme-muted);font-size:var(--text-xs);white-space:normal}.outflow-date{white-space:nowrap}.outflow-receipt{min-height:34px;padding:5px 8px;text-decoration:none;white-space:nowrap}.outflow-pagination{display:flex;align-items:center;justify-content:center;gap:12px;padding-top:11px;color:var(--theme-muted);font-size:var(--text-xs)}.outflow-empty{text-align:center;padding:22px!important;color:var(--theme-muted)}
html[data-theme="dark"] #outflow-filter-form input,html[data-theme="dark"] #outflow-filter-form select{color:var(--theme-ink)}
@media(max-width:1000px){#outflow-filter-form{grid-template-columns:repeat(3,minmax(0,1fr))}.outflow-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.overview-tabs{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:4px}.overview-tabs button{padding:7px 5px;font-size:var(--text-xs)}.outflow-periods{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.outflow-periods button{padding:4px 3px;font-size:10px}#outflow-filter-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.outflow-search{grid-column:span 2}#outflow-filter-form button{grid-column:span 2}.outflow-kpis{gap:7px}.outflow-kpis .report-stat{padding:11px}.outflow-kpis .report-stat>span,.outflow-kpis .report-stat small{font-size:10px}.outflow-kpis .report-stat strong{font-size:var(--text-lg)}.outflow-charts{grid-template-columns:minmax(0,1fr);gap:8px}.outflow-top{grid-column:auto}.outflow-table-panel{padding:11px}.outflow-table-panel>.section-heading{align-items:flex-start;flex-direction:column}.outflow-table-panel>.section-heading>.primary{width:100%;justify-content:center}.outflow-category-layout{grid-template-columns:125px minmax(0,1fr);min-height:132px}.outflow-donut{width:120px}}

.outflow-periods #outflow-all[aria-pressed="true"]{background:linear-gradient(135deg,#3475f6,#2458df);color:#fff;border-color:transparent}

/* v1.5.1: controls remain inside their grid cells at tablet widths. */
@media(min-width:621px) and (max-width:1000px){#outflow-filter-form{grid-template-columns:repeat(6,minmax(0,1fr));gap:9px}#outflow-filter-form>label:not(.outflow-search){grid-column:span 2}.outflow-search{grid-column:span 4!important}#outflow-filter-form>button{grid-column:span 2}}

/* v1.5.4 — shared semantic control sizing and stable report-filter grids. */
:root{--form-control-height:48px}
label{margin-bottom:0}
input:not([type=checkbox]):not([type=radio]),select,textarea{box-sizing:border-box;min-width:0;max-width:100%}
.settings-grid>form{display:grid;gap:14px;align-content:start}
.settings-grid>form label,.delivery-fields label,.login-card label{display:grid;grid-template-rows:auto var(--form-control-height);gap:6px;min-width:0;margin:0;line-height:1.25}
.settings-grid>form input,.delivery-fields input,.login-card input,.user-create input,#new-username{box-sizing:border-box;width:100%;min-width:0;height:var(--form-control-height);min-height:var(--form-control-height);max-height:var(--form-control-height);margin:0}
.settings-grid>form button,.delivery-fields button,.login-card button.primary,.user-create>button{box-sizing:border-box;min-height:var(--form-control-height);height:var(--form-control-height);align-self:end}
.delivery-fields{align-items:end}
.report-filters .period-buttons{align-items:end}
.report-filters .period-buttons .date-field{display:grid;grid-template-rows:auto var(--form-control-height);gap:6px;align-self:end;min-width:0;margin:0;line-height:1.25}
.report-filters .period-buttons .date-field input[type=date]{box-sizing:border-box;width:100%;min-width:0;height:var(--form-control-height);min-height:var(--form-control-height);max-height:var(--form-control-height);margin:0;padding:0 10px;font-size:var(--text-sm);letter-spacing:normal}
.report-filters .period-buttons button,.report-filters .period-buttons>a{box-sizing:border-box;min-height:var(--form-control-height);height:var(--form-control-height);align-self:end}
#outflow-filter-form{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;align-items:end}
#outflow-filter-form>label{display:grid;grid-template-rows:auto var(--form-control-height);gap:6px;min-width:0;margin:0;line-height:1.25}
#outflow-filter-form input,#outflow-filter-form select{box-sizing:border-box;width:100%;min-width:0;height:var(--form-control-height);min-height:var(--form-control-height);max-height:var(--form-control-height);padding:0 12px;font-size:var(--text-sm)}
#outflow-filter-form .outflow-search{grid-column:span 2}
#outflow-filter-form>button{box-sizing:border-box;grid-column:auto;min-width:0;width:100%;height:var(--form-control-height);min-height:var(--form-control-height);align-self:end;white-space:nowrap}
.stock-toolbar .search,.stock-toolbar>button,.stock-toolbar>a{min-height:var(--form-control-height)}
.stock-toolbar .search input{box-sizing:border-box;height:var(--form-control-height);min-height:var(--form-control-height)}
.outflow-category-layout{grid-template-columns:minmax(118px, .72fr) minmax(0,1fr);gap:14px;min-height:172px}
.outflow-donut{display:grid;place-items:center;width:min(100%,148px);aspect-ratio:1;min-width:0;border-radius:50%;margin:auto;position:relative;background:none!important}
.outflow-donut:before{display:none}
.outflow-donut svg{position:absolute;inset:0;display:block;width:100%;height:100%;overflow:visible;transform:rotate(-90deg)}
.outflow-donut svg circle,.outflow-donut svg path{fill:none}
.outflow-donut .outflow-donut-track{stroke:var(--theme-line);stroke-width:15}
.outflow-donut>span{z-index:1;display:grid;place-content:center;width:66%;height:66%;border-radius:50%;background:var(--theme-raised);text-align:center;font-size:var(--text-lg);font-weight:750;line-height:1.15;color:var(--theme-ink)}
.outflow-donut small{font-size:10px;color:var(--theme-muted);font-weight:500}
@media(max-width:1000px){#outflow-filter-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.outflow-search{grid-column:1!important}#outflow-filter-form>button{grid-column:2}.outflow-category-layout{grid-template-columns:minmax(112px,.7fr) minmax(0,1fr)}}
@media(max-width:700px){
 .report-filters .period-buttons{grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
 .report-filters .period-buttons>button[data-period]{grid-column:span 2}
 .report-filters .period-buttons .date-field{grid-column:span 3;display:grid}
 .report-filters .period-buttons>a,.report-filters .period-buttons>#report-refresh{grid-column:span 6;width:100%;justify-content:center}
 #outflow-filter-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 #outflow-filter-form>label{grid-column:span 1!important}
 #outflow-filter-form>label.outflow-search{grid-column:1!important}
 #outflow-filter-form>button{grid-column:2!important}
 .settings-grid>form{gap:12px}.settings-grid>form input{margin:0}
 .outflow-category-layout{grid-template-columns:minmax(108px,.65fr) minmax(0,1fr);gap:10px;min-height:150px}
 .outflow-donut{width:min(100%,132px)}
}
@media(max-width:360px){.report-filters .period-buttons{gap:5px}.report-filters .period-buttons .date-field input[type=date]{padding-inline:4px;font-size:11px}#outflow-filter-form{gap:8px}}
@media(max-width:620px){#outflow-filter-form>label:not(.outflow-search){grid-column:span 1}.outflow-search{grid-column:span 2!important}#outflow-filter-form>button{grid-column:span 2}}
.top-right{gap:clamp(8px,1.5vw,20px)}.presence-users{display:flex;align-items:center;gap:9px;min-width:0;max-width:min(36vw,330px);overflow:hidden}.presence-person{display:inline-flex;align-items:center;gap:5px;min-width:0;color:var(--theme-muted);font-size:var(--text-xs);white-space:nowrap}.presence-person>span{overflow:hidden;text-overflow:ellipsis;max-width:96px}.presence-dot{width:9px;height:9px;display:inline-block;flex:none;border-radius:50%;background:var(--profile,#2864e8);box-shadow:0 0 0 2px var(--theme-surface)}.presence-more{flex:none;color:var(--theme-muted);font-size:var(--text-xs);font-weight:700}
.locked-setting{display:block;margin:-14px 0 14px;color:var(--theme-muted);font-size:var(--text-xs)}#org[readonly]{background:var(--theme-bg);color:var(--theme-muted);cursor:default}
@media(max-width:620px){.top-right{gap:7px}.top-right .live{display:none}.presence-users{gap:6px;max-width:86px}.presence-person>span{display:none}.presence-dot{width:9px;height:9px}.topbar{min-width:0}.breadcrumb{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.locked-setting{margin-top:-9px}}
:root{--form-control-height:48px}
/* Let stock actions and every quantity/status stay visible on tablet-sized screens. */
@media(min-width:621px) and (max-width:1100px){
 #stock-results .table-scroll{overflow:visible}
 #stock-results table{table-layout:fixed;width:100%;min-width:0}
 #stock-results th,#stock-results td{padding:9px 7px;white-space:normal;overflow-wrap:anywhere}
 #stock-results th:nth-child(1){width:23%}#stock-results th:nth-child(2){width:26%}#stock-results th:nth-child(3){width:9%}#stock-results th:nth-child(4){width:13%}#stock-results th:nth-child(5){width:29%}
 #stock-results .table-item{gap:7px}#stock-results .mini-item,#stock-results .table-item img{width:32px;height:32px;flex:0 0 32px}
 #stock-results td:last-child{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
 #stock-results td:last-child .primary,#stock-results td:last-child .secondary{min-height:38px;padding:7px 9px;white-space:nowrap;flex:0 0 auto}
 #stock-results .photo-button{padding:7px 6px}
}
/* Phone inventory becomes a compact, no-horizontal-scroll card row. */
@media(max-width:620px){
 #stock-results .table-scroll{overflow:visible}
 #stock-results table,#stock-results tbody{display:block;width:100%;min-width:0}
 #stock-results thead{display:none}
 #stock-results tbody tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 9px;padding:10px 0;border-top:1px solid var(--theme-line,var(--line))}
 #stock-results tbody td{display:block;padding:2px 0;border:0;white-space:normal;min-width:0}
 #stock-results tbody td:nth-child(1){grid-column:1;grid-row:1}
 #stock-results tbody td:nth-child(2){grid-column:1;grid-row:2;color:var(--theme-muted,var(--muted));font-size:var(--text-xs)}
 #stock-results tbody td:nth-child(3){grid-column:2;grid-row:1;align-self:center;text-align:right}
 #stock-results tbody td:nth-child(4){grid-column:2;grid-row:2;justify-self:end;align-self:center}
 #stock-results tbody td:nth-child(5){grid-column:1/-1;grid-row:3;display:flex;justify-content:flex-end;align-items:center;gap:6px;flex-wrap:wrap;padding-top:5px}
 #stock-results td:last-child .primary,#stock-results td:last-child .secondary{min-height:38px;padding:7px 10px;white-space:nowrap}
 #stock-results .table-item{gap:8px}#stock-results .mini-item,#stock-results .table-item img{width:34px;height:34px;flex:0 0 34px}
 .report-filters .period-buttons .date-field input[type=date]{width:100%;max-width:100%;min-width:0;box-sizing:border-box;padding-inline:8px;font-size:16px;text-align:center}
}
.report-filters .period-buttons .date-field{flex:1 1 145px;min-width:0}
.report-filters .period-buttons .date-field input[type=date]{width:100%;max-width:100%;min-width:0;box-sizing:border-box}
.outflow-filters{min-width:0;overflow:hidden}
#outflow-filter-form{min-width:0}
#outflow-filter-form>label{min-width:0;width:100%;overflow:hidden}
#outflow-filter-form input[type=date]{width:100%;max-width:100%;min-width:0;box-sizing:border-box;padding-inline:8px;text-align:center;font-size:16px}

/* Keep compact filter rails touch-scrollable without exposing a clipped scrollbar. */
@media(max-width:700px){
 .filter-row{min-width:0;max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
 .filter-row::-webkit-scrollbar{display:none}
 .filter-row .chip{scroll-snap-align:start}
}

/* Explicit SVG sizing avoids intrinsic-width and paint clipping in WebKit grids. */
.outflow-trend{display:block;width:100%;max-width:100%;min-width:0}
.outflow-donut{min-width:0;max-width:100%;isolation:isolate}
.outflow-donut svg{max-width:100%;max-height:100%;overflow:visible;shape-rendering:geometricPrecision}
.outflow-legend,.outflow-legend>div{min-width:0}
.outflow-legend>div span{min-width:0;overflow-wrap:anywhere}

/* Administration labels are separate siblings from their controls. */
.settings-grid>form>label{display:block;min-height:0;line-height:1.25}

/* Progress fills are painted on the track itself so Safari and WebKit cannot collapse a nested fill element. */
.outflow-progress{grid-column:1/-1;display:block;width:100%;height:7px;border-radius:99px;background:linear-gradient(90deg,var(--progress-color) 0 var(--progress-width),var(--theme-line) var(--progress-width) 100%)!important;}


.outflow-progress{min-width:0;border-radius:99px;}


.outflow-progress{display:block;width:100%;height:8px;min-width:0;overflow:hidden;border-radius:99px}.outflow-progress svg{display:block;width:100%;height:8px;overflow:visible}
@media(max-width:620px){.top-right .live{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font-size:10px}.top-right .live #presence-count{font-weight:750;color:var(--theme-ink)}.presence-users{max-width:58px;gap:5px}.presence-person>span{display:none}.presence-dot{width:10px;height:10px}.presence-more{font-size:10px}}


/* Keep identities readable with their chosen profile colors on phone-width headers. */
@media(max-width:620px){.presence-users{max-width:min(142px,38vw);gap:4px}.presence-person{gap:3px}.presence-person>span{display:block;max-width:36px;font-size:9px}.presence-dot{width:8px;height:8px}}
@media(max-width:400px){.top-right{gap:4px}.presence-users{max-width:36vw}.presence-person>span{max-width:30px}}

/* Presence is one readable status pill; the colored identities beside it identify active accounts. */
.live{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border:1px solid var(--theme-line,var(--line));border-radius:999px;background:var(--theme-raised,#fff);color:var(--theme-muted,#65758b);font-size:var(--text-xs);font-weight:600;line-height:1;white-space:nowrap;box-shadow:0 2px 8px rgba(28,48,80,.06)}
.live b{display:grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:rgba(36,88,230,.12);color:var(--blue,#2458e6);font-size:var(--text-xs);font-weight:750}
.account{background:transparent;cursor:default;min-width:0}.account-logout{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:36px;margin-left:auto;padding:6px 9px;border:1px solid var(--theme-line,var(--line));border-radius:9px;background:var(--theme-raised,#fff);color:var(--theme-muted,#65758b);font-size:var(--text-xs);white-space:nowrap}.account-logout .icon{width:16px;height:16px}
@media(min-width:621px){.mobile-logout{display:none!important}}
@media(max-width:620px){.account-logout{display:none}.top-right .live{display:inline-flex;align-items:center;gap:5px;max-width:none;padding:4px 6px;font-size:9px}.top-right .live b{min-width:16px;height:16px;padding:0 4px;font-size:10px}}
@media(max-width:360px){.topbar{padding-inline:8px}.top-right{gap:3px}.top-right .live{padding:3px 5px}.presence-users{max-width:32vw}.presence-person>span{max-width:27px;font-size:8px}}
html[data-theme="dark"] .live{background:var(--theme-raised);border-color:var(--theme-line);color:var(--theme-muted);box-shadow:0 2px 8px rgba(0,0,0,.16)}
html[data-theme="dark"] .live b{background:rgba(85,133,255,.18);color:#a9c2ff}
html[data-theme="dark"] .account-logout{background:var(--theme-raised);border-color:var(--theme-line);color:var(--theme-muted)}

/* v1.6.6 — keep profile and sign-out controls centered in the compact rail. */
@media(min-width:621px) and (max-width:1100px){
  .sidebar-bottom{width:100%;padding:0 0 4px}
  .account{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px 0 0}
  .account>.avatar,.account-logout{align-self:center;margin:0}
  .account-logout{display:grid;place-items:center;width:38px;min-width:38px;height:38px;min-height:38px;padding:0;border-radius:12px;font-size:0}
  .account-logout .icon{width:17px;height:17px}
  .account-logout>span{display:none}
}
@media(min-width:1101px){
  .sidebar-bottom{width:100%}
  .account{display:grid;grid-template-columns:33px minmax(0,1fr) auto;align-items:center;column-gap:9px;width:100%;padding:16px 0 0}
  .account>span:not(.avatar){min-width:0}
  .account-logout{justify-self:end;margin:0;padding-inline:8px}
}

/* Four-step, touch-first stock-entry wizard */
.entry-flow{width:min(100%,1120px);margin:0 auto;display:grid;gap:16px;min-width:0}
.entry-progress{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:14px 18px;border:1px solid var(--theme-line,var(--line));border-radius:18px;background:var(--theme-raised,#fff);box-shadow:0 8px 28px rgba(29,52,88,.06)}
.entry-progress-step{position:relative;display:flex;align-items:center;gap:10px;min-width:0;color:var(--theme-muted,#73819a)}
.entry-progress-step:not(:last-child)::after{content:"";height:2px;flex:1;min-width:8px;background:var(--theme-line,var(--line));border-radius:9px}
.entry-progress-step>span{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:11px;background:var(--theme-soft,#eef3ff);color:var(--theme-muted,#73819a);font-weight:750}
.entry-progress-step.current{color:var(--theme-ink,#14243d);font-weight:700}.entry-progress-step.current>span,.entry-progress-step.complete>span{background:var(--blue,#2458e6);color:#fff}
.entry-progress-step.complete::after{background:var(--blue,#2458e6)}.entry-progress-step small{font-size:var(--text-sm);white-space:nowrap}
.entry-trail{display:flex;align-items:center;gap:8px;min-width:0;overflow:auto;padding:0 4px;color:var(--theme-muted,#73819a);font-size:var(--text-sm);scrollbar-width:none}.entry-trail::-webkit-scrollbar{display:none}.entry-trail strong{flex:0 0 auto;padding:7px 11px;border:1px solid var(--theme-line,var(--line));border-radius:999px;background:var(--theme-raised,#fff);color:var(--theme-ink,#14243d)}
.entry-stage{width:100%;min-width:0;padding:clamp(18px,3vw,30px);border:1px solid var(--theme-line,var(--line));border-radius:22px;background:var(--theme-raised,#fff);box-shadow:0 16px 42px rgba(29,52,88,.08)}
.entry-stage-heading{display:flex;align-items:flex-start;gap:14px;margin-bottom:22px}.entry-stage-heading .step-number{display:grid;place-items:center;flex:0 0 42px;height:42px;border-radius:14px;background:var(--theme-soft,#eef3ff);color:var(--blue,#2458e6);font-size:var(--text-lg);font-weight:800}.entry-stage-heading h2{margin:0;color:var(--theme-ink,#14243d);font-size:var(--text-xl);line-height:1.2}.entry-stage-heading p{margin:6px 0 0;color:var(--theme-muted,#73819a);font-size:var(--text-base);line-height:1.45}
.entry-category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.entry-category-grid .category{position:relative;display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;min-width:0;min-height:78px;padding:14px;border:1px solid var(--theme-line,var(--line));border-radius:15px;background:var(--theme-raised,#fff);color:var(--theme-ink,#14243d);text-align:left;box-shadow:0 2px 8px rgba(29,52,88,.035);transition:border-color .16s,background .16s,box-shadow .16s,transform .16s}.entry-category-grid .category:hover{transform:translateY(-1px);border-color:rgba(36,88,230,.4);box-shadow:0 8px 20px rgba(36,88,230,.09)}.entry-category-grid .category.chosen{border:2px solid var(--blue,#2458e6);padding:13px;background:var(--theme-soft,#eef3ff);box-shadow:0 0 0 3px rgba(36,88,230,.08)}.entry-category-grid .category strong{overflow:hidden;text-overflow:ellipsis;font-size:var(--text-base);line-height:1.25}.entry-category-grid .category-icon{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;border-radius:13px;background:var(--theme-soft,#eef3ff);color:var(--blue,#2458e6)}.entry-category-grid .category-icon .icon{width:25px;height:25px}.entry-category-grid .check-circle{display:none;place-items:center;position:absolute;right:9px;top:9px;width:21px;height:21px;border-radius:50%;background:var(--blue,#2458e6);color:white}.entry-category-grid .chosen .check-circle{display:grid}.entry-category-grid .check-circle .icon{width:13px;height:13px}
.entry-article-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.entry-article-grid .article{display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;min-width:0;min-height:72px;padding:14px;border:1px solid var(--theme-line,var(--line));border-radius:15px;background:var(--theme-raised,#fff);color:var(--theme-ink,#14243d);text-align:left;font-size:var(--text-base);line-height:1.25;transition:border-color .16s,background .16s,box-shadow .16s}.entry-article-grid .article>.icon{flex:0 0 26px;width:26px;height:26px;color:var(--blue,#2458e6)}.entry-article-grid .article span{overflow:hidden;text-overflow:ellipsis}.entry-article-grid .article:hover,.entry-article-grid .article.chosen{border:2px solid var(--blue,#2458e6);padding:13px;background:var(--theme-soft,#eef3ff);box-shadow:0 0 0 3px rgba(36,88,230,.08)}
.entry-attributes{display:grid;gap:18px}.entry-attributes .attribute{margin:0;padding:0;border:0}.entry-attributes .attribute h3{margin:0 0 10px;color:var(--theme-ink,#14243d);font-size:var(--text-base);font-weight:700}.entry-attributes .chips{display:flex;flex-wrap:wrap;gap:10px}.entry-attributes .chip{display:inline-flex;align-items:center;justify-content:center;min-width:84px;min-height:52px;padding:10px 18px;border:1px solid var(--theme-line,var(--line));border-radius:13px;background:var(--theme-raised,#fff);color:var(--theme-ink,#14243d);font-size:var(--text-base);font-weight:600}.entry-attributes .chip.chosen{border:2px solid var(--blue,#2458e6);padding:9px 17px;background:var(--theme-soft,#eef3ff);color:var(--blue,#2458e6);box-shadow:0 0 0 3px rgba(36,88,230,.08)}
.entry-actions{display:flex;justify-content:space-between;gap:12px;margin-top:24px;padding-top:18px;border-top:1px solid var(--theme-line,var(--line))}.entry-actions button{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-width:164px;min-height:54px;border-radius:13px;font-size:var(--text-base);font-weight:700}.entry-actions .entry-next{margin-left:auto}.entry-actions button:disabled{opacity:.48;cursor:not-allowed;box-shadow:none}.entry-actions .entry-back{border:1px solid var(--theme-line,var(--line));background:var(--theme-raised,#fff);color:var(--theme-ink,#14243d)}
.entry-confirm{display:grid;gap:18px;max-width:760px;margin:0 auto}.entry-variant{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--theme-line,var(--line));border-radius:15px;background:var(--theme-soft,#f5f7fc)}.entry-variant-icon{display:grid;place-items:center;flex:0 0 48px;width:48px;height:48px;border-radius:14px;background:var(--blue,#2458e6);color:white}.entry-variant-icon .icon{width:25px;height:25px}.entry-variant>div{display:grid;gap:4px;min-width:0}.entry-variant strong{font-size:var(--text-lg);color:var(--theme-ink,#14243d)}.entry-variant>div>span{color:var(--theme-muted,#73819a);font-size:var(--text-base);overflow-wrap:anywhere}.entry-quantity>label,.note-field-label{display:flex;align-items:center;gap:8px;margin-bottom:9px;color:var(--theme-ink,#14243d);font-weight:700;font-size:var(--text-base)}.entry-quantity .stepper{max-width:460px;height:58px}.entry-quantity .stepper button{min-width:64px}.entry-quantity .stepper input{font-size:var(--text-xl);font-weight:750}.entry-quantity .quick-qty{display:flex;gap:9px;margin-top:9px}.entry-quantity .quick-qty button{min-width:70px;min-height:42px;border:1px solid var(--theme-line,var(--line));border-radius:10px;background:var(--theme-raised,#fff);color:var(--blue,#2458e6);font-weight:700}.entry-note{display:grid;gap:8px}.note-field-label{justify-content:flex-start;margin:0}.note-field-label small{color:var(--theme-muted,#73819a);font-size:var(--text-sm);font-weight:500}.entry-note input{width:100%;min-height:52px;padding:12px 14px;border:1px solid var(--theme-line,var(--line));border-radius:12px;background:var(--theme-raised,#fff);color:var(--theme-ink,#14243d);font:inherit;font-size:var(--text-base)}.entry-note input::placeholder{color:var(--theme-muted,#73819a);opacity:.8}.entry-note input:focus,.entry-quantity input:focus{outline:3px solid rgba(36,88,230,.2);border-color:var(--blue,#2458e6)}.entry-after{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-radius:13px;background:var(--theme-soft,#f3f6fc);color:var(--theme-muted,#73819a)}.entry-after strong{color:var(--theme-ink,#14243d);font-size:var(--text-xl)}.entry-after small{font-size:var(--text-sm);font-weight:500}.entry-confirm .safe-note{margin:0}.entry-confirm .duplicate{margin:0;padding:11px 13px;border-radius:11px}
html[data-theme="dark"] .entry-stage,html[data-theme="dark"] .entry-progress{background:var(--theme-raised);border-color:var(--theme-line)}html[data-theme="dark"] .entry-category-grid .category,html[data-theme="dark"] .entry-article-grid .article,html[data-theme="dark"] .entry-attributes .chip,html[data-theme="dark"] .entry-actions .entry-back,html[data-theme="dark"] .entry-quantity .quick-qty button,html[data-theme="dark"] .entry-note input{background:var(--theme-raised);color:var(--theme-ink);border-color:var(--theme-line)}html[data-theme="dark"] .entry-category-grid .chosen,html[data-theme="dark"] .entry-article-grid .chosen,html[data-theme="dark"] .entry-attributes .chip.chosen{background:rgba(66,112,238,.16);border-color:#5d86ff;color:#a9c2ff}html[data-theme="dark"] .entry-variant,html[data-theme="dark"] .entry-after{background:var(--theme-soft);border-color:var(--theme-line)}
@media(min-width:1000px){.entry-stage{min-height:430px}.entry-category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.entry-article-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(min-width:621px) and (max-width:999px){.entry-flow{gap:12px}.entry-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.entry-article-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.entry-stage{min-height:430px}.entry-progress-step{gap:7px}.entry-progress-step small{font-size:var(--text-xs)}}
@media(max-width:620px){.entry-flow{gap:10px}.entry-progress{gap:4px;padding:10px 8px;border-radius:14px}.entry-progress-step{justify-content:center;gap:4px}.entry-progress-step:not(:last-child)::after{position:absolute;left:calc(50% + 18px);right:calc(-50% + 18px);top:16px;z-index:0}.entry-progress-step>span{position:relative;z-index:1;flex-basis:30px;width:30px;height:30px;border-radius:10px;font-size:var(--text-sm)}.entry-progress-step small{display:block;max-width:100%;font-size:10px;line-height:1.1;text-align:center}.entry-progress-step{flex-direction:column}.entry-trail{gap:5px;font-size:var(--text-xs)}.entry-trail strong{padding:6px 9px}.entry-stage{min-height:0;padding:16px 14px;border-radius:17px}.entry-stage-heading{gap:10px;margin-bottom:17px}.entry-stage-heading .step-number{flex-basis:36px;height:36px;border-radius:11px;font-size:var(--text-base)}.entry-stage-heading h2{font-size:var(--text-lg)}.entry-stage-heading p{font-size:var(--text-sm)}.entry-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.entry-category-grid .category{min-height:74px;padding:10px;gap:9px;border-radius:13px}.entry-category-grid .category.chosen{padding:9px}.entry-category-grid .category-icon{flex-basis:38px;width:38px;height:38px;border-radius:11px}.entry-category-grid .category-icon .icon{width:22px;height:22px}.entry-category-grid .category strong{font-size:var(--text-sm);white-space:normal}.entry-article-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.entry-article-grid .article{min-height:62px;padding:10px;gap:8px;border-radius:13px;font-size:var(--text-sm)}.entry-article-grid .article:hover,.entry-article-grid .article.chosen{padding:9px}.entry-article-grid .article>.icon{flex-basis:22px;width:22px;height:22px}.entry-attributes{gap:15px}.entry-attributes .chips{gap:8px}.entry-attributes .chip{flex:1 0 calc(33.333% - 8px);min-width:74px;min-height:48px;padding:8px 10px;border-radius:11px;font-size:var(--text-sm)}.entry-attributes .chip.chosen{padding:7px 9px}.entry-actions{gap:9px;margin-top:18px;padding-top:14px}.entry-actions button{min-width:0;flex:1;min-height:50px;padding:10px;border-radius:12px;font-size:var(--text-sm)}.entry-actions .entry-next{margin-left:auto}.entry-confirm{gap:14px}.entry-variant{padding:12px;gap:10px}.entry-variant-icon{flex-basis:40px;width:40px;height:40px}.entry-variant strong{font-size:var(--text-base)}.entry-variant>div>span{font-size:var(--text-sm)}.entry-quantity .stepper{height:54px}.entry-quantity .stepper button{min-width:54px}.entry-quantity .quick-qty button{flex:1;min-height:44px}.entry-note input{min-height:50px}.entry-after{padding:12px}.entry-after strong{font-size:var(--text-lg)}}
@media(max-width:360px){.entry-stage{padding-inline:12px}.entry-category-grid{gap:7px}.entry-category-grid .category{gap:7px;padding:8px}.entry-category-grid .category.chosen{padding:7px}.entry-category-grid .category-icon{flex-basis:34px;width:34px;height:34px}.entry-category-grid .category strong{font-size:var(--text-xs)}.entry-progress-step small{font-size:9px}.entry-attributes .chip{min-width:66px}.entry-actions button{font-size:var(--text-xs)}}
/* v1.6.4 — give charts first position, keep controls readable and group sortie items. */
#page>.dashboard-chart-top{margin-bottom:14px}
#page>.dashboard-recent{grid-template-columns:minmax(0,1fr);gap:12px;margin-top:12px}
#page>.dashboard-recent>.recent-card{grid-column:1}
.report-content{display:flex;flex-direction:column;gap:10px}
.report-content>.trend-panel{order:1;margin:0}
.report-content>.report-kpis{order:2;margin:0}
#outflow-results{display:flex;flex-direction:column;gap:10px}
#outflow-results>.outflow-charts{order:1;margin:0}
#outflow-results>.outflow-kpis{order:2;margin:0}
#outflow-results>.outflow-table-panel{order:3}
.outflow-stock-panel #stock-results .table-scroll{overflow:visible}
.outflow-stock-panel #stock-results table{display:block;width:100%;min-width:0;table-layout:fixed}
.outflow-stock-panel #stock-results thead{display:none}
.outflow-stock-panel #stock-results tbody{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-top:14px}
.outflow-stock-panel #stock-results tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"item quantity" "details details" "state state" "actions actions";align-content:start;gap:9px;min-width:0;margin:0;padding:14px;border:1px solid var(--theme-line);border-radius:16px;background:var(--theme-raised);box-shadow:0 5px 18px rgba(22,42,76,.06)}
.outflow-stock-panel #stock-results td{display:block;min-width:0;padding:0;border:0;white-space:normal;overflow-wrap:anywhere;color:var(--theme-muted)}
.outflow-stock-panel #stock-results td:nth-child(1){grid-area:item}
.outflow-stock-panel #stock-results td:nth-child(2){grid-area:details;font-size:var(--text-xs)}
.outflow-stock-panel #stock-results td:nth-child(3){grid-area:quantity;text-align:right;white-space:nowrap}
.outflow-stock-panel #stock-results td:nth-child(3)::after{content:' en stock';display:block;font-size:var(--text-xs);color:var(--theme-muted)}
.outflow-stock-panel #stock-results td:nth-child(4){grid-area:state}
.outflow-stock-panel #stock-results td:nth-child(5){grid-area:actions;display:flex;gap:8px;align-items:center}
.outflow-stock-panel #stock-results td:nth-child(5)>.primary,.outflow-stock-panel #stock-results td:nth-child(5)>.secondary{flex:1;min-height:46px}
.outflow-stock-panel #stock-results .table-item{gap:9px}
.outflow-stock-panel #stock-results .table-item strong{color:var(--theme-ink)}
.movement-tinted{background:color-mix(in srgb,var(--profile,#2864e8) 20%,var(--theme-raised));border:1px solid color-mix(in srgb,var(--profile,#2864e8) 24%,var(--theme-line));border-radius:13px;margin:8px 0;padding:14px 12px}
.movement-tinted:last-child{border-bottom:1px solid color-mix(in srgb,var(--profile,#2864e8) 24%,var(--theme-line))}
.movement-tinted .movement-main strong,.movement-tinted .delta{color:var(--theme-ink)}
.topbar .live{position:relative;cursor:pointer;text-align:center}
.presence-tooltip{position:absolute;z-index:100;top:calc(100% + 9px);right:0;display:grid;gap:7px;min-width:210px;width:max-content;max-width:min(320px,80vw);padding:12px;border:1px solid var(--theme-line);border-radius:13px;background:var(--theme-raised);color:var(--theme-ink);box-shadow:0 14px 34px rgba(10,25,48,.2);text-align:left;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .14s ease,transform .14s ease,visibility .14s;pointer-events:none}
.topbar .live:hover .presence-tooltip,.topbar .live:focus-visible .presence-tooltip,.topbar .live[aria-expanded="true"] .presence-tooltip{opacity:1;visibility:visible;transform:translateY(0)}
.presence-tooltip-person{display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:8px;font-size:var(--text-sm);font-weight:650}.presence-tooltip-person small{color:var(--theme-muted);font-size:var(--text-xs);font-weight:500}.presence-tooltip-empty{color:var(--theme-muted);font-size:var(--text-sm)}
.outflow-stock-panel #stock-results .status{display:inline-flex}
@media(max-width:700px){.outflow-stock-panel #stock-results tbody{grid-template-columns:minmax(0,1fr);gap:9px}.outflow-stock-panel #stock-results tr{padding:12px}}
@media(max-width:620px){#page>.dashboard-chart-top{gap:9px;margin-bottom:9px}#page>.dashboard-recent{margin-top:9px}.report-content{gap:8px}.outflow-charts{order:1}.outflow-kpis{order:2}.movement-tinted{padding:11px 9px;margin:7px 0}}
@media(prefers-reduced-motion:reduce){.presence-tooltip{transition:none}}
.custom-item-field{display:grid;gap:8px;max-width:640px;margin:14px 0}.custom-item-field label{font-size:var(--text-sm);font-weight:700;color:var(--theme-ink)}.custom-item-field input{width:100%;min-height:52px;padding:12px 14px;border:1px solid var(--theme-line);border-radius:12px;background:var(--theme-raised);color:var(--theme-ink);font:inherit;font-size:16px}.custom-item-field p{margin:0;color:var(--theme-muted);font-size:var(--text-xs);line-height:1.5}