:root{
  --bg:#03101a;
  --panel:#071827;
  --panel2:#0a2032;
  --panel3:#0c263a;
  --line:#18374f;
  --line2:#234964;
  --text:#f4f7fb;
  --muted:#8ea2b4;
  --blue:#1476ff;
  --blue2:#0b5ed7;
  --green:#36d884;
  --shadow:0 18px 44px rgba(0,0,0,.38);
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;font-family:Inter,Segoe UI,Arial,sans-serif;background:#020a11;color:var(--text)}
button,input{font:inherit}
button{outline:none}
.app-shell{
  height:100vh;
  min-height:760px;
  display:grid;
  grid-template-columns:232px 1fr;
  overflow:hidden;
  background:#020a11;
}
.sidebar{
  background:linear-gradient(180deg,#03101c 0%,#061928 100%);
  border-right:1px solid #173149;
  padding:20px 14px 16px;
  display:flex;
  flex-direction:column;
  z-index:10;
}
.brand{
  height:108px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:6px 10px 10px;
  overflow:visible;
}
.brand img{
  display:block;
  width:208px;
  max-width:100%;
  height:auto;
  max-height:92px;
  object-fit:contain;
  object-position:center center;
  border-radius:0;
  margin:0 auto;
}
nav{
  display:grid;
  gap:8px;
  margin-top:12px;
}
.nav-item{
  height:54px;
  border:0;
  border-radius:12px;
  background:transparent;
  color:#d8e1e9;
  text-align:left;
  padding:0 18px;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
  transition:.18s ease;
}
.nav-item span{
  display:inline-grid;
  place-items:center;
  width:31px;
  margin-right:4px;
  font-size:18px;
  color:#9db0bf;
}
.nav-item:hover{background:#0a2840}
.nav-item.active{
  color:#fff;
  background:linear-gradient(135deg,#1678ff,#0b5ed2);
  box-shadow:0 10px 28px rgba(10,102,255,.24);
}
.nav-item.active span{color:#fff}

.driver-card{
  margin-top:auto;
  background:#071a29;
  border:1px solid #1a3a53;
  border-radius:14px;
  padding:13px;
  display:flex;
  gap:11px;
  align-items:center;
}
.driver-icon{
  width:48px;height:48px;border-radius:50%;
  display:grid;place-items:center;
  background:#1169ec;
  font-size:22px;
}
.driver-card small{display:block;color:#8fa3b4;font-size:11px}
.driver-card strong{display:block;margin:2px 0 5px;font-size:13px}
.online{font-size:11px;color:#afbecb}
.online i,.green-dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--green);display:inline-block;margin-right:5px
}
.sync-btn{
  margin-top:12px;
  height:48px;
  border:1px solid #1c3d57;
  border-radius:12px;
  background:#071827;
  color:#dce6ee;
  font-weight:600;
  cursor:pointer;
}

.workspace{
  position:relative;
  overflow:hidden;
  background:#0b171d;
}
#map{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 72% 22%,rgba(44,83,64,.34),transparent 32%),
    linear-gradient(135deg,#13211e,#27372e);
}

/* dark veil similar to generated mockup */
#map:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(2,10,17,.12),rgba(2,10,17,.03));
  pointer-events:none;
}
.top-chip,.editor-card,.route-panel,.filters,.status-bar{
  position:absolute;
  z-index:6;
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:var(--shadow);
}

.top-chip{
  left:24px;top:22px;
  padding:13px 18px;
  background:rgba(5,23,38,.94);
  border:1px solid #23455f;
  border-radius:16px;
  font-size:13px;
  font-weight:800;
  letter-spacing:.1px;
}
.top-chip b{color:var(--green);margin-left:8px}

.editor-card{
  left:24px;
  top:86px;
  width:350px;
  max-height:520px;
  overflow:auto;
  background:rgba(5,22,36,.95);
  border:1px solid #21425c;
  border-radius:18px;
  padding:15px;
}
.editor-card::-webkit-scrollbar,.route-panel::-webkit-scrollbar{width:6px}
.editor-card::-webkit-scrollbar-thumb,.route-panel::-webkit-scrollbar-thumb{background:#21445f;border-radius:10px}

.editor-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding-bottom:12px;
  border-bottom:1px solid #17384f;
}
.editor-head small{display:block;color:#8fa5b7;font-size:11px;margin-bottom:3px}
.editor-head strong{font-size:13px}
.secondary-btn,.text-btn{
  border:1px solid #21465f;
  background:#0a263b;
  color:#dcebf6;
  border-radius:10px;
  padding:8px 10px;
  cursor:pointer;
  font-size:12px;
}
.text-btn{border:0;background:transparent;color:#61a8ff;font-weight:700}
.stop-editor-title{display:flex;justify-content:space-between;align-items:center;margin:12px 0 8px}
.stop-editor-title strong{font-size:13px}
.stop-row{
  display:grid;
  grid-template-columns:28px 1fr 26px;
  gap:7px;
  align-items:center;
  margin:7px 0;
}
.stop-row .num{
  width:27px;height:27px;
  border-radius:50%;
  background:#fff;
  border:2px solid #1680ff;
  display:grid;place-items:center;
  color:#0b59c9;
  font-weight:900;
  font-size:11px;
}
.stop-row input{
  width:100%;
  border:1px solid #22465f;
  background:#071a29;
  color:#fff;
  border-radius:10px;
  padding:9px 10px;
  font-size:12px;
}
.stop-row input:focus{border-color:#157cff;box-shadow:0 0 0 2px rgba(21,124,255,.12)}
.delete-stop{border:0;background:transparent;color:#90a5b6;font-size:18px;cursor:pointer}

.route-panel{
  right:22px;
  top:110px;
  width:344px;
  max-height:calc(100vh - 156px);
  overflow:auto;
  background:rgba(5,22,36,.96);
  border:1px solid #24465f;
  border-radius:20px;
  padding:19px;
}
.panel-title{display:flex;align-items:center;justify-content:space-between}
.panel-title h2{margin:0;font-size:19px}
.badge{
  background:#0b382a;
  color:#57e091;
  border:1px solid rgba(87,224,145,.16);
  padding:6px 10px;
  border-radius:10px;
  font-size:11px;
  font-weight:800;
}
.route-stops{margin:16px 0}
.route-stop{
  display:grid;
  grid-template-columns:30px 1fr auto;
  gap:9px;
  padding:9px 0 12px;
  position:relative;
}
.route-stop:not(:last-child):after{
  content:"";
  position:absolute;
  left:14px;top:38px;
  height:calc(100% - 18px);
  border-left:1px dashed #496274;
}
.route-stop .n{
  width:29px;height:29px;
  background:#fff;
  border:2px solid #1a80ff;
  border-radius:50%;
  display:grid;place-items:center;
  color:#0c58c6;
  font-size:11px;
  font-weight:900;
  z-index:1;
}
.route-stop strong{font-size:12px;line-height:1.35}
.route-stop small{display:block;color:#8ea3b5;margin-top:4px;font-size:10px}
.route-stop time{font-size:11px;color:#55df8e;white-space:nowrap}

.summary{
  border-top:1px solid #18384f;
  padding-top:13px;
}
.summary h3{font-size:13px;margin:0 0 12px}
.summary-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.summary-grid div{text-align:center;padding:5px 4px;border-right:1px solid #19374e}
.summary-grid div:last-child{border:0}
.summary-grid span{display:block;font-size:20px;color:#2d83ff}
.summary-grid strong{display:block;font-size:17px;margin:5px 0}
.summary-grid small{display:block;color:#93a7b7;font-size:9px;line-height:1.2}

.primary-btn,.ai-btn{
  width:100%;
  height:54px;
  border-radius:13px;
  margin-top:14px;
  cursor:pointer;
  color:#fff;
  font-weight:800;
  font-size:13px;
}
.primary-btn{
  border:0;
  background:linear-gradient(135deg,#177bff,#085ed6);
  box-shadow:0 10px 24px rgba(8,94,214,.24);
}
.ai-btn{
  border:1px solid #24475f;
  background:#071a29;
}
.primary-btn:hover{filter:brightness(1.06)}
.ai-btn:hover{background:#0a2235}
.primary-btn:disabled,.ai-btn:disabled{opacity:.45;cursor:not-allowed}

.filters{
  left:24px;
  bottom:50px;
  display:flex;
  gap:14px;
  align-items:center;
  background:rgba(5,22,36,.95);
  border:1px solid #24465f;
  border-radius:16px;
  padding:11px 16px;
}
.filters>strong{font-size:12px;margin-right:3px}
.filters label{
  display:flex;
  align-items:center;
  gap:7px;
  color:#c9d5de;
  font-size:11px;
  white-space:nowrap;
}
.filters input{display:none}
.filters label i{
  width:38px;height:21px;border-radius:20px;
  background:#56636c;
  position:relative;cursor:pointer;
}
.filters label i:after{
  content:"";
  position:absolute;
  width:15px;height:15px;
  border-radius:50%;
  background:#fff;
  top:3px;left:3px;
  transition:.2s;
}
.filters input:checked+i{background:#38cd7c}
.filters input:checked+i:after{left:20px}

.status-bar{
  left:0;right:0;bottom:0;
  height:40px;
  background:rgba(4,17,28,.98);
  border-top:1px solid #17364c;
  display:flex;
  align-items:center;
  justify-content:space-around;
  color:#a9b7c2;
  font-size:11px;
}
.status-bar b{color:#e3edf4}

.map-label{
  background:#fff;
  color:#0c2544;
  border-radius:9px;
  padding:8px 10px;
  font-weight:800;
  font-size:11px;
  box-shadow:0 8px 22px rgba(0,0,0,.32);
  max-width:220px;
}

.loading{animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.45}}
.error-banner{
  position:absolute;
  z-index:25;
  left:50%;top:18px;
  transform:translateX(-50%);
  background:#601822;
  border:1px solid #aa4351;
  color:#fff;
  padding:12px 18px;
  border-radius:12px;
  box-shadow:var(--shadow);
  font-size:13px;
}

@media(max-width:1180px){
  .app-shell{grid-template-columns:82px 1fr}
  .brand img{width:56px;object-fit:cover;object-position:left}
  .nav-item{font-size:0;padding:0;text-align:center}
  .nav-item span{font-size:20px;width:auto;margin:0}
  .driver-card,.sync-btn{display:none}
  .route-panel{right:14px;width:310px}
  .editor-card{left:14px;width:315px}
  .filters{left:14px;right:14px;overflow:auto}
  .top-chip{left:14px}
}
@media(max-width:840px){
  .app-shell{display:block}
  .sidebar{display:none}
  .workspace{height:100vh}
  .top-chip{left:12px;top:12px}
  .editor-card{left:12px;right:12px;top:68px;width:auto;max-height:210px}
  .route-panel{left:12px;right:12px;top:auto;bottom:96px;width:auto;max-height:42vh}
  .filters{display:none}
  .status-bar{font-size:9px}
}


/* Televending permanent numbered stop markers */
.tv-stop-overlay{
  position:absolute;
  transform:translate(-20px,-20px);
  display:flex;
  align-items:center;
  gap:8px;
  z-index:9999;
  pointer-events:none;
  white-space:nowrap;
}
.tv-stop-number{
  width:40px;
  height:40px;
  border-radius:50%;
  background:#fff;
  border:4px solid #0875ff;
  color:#0755c7;
  display:grid;
  place-items:center;
  font:900 16px/1 Inter,Segoe UI,Arial,sans-serif;
  box-shadow:0 5px 18px rgba(0,0,0,.45),0 0 0 2px rgba(255,255,255,.4);
  flex:0 0 40px;
}
.tv-stop-label{
  max-width:240px;
  overflow:hidden;
  text-overflow:ellipsis;
  background:rgba(255,255,255,.98);
  color:#0a2344;
  border-radius:9px;
  padding:8px 10px;
  font:800 11px/1.25 Inter,Segoe UI,Arial,sans-serif;
  box-shadow:0 6px 20px rgba(0,0,0,.38);
}


/* V11: Televending-styled confirmation modal */
.tv-modal-backdrop[hidden]{display:none}
.tv-modal-backdrop{
  position:fixed;
  inset:0;
  z-index:99999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(1,8,14,.68);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  opacity:0;
  transition:opacity .16s ease;
}
.tv-modal-backdrop.show{opacity:1}
.tv-modal{
  width:min(430px,100%);
  background:linear-gradient(180deg,#071b2b,#061624);
  border:1px solid #244862;
  border-radius:20px;
  box-shadow:0 24px 70px rgba(0,0,0,.5);
  padding:22px;
  transform:translateY(8px) scale(.985);
  transition:transform .16s ease;
}
.tv-modal-backdrop.show .tv-modal{transform:translateY(0) scale(1)}
.tv-modal-icon{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#0c3c2d;
  color:#59e394;
  font-size:23px;
  font-weight:900;
  margin-bottom:14px;
}
.tv-modal-content small{
  color:#55a6ff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
}
.tv-modal-content h3{
  margin:6px 0 7px;
  font-size:20px;
}
.tv-modal-content p{
  margin:0;
  color:#aebdca;
  font-size:13px;
  line-height:1.5;
}
.tv-modal-actions{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:10px;
  margin-top:20px;
}
.tv-modal-btn{
  height:48px;
  border-radius:12px;
  cursor:pointer;
  font-weight:800;
}
.tv-modal-btn-secondary{
  border:1px solid #294b62;
  background:#081b2a;
  color:#dbe6ee;
}
.tv-modal-btn-primary{
  border:0;
  background:linear-gradient(135deg,#1678ff,#0a5ed7);
  color:#fff;
  box-shadow:0 10px 24px rgba(10,94,215,.24);
}
.route-stop-clickable{cursor:pointer;transition:background .15s ease,border-color .15s ease}
.route-stop-clickable:hover{background:rgba(20,118,255,.08);border-radius:10px}


/* V12: collapsible location and route panels */
.panel-min-btn{
  position:absolute;
  top:12px;
  right:12px;
  width:28px;
  height:28px;
  border:1px solid #244b68;
  border-radius:9px;
  background:#0a2740;
  color:#dcecf8;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  z-index:3;
  display:grid;
  place-items:center;
}
.panel-min-btn:hover{background:#0d3150}
.route-min-btn{top:14px;right:14px}

.editor-card,
.route-panel{
  transition:
    width .2s ease,
    height .2s ease,
    max-height .2s ease,
    padding .2s ease,
    transform .2s ease,
    opacity .2s ease;
}

.editor-card.collapsed{
  width:54px !important;
  height:54px !important;
  min-height:54px !important;
  max-height:54px !important;
  overflow:hidden !important;
  padding:0 !important;
  border-radius:16px !important;
}
.editor-card.collapsed > *:not(.editor-head){display:none !important}
.editor-card.collapsed .editor-head{
  border:0 !important;
  padding:0 !important;
  height:54px;
}
.editor-card.collapsed .editor-head > *:not(.panel-min-btn){display:none !important}
.editor-card.collapsed .panel-min-btn{
  position:static;
  margin:auto;
  width:100%;
  height:100%;
  border:0;
  border-radius:16px;
  background:transparent;
}

.route-panel.collapsed{
  width:54px !important;
  height:54px !important;
  min-height:54px !important;
  max-height:54px !important;
  overflow:hidden !important;
  padding:0 !important;
  border-radius:16px !important;
}
.route-panel.collapsed > *:not(.panel-title){display:none !important}
.route-panel.collapsed .panel-title{
  height:54px;
  padding:0;
}
.route-panel.collapsed .panel-title > *:not(.panel-min-btn){display:none !important}
.route-panel.collapsed .panel-min-btn{
  position:static;
  margin:auto;
  width:100%;
  height:100%;
  border:0;
  border-radius:16px;
  background:transparent;
}

@media(max-width:840px){
  .editor-card.collapsed,
  .route-panel.collapsed{
    width:54px !important;
    left:auto !important;
  }
  .editor-card.collapsed{right:12px !important}
  .route-panel.collapsed{right:12px !important;bottom:96px !important}
}


/* V13: keep existing header actions clear of the minimize buttons */
#editorCard:not(.collapsed) .editor-head{
  padding-right:48px;
}
#editorCard:not(.collapsed) #gpsBtn{
  margin-right:38px;
}

#routePanel:not(.collapsed) .panel-title{
  padding-right:48px;
}
#routePanel:not(.collapsed) .panel-title .status-pill,
#routePanel:not(.collapsed) .panel-title .done,
#routePanel:not(.collapsed) .panel-title [class*="status"]{
  margin-right:38px;
}


/* V14: functional Objects module using existing Televending visual language */
.objects-drawer[hidden]{display:none}
.objects-drawer{
  position:absolute;
  inset:0;
  z-index:40;
  background:rgba(1,8,14,.55);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  opacity:0;
  transition:opacity .17s ease;
}
.objects-drawer.show{opacity:1}
.objects-drawer-card{
  position:absolute;
  left:24px;
  top:22px;
  bottom:52px;
  width:min(620px,calc(100% - 48px));
  background:rgba(5,22,36,.98);
  border:1px solid #24465f;
  border-radius:20px;
  box-shadow:0 22px 60px rgba(0,0,0,.48);
  padding:20px;
  overflow:auto;
}
.objects-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #19384f;
  padding-bottom:14px;
}
.objects-head small{color:#57a6ff;font-size:10px;font-weight:900;letter-spacing:.08em}
.objects-head h2{margin:4px 0 0;font-size:22px}
.objects-head-actions{display:flex;gap:8px;align-items:center}
.objects-close-btn{position:static;width:38px;height:38px}
.objects-toolbar{
  display:grid;
  grid-template-columns:100px 130px 1fr;
  gap:10px;
  align-items:center;
  margin:15px 0;
  padding:12px;
  background:#071a29;
  border:1px solid #1e3d55;
  border-radius:14px;
}
.objects-toolbar>div strong{display:block;font-size:20px}
.objects-toolbar>div small{display:block;color:#8fa4b5;font-size:10px;margin-top:2px}
.objects-route-btn{margin:0;height:46px}
.objects-status{color:#8fa4b5;font-size:11px;margin:10px 2px}
.objects-list{display:grid;gap:9px}
.object-row{
  display:grid;
  grid-template-columns:26px 1fr 72px;
  gap:12px;
  align-items:center;
  background:#071a29;
  border:1px solid #1d3c54;
  border-radius:14px;
  padding:13px;
  cursor:pointer;
}
.object-row:hover{border-color:#2b5a79;background:#092036}
.object-row input{width:18px;height:18px;accent-color:#1476ff}
.object-row input:disabled{opacity:.35;cursor:not-allowed}
.object-title-line{display:flex;align-items:center;gap:8px}
.object-title-line strong{font-size:14px}
.object-machine-id{
  background:#0b2d47;color:#73b3ff;border-radius:8px;padding:3px 6px;font-size:10px;font-weight:800
}
.object-address{color:#d0dce5;font-size:11px;margin-top:4px}
.object-meta{display:flex;gap:10px;flex-wrap:wrap;color:#8fa4b5;font-size:10px;margin-top:6px}
.object-stock{text-align:right}
.object-stock strong{display:block;font-size:17px}
.object-stock small{color:#8fa4b5;font-size:9px}
.object-ok{border-left:3px solid #36d884}
.object-warning{border-left:3px solid #ffb84d}
.object-error{border-left:3px solid #ff6470}
@media(max-width:840px){
  .objects-drawer-card{left:12px;top:12px;bottom:50px;width:calc(100% - 24px);padding:14px}
  .objects-toolbar{grid-template-columns:1fr 1fr}
  .objects-route-btn{grid-column:1/-1}
}


/* V15: editable machine addresses */
.object-edit-address{
  margin-top:7px;
  border:1px solid #2a4b63;
  background:#0a2438;
  color:#8fc1ff;
  border-radius:8px;
  padding:6px 8px;
  font-size:9px;
  font-weight:800;
  cursor:pointer;
  white-space:nowrap;
}
.object-edit-address:hover{background:#0d2f49}
.address-edit-label{
  display:block;
  margin-top:16px;
  color:#92a7b8;
  font-size:11px;
  font-weight:700;
}
.address-edit-input{
  width:100%;
  margin-top:7px;
  border:1px solid #294a62;
  background:#071a29;
  color:#fff;
  border-radius:11px;
  padding:11px 12px;
  outline:none;
}
.address-edit-input:focus{
  border-color:#1476ff;
  box-shadow:0 0 0 2px rgba(20,118,255,.13);
}


/* V17: expandable Machines module */
.machines-drawer[hidden]{display:none}
.machines-drawer{
  position:absolute;
  inset:0;
  z-index:40;
  background:rgba(1,8,14,.55);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  opacity:0;
  transition:opacity .17s ease;
}
.machines-drawer.show{opacity:1}
.machines-drawer-card{
  position:absolute;
  left:24px;
  top:22px;
  bottom:52px;
  width:min(720px,calc(100% - 48px));
  background:rgba(5,22,36,.98);
  border:1px solid #24465f;
  border-radius:20px;
  box-shadow:0 22px 60px rgba(0,0,0,.48);
  padding:20px;
  overflow:auto;
}
.machines-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #19384f;
  padding-bottom:14px;
}
.machines-head small{color:#57a6ff;font-size:10px;font-weight:900;letter-spacing:.08em}
.machines-head h2{margin:4px 0 0;font-size:22px}
.machines-head-actions{display:flex;gap:8px;align-items:center}
.machines-close-btn{position:static;width:38px;height:38px}
.machines-list{display:grid;gap:10px;margin-top:12px}
.machine-card{
  border:1px solid #1d3d55;
  border-radius:14px;
  overflow:hidden;
  background:#071a29;
}
.machine-card-summary{
  width:100%;
  border:0;
  background:transparent;
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px;
  cursor:pointer;
  text-align:left;
}
.machine-card-summary:hover{background:#092036}
.machine-summary-left{display:flex;gap:11px;align-items:center;min-width:0}
.machine-dot{width:10px;height:10px;border-radius:50%;flex:0 0 10px}
.machine-state-ok{background:#36d884}
.machine-state-warning{background:#ffb84d}
.machine-state-error{background:#ff6470}
.machine-name-line{display:flex;align-items:center;gap:8px}
.machine-name-line strong{font-size:14px}
.machine-name-line span{font-size:10px;color:#73b3ff;background:#0b2d47;padding:3px 6px;border-radius:7px}
.machine-summary-left small{display:block;color:#8fa4b5;margin-top:4px;font-size:10px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.machine-summary-right{display:flex;align-items:center;gap:14px;text-align:right}
.machine-summary-right strong{display:block;font-size:16px}
.machine-summary-right small{display:block;color:#8fa4b5;font-size:9px}
.machine-chevron{font-size:20px;color:#7f9aad;transition:transform .16s ease}
.machine-card-summary.open .machine-chevron{transform:rotate(180deg)}
.machine-details{
  border-top:1px solid #19384f;
  padding:14px;
  background:#061624;
}
.machine-details-loading,.machine-details-error{color:#91a5b5;font-size:11px;padding:8px}
.machine-metrics{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin-bottom:14px;
}
.machine-metrics>div{
  border:1px solid #1e3e56;
  background:#081c2c;
  border-radius:11px;
  padding:10px;
}
.machine-metrics small{display:block;color:#8fa4b5;font-size:9px;margin-bottom:5px}
.machine-metrics strong{font-size:13px}
.machine-products-head{display:flex;justify-content:space-between;align-items:center;margin:10px 0}
.machine-products-head strong{font-size:12px}
.machine-products-head small{color:#8fa4b5;font-size:10px}
.machine-products-list{display:grid;gap:6px}
.machine-product-row{
  display:grid;
  grid-template-columns:1fr 90px 100px;
  gap:8px;
  align-items:center;
  border:1px solid #1b394f;
  border-radius:10px;
  padding:9px 10px;
  background:#071a29;
}
.machine-product-row>div:first-child strong{display:block;font-size:11px}
.machine-product-row>div:first-child small{color:#7f94a6;font-size:9px}
.machine-product-stock,.machine-product-restock{text-align:right}
.machine-product-stock strong,.machine-product-restock strong{display:block;font-size:11px}
.machine-product-stock small,.machine-product-restock small{display:block;color:#8298a9;font-size:8px}
.machine-product-restock span{color:#51dc8b;font-size:10px;font-weight:800}
.product-zero{border-left:3px solid #ff6470}
.product-low{border-left:3px solid #ffb84d}
.product-ok{border-left:3px solid #36d884}
@media(max-width:840px){
  .machines-drawer-card{left:12px;top:12px;bottom:50px;width:calc(100% - 24px);padding:14px}
  .machine-metrics{grid-template-columns:1fr 1fr}
  .machine-product-row{grid-template-columns:1fr 70px 80px}
}

/* V18: date filter + historical product availability */
.machines-date-filter{
  display:grid;
  grid-template-columns:1fr 1fr auto;
  gap:10px;
  align-items:end;
  margin:14px 0 6px;
  padding:12px;
  background:#071a29;
  border:1px solid #1e3d55;
  border-radius:14px;
}
.machines-date-filter label span{
  display:block;
  color:#8fa4b5;
  font-size:10px;
  margin-bottom:6px;
}
.machines-date-filter input{
  width:100%;
  border:1px solid #294a62;
  background:#061624;
  color:#fff;
  border-radius:10px;
  padding:9px 10px;
}
.machine-product-row{
  grid-template-columns:1.3fr 90px 95px 100px;
}
.machine-product-sales{text-align:right}
.machine-product-sales strong{display:block;font-size:11px}
.machine-product-sales small{display:block;color:#8298a9;font-size:8px}
@media(max-width:840px){
  .machines-date-filter{grid-template-columns:1fr 1fr}
  .machines-date-filter button{grid-column:1/-1}
  .machine-product-row{grid-template-columns:1fr 80px 80px}
  .machine-product-sales{display:none}
}


/* V20: Televending custom Machines calendar */
.machines-date-filter{
  position:relative;
  overflow:visible;
}
.tv-date-field>span{
  display:block;
  color:#8fa4b5;
  font-size:10px;
  margin-bottom:6px;
}
.tv-date-button{
  width:100%;
  height:42px;
  border:1px solid #294a62;
  background:#061624;
  color:#fff;
  border-radius:10px;
  padding:0 11px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  text-align:left;
}
.tv-date-button:hover,
.tv-date-button:focus{
  border-color:#1476ff;
  box-shadow:0 0 0 2px rgba(20,118,255,.12);
}
.tv-date-icon{
  color:#36d884;
  font-size:17px;
}
.tv-calendar[hidden]{display:none}
.tv-calendar{
  position:absolute;
  z-index:999;
  width:292px;
  background:#061624;
  border:1px solid #294a62;
  border-radius:15px;
  padding:12px;
  box-shadow:0 20px 48px rgba(0,0,0,.52);
  opacity:0;
  transform:translateY(-6px) scale(.985);
  transition:opacity .14s ease,transform .14s ease;
}
.tv-calendar.show{
  opacity:1;
  transform:translateY(0) scale(1);
}
.tv-calendar-head{
  height:38px;
  display:grid;
  grid-template-columns:36px 1fr 36px;
  align-items:center;
  gap:6px;
  margin-bottom:8px;
}
.tv-calendar-head strong{
  text-align:center;
  font-size:13px;
}
.tv-calendar-arrow{
  width:34px;
  height:34px;
  border:1px solid #203e54;
  border-radius:9px;
  background:#081d2d;
  color:#dfe9ef;
  cursor:pointer;
  font-size:22px;
  display:grid;
  place-items:center;
}
.tv-calendar-arrow:hover{
  border-color:#1476ff;
  background:#0a263b;
}
.tv-calendar-weekdays,
.tv-calendar-days{
  display:grid;
  grid-template-columns:repeat(7,1fr);
  gap:4px;
}
.tv-calendar-weekdays{
  margin-bottom:5px;
}
.tv-calendar-weekdays span{
  text-align:center;
  color:#758b9d;
  font-size:9px;
  font-weight:800;
  padding:4px 0;
}
.tv-calendar-day{
  aspect-ratio:1;
  min-width:0;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#dce6ed;
  cursor:pointer;
  font-size:11px;
  font-weight:700;
}
.tv-calendar-day:hover{
  background:#0b2b43;
  color:#fff;
}
.tv-calendar-day.outside{
  color:#536878;
}
.tv-calendar-day.today{
  box-shadow:inset 0 0 0 1px #36d884;
  color:#61e49a;
}
.tv-calendar-day.selected{
  background:linear-gradient(135deg,#177bff,#075ed9);
  color:#fff;
  box-shadow:0 7px 18px rgba(10,98,220,.28);
}
.tv-calendar-footer{
  border-top:1px solid #19384f;
  margin-top:9px;
  padding-top:9px;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.tv-calendar-footer button{
  border:0;
  background:transparent;
  color:#58a8ff;
  font-size:10px;
  font-weight:800;
  cursor:pointer;
  padding:5px;
}
.tv-calendar-footer button:first-child{
  color:#52df8e;
}
@media(max-width:840px){
  .tv-calendar{
    width:min(292px,calc(100vw - 52px));
    left:0 !important;
  }
}


/* V22: full-row semi-transparent stock status */
.machine-product-row{
  transition:background .16s ease,border-color .16s ease,box-shadow .16s ease;
}

/* Enough stock */
.machine-product-row.product-ok{
  background:linear-gradient(90deg,rgba(54,216,132,.16),rgba(54,216,132,.075));
  border-color:rgba(54,216,132,.38);
  border-left:3px solid #36d884;
}

/* Low stock / refill soon */
.machine-product-row.product-low{
  background:linear-gradient(90deg,rgba(255,184,77,.22),rgba(255,184,77,.09));
  border-color:rgba(255,184,77,.48);
  border-left:3px solid #ffb84d;
}

/* Empty / refill required */
.machine-product-row.product-zero{
  background:linear-gradient(90deg,rgba(255,100,112,.24),rgba(255,100,112,.095));
  border-color:rgba(255,100,112,.50);
  border-left:3px solid #ff6470;
}

.machine-product-row.product-ok:hover{
  background:linear-gradient(90deg,rgba(54,216,132,.22),rgba(54,216,132,.11));
}
.machine-product-row.product-low:hover{
  background:linear-gradient(90deg,rgba(255,184,77,.28),rgba(255,184,77,.13));
}
.machine-product-row.product-zero:hover{
  background:linear-gradient(90deg,rgba(255,100,112,.30),rgba(255,100,112,.14));
}

/* Keep all text readable over the tinted backgrounds */
.machine-product-row strong{color:#f4f8fb}
.machine-product-row small{color:#a9bbc8}
.machine-product-row.product-ok .machine-product-restock span{color:#65e8a0}
.machine-product-row.product-low .machine-product-restock strong{color:#ffd08a}
.machine-product-row.product-zero .machine-product-restock strong{color:#ff9ca4}

/* V23: brighter full-row stock colors */
.machine-product-row.product-ok{
  background:linear-gradient(90deg,rgba(54,216,132,.30),rgba(54,216,132,.14));
  border-color:rgba(54,216,132,.62);
  box-shadow:inset 0 0 18px rgba(54,216,132,.055);
}
.machine-product-row.product-low{
  background:linear-gradient(90deg,rgba(255,184,77,.36),rgba(255,184,77,.17));
  border-color:rgba(255,184,77,.68);
  box-shadow:inset 0 0 18px rgba(255,184,77,.06);
}
.machine-product-row.product-zero{
  background:linear-gradient(90deg,rgba(255,100,112,.40),rgba(255,100,112,.18));
  border-color:rgba(255,100,112,.72);
  box-shadow:inset 0 0 18px rgba(255,100,112,.07);
}
.machine-product-row.product-ok:hover{
  background:linear-gradient(90deg,rgba(54,216,132,.36),rgba(54,216,132,.18));
}
.machine-product-row.product-low:hover{
  background:linear-gradient(90deg,rgba(255,184,77,.43),rgba(255,184,77,.21));
}
.machine-product-row.product-zero:hover{
  background:linear-gradient(90deg,rgba(255,100,112,.47),rgba(255,100,112,.23));
}


/* V24: mobile navigation — desktop design unchanged */
@media(max-width:840px){
  .sidebar{
    position:fixed !important;
    left:0 !important;
    right:0 !important;
    top:auto !important;
    bottom:0 !important;
    width:100% !important;
    height:64px !important;
    min-height:64px !important;
    z-index:1200 !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    padding:5px 8px !important;
    border-right:0 !important;
    border-top:1px solid #1d3d55 !important;
    background:rgba(4,18,30,.97) !important;
    box-shadow:0 -8px 28px rgba(0,0,0,.32) !important;
    overflow:visible !important;
  }

  .sidebar .brand{
    display:none !important;
  }

  .sidebar nav{
    width:100% !important;
    height:100% !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-around !important;
    gap:4px !important;
    margin:0 !important;
    padding:0 !important;
  }

  .sidebar .nav-item{
    display:flex !important;
    flex:1 1 0 !important;
    min-width:0 !important;
    height:52px !important;
    margin:0 !important;
    padding:5px 3px !important;
    border-radius:10px !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:3px !important;
    font-size:9px !important;
    line-height:1.05 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  .sidebar .nav-item svg,
  .sidebar .nav-item i{
    width:18px !important;
    height:18px !important;
    min-width:18px !important;
    font-size:17px !important;
  }

  .app{
    padding-bottom:64px !important;
  }

  .map-wrap,
  .main{
    bottom:64px !important;
  }

  .machines-drawer,
  .objects-drawer{
    bottom:64px !important;
  }

  .machines-drawer-card{
    bottom:10px !important;
  }
}


/* V25: mobile calendar fix */
@media(max-width:840px){
  .machines-date-filter{
    position:static !important;
    overflow:visible !important;
  }

  .tv-calendar{
    position:fixed !important;
    left:12px !important;
    right:12px !important;
    top:50% !important;
    bottom:auto !important;
    width:auto !important;
    max-width:none !important;
    max-height:calc(100vh - 110px) !important;
    overflow:auto !important;
    transform:translateY(-50%) scale(.985) !important;
    z-index:5000 !important;
    padding:14px !important;
    border-radius:16px !important;
  }

  .tv-calendar.show{
    transform:translateY(-50%) scale(1) !important;
  }

  .tv-calendar-head{
    position:sticky;
    top:0;
    z-index:2;
    background:#061624;
    padding-bottom:6px;
  }

  .tv-calendar-weekdays{
    position:sticky;
    top:44px;
    z-index:2;
    background:#061624;
    padding-bottom:4px;
  }

  .tv-calendar-day{
    min-height:38px !important;
    font-size:12px !important;
    border-radius:10px !important;
  }

  .tv-calendar-arrow{
    width:38px !important;
    height:38px !important;
  }

  .tv-calendar-footer{
    position:sticky;
    bottom:0;
    z-index:2;
    background:#061624;
    padding-top:10px;
  }

  .tv-calendar-footer button{
    min-height:36px;
    padding:8px 10px !important;
  }

  .machines-drawer,
  .machines-drawer-card{
    overflow:visible !important;
  }

  body.calendar-open{
    overflow:hidden !important;
  }
}

/* V26: true mobile modal calendar */
.mobile-calendar-overlay[hidden]{display:none}
.mobile-calendar-overlay{
  display:none;
}

@media(max-width:840px){
  .mobile-calendar-overlay{
    position:fixed;
    inset:0;
    z-index:4998;
    display:block;
    background:rgba(0,0,0,.58);
    backdrop-filter:blur(4px);
    -webkit-backdrop-filter:blur(4px);
    opacity:0;
    transition:opacity .14s ease;
  }
  .mobile-calendar-overlay.show{
    opacity:1;
  }

  .tv-calendar.mobile-modal-calendar{
    position:fixed !important;
    z-index:4999 !important;
    left:50% !important;
    top:50% !important;
    right:auto !important;
    bottom:auto !important;
    width:min(340px,calc(100vw - 28px)) !important;
    max-width:340px !important;
    max-height:calc(100vh - 120px) !important;
    overflow:auto !important;
    margin:0 !important;
    padding:14px !important;
    border-radius:18px !important;
    transform:translate(-50%,-50%) scale(.985) !important;
    box-shadow:0 24px 70px rgba(0,0,0,.58) !important;
  }

  .tv-calendar.mobile-modal-calendar.show{
    transform:translate(-50%,-50%) scale(1) !important;
  }

  .tv-calendar.mobile-modal-calendar .tv-calendar-head{
    position:static !important;
    padding:0 !important;
    background:transparent !important;
  }

  .tv-calendar.mobile-modal-calendar .tv-calendar-weekdays{
    position:static !important;
    padding:0 !important;
    background:transparent !important;
  }

  .tv-calendar.mobile-modal-calendar .tv-calendar-footer{
    position:static !important;
    background:transparent !important;
  }

  .tv-calendar.mobile-modal-calendar .tv-calendar-days{
    gap:5px !important;
  }

  .tv-calendar.mobile-modal-calendar .tv-calendar-day{
    min-height:40px !important;
    aspect-ratio:1/1 !important;
    font-size:13px !important;
  }

  body.calendar-open{
    overflow:hidden !important;
    touch-action:none;
  }
}


/* V31: Statistics */
.statistics-drawer[hidden]{display:none}
.statistics-drawer{
  position:absolute;
  inset:0;
  z-index:42;
  background:rgba(1,8,14,.55);
  backdrop-filter:blur(5px);
  -webkit-backdrop-filter:blur(5px);
  opacity:0;
  transition:opacity .17s ease;
}
.statistics-drawer.show{opacity:1}
.statistics-drawer-card{
  position:absolute;
  left:24px;
  right:24px;
  top:22px;
  bottom:52px;
  background:rgba(5,22,36,.985);
  border:1px solid #24465f;
  border-radius:20px;
  box-shadow:0 22px 60px rgba(0,0,0,.48);
  padding:20px;
  overflow:auto;
}
.statistics-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #19384f;
  padding-bottom:14px;
}
.statistics-head small{color:#57a6ff;font-size:10px;font-weight:900;letter-spacing:.08em}
.statistics-head h2{margin:4px 0 0;font-size:22px}
.statistics-head-actions{display:flex;gap:8px;align-items:center}
.statistics-close-btn{position:static;width:38px;height:38px}
.statistics-filter{
  display:grid;
  grid-template-columns:minmax(150px,220px) minmax(180px,260px) auto;
  gap:10px;
  align-items:end;
  margin:15px 0;
  padding:12px;
  background:#071a29;
  border:1px solid #1e3d55;
  border-radius:14px;
}
.statistics-filter-group label{
  display:block;
  color:#8fa4b5;
  font-size:10px;
  margin-bottom:6px;
}
.statistics-filter select{
  width:100%;
  height:42px;
  border:1px solid #294a62;
  border-radius:10px;
  background:#061624;
  color:#fff;
  padding:0 10px;
}
.statistics-apply-btn{height:42px;margin:0;padding:0 18px}
.statistics-status{
  color:#8fa4b5;
  font-size:11px;
  margin:8px 2px 14px;
}
.statistics-kpis{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-bottom:12px;
}
.statistics-kpi{
  background:#071a29;
  border:1px solid #1d3d55;
  border-radius:14px;
  padding:14px;
}
.statistics-kpi small{
  display:block;
  color:#8fa4b5;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.04em;
}
.statistics-kpi strong{
  display:block;
  margin:6px 0 4px;
  font-size:20px;
  color:#f4f8fb;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.statistics-kpi span{
  color:#8fa4b5;
  font-size:9px;
}
.statistics-kpi .trend-up{color:#54df8f}
.statistics-kpi .trend-down{color:#ff7580}
.statistics-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.statistics-section{
  background:#071a29;
  border:1px solid #1d3d55;
  border-radius:15px;
  padding:15px;
  min-width:0;
}
.statistics-section-wide{grid-column:1/-1}
.statistics-section-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:12px;
}
.statistics-section-head small{
  color:#57a6ff;
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
}
.statistics-section-head h3{
  font-size:14px;
  margin:3px 0 0;
}
.statistics-ranking{display:grid;gap:10px}
.statistics-rank-row{
  display:grid;
  grid-template-columns:28px 1fr;
  gap:9px;
  align-items:center;
}
.statistics-rank-position{
  width:28px;height:28px;
  display:grid;place-items:center;
  border-radius:9px;
  background:#0a2a42;
  color:#6cb1ff;
  font-size:10px;
  font-weight:900;
}
.statistics-rank-title{
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:11px;
}
.statistics-rank-title strong{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.statistics-rank-title span{
  color:#dfe8ee;
  font-weight:800;
  white-space:nowrap;
}
.statistics-rank-bar{
  height:7px;
  border-radius:10px;
  overflow:hidden;
  background:#102a3d;
  margin:5px 0 3px;
}
.statistics-rank-bar i{
  display:block;
  height:100%;
  border-radius:10px;
  background:linear-gradient(90deg,#1476ff,#36d884);
}
.statistics-rank-main small{color:#8297a8;font-size:8px}
.statistics-location-products{display:grid;gap:8px}
.statistics-location-card{
  border:1px solid #1b3a51;
  border-radius:11px;
  padding:10px;
  background:#061624;
}
.statistics-location-title{
  display:flex;
  justify-content:space-between;
  gap:10px;
  font-size:11px;
  margin-bottom:8px;
}
.statistics-location-title span{color:#55df8e;font-weight:800}
.statistics-location-tags{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.statistics-location-tags span{
  border:1px solid #21455e;
  border-radius:8px;
  background:#0a2437;
  color:#b8c8d3;
  padding:5px 7px;
  font-size:8px;
}
.statistics-location-tags span.top{
  border-color:rgba(54,216,132,.45);
  background:rgba(54,216,132,.10);
  color:#62e59d;
}
.statistics-location-tags b{margin-left:4px}
.statistics-seasons{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:9px;
}
.season-card{
  background:#061624;
  border:1px solid #1b3a51;
  border-radius:12px;
  padding:11px;
}
.season-title{
  display:flex;
  gap:7px;
  align-items:center;
  margin-bottom:9px;
}
.season-title span{color:#57a6ff;font-size:16px}
.season-title strong{font-size:12px}
.season-products{display:grid;gap:6px}
.season-products>div{
  display:grid;
  grid-template-columns:18px 1fr auto;
  gap:5px;
  font-size:9px;
}
.season-products>div b{color:#5faaff}
.season-products>div span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.season-products>div strong{
  color:#aabcc8;
  white-space:nowrap;
}
.season-products small{color:#718797;font-size:8px}
.ai-insights-section{
  background:
    radial-gradient(circle at 95% 0%,rgba(20,118,255,.11),transparent 35%),
    #071a29;
}
.ai-insights-badge{
  border:1px solid rgba(87,166,255,.30);
  background:rgba(20,118,255,.10);
  color:#73b5ff;
  border-radius:9px;
  padding:5px 8px;
  font-size:8px;
  font-weight:900;
}
.ai-insights-list{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:9px;
}
.ai-insight{
  display:grid;
  grid-template-columns:36px 1fr;
  gap:10px;
  border:1px solid #1e3e55;
  background:#061624;
  border-radius:12px;
  padding:11px;
}
.ai-insight-icon{
  width:36px;height:36px;
  border-radius:10px;
  display:grid;place-items:center;
  font-size:16px;
  background:#0a2a42;
  color:#66adff;
}
.ai-insight strong{font-size:11px}
.ai-insight p{
  margin:4px 0 0;
  color:#91a5b5;
  font-size:9px;
  line-height:1.45;
}
.ai-insight.positive{border-left:3px solid #36d884}
.ai-insight.positive .ai-insight-icon{background:rgba(54,216,132,.12);color:#56e294}
.ai-insight.warning{border-left:3px solid #ffb84d}
.ai-insight.warning .ai-insight-icon{background:rgba(255,184,77,.12);color:#ffc669}
.statistics-empty{
  color:#7f94a5;
  font-size:10px;
  padding:10px;
}
@media(max-width:840px){
  .statistics-drawer{bottom:64px}
  .statistics-drawer-card{
    left:12px;
    right:12px;
    top:12px;
    bottom:10px;
    padding:14px;
  }
  .statistics-filter{
    grid-template-columns:1fr 1fr;
  }
  .statistics-apply-btn{grid-column:1/-1}
  .statistics-kpis{
    grid-template-columns:1fr 1fr;
  }
  .statistics-grid{
    grid-template-columns:1fr;
  }
  .statistics-section-wide{grid-column:auto}
  .statistics-seasons{
    grid-template-columns:1fr 1fr;
  }
  .ai-insights-list{
    grid-template-columns:1fr;
  }
}

/* V32 practical statistics */
.stats-compact-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
.stats-compact-kpi,.stats-visual-card,.stats-ai-card{background:#071a29;border:1px solid #1d3d55;border-radius:16px;padding:14px}
.stats-compact-kpi small,.stats-card-head small{color:#8297a8;font-size:9px;text-transform:uppercase}
.stats-compact-kpi strong{display:block;margin:6px 0 4px;font-size:21px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stats-compact-kpi span{font-size:9px;color:#899dad}.trend-up{color:#55df8e!important}.trend-down{color:#ff7882!important}
.stats-visual-grid{display:grid;grid-template-columns:.85fr 1.3fr;gap:12px}
.stats-card-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.stats-card-head h3{margin:3px 0 0;font-size:14px}
.stats-donut-wrap{display:grid;grid-template-columns:190px 1fr;gap:18px;align-items:center;min-height:210px}
.stats-donut{width:180px;height:180px;border-radius:50%;position:relative;margin:auto;background:conic-gradient(#17354a 0 100%)}
.stats-donut:after{content:'';position:absolute;inset:28px;background:#071a29;border-radius:50%;border:1px solid #17364b}
.stats-donut-center{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center}
.stats-donut-center strong{font-size:20px}.stats-donut-center small{color:#8297a8;font-size:9px}
.stats-donut-legend{display:grid;gap:9px}.stats-legend-row{display:grid;grid-template-columns:10px 1fr auto;gap:8px;align-items:center;font-size:10px}
.stats-legend-row i{width:9px;height:9px;border-radius:50%}
.stats-bars{height:220px;display:flex;align-items:flex-end;gap:9px;padding:22px 4px 0}
.stats-bar-item{flex:1;min-width:0;height:100%;display:grid;grid-template-rows:22px 1fr 34px;gap:5px;text-align:center}
.stats-bar-value{font-size:8px;color:#9eb0bd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stats-bar-track{width:min(42px,75%);height:100%;margin:auto;border-radius:9px 9px 4px 4px;background:#102b3e;display:flex;align-items:flex-end;overflow:hidden}
.stats-bar-track i{width:100%;display:block;border-radius:9px 9px 3px 3px;background:linear-gradient(180deg,#42e09a,#1476ff)}
.stats-bar-label{font-size:8px;color:#aebdc8;line-height:1.15;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.stats-ai-card{margin-top:12px}.stats-ai-badge{padding:5px 8px;border:1px solid rgba(87,166,255,.3);border-radius:9px;color:#74b6ff;background:rgba(20,118,255,.1);font-size:8px;font-weight:900}
.stats-ai-list{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
.stats-ai-tip{display:grid;grid-template-columns:32px 1fr;gap:8px;padding:10px;border:1px solid #1c3a50;border-radius:11px;background:#061624}
.stats-ai-tip>span{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:#0a2a42;color:#67afff}
.stats-ai-tip strong{font-size:10px}.stats-ai-tip p{margin:4px 0 0;font-size:8px;line-height:1.4;color:#8fa3b2}
.stats-ai-tip.positive{border-left:3px solid #36d884}.stats-ai-tip.warning{border-left:3px solid #ffb84d}
.stats-empty-small{color:#7f94a5;font-size:9px;padding:10px}
@media(max-width:840px){
 .stats-compact-kpis,.stats-visual-grid,.stats-ai-list{grid-template-columns:1fr}
 .stats-donut-wrap{grid-template-columns:150px 1fr}.stats-donut{width:145px;height:145px}.stats-donut:after{inset:23px}
 .stats-bars{height:190px}
}

/* V33 richer statistics, preserving V32 visual language */
.stats-secondary-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.stats-seasons-card{margin-top:12px}
.stats-soft-badge{font-size:8px;color:#8fbfff;border:1px solid #254c67;background:#0a2336;border-radius:9px;padding:5px 8px}
.stats-neighborhoods{display:grid;gap:11px}
.stats-neighborhood-title{display:flex;justify-content:space-between;font-size:10px}
.stats-neighborhood-title span{color:#8fb0c1}
.stats-neighborhood-track{height:9px;background:#102b3e;border-radius:9px;overflow:hidden;margin:5px 0 3px}
.stats-neighborhood-track i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,#1476ff,#36d884)}
.stats-neighborhood-row small{font-size:8px;color:#7f94a5}

.stats-risk-list{display:grid;gap:7px}
.stats-risk-row{display:grid;grid-template-columns:1fr auto 46px;gap:9px;align-items:center;background:#061624;border:1px solid #1d3b51;border-radius:10px;padding:9px}
.stats-risk-row strong{font-size:10px}.stats-risk-row small{display:block;color:#8297a8;font-size:8px;margin-top:2px}.stats-risk-row b{text-align:right;font-size:11px}
.stats-risk-pill{font-size:8px;font-weight:900;border-radius:8px;padding:5px 7px}
.risk-ok{border-left:3px solid #36d884}.risk-ok .stats-risk-pill{color:#64e69f;background:rgba(54,216,132,.11)}
.risk-mid{border-left:3px solid #ffb84d}.risk-mid .stats-risk-pill{color:#ffc96f;background:rgba(255,184,77,.11)}
.risk-high{border-left:3px solid #ff6470}.risk-high .stats-risk-pill{color:#ff8d96;background:rgba(255,100,112,.12)}
.risk-off{border-left:3px solid #718595}.risk-off .stats-risk-pill{color:#9eb0bd;background:#102535}

.stats-season-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.stats-season-card{background:#061624;border:1px solid #1d3b51;border-radius:13px;padding:11px;text-align:center}
.stats-season-ring{width:54px;height:54px;border-radius:50%;margin:0 auto 7px;display:grid;place-items:center;border:7px solid color-mix(in srgb,var(--season) 72%,#102b3e);box-shadow:inset 0 0 0 1px #0f2738}
.stats-season-ring span{font-size:17px}.stats-season-card>strong{font-size:11px}
.stats-season-top{display:grid;gap:5px;margin-top:9px;text-align:left}
.stats-season-top>div{display:grid;grid-template-columns:16px 1fr auto;gap:4px;font-size:8px;align-items:center}
.stats-season-top b{color:#68afff}.stats-season-top span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stats-season-top small{color:#8da0ad}

.stats-combo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.stats-combo-card{display:grid;grid-template-columns:28px 1fr auto;gap:8px;align-items:center;background:#061624;border:1px solid #1c3a50;border-radius:11px;padding:9px}
.stats-combo-rank{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#0a2b43;color:#6db3ff;font-size:9px;font-weight:900}
.stats-combo-card strong{font-size:10px;display:block}.stats-combo-card small{font-size:8px;color:#8297a8}.stats-combo-card>b{font-size:9px;color:#57df90}

.stats-actions-list{display:grid;gap:8px}
.stats-action-row{display:grid;grid-template-columns:30px 1fr;gap:9px;padding:10px;border-radius:11px;background:#061624;border:1px solid #1d3b51}
.stats-action-row>span{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#0a2a42;color:#66adff;font-size:9px;font-weight:900}
.stats-action-row strong{font-size:10px}.stats-action-row p{margin:3px 0 0;color:#8da1b0;font-size:8px;line-height:1.45}
.stats-action-row.good{border-left:3px solid #36d884}.stats-action-row.warn{border-left:3px solid #ffb84d}.stats-action-row.info{border-left:3px solid #1476ff}

@media(max-width:840px){
 .stats-secondary-grid{grid-template-columns:1fr}
 .stats-season-cards{grid-template-columns:1fr 1fr}
 .stats-combo-grid{grid-template-columns:1fr}
}

/* V34 statistics performance + richer AI */
.stats-loading-line{
  display:flex;
  align-items:center;
  gap:9px;
  color:#8499a8;
  font-size:9px;
  padding:12px 4px;
}
.stats-loading-line i{
  width:14px;height:14px;
  border:2px solid #1d4058;
  border-top-color:#4da4ff;
  border-radius:50%;
  animation:statsSpin .8s linear infinite;
}
@keyframes statsSpin{to{transform:rotate(360deg)}}

.stats-ai-report-card{
  margin-top:12px;
  background:
    radial-gradient(circle at 100% 0%,rgba(20,118,255,.09),transparent 38%),
    #071a29;
}
.stats-ai-report{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.stats-ai-report-row{
  display:grid;
  grid-template-columns:28px 1fr;
  gap:9px;
  align-items:start;
  padding:10px;
  background:#061624;
  border:1px solid #1d3b51;
  border-radius:11px;
}
.stats-ai-report-row>span{
  width:28px;height:28px;
  display:grid;place-items:center;
  border-radius:9px;
  background:linear-gradient(135deg,#0d3451,#0a2539);
  color:#6eb4ff;
  font-size:9px;
  font-weight:900;
}
.stats-ai-report-row p{
  margin:0;
  color:#a0b2bf;
  font-size:9px;
  line-height:1.55;
}
@media(max-width:840px){
  .stats-ai-report{grid-template-columns:1fr}
}

/* V35 product labels: real name + muted #number */
.product-number-muted{
  color:#657b8b;
  font-size:.82em;
  font-weight:600;
  opacity:.78;
  white-space:nowrap;
}
.stats-bar-label .product-number-muted,
.stats-season-top .product-number-muted{
  display:inline;
}

/* V36 statistics readability */
.stats-compact-kpi small,
.stats-card-head small{font-size:11px}

.stats-compact-kpi strong{font-size:24px}
.stats-compact-kpi span{font-size:11px}

.stats-card-head h3{font-size:17px}

.stats-legend-row{font-size:12px}
.stats-donut-center strong{font-size:23px}
.stats-donut-center small{font-size:11px}

.stats-bar-value{font-size:10px}
.stats-bar-label{font-size:11px;line-height:1.25}

.stats-ai-tip strong{font-size:12px}
.stats-ai-tip p{font-size:10px;line-height:1.5}

.stats-neighborhood-title{font-size:12px}
.stats-neighborhood-row small{font-size:10px}

.stats-risk-row strong{font-size:12px}
.stats-risk-row small{font-size:10px}
.stats-risk-row b{font-size:13px}
.stats-risk-pill{font-size:10px}

.stats-season-card>strong{font-size:13px}
.stats-season-top>div{font-size:10px}
.stats-season-top small{font-size:9px}

.stats-combo-card strong{font-size:12px}
.stats-combo-card small{font-size:10px}
.stats-combo-card>b{font-size:11px}

.stats-action-row strong{font-size:12px}
.stats-action-row p{font-size:10px;line-height:1.5}

.stats-ai-report-row p{font-size:11px;line-height:1.55}

.stats-empty-small,
.stats-loading-line{font-size:11px}

/* #product number suffix from V35 is intentionally removed */
.product-number-muted{display:none!important}

/* V37: password gate for Machines and Statistics only */
.protected-access-modal{max-width:440px}
.protected-access-error{margin-top:9px;color:#ff8585;font-size:13px;font-weight:700}
#protectedAccessPassword{margin-top:14px;width:100%}