@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Lexend:wght@300;400;500;600;700&family=Montserrat:wght@400;500;600;700;800&display=swap');
:root{--bg:#f5f8fc;--card:#fff;--ink:#10213d;--muted:#66758d;--line:#dde6f2;--blue:#0d5bd7;--blue2:#0a46a8;--navy:#071d42;--green:#13875d;--amber:#bd7400;--red:#c33b43;--shadow:0 14px 40px rgba(22,50,92,.10);--font-display:'Bebas Neue',sans-serif;--font-body:'Lexend',sans-serif;--font-ui:'Montserrat',sans-serif}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font-body),ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.login-shell{min-height:100vh;display:grid;grid-template-columns:1.05fr .95fr;background:linear-gradient(135deg,#071d42,#0d5bd7 60%,#65a7ff)}.login-brand{padding:8vw;display:flex;flex-direction:column;justify-content:center;color:#fff;position:relative;overflow:hidden}.login-brand:after{content:"";position:absolute;width:420px;height:420px;border:1px solid rgba(255,255,255,.18);border-radius:50%;right:-160px;top:-80px;box-shadow:0 0 0 70px rgba(255,255,255,.05),0 0 0 140px rgba(255,255,255,.03)}.brandmark{width:64px;height:64px;border-radius:18px;background:#fff;color:var(--blue);display:grid;place-items:center;font-size:28px;font-weight:900;box-shadow:0 16px 40px rgba(0,0,0,.2)}.login-brand h1{font-size:clamp(42px,5vw,76px);line-height:.95;margin:28px 0 18px;letter-spacing:-3px}.login-brand p{max-width:650px;font-size:18px;line-height:1.65;color:#d9e9ff}.login-panel{background:#f8fbff;display:flex;align-items:center;justify-content:center;padding:30px}.login-card{width:min(500px,100%);background:#fff;border:1px solid var(--line);border-radius:28px;padding:34px;box-shadow:var(--shadow)}.login-card h2{margin:0 0 6px;font-size:30px}.sub{color:var(--muted);margin:0 0 24px}.field{display:grid;gap:8px;margin:14px 0}.field label{font-size:13px;font-weight:700;color:#41516a}.field input,.field select,.field textarea{width:100%;border:1px solid #ccd8e8;background:#fff;border-radius:12px;padding:12px 13px;outline:none;color:var(--ink)}.field textarea{min-height:90px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:#70a8f7;box-shadow:0 0 0 3px #e4efff}.btn{border:0;border-radius:12px;padding:11px 16px;font-weight:800;background:#eef3fa;color:var(--ink)}.btn.primary{background:var(--blue);color:#fff}.btn.primary:hover{background:var(--blue2)}.btn.danger{background:#fff0f1;color:var(--red)}.btn.ghost{background:transparent;border:1px solid var(--line)}.btn.small{padding:8px 11px;font-size:13px}.btn.block{width:100%;padding:13px}.demo-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:20px}.demo{border:1px solid var(--line);background:#f8fbff;padding:10px;border-radius:12px;text-align:left}.demo b{display:block;font-size:12px}.demo span{font-size:11px;color:var(--muted)}.shell{min-height:100vh;display:grid;grid-template-columns:250px 1fr}.sidebar{background:var(--navy);color:#d8e7ff;padding:22px 16px;position:sticky;top:0;height:100vh}.side-brand{display:flex;align-items:center;gap:12px;padding:8px 8px 24px}.side-logo{width:42px;height:42px;border-radius:12px;background:#fff;color:var(--blue);display:grid;place-items:center;font-weight:900}.side-brand b{color:#fff;font-size:17px}.side-brand small{display:block;color:#8eabd3}.nav{display:grid;gap:6px}.nav button{border:0;background:transparent;color:#b9ccec;padding:11px 12px;border-radius:10px;text-align:left;font-weight:700}.nav button:hover,.nav button.active{background:#103466;color:#fff}.side-footer{position:absolute;left:16px;right:16px;bottom:18px;border-top:1px solid #17355f;padding-top:14px}.user-chip{display:flex;gap:10px;align-items:center;margin-bottom:10px}.avatar{width:36px;height:36px;border-radius:50%;background:#1d65c9;color:#fff;display:grid;place-items:center;font-weight:900}.user-chip b{font-size:13px;color:#fff}.user-chip small{display:block;color:#88a5ca}.main{min-width:0}.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 30px;background:rgba(245,248,252,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.page-title h1{margin:0;font-size:23px}.page-title p{margin:2px 0 0;color:var(--muted);font-size:12px}.top-actions{display:flex;align-items:center;gap:10px}.content{padding:28px;max-width:1500px}.metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px}.metric{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:0 7px 20px rgba(22,50,92,.05)}.metric small{color:var(--muted);font-weight:700}.metric strong{display:block;font-size:30px;margin-top:7px}.metric .hint{font-size:11px;color:#7c8ba0;margin-top:4px}.grid2{display:grid;grid-template-columns:1.35fr .65fr;gap:18px;margin-top:18px}.card{background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:0 8px 24px rgba(22,50,92,.05);overflow:hidden}.card-head{padding:17px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px}.card-head h3{margin:0;font-size:16px}.card-body{padding:18px}.table-wrap{overflow:auto}.table{width:100%;border-collapse:collapse;min-width:720px}.table th{text-align:left;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:#7d8ba0;padding:11px 12px;border-bottom:1px solid var(--line);background:#f9fbfe}.table td{padding:12px;border-bottom:1px solid #edf2f8;font-size:13px;vertical-align:middle}.table tr:last-child td{border-bottom:0}.badge{display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;background:#edf3fb;color:#38516f;font-size:11px;font-weight:800}.badge.green{background:#e7f7f0;color:var(--green)}.badge.amber{background:#fff4df;color:var(--amber)}.badge.red{background:#ffebed;color:var(--red)}.badge.blue{background:#e7f0ff;color:var(--blue)}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:16px;flex-wrap:wrap}.toolbar .left,.toolbar .right{display:flex;gap:9px;align-items:center;flex-wrap:wrap}.toolbar input,.toolbar select{border:1px solid var(--line);padding:10px 12px;border-radius:11px;background:#fff}.empty{padding:44px 20px;text-align:center;color:var(--muted)}.activity{display:grid;gap:14px}.activity-item{display:grid;grid-template-columns:10px 1fr;gap:10px}.activity-dot{width:9px;height:9px;background:#76aaf0;border-radius:50%;margin-top:5px}.activity-item b{font-size:12px}.activity-item p{margin:2px 0 0;font-size:12px;color:var(--muted)}.modal-bg{position:fixed;inset:0;background:rgba(4,15,34,.55);z-index:50;display:grid;place-items:center;padding:20px}.modal{width:min(620px,100%);max-height:88vh;overflow:auto;background:#fff;border-radius:20px;box-shadow:0 25px 80px rgba(0,0,0,.25)}.modal-head{padding:18px 20px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.modal-head h3{margin:0}.modal-body{padding:20px}.modal-foot{padding:16px 20px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;gap:10px}.x{border:0;background:transparent;font-size:22px;color:var(--muted)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-grid .span2{grid-column:1/-1}.delivery-card{border:1px solid var(--line);border-radius:16px;padding:16px;margin-bottom:12px;background:#fff}.delivery-card .row{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.delivery-card h3{margin:0 0 4px}.delivery-meta{color:var(--muted);font-size:13px;line-height:1.6}.delivery-actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}.route-no{width:34px;height:34px;border-radius:10px;background:#e9f2ff;color:var(--blue);display:grid;place-items:center;font-weight:900;flex:0 0 auto}.complaint{border:1px solid var(--line);border-radius:14px;margin-bottom:12px;overflow:hidden}.complaint-top{padding:14px 16px;background:#fbfcfe;display:flex;justify-content:space-between;gap:12px}.complaint-body{padding:14px 16px}.comments{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}.comment{background:#f7f9fc;padding:10px 12px;border-radius:10px;margin:8px 0}.comment b{font-size:11px}.comment p{margin:4px 0;font-size:12px}.proof-thumb{width:62px;height:62px;object-fit:cover;border-radius:10px;border:1px solid var(--line)}.mobile-menu{display:none}.toast{position:fixed;right:24px;bottom:24px;background:#10213d;color:#fff;padding:12px 16px;border-radius:12px;box-shadow:var(--shadow);transform:translateY(30px);opacity:0;pointer-events:none;transition:.2s;z-index:100}.toast.show{transform:none;opacity:1}.toast.error{background:#a92c36}.kicker{font-size:12px;color:var(--blue);font-weight:900;text-transform:uppercase;letter-spacing:.08em}.hero-card{background:linear-gradient(135deg,#0b4db7,#0d66e9);color:#fff;border-radius:20px;padding:24px;position:relative;overflow:hidden}.hero-card:after{content:"";position:absolute;width:230px;height:230px;border-radius:50%;border:1px solid rgba(255,255,255,.18);right:-80px;top:-100px;box-shadow:0 0 0 45px rgba(255,255,255,.05)}.hero-card h2{margin:5px 0 8px;font-size:28px}.hero-card p{color:#dceaff;max-width:700px}.invoice{border:1px solid var(--line);border-radius:14px;padding:15px;margin-bottom:10px;display:grid;grid-template-columns:1fr auto;gap:10px}.invoice .num{font-weight:900;color:var(--blue)}@media(max-width:1100px){.metrics{grid-template-columns:repeat(3,1fr)}.grid2{grid-template-columns:1fr}.shell{grid-template-columns:210px 1fr}}@media(max-width:760px){.login-shell{grid-template-columns:1fr}.login-brand{display:none}.login-panel{min-height:100vh;padding:16px}.login-card{padding:24px;border-radius:20px}.shell{display:block}.sidebar{position:fixed;left:-280px;width:250px;z-index:30;transition:.2s;box-shadow:20px 0 60px rgba(0,0,0,.25)}.sidebar.open{left:0}.mobile-menu{display:inline-flex}.topbar{height:68px;padding:0 16px}.content{padding:16px}.page-title h1{font-size:19px}.metrics{grid-template-columns:1fr 1fr}.metric strong{font-size:25px}.form-grid{grid-template-columns:1fr}.form-grid .span2{grid-column:auto}.demo-grid{grid-template-columns:1fr}.top-actions .date-label{display:none}}@media(max-width:430px){.metrics{grid-template-columns:1fr}.login-card{box-shadow:none;border:0;background:transparent}.card{border-radius:14px}.hero-card{padding:20px}.hero-card h2{font-size:23px}}

.hero-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.hero-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.dark-btn{color:#fff;border-color:rgba(255,255,255,.22)!important;background:rgba(255,255,255,.08)!important}
.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0 14px;flex-wrap:wrap}.section-head h3{margin:0;font-size:22px}.section-head p{margin:4px 0 0;color:#69819f;font-size:14px}
.insights-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-bottom:18px}.insight-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px;box-shadow:0 10px 26px rgba(22,50,92,.07);overflow:hidden}.insight-card.dark{background:linear-gradient(180deg,#151820,#10131b);border-color:#242938;color:#eef3ff;box-shadow:0 18px 40px rgba(11,18,36,.25)}.insight-card.span2{grid-column:span 2}.insight-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.insight-head h3{margin:0;font-size:18px;color:inherit}.insight-head p{margin:4px 0 0;color:#98a3bf;font-size:13px;max-width:420px}.ghost-link{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);color:#c7d4ef;padding:8px 12px;border-radius:999px;font-weight:700}.ghost-link:hover{background:rgba(255,255,255,.08)}
.donut-wrap{position:relative;width:190px;height:190px;margin:8px auto 14px}.donut-svg{width:190px;height:190px;display:block}.donut-center{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:40px}.donut-center b{display:block;font-size:28px;line-height:1.05}.donut-center span{display:block;color:#b8c6e3;font-size:13px;margin-top:4px}.legend{display:grid;gap:10px}.legend-item{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;font-size:13px}.swatch{width:10px;height:10px;border-radius:50%}.legend-item label{color:#dce6fb}.legend-item strong{color:#fff}
.bars{display:grid;gap:14px}.bar-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:7px;font-size:13px}.bar-top span{color:#cfd8f0;font-weight:700}.bar-top b{color:#fff}.bar-rail{height:12px;background:rgba(255,255,255,.08);border-radius:999px;overflow:hidden}.bar-fill{height:100%;border-radius:999px}.bar-sub{margin-top:5px;font-size:12px;color:#92a2c2}
.line-svg{width:100%;height:auto;display:block}.chart-grid line{stroke:rgba(255,255,255,.10);stroke-dasharray:4 6}.chart-labels text{fill:#9bb0d5;font-size:10px}.trend-top{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:4px 0 12px}.pulse-box{padding:14px 14px;border-radius:18px;color:#fff}.pulse-box small{display:block;font-size:12px;color:rgba(255,255,255,.88)}.pulse-box strong{display:block;font-size:26px;margin-top:5px}.line-legend{display:flex;gap:18px;flex-wrap:wrap;margin-top:10px;color:#c4d1eb;font-size:13px}.line-legend span{display:flex;align-items:center;gap:8px}.line-legend i{display:inline-block;width:12px;height:12px;border-radius:50%}
.list-rows{display:grid;gap:10px}.list-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.05);border-radius:14px}.list-main{display:flex;align-items:center;gap:10px}.list-main .dot{width:12px;height:12px;border-radius:50%}.list-main b{display:block;color:#fff;font-size:14px}.list-main small{display:block;color:#9eb0cf;font-size:12px}.list-row strong{color:#fff}
.pulse-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:12px}.insight-note{margin-top:12px;color:#9eb0cf;font-size:13px}.note-panel{margin-top:14px;padding:12px 14px;border-radius:14px;background:#eef5ff;color:#46607f;font-size:13px}
.config-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.switch-list{display:grid;gap:10px;margin-top:16px}.switch-item{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:flex-start;padding:12px;border-radius:14px;background:#f8fbff;border:1px solid #dde7f3}.switch-item input{margin-top:3px}.switch-item b{display:block;font-size:14px}.switch-item small{display:block;color:#7085a0;font-size:12px;margin-top:2px}
@media(max-width:1100px){.insights-grid{grid-template-columns:1fr}.insight-card.span2{grid-column:auto}}
@media(max-width:760px){.hero-head,.section-head{display:block}.hero-actions{margin-top:12px}.trend-top,.pulse-grid,.config-grid{grid-template-columns:1fr}.insight-card{padding:16px}.insight-head{display:block}.ghost-link{margin-top:10px}.donut-wrap{width:170px;height:170px}.donut-svg{width:170px;height:170px}.donut-center b{font-size:24px}}

/* ION branding + sidebar stability patch */
.brandmark{width:92px;height:78px;padding:5px;background:rgba(255,255,255,.96);border-radius:20px;display:flex;align-items:center;justify-content:center}
.brandmark img{width:100%;height:100%;object-fit:contain;display:block}
.sidebar{display:flex;flex-direction:column;overflow:hidden;position:sticky;top:0;height:100vh;height:100dvh}
.side-brand{position:relative;flex:0 0 auto;padding-right:36px}
.side-logo{width:54px;height:46px;border-radius:11px;background:#fff;display:flex;align-items:center;justify-content:center;padding:3px;overflow:hidden;flex:0 0 auto}
.side-logo img{width:100%;height:100%;object-fit:contain;display:block}
.side-brand-copy{min-width:0}.side-brand-copy b,.side-brand-copy small{white-space:nowrap}
.nav{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding:2px 2px 12px;scrollbar-width:thin;scrollbar-color:#31517a transparent}
.nav::-webkit-scrollbar{width:5px}.nav::-webkit-scrollbar-thumb{background:#31517a;border-radius:10px}
.side-footer{position:static;left:auto;right:auto;bottom:auto;flex:0 0 auto;margin-top:auto;padding-top:14px;background:var(--navy)}
.side-close{display:none;position:absolute;right:0;top:12px;width:34px;height:34px;border:0;border-radius:10px;background:rgba(255,255,255,.08);color:#fff;font-size:24px;line-height:1;align-items:center;justify-content:center}
.sidebar-backdrop{display:none;border:0;padding:0;margin:0;background:rgba(3,11,25,.56);position:fixed;inset:0;z-index:54;opacity:0;pointer-events:none;transition:opacity .2s ease}
.mobile-brand-logo{display:none;width:40px;height:34px;object-fit:contain}

@media(max-width:760px){
  body.sidebar-open{overflow:hidden}
  .shell{display:block}
  .sidebar{display:flex;position:fixed;left:0;top:0;width:min(84vw,290px);height:100vh;height:100dvh;z-index:60;transform:translateX(-105%);transition:transform .22s ease;box-shadow:18px 0 55px rgba(0,0,0,.34);padding:16px}
  .sidebar.open{left:0;transform:translateX(0)}
  .sidebar-backdrop{display:block}
  .sidebar-backdrop.show{opacity:1;pointer-events:auto}
  .side-close{display:flex}
  .side-brand{padding:4px 42px 18px 4px}
  .nav{padding-bottom:12px}
  .side-footer{padding-bottom:max(4px,env(safe-area-inset-bottom))}
  .mobile-brand-logo{display:block}
  .mobile-menu{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;font-size:20px;padding:0}
  .topbar{z-index:20}
}
.side-brand{padding-right:8px}
@media(max-width:760px){.side-brand{padding:4px 42px 18px 4px}}

/* Sidebar v3 — desktop + mobile layout fix */
.shell{grid-template-columns:276px minmax(0,1fr)}
.sidebar{
  width:276px;
  min-width:276px;
  padding:16px 14px 14px;
  border-right:1px solid rgba(255,255,255,.06);
  box-shadow:8px 0 28px rgba(4,16,39,.08);
  overscroll-behavior:contain;
}
.side-brand{
  min-height:76px;
  padding:8px 8px 18px;
  gap:12px;
  border-bottom:1px solid rgba(255,255,255,.08);
  margin-bottom:12px;
}
.side-logo{width:62px;height:52px;padding:4px;border-radius:14px}
.side-brand-copy{overflow:hidden;flex:1 1 auto}
.side-brand-copy b{font-size:18px;line-height:1.15;display:block}
.side-brand-copy small{font-size:12px;margin-top:3px;overflow:hidden;text-overflow:ellipsis}
.nav{display:flex;flex-direction:column;gap:6px;padding:0 2px 14px}
.nav button{
  width:100%;
  min-height:44px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  line-height:1.2;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  transition:background .16s ease,color .16s ease,transform .16s ease;
}
.nav button span:last-child{overflow:hidden;text-overflow:ellipsis}
.nav button:hover{transform:translateX(2px)}
.nav button.active{background:#15447e;color:#fff;box-shadow:inset 3px 0 0 #5fa8ff}
.nav-dot{width:8px;height:8px;border-radius:50%;background:#42658f;flex:0 0 auto;transition:.16s ease}
.nav button.active .nav-dot{background:#70b0ff;box-shadow:0 0 0 4px rgba(95,168,255,.12)}
.side-footer{
  margin:0;
  padding:14px 6px 2px;
  border-top:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg,rgba(7,29,66,0),var(--navy) 18%);
}
.user-chip{min-width:0}
.user-chip>div:last-child{min-width:0}
.user-chip b,.user-chip small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.main{width:100%;min-width:0;overflow-x:hidden}
.sidebar-backdrop{appearance:none;-webkit-appearance:none}
.side-close{cursor:pointer}

@media(max-width:1100px) and (min-width:761px){
  .shell{grid-template-columns:244px minmax(0,1fr)}
  .sidebar{width:244px;min-width:244px;padding-left:12px;padding-right:12px}
  .side-logo{width:56px;height:48px}
  .side-brand-copy b{font-size:17px}
  .nav button{padding-left:10px;padding-right:10px;font-size:14px}
}

@media(max-width:760px){
  .shell{display:block!important}
  .sidebar{
    width:min(88vw,312px)!important;
    min-width:0!important;
    max-width:312px;
    height:100dvh;
    padding:14px 12px max(12px,env(safe-area-inset-bottom));
    border-right:0;
    transform:translate3d(-105%,0,0);
    will-change:transform;
    visibility:hidden;
    transition:transform .22s ease,visibility 0s linear .22s;
  }
  .sidebar.open{
    transform:translate3d(0,0,0);
    visibility:visible;
    transition:transform .22s ease,visibility 0s;
  }
  .side-brand{min-height:70px;padding:6px 42px 14px 4px;margin-bottom:10px}
  .side-logo{width:58px;height:48px}
  .side-close{top:8px;right:2px}
  .nav{padding-bottom:12px}
  .nav button{min-height:46px;font-size:15px}
  .side-footer{padding-bottom:max(2px,env(safe-area-inset-bottom))}
  .sidebar-backdrop{z-index:55}
  .sidebar{z-index:60}
  .topbar{z-index:25}
}


/* Pie chart refinement - closer to reference screenshots */
.pie-card{position:relative}
.pie-summary{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:2px 0 10px}
.pie-summary div{padding:10px 14px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);min-width:120px}
.pie-summary small{display:block;color:#93a2be;font-size:12px;margin-bottom:4px}
.pie-summary strong{display:block;color:#fff;font-size:26px;line-height:1.05}
.pie-panel{display:grid;place-items:center}
.donut-wrap.showcase{position:relative;width:250px;height:250px;margin:8px auto 18px}
.donut-svg{overflow:visible}
.donut-track{opacity:.9}
.donut-hole{fill:#10131b;filter:drop-shadow(0 0 18px rgba(0,0,0,.24))}
.donut-seg{filter:drop-shadow(0 3px 10px rgba(0,0,0,.20))}
.donut-center.showcase{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:58px}
.donut-center.showcase label{display:block;color:#f3f7ff;font-size:18px;font-weight:700;line-height:1.16;max-width:130px}
.donut-center.showcase b{display:block;font-size:34px;line-height:1.03;margin-top:8px;color:#fff}
.donut-center.showcase span{display:block;color:#61e3af;font-size:16px;font-weight:700;margin-top:6px}
.legend.showcase{display:flex;align-items:center;justify-content:center;gap:12px 18px;flex-wrap:wrap;margin-top:2px}
.legend-item.showcase{display:flex;align-items:center;justify-content:center;gap:8px;background:transparent;border:0;padding:0;font-size:14px;grid-template-columns:none}
.legend-item.showcase label{color:#dce6fb}
.legend-item.showcase strong{color:#9fb1d0;font-size:13px;font-weight:700}
.legend-item.showcase .swatch{width:11px;height:11px;box-shadow:0 0 0 4px rgba(255,255,255,.04)}
@media(max-width:760px){
  .pie-summary{gap:10px}
  .pie-summary div{min-width:0;flex:1 1 0;padding:10px 12px}
  .pie-summary strong{font-size:22px}
  .donut-wrap.showcase{width:220px;height:220px}
  .donut-center.showcase{padding:50px}
  .donut-center.showcase label{font-size:16px;max-width:112px}
  .donut-center.showcase b{font-size:30px}
  .donut-center.showcase span{font-size:14px}
}

/* Pie chart v5 — visual match to provided mobile reference */
.reference-pie-card{padding:20px 22px 18px;min-height:0}
.reference-pie-head{margin-bottom:8px}
.reference-pie-head h3{font-size:20px}
.reference-pie-head p{font-size:13px;color:#9da9c2}
.reference-pie-divider{height:1px;background:rgba(255,255,255,.08);margin:12px 0 16px}
.reference-pie-stats{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:end;margin-bottom:2px}
.reference-pie-stats>div{background:transparent;border:0;padding:0}
.reference-pie-stats span{display:block;color:#9da9c2;font-size:12px;font-weight:800;letter-spacing:.045em}
.reference-pie-stats strong{display:inline-block;color:#fff;font-size:34px;line-height:1.05;margin-top:5px;letter-spacing:-.02em}
.reference-pie-stats small{display:inline-block;color:#8e9db9;font-size:12px;margin-left:7px}
.reference-pie-stat-right{text-align:right}
.reference-pie-stat-right strong{color:#47d9a9}
.reference-pie-wrap{position:relative;width:min(330px,92%);aspect-ratio:1;margin:2px auto 4px}
.reference-pie-svg{width:100%;height:100%;display:block;overflow:visible}
.reference-pie-wrap .donut-hole{fill:#10131b}
.reference-pie-wrap .donut-seg{filter:drop-shadow(0 3px 8px rgba(0,0,0,.18))}
.reference-pie-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:72px}
.reference-pie-center span{display:block;color:#fff;font-size:18px;font-weight:800;line-height:1.15;max-width:150px}
.reference-pie-center strong{display:block;color:#fff;font-size:35px;line-height:1;margin-top:7px}
.reference-pie-center b{display:block;color:#47d9a9;font-size:17px;line-height:1;margin-top:8px}
.reference-pie-legend{display:flex;align-items:center;justify-content:center;gap:10px 18px;flex-wrap:wrap;margin:0 auto 8px}
.reference-pie-legend-item{display:flex;align-items:center;gap:7px;color:#e4eaf7;font-size:13px}
.reference-pie-legend-item .swatch{width:11px;height:11px;border-radius:50%;box-shadow:0 0 0 3px rgba(255,255,255,.035)}
.reference-pie-legend-item strong{font-size:12px;color:#9daac3;font-weight:800}
.reference-show-more{display:inline-flex;margin-top:8px;border:0;background:transparent;color:#67a7ff;font-weight:800;padding:6px 0;font-size:13px}
.reference-show-more:hover{text-decoration:underline}
@media(max-width:760px){
 .reference-pie-card{padding:18px 16px 16px}
 .reference-pie-stats{gap:12px}
 .reference-pie-stats strong{font-size:29px}
 .reference-pie-stats small{display:block;margin:3px 0 0}
 .reference-pie-wrap{width:min(300px,96%)}
 .reference-pie-center{padding:64px}
 .reference-pie-center span{font-size:17px}
 .reference-pie-center strong{font-size:32px}
 .reference-pie-center b{font-size:15px}
}

/* Pie chart v6 — closer visual match to supplied reference */
.reference-pie-card{
  padding:24px 28px 22px;
  border-radius:24px;
  background:#17191d!important;
  border:1px solid #2a2d34!important;
  box-shadow:0 12px 28px rgba(0,0,0,.22)!important;
}
.reference-pie-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:18px}
.reference-pie-title-row h3{margin:0;color:#fff;font-size:21px;line-height:1.15}
.reference-pie-title-row p{margin:7px 0 0;color:#a2a5ab;font-size:14px;line-height:1.35}
.reference-kebab{border:0;background:transparent;color:#9b9ea5;font-size:30px;line-height:1;padding:0 2px;min-width:26px}
.reference-pie-divider{height:1px;background:#0b0c0e;margin:18px 0 18px;box-shadow:0 1px 0 rgba(255,255,255,.035)}
.reference-pie-stats{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:18px;margin-bottom:14px}
.reference-pie-stats span{display:block;color:#9fa2a8;font-size:13px;font-weight:700;letter-spacing:.035em}
.reference-pie-stats strong{display:block;color:#f6f7f8;font-size:40px;line-height:1.05;margin-top:6px;letter-spacing:-.025em}
.reference-pie-stat-right{text-align:right}
.reference-pie-stat-right strong{font-size:36px}
.reference-pie-stat-right strong.up{color:#28d79f}
.reference-pie-stat-right strong.down{color:#ff5757}
.reference-pie-stat-right strong.neutral{color:#a7abb2}
.reference-pie-toggle{display:grid;grid-template-columns:1fr 1fr;max-width:360px;margin:4px 0 0;border:1px solid #4a4d54;border-radius:999px;overflow:hidden;background:#1a1c20}
.reference-pie-toggle button{border:0;background:transparent;color:#b7bac1;padding:10px 18px;font-weight:800}
.reference-pie-toggle button+button{border-left:1px solid #4a4d54}
.reference-pie-toggle button.active{background:#67a8f4;color:#0d1520}
.reference-go-row{display:flex;justify-content:flex-end;margin-top:14px}
.reference-go-deeper{border:1px solid #51545b;background:transparent;color:#d9dadd;border-radius:999px;padding:10px 18px;font-weight:800}
.reference-go-deeper:hover{background:#24272c}
.reference-pie-wrap{position:relative;width:min(430px,82%);aspect-ratio:1;margin:2px auto 2px}
.reference-pie-svg{width:100%;height:100%;display:block;overflow:visible}
.reference-pie-track{opacity:.9}
.reference-pie-segment{filter:drop-shadow(0 1px 1px rgba(0,0,0,.2))}
.reference-pie-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:100px}
.reference-pie-center span{display:block;color:#f6f7f8;font-size:22px;font-weight:700;line-height:1.15;max-width:170px}
.reference-pie-center strong{display:block;color:#fff;font-size:38px;line-height:1;margin-top:7px}
.reference-pie-center b{display:block;color:#b7bbc3;font-size:18px;line-height:1;margin-top:8px;font-weight:700}
.reference-pie-legend{display:flex;align-items:center;justify-content:center;gap:10px 18px;flex-wrap:wrap;margin:0 auto 10px;padding-top:2px}
.reference-pie-legend-item{display:flex;align-items:center;gap:7px;color:#eceef1;font-size:14px}
.reference-pie-legend-item .swatch{width:12px;height:12px;border-radius:50%;box-shadow:none}
.reference-pie-legend-item strong{font-size:13px;color:#aeb2b8;font-weight:700}
.reference-show-more{display:inline-flex;margin-top:4px;border:0;background:transparent;color:#67a8f4;font-weight:800;padding:8px 0;font-size:14px}
.reference-show-more:hover{text-decoration:underline}
@media(max-width:760px){
  .reference-pie-card{padding:20px 18px 18px;border-radius:20px}
  .reference-pie-title-row h3{font-size:20px}
  .reference-pie-title-row p{font-size:13px}
  .reference-pie-stats strong{font-size:34px}
  .reference-pie-stat-right strong{font-size:30px}
  .reference-pie-toggle{max-width:none;width:100%}
  .reference-pie-wrap{width:min(350px,94%);margin-top:4px}
  .reference-pie-center{padding:82px}
  .reference-pie-center span{font-size:19px;max-width:140px}
  .reference-pie-center strong{font-size:34px}
  .reference-pie-center b{font-size:16px}
  .reference-pie-legend{gap:10px 14px}
  .reference-pie-legend-item{font-size:13px}
}
@media(max-width:430px){
  .reference-pie-stats{gap:10px}
  .reference-pie-stats span{font-size:11px}
  .reference-pie-stats strong{font-size:30px}
  .reference-pie-stat-right strong{font-size:27px}
  .reference-pie-wrap{width:100%}
  .reference-pie-center{padding:74px}
}


/* ION typography system: Bebas Neue + Lexend + Montserrat */
html,body,input,select,textarea,table,.card,.insight-card,.modal,.toast{font-family:var(--font-body)!important}
button,.btn,.nav button,.badge,.kicker,.field label,.table th,.game-eyebrow,.dash-dropdown-title small,.mobile-kpi-copy small,.mobile-kpi-copy em{font-family:var(--font-ui)!important}
h1,h2,h3,h4,.login-brand h1,.login-card h2,.page-title h1,.hero-card h2,.section-head h3,.card-head h3,.insight-head h3,.metric strong,.mobile-kpi-copy b,.pie-summary strong,.donut-center b,.reference-pie-center strong,.trend-top strong,.task-stat strong,.game-points span,.leader-score strong{font-family:var(--font-display)!important;letter-spacing:.02em}
svg text{font-family:var(--font-body)!important}

/* Delivery trend v7 — bar + smooth line graph inspired by reference */
.delivery-trend-card{padding-bottom:16px}
.delivery-flow-chart{width:100%;margin-top:8px;overflow:hidden;border-radius:16px}
.flow-svg{display:block;width:100%;height:auto;min-height:260px}
.flow-grid line{stroke:rgba(255,255,255,.10);stroke-dasharray:4 5;stroke-width:1}
.flow-bg-col{fill:#343941;opacity:.92}
.flow-completed{fill:#29d39a}
.flow-open{fill:#ff4e45}
.flow-qty-line{fill:none;stroke:#f2f4f7;stroke-width:3.6;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 2px 5px rgba(255,255,255,.10))}
.flow-x-labels text,.flow-y-labels text{fill:#9da5b2;font-size:10px}
.flow-legend{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;margin:8px 0 2px;color:#d7dfec;font-size:13px}
.flow-legend span{display:flex;align-items:center;gap:8px}
.flow-legend-box{width:12px;height:12px;border-radius:2px;display:inline-block}
.flow-legend-box.completed{background:#29d39a}
.flow-legend-box.open{background:#ff4e45}
.flow-legend-line{width:15px;height:4px;border-radius:999px;background:#f2f4f7;display:inline-block}
@media(max-width:760px){
  .flow-svg{min-height:220px}
  .flow-x-labels text,.flow-y-labels text{font-size:9px}
  .flow-legend{justify-content:flex-start;gap:12px;font-size:12px}
}

/* Task assignment system v8 */
.task-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}
.task-stat{background:linear-gradient(135deg,#fff7e8,#fff);border:1px solid #f1dfbb;border-radius:18px;padding:17px 18px;box-shadow:0 8px 24px rgba(22,50,92,.05)}
.task-stat.progress{background:linear-gradient(135deg,#eaf3ff,#fff);border-color:#cfe0f8}
.task-stat.done{background:linear-gradient(135deg,#e9faf4,#fff);border-color:#c8ebdf}
.task-stat small{display:block;color:#6e7d94;font-size:12px;font-weight:800}
.task-stat strong{display:block;font-size:30px;line-height:1;margin:7px 0 5px;color:#172943}
.task-stat span{display:block;color:#8390a4;font-size:12px}
.task-toolbar{align-items:flex-end}
.task-toolbar .left{flex:1 1 650px}
.task-toolbar input{min-width:220px}
.task-board{display:grid;gap:13px}
.task-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:18px;padding:17px 18px;box-shadow:0 8px 24px rgba(22,50,92,.05);position:relative;overflow:hidden}
.task-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#5fa8ff}
.task-card.overdue:before{background:#ff5c6a}
.task-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.task-title-row h3{margin:3px 0 0;font-size:18px;color:#172943}
.task-kicker{font-size:10px;letter-spacing:.08em;text-transform:uppercase;font-weight:900;color:#6983a5}
.task-card.overdue .task-kicker{color:#c33b43}
.task-notes{margin:8px 0 12px;color:#697990;font-size:13px;line-height:1.55}
.task-meta-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.task-meta-grid>div{background:#f8fafd;border:1px solid #edf1f7;border-radius:12px;padding:9px 10px;min-width:0}
.task-meta-grid small{display:block;color:#8b98aa;font-size:10px;text-transform:uppercase;letter-spacing:.05em}
.task-meta-grid b{display:block;color:#263a55;font-size:12px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.task-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap;min-width:210px}
.task-form-note{background:#eef5ff;border:1px solid #d3e3fa;border-radius:13px;padding:11px 13px;color:#496784;font-size:13px;margin-bottom:10px}
.assignee-fixed{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #dde6f2;border-radius:12px;background:#f8fbff}
.avatar.mini{width:34px;height:34px;font-size:12px}
.assignee-fixed b{display:block;font-size:13px;color:#243955}
.assignee-fixed small{display:block;font-size:11px;color:#7e8da3;margin-top:2px}
@media(max-width:1000px){
  .task-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .task-card{grid-template-columns:1fr}
  .task-actions{justify-content:flex-start;min-width:0}
}
@media(max-width:760px){
  .task-summary{grid-template-columns:1fr 1fr}
  .task-summary .task-stat:last-child{grid-column:1/-1}
  .task-toolbar .left{display:grid;width:100%}
  .task-toolbar input,.task-toolbar select{width:100%;min-width:0}
  .task-card{padding:15px}
  .task-title-row{display:block}
  .task-title-row .badge{margin-top:8px}
  .task-meta-grid{grid-template-columns:1fr}
  .task-actions .btn{flex:1 1 auto}
}

/* Gamification + leaderboard v9 */
.game-eyebrow{display:block;font-size:11px;letter-spacing:.12em;font-weight:900;color:#8fb6ef;margin-bottom:5px}
.game-progress-card{margin:18px 0;background:linear-gradient(135deg,#0f1730 0%,#172a52 50%,#0c1328 100%);color:#fff;border:1px solid rgba(122,166,235,.20);border-radius:22px;padding:20px;box-shadow:0 18px 40px rgba(9,22,51,.20);overflow:hidden;position:relative}
.game-progress-card:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-100px;top:-120px;background:radial-gradient(circle,rgba(88,154,255,.20),transparent 68%);pointer-events:none}
.game-progress-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;position:relative;z-index:1}.game-progress-head h3{margin:0;font-size:23px}.game-progress-head p{margin:5px 0 0;color:#a9bbd9;font-size:13px}.game-points{text-align:right;min-width:115px}.game-points span{display:block;font-size:36px;line-height:1;color:#ffd36b;font-weight:900}.game-points small{display:block;color:#9fb2d2;margin-top:5px;font-size:12px}
.game-level-row{margin-top:17px}.game-level-label{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;font-size:12px}.game-level-label span{color:#9fb2d2}.game-level-track{height:11px;background:rgba(255,255,255,.10);border-radius:999px;overflow:hidden}.game-level-track i{display:block;height:100%;background:linear-gradient(90deg,#52a7ff,#7d7dff,#ffbf3d);border-radius:999px;box-shadow:0 0 16px rgba(97,163,255,.35)}
.game-mini-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}.game-mini-stats>div{background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:11px 12px}.game-mini-stats strong{display:block;font-size:21px;color:#fff}.game-mini-stats span{display:block;font-size:11px;color:#9db0cf;margin-top:3px}
.game-badges{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.game-badge{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:999px;padding:7px 10px}.game-badge span{font-size:17px}.game-badge small{color:#dbe6f8;font-size:11px}.game-leader-btn{margin-top:15px;background:#ffd36b;color:#13213c}
.manager-leader-strip{margin:18px 0;display:flex;align-items:center;justify-content:space-between;gap:14px;background:linear-gradient(135deg,#10182c,#182744);border-radius:18px;padding:15px 17px;color:#fff;border:1px solid #253c64}.manager-leader-strip h3{margin:1px 0 0;font-size:17px}.manager-leader-strip .btn{background:#ffd36b;color:#17243a}
.leader-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding:24px;border-radius:22px;background:linear-gradient(135deg,#0e1832,#173665 65%,#27518e);color:#fff;margin-bottom:18px}.leader-hero h2{margin:0;font-size:32px}.leader-hero p{margin:6px 0 0;color:#bbcae3;max-width:720px}.leader-period{display:flex;gap:7px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12);padding:5px;border-radius:999px;flex-wrap:wrap}.leader-period button{border:0;background:transparent;color:#c7d6ed;border-radius:999px;padding:9px 13px;font-weight:800}.leader-period button.active{background:#fff;color:#173159}
.leader-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr);gap:18px}.leader-card{background:#111620;color:#fff;border:1px solid #252c39;border-radius:22px;padding:20px;box-shadow:0 16px 38px rgba(15,25,45,.18)}.leader-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.leader-card-head h3{margin:0;font-size:20px}.leader-card-head p{margin:5px 0 0;color:#9ca8bb;font-size:13px}.trophy-mark{font-size:32px}
.leader-podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:end;gap:10px;margin:24px 0 22px}.podium-person{text-align:center;min-width:0}.podium-medal{font-size:28px;margin-bottom:5px}.podium-avatar{width:58px;height:58px;margin:0 auto 8px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#315fa8,#5fa8ff);font-weight:900;border:3px solid #6caaff}.podium-person.rank-1 .podium-avatar{width:72px;height:72px;background:linear-gradient(135deg,#b27800,#ffc94c);border-color:#ffe399;color:#352300}.podium-person.rank-2 .podium-avatar{background:linear-gradient(135deg,#687386,#c5cedd);border-color:#e5e8ee;color:#27313e}.podium-person.rank-3 .podium-avatar{background:linear-gradient(135deg,#8b4c25,#d78c56);border-color:#f0b58d}.podium-person b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.podium-person strong{display:block;color:#ffd36b;font-size:19px;margin-top:4px}.podium-person small{display:block;color:#8fa1be;font-size:10px;margin-top:3px}.podium-block{height:34px;margin:10px 8px 0;border-radius:10px 10px 0 0;background:#223657;display:grid;place-items:center;color:#7ea8e9;font-weight:900}.rank-1 .podium-block{height:54px;background:#7d5a13;color:#ffd36b}.rank-2 .podium-block{height:42px;background:#465163;color:#dbe2ed}.rank-3 .podium-block{height:34px;background:#65402f;color:#eeb58f}
.leader-list{display:grid;gap:9px}.leader-row{display:grid;grid-template-columns:54px 42px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 12px;border-radius:15px;background:#171d28;border:1px solid #252d3a}.leader-row.is-me{border-color:#477fd4;background:#182942}.leader-rank{text-align:center;font-weight:900;color:#aebbd0}.leader-avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#263b5b;color:#fff;font-weight:900}.leader-person{min-width:0}.leader-person b{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.leader-person small{display:block;color:#8ea0bb;font-size:11px;margin-top:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.you-chip{font-size:9px;background:#5fa8ff;color:#0d1c31;padding:2px 6px;border-radius:999px;margin-left:5px}.leader-score{text-align:right}.leader-score strong{display:block;color:#ffd36b;font-size:20px}.leader-score span{display:block;color:#8392a9;font-size:10px}
.points-rules{display:grid;gap:10px;margin-top:18px}.points-rules>div{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:8px;align-items:center;background:#171e29;border:1px solid #252e3c;border-radius:14px;padding:11px 12px}.points-rules span{font-size:20px}.points-rules b{font-size:13px}.points-rules strong{color:#6de3ab;font-size:18px}.badge-guide{margin-top:20px;border-top:1px solid #293241;padding-top:16px}.badge-guide h4{margin:0;font-size:16px}.badge-guide p{color:#909db0;font-size:12px}.badge-preview{display:flex;gap:8px;flex-wrap:wrap}.badge-preview span{width:39px;height:39px;border-radius:12px;display:grid;place-items:center;background:#1c2533;border:1px solid #2b3748;font-size:20px}
.route-game-strip{display:grid;grid-template-columns:minmax(150px,1fr) auto auto minmax(150px,1fr) auto;gap:12px;align-items:center;background:linear-gradient(135deg,#111d38,#1b3765);color:#fff;border-radius:18px;padding:14px 15px;margin-bottom:15px}.route-game-strip>div:first-child span{display:block;font-size:10px;color:#8db2ec;font-weight:900;letter-spacing:.08em}.route-game-strip>div:first-child b{display:block;font-size:15px;margin-top:2px}.route-game-strip strong{display:block;font-size:20px;color:#ffd36b}.route-game-strip small{display:block;font-size:10px;color:#96a9c7}.route-game-progress{height:10px;background:rgba(255,255,255,.10);border-radius:999px;overflow:hidden}.route-game-progress i{display:block;height:100%;background:linear-gradient(90deg,#51a8ff,#ffd36b);border-radius:999px}
@media(max-width:1050px){.leader-grid{grid-template-columns:1fr}.leader-card.rules-card{order:-1}.route-game-strip{grid-template-columns:1fr auto auto}.route-game-progress{grid-column:1/-1}.route-game-strip .btn{grid-column:1/-1}}
@media(max-width:760px){.game-progress-head,.leader-hero,.manager-leader-strip{display:block}.game-points{text-align:left;margin-top:12px}.game-mini-stats{grid-template-columns:1fr 1fr}.leader-period{margin-top:15px;border-radius:16px}.leader-period button{flex:1}.leader-podium{gap:5px}.podium-person b{font-size:12px}.podium-person strong{font-size:16px}.podium-person small{display:none}.leader-row{grid-template-columns:40px 36px minmax(0,1fr) auto;padding:9px}.leader-rank{font-size:12px}.leader-avatar{width:34px;height:34px;font-size:11px}.leader-person small{font-size:10px}.leader-score strong{font-size:16px}.route-game-strip{grid-template-columns:1fr 1fr}.route-game-strip>div:first-child{grid-column:1/-1}.route-game-progress,.route-game-strip .btn{grid-column:1/-1}.manager-leader-strip .btn{margin-top:10px;width:100%}}
@media(max-width:430px){.game-mini-stats{grid-template-columns:1fr 1fr}.leader-podium{grid-template-columns:repeat(3,minmax(0,1fr))}.podium-avatar{width:44px;height:44px}.podium-person.rank-1 .podium-avatar{width:56px;height:56px}.leader-row{grid-template-columns:32px 34px minmax(0,1fr)}.leader-score{grid-column:3;text-align:left;display:flex;align-items:baseline;gap:5px}.leader-person b{font-size:12px}}

/* v10 proof timestamp audit */
.proof-audit{display:flex;align-items:center;gap:12px;margin-top:12px;padding:11px 12px;border-radius:14px;background:#f6f9fe;border:1px solid #dfe9f6}
.proof-audit .proof-thumb{width:72px;height:72px;flex:0 0 auto;object-fit:cover;border-radius:12px;border:1px solid #cfdced;background:#fff}
.proof-audit-copy{min-width:0;display:flex;flex-direction:column;gap:3px}
.proof-audit-copy .proof-label{font-size:10px;letter-spacing:.09em;font-weight:900;color:#0d5bd7}
.proof-audit-copy b{font-size:13px;color:#14263f}
.proof-audit-copy small{font-size:11px;color:#667b98;white-space:normal;overflow-wrap:anywhere}
.completion-time{color:#687d99;font-size:11px;font-weight:700}
.table-proof-time{display:block;margin-top:6px;color:#6a7e98;font-size:10px;white-space:nowrap}
.auto-time-banner{display:flex;gap:11px;align-items:flex-start;padding:12px 14px;margin-bottom:14px;border-radius:14px;background:#eef6ff;border:1px solid #cfe3fb;color:#183d6f}
.auto-time-banner>span{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:#0d5bd7;color:#fff;font-size:17px;flex:0 0 auto}
.auto-time-banner b{display:block;font-size:13px}
.auto-time-banner small{display:block;margin-top:3px;color:#5e7594;font-size:11px;line-height:1.4}
.insight-card.dark .proof-audit,.delivery-card .proof-audit{background:#f6f9fe}
@media(max-width:560px){.proof-audit{align-items:flex-start}.proof-audit .proof-thumb{width:64px;height:64px}.table-proof-time{white-space:normal}}

/* v11 mobile dashboard dropdown mode */
.dash-dropdown{margin-top:18px;min-width:0}
.dash-dropdown>summary{display:none;list-style:none}
.dash-dropdown>summary::-webkit-details-marker{display:none}
.dash-dropdown-body{min-width:0}
.dash-dropdown .metrics{margin-top:0}
.dash-dropdown .manager-leader-strip,.dash-dropdown .game-progress-card{margin-top:0;margin-bottom:0}
.dash-dropdown .dropdown-section-head{margin-top:0}
.dash-dropdown .dropdown-card{margin:0}
.dash-dropdown-chevron{width:12px;height:12px;border-right:2px solid #7890ad;border-bottom:2px solid #7890ad;transform:rotate(45deg);transition:transform .2s ease;flex:0 0 auto;margin-right:4px}
.dash-dropdown[open] .dash-dropdown-chevron{transform:rotate(225deg);margin-top:6px}

@media(max-width:760px){
  .dash-dropdown{margin-top:12px;background:#fff;border:1px solid #dce6f2;border-radius:18px;box-shadow:0 7px 22px rgba(22,50,92,.06);overflow:hidden}
  .dash-dropdown>summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:66px;padding:13px 16px;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;background:#fff}
  .dash-dropdown>summary:focus-visible{outline:3px solid rgba(13,91,215,.22);outline-offset:-3px}
  .dash-dropdown[open]>summary{border-bottom:1px solid #e6edf6;background:#fbfdff}
  .dash-dropdown-title{display:block;min-width:0}
  .dash-dropdown-title b{display:block;font-size:16px;line-height:1.15;color:#10213d}
  .dash-dropdown-title small{display:block;margin-top:4px;color:#71839c;font-size:11px;line-height:1.3}
  .dash-dropdown-body{padding:12px 14px 15px}

  /* Turn the large KPI cards into compact dropdown rows on mobile. */
  .summary-drop .dash-dropdown-body{padding-top:2px;padding-bottom:5px}
  .summary-drop .metrics{display:block}
  .summary-drop .metric{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:14px;align-items:center;padding:13px 2px;border:0;border-bottom:1px solid #edf2f8;border-radius:0;box-shadow:none;background:transparent}
  .summary-drop .metric:last-child{border-bottom:0}
  .summary-drop .metric small{grid-column:1;grid-row:1;font-size:13px;color:#405674}
  .summary-drop .metric strong{grid-column:2;grid-row:1/3;margin:0;font-size:25px;color:#10213d;text-align:right}
  .summary-drop .metric .hint{grid-column:1;grid-row:2;margin-top:3px;font-size:10px;color:#8393a9}

  /* Smart dashboard opens only when needed, keeping the home screen short. */
  .smart-dashboard-drop .dash-dropdown-body{padding:12px}
  .smart-dashboard-drop .dropdown-section-head{display:flex;align-items:center;justify-content:flex-end;margin:0 0 10px}
  .smart-dashboard-drop .dropdown-section-head>div{display:none}
  .smart-dashboard-drop .dropdown-section-head .btn{width:100%}
  .smart-dashboard-drop .insights-grid{margin-bottom:0}

  .delivery-dashboard-drop .dash-dropdown-body,.activity-dashboard-drop .dash-dropdown-body{padding:0}
  .delivery-dashboard-drop .dropdown-card,.activity-dashboard-drop .dropdown-card{border:0;border-radius:0;box-shadow:none}
  .delivery-dashboard-drop .card-head,.activity-dashboard-drop .card-head{padding:13px 14px}
  .activity-dashboard-drop .card-body{padding:14px}

  .game-dashboard-drop .dash-dropdown-body{padding:10px}
  .game-dashboard-drop .manager-leader-strip,.game-dashboard-drop .game-progress-card{border-radius:14px}

  /* Keep the hero compact before the dropdown menu list begins. */
  .hero-card{margin-bottom:2px}
}

@media(min-width:761px){
  .dash-dropdown{margin-top:18px}
  .dash-dropdown-body{display:block!important}
}


/* v12 individual KPI dropdowns + three-font system */
.mobile-kpi-list{display:none}
.kpi-summary-section{margin-top:18px}
@media(max-width:760px){
  .desktop-kpis{display:none!important}
  .mobile-kpi-list{display:grid;gap:10px}
  .kpi-summary-section{margin-top:12px}
  .mobile-kpi-dropdown{background:#fff;border:1px solid #dce6f2;border-radius:18px;overflow:hidden;box-shadow:0 7px 22px rgba(22,50,92,.06)}
  .mobile-kpi-dropdown>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:88px;padding:13px 16px;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;position:relative}
  .mobile-kpi-dropdown>summary::-webkit-details-marker{display:none}
  .mobile-kpi-dropdown>summary:before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px;background:var(--kpi-accent,#0d5bd7)}
  .mobile-kpi-dropdown[open]>summary{background:#fbfdff;border-bottom:1px solid #e7eef7}
  .mobile-kpi-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto;align-items:center;column-gap:16px;min-width:0;width:100%}
  .mobile-kpi-copy small{grid-column:1;grid-row:1;color:#425a77;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.02em}
  .mobile-kpi-copy b{grid-column:2;grid-row:1/3;color:#10213d;font-size:34px;line-height:1;text-align:right;font-weight:400}
  .mobile-kpi-copy em{grid-column:1;grid-row:2;color:#8292a7;font-size:10px;font-style:normal;font-weight:600;text-transform:uppercase;margin-top:5px}
  .mobile-kpi-chevron{width:11px;height:11px;border-right:2px solid #7890ad;border-bottom:2px solid #7890ad;transform:rotate(45deg);transition:transform .2s ease;flex:0 0 auto;margin-left:2px}
  .mobile-kpi-dropdown[open] .mobile-kpi-chevron{transform:rotate(225deg);margin-top:6px}
  .mobile-kpi-body{padding:12px 16px 15px;background:#fff}
  .kpi-info-list{display:grid;gap:0;border:1px solid #e7eef7;border-radius:14px;overflow:hidden;background:#f8fbff}
  .kpi-info-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border-bottom:1px solid #e7eef7}
  .kpi-info-row:last-child{border-bottom:0}
  .kpi-info-row span{font-size:12px;color:#637891}
  .kpi-info-row strong{font-family:var(--font-ui);font-size:13px;color:#10213d}
  .kpi-open-btn{width:100%;margin-top:10px;min-height:42px;background:#eef4ff;color:#0d5bd7}
  .kpi-blue{--kpi-accent:#3d7cff}.kpi-amber{--kpi-accent:#ffad2e}.kpi-violet{--kpi-accent:#8a6cff}.kpi-green{--kpi-accent:#27c99a}.kpi-cyan{--kpi-accent:#35b8d8}
}
@media(min-width:761px){.mobile-kpi-list{display:none!important}}

/* v13 Active Clients KPI dropdown: show actual active client records */
@media(max-width:760px){
  .active-client-list{display:grid;gap:9px}
  .active-client-item{display:grid;grid-template-columns:32px minmax(0,1fr);gap:10px;align-items:flex-start;padding:11px;border:1px solid #e5edf7;border-radius:14px;background:#f9fbfe}
  .active-client-index{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:#e7f0ff;color:#0d5bd7;font-family:var(--font-ui);font-size:12px;font-weight:800}
  .active-client-main{min-width:0}
  .active-client-title{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;min-width:0}
  .active-client-title b{font-family:var(--font-ui);font-size:13px;color:#10213d;line-height:1.3;min-width:0}
  .active-client-main p{margin:4px 0 0;color:#687d96;font-size:11px;line-height:1.45}
  .active-client-main small{display:block;margin-top:4px;color:#8a99ad;font-size:10px}
  .client-condition{flex:0 0 auto;max-width:46%;padding:4px 7px;border-radius:999px;font-family:var(--font-ui);font-size:9px;font-weight:700;line-height:1.2;text-align:center}
  .client-condition.good{background:#e7f8f1;color:#147957}
  .client-condition.attention{background:#fff0e8;color:#b65522}
  .active-client-summary{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
  .active-client-summary span{flex:1 1 120px;padding:9px 10px;border-radius:12px;background:#f2f6fb;color:#687d96;font-size:10px}
  .active-client-summary b{color:#10213d;font-size:14px;margin-right:3px}
  .kpi-empty{padding:18px;text-align:center;color:#8090a5;font-size:12px;border:1px dashed #d8e3ef;border-radius:12px}
}

/* v14 Bengali Delivery Man experience */
@font-face{
  font-family:'ION Bangla';
  src:url('/fonts/ion-bangla.ttf?v=20260905v15') format('truetype');
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}
body.delivery-bangla,
body.delivery-bangla button,
body.delivery-bangla input,
body.delivery-bangla select,
body.delivery-bangla textarea,
body.delivery-bangla table,
body.delivery-bangla .card,
body.delivery-bangla .modal,
body.delivery-bangla .toast,
body.delivery-bangla .badge,
body.delivery-bangla .nav button,
body.delivery-bangla h1,
body.delivery-bangla h2,
body.delivery-bangla h3,
body.delivery-bangla h4,
body.delivery-bangla svg text{
  font-family:'ION Bangla','Noto Sans Bengali','Hind Siliguri',sans-serif!important;
  letter-spacing:normal!important;
}
body.delivery-bangla{font-size:16px}
body.delivery-bangla .nav button{font-size:16px;font-weight:700}
body.delivery-bangla .page-title h1{font-size:25px;line-height:1.25}
body.delivery-bangla .page-title p{font-size:13px}
body.delivery-bangla .bn-hero h2{font-size:30px;line-height:1.25}
body.delivery-bangla .bn-hero p{font-size:16px;line-height:1.65}
body.delivery-bangla .bn-help-box,
body.delivery-bangla .delivery-meta,
body.delivery-bangla .bn-date-label{font-size:15px;line-height:1.65}
body.delivery-bangla .delivery-actions .btn{min-height:44px;font-size:15px}
body.delivery-bangla .bn-simple-kpis small,
body.delivery-bangla .game-mini-stats span{font-size:13px}
body.delivery-bangla .bn-simple-kpis strong{font-size:30px}
body.delivery-bangla .leader-person small{font-size:12px;line-height:1.45}
body.delivery-bangla .proof-audit-copy b{font-size:14px}
body.delivery-bangla .proof-audit-copy small{font-size:12px;line-height:1.5}
@media(max-width:760px){
  body.delivery-bangla .content{padding:14px}
  body.delivery-bangla .bn-hero{padding:20px}
  body.delivery-bangla .bn-hero h2{font-size:27px}
  body.delivery-bangla .bn-simple-kpis{grid-template-columns:1fr 1fr}
}

/* v15 — Bengali Delivery Man premium mobile UI + login stability */
.app-loading,.load-error{min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:16px;padding:34px;border-radius:24px;background:#fff;border:1px solid #e3ebf5;box-shadow:0 14px 40px rgba(24,52,92,.08)}
.loading-orb{width:74px;height:74px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(145deg,#ffffff,#e9f3ff);box-shadow:0 16px 40px rgba(13,91,215,.14);animation:ionPulse 1.2s ease-in-out infinite}
.loading-orb img{width:58px;height:58px;object-fit:contain}.app-loading b{font-size:18px}.app-loading span{display:block;color:#7c8ca4;font-size:13px;margin-top:5px}.load-error-icon{width:52px;height:52px;border-radius:18px;background:#fff0f1;color:#c33b43;display:grid;place-items:center;font-size:26px;font-weight:900}.load-error h3{margin:0}.load-error p{margin:0;color:#708199;max-width:420px}.load-error .btn{margin-top:4px}@keyframes ionPulse{50%{transform:scale(.94);opacity:.75}}

body.delivery-bangla{--bn-blue:#0b5fe8;--bn-blue2:#0645b3;--bn-sky:#eaf5ff;--bn-navy:#071b3f;--bn-cyan:#12bfe7;--bn-mint:#19c991;--bn-gold:#ffb423;--bn-pink:#ff6b89;background:linear-gradient(180deg,#eef7ff 0,#f7fbff 320px,#f5f8fc 100%);color:#0a2145}
body.delivery-bangla .topbar{height:76px;background:rgba(255,255,255,.93);border-bottom:1px solid rgba(18,93,180,.10);box-shadow:0 6px 22px rgba(15,61,118,.06)}
body.delivery-bangla .page-title h1{color:#0b2448;font-weight:800}
body.delivery-bangla .page-title p{color:#7084a0}
body.delivery-bangla .content{max-width:980px;margin:0 auto;width:100%}
body.delivery-bangla .sidebar{background:linear-gradient(180deg,#082653 0%,#061a38 100%)}
body.delivery-bangla .nav button{border:1px solid transparent}
body.delivery-bangla .nav button.active{background:linear-gradient(135deg,#1767d8,#124aa1);border-color:rgba(255,255,255,.1);box-shadow:0 10px 26px rgba(0,0,0,.18)}
body.delivery-bangla .nav-dot{background:#6887ae}body.delivery-bangla .nav button.active .nav-dot{background:#fff;box-shadow:0 0 0 4px rgba(255,255,255,.12)}

body.delivery-bangla .bn-hero{position:relative;padding:28px;border-radius:28px;background:linear-gradient(135deg,#0754d3 0%,#0b7af2 55%,#12b5e8 100%);box-shadow:0 22px 50px rgba(9,83,190,.24);overflow:hidden;margin-bottom:18px}
body.delivery-bangla .bn-hero:before{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-65px;top:-95px;border:1px solid rgba(255,255,255,.2);box-shadow:0 0 0 42px rgba(255,255,255,.06),0 0 0 84px rgba(255,255,255,.035)}
body.delivery-bangla .bn-hero:after{content:"";position:absolute;width:130px;height:130px;right:18px;bottom:-92px;border-radius:34px;background:rgba(255,255,255,.07);transform:rotate(25deg)}
body.delivery-bangla .bn-hero>*{position:relative;z-index:1}
body.delivery-bangla .bn-hero .kicker{display:inline-flex;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.2);padding:7px 11px;border-radius:999px;color:#fff!important;font-size:12px}
body.delivery-bangla .bn-hero h2{margin:12px 0 8px;font-size:34px;line-height:1.25;color:#fff;font-weight:800}
body.delivery-bangla .bn-hero p{margin:0;max-width:720px;color:rgba(255,255,255,.93);font-size:16px;line-height:1.75}

body.delivery-bangla .bn-simple-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0 18px}
body.delivery-bangla .bn-simple-kpis>div{position:relative;padding:16px 14px 15px;border-radius:20px;background:rgba(255,255,255,.96);border:1px solid #dbe9f8;box-shadow:0 12px 30px rgba(30,74,128,.08);overflow:hidden}
body.delivery-bangla .bn-simple-kpis>div:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#0f72ed,#15c7df)}
body.delivery-bangla .bn-simple-kpis>div:nth-child(2):before{background:linear-gradient(180deg,#17b483,#22d6a0)}
body.delivery-bangla .bn-simple-kpis>div:nth-child(3):before{background:linear-gradient(180deg,#ff9c17,#ffbf2e)}
body.delivery-bangla .bn-simple-kpis>div:nth-child(4):before{background:linear-gradient(180deg,#9c64e8,#6f7cf3)}
body.delivery-bangla .bn-simple-kpis small{display:block;color:#6e829c;font-size:12px;font-weight:700}
body.delivery-bangla .bn-simple-kpis strong{display:block;color:#0a2349;font-size:32px;line-height:1;margin-top:9px}

body.delivery-bangla .bn-progress-wrap{margin:0 0 18px;padding:18px;border-radius:22px;background:linear-gradient(135deg,#ffffff,#f2f8ff);border:1px solid #dbe8f6;box-shadow:0 12px 30px rgba(31,79,137,.07)}
body.delivery-bangla .bn-progress-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:11px;color:#435b79}
body.delivery-bangla .bn-progress-head b{color:#0b2448;font-size:17px}
body.delivery-bangla .bn-progress-track{height:13px;border-radius:999px;background:#e4edf7;overflow:hidden;box-shadow:inset 0 1px 3px rgba(4,34,76,.08)}
body.delivery-bangla .bn-progress-track i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#0d75ec,#18c6df,#24d79a);box-shadow:0 0 14px rgba(24,198,223,.35)}

body.delivery-bangla .bn-game-card{border-radius:28px;background:linear-gradient(145deg,#081f47 0%,#0b2d62 55%,#102963 100%);border:1px solid rgba(255,255,255,.08);box-shadow:0 20px 50px rgba(6,30,72,.22);padding:22px;color:#fff;margin:18px 0;position:relative;overflow:hidden}
body.delivery-bangla .bn-game-card:after{content:"★";position:absolute;right:20px;top:10px;color:rgba(255,188,51,.13);font-size:94px;line-height:1}
body.delivery-bangla .bn-game-card .game-progress-head,body.delivery-bangla .bn-game-card .game-level-row,body.delivery-bangla .bn-game-card .game-mini-stats,body.delivery-bangla .bn-game-card .game-badges,body.delivery-bangla .bn-game-card .game-leader-btn{position:relative;z-index:1}
body.delivery-bangla .bn-game-card .game-eyebrow{color:#75c7ff;font-size:12px;font-weight:700}
body.delivery-bangla .bn-game-card h3{font-size:25px;margin:5px 0;color:#fff}
body.delivery-bangla .bn-game-card p{color:#b8ccea;margin:0}
body.delivery-bangla .bn-game-card .game-points{min-width:104px;text-align:center;padding:12px;border-radius:20px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1)}
body.delivery-bangla .bn-game-card .game-points span{font-size:34px;color:#ffbd31;font-weight:800;display:block}
body.delivery-bangla .bn-game-card .game-points small{color:#d8e7ff}
body.delivery-bangla .bn-game-card .game-level-track{background:rgba(255,255,255,.12)}
body.delivery-bangla .bn-game-card .game-level-track i{background:linear-gradient(90deg,#58a8ff,#7c6cff,#ffbe2f)}
body.delivery-bangla .bn-game-card .game-mini-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-top:15px}
body.delivery-bangla .bn-game-card .game-mini-stats>div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.06);border-radius:16px;padding:12px 8px;text-align:center}
body.delivery-bangla .bn-game-card .game-mini-stats strong{font-size:21px;color:#fff;display:block}
body.delivery-bangla .bn-game-card .game-mini-stats span{color:#aac1e2}
body.delivery-bangla .bn-game-card .game-leader-btn{width:100%;margin-top:14px;background:linear-gradient(135deg,#287cef,#12bada);color:#fff;border:0}

body.delivery-bangla .bn-section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:28px 0 12px}
body.delivery-bangla .bn-section-title h3{margin:0;color:#0a2349;font-size:24px}
body.delivery-bangla .bn-section-title p{margin:4px 0 0;color:#758aa3;font-size:13px}
body.delivery-bangla .bn-section-title .btn{background:#e8f3ff;color:#0b62c9;border:1px solid #d1e6fb}

body.delivery-bangla .bn-delivery-card{position:relative;border-radius:24px;border:1px solid #d9e8f6;background:#fff;box-shadow:0 12px 30px rgba(26,71,126,.08);padding:18px;margin-bottom:14px;overflow:hidden}
body.delivery-bangla .bn-delivery-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:linear-gradient(180deg,#176fe6,#15c7dc)}
body.delivery-bangla .bn-delivery-card .route-no{width:44px;height:44px;border-radius:15px;background:linear-gradient(145deg,#eaf4ff,#dcecff);color:#0b62cc;font-size:20px;box-shadow:inset 0 0 0 1px #cfe3f9}
body.delivery-bangla .bn-delivery-card h3{font-size:20px;color:#0b2448;margin-bottom:6px}
body.delivery-bangla .bn-delivery-card .delivery-meta{color:#5e7390;font-size:14px;line-height:1.75}
body.delivery-bangla .bn-delivery-card .delivery-meta b{color:#143b6b}
body.delivery-bangla .bn-delivery-card .badge{font-size:12px;padding:7px 10px}
body.delivery-bangla .bn-delivery-card .delivery-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:14px}
body.delivery-bangla .bn-delivery-card .delivery-actions .btn{width:100%;border-radius:14px;min-height:48px}
body.delivery-bangla .bn-delivery-card .delivery-actions .primary{background:linear-gradient(135deg,#0b68dd,#0e8cf1);box-shadow:0 8px 18px rgba(13,104,221,.2)}
body.delivery-bangla .bn-delivery-card .proof-audit{margin-top:13px;border-radius:16px;background:#f3f9ff;border:1px solid #d8ebfa;padding:10px}
body.delivery-bangla .bn-delivery-card .proof-thumb{width:72px;height:72px;border-radius:14px}

body.delivery-bangla .bn-help-box{padding:14px 15px;border-radius:18px;background:#fff8df;border:1px solid #ffe6a1;color:#715620;box-shadow:0 8px 20px rgba(188,132,15,.06)}
body.delivery-bangla .bn-date-label{display:inline-flex;padding:7px 11px;border-radius:999px;background:#eaf4ff;color:#1760b3;font-weight:700;margin-bottom:12px}
body.delivery-bangla .bn-empty{border:1px dashed #cfe0f1;border-radius:18px;background:#f8fbff}
body.delivery-bangla .bn-leader-hero{border-radius:28px;background:linear-gradient(135deg,#0a2c5f,#0c55b8);box-shadow:0 20px 45px rgba(6,48,110,.19)}
body.delivery-bangla .bn-leader-list .leader-row{border-radius:18px;background:linear-gradient(135deg,#0f1d35,#111a2d);border:1px solid rgba(255,255,255,.06);margin-bottom:10px;box-shadow:0 10px 24px rgba(5,20,48,.11)}
body.delivery-bangla .bn-leader-list .leader-row.is-me{background:linear-gradient(135deg,#0d4088,#0d5cb8);border-color:rgba(103,184,255,.45)}
body.delivery-bangla .bn-rules{border-radius:24px}
body.delivery-bangla .bn-invoice-card{border-radius:24px;box-shadow:0 14px 35px rgba(28,73,128,.08)}
body.delivery-bangla .invoice{border-radius:17px;background:#fbfdff}
body.delivery-bangla .modal{border-radius:28px}
body.delivery-bangla .modal-bg{backdrop-filter:blur(8px);background:rgba(3,17,39,.62)}
body.delivery-bangla .modal .btn{min-height:46px;border-radius:14px}
body.delivery-bangla .toast{left:16px;right:16px;bottom:18px;text-align:center;border-radius:16px;background:#092653}
body.delivery-bangla .app-loading{background:linear-gradient(180deg,#fff,#f0f8ff)}
body.delivery-bangla .loading-orb{background:#fff}

@media(max-width:760px){
  body.delivery-bangla .content{padding:12px 12px 30px}
  body.delivery-bangla .topbar{height:70px;padding:0 12px}
  body.delivery-bangla .mobile-brand-logo{width:44px;height:40px}
  body.delivery-bangla .page-title h1{font-size:21px}
  body.delivery-bangla .page-title p{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
  body.delivery-bangla .bn-hero{padding:22px 20px;border-radius:24px;margin-top:4px}
  body.delivery-bangla .bn-hero h2{font-size:29px;margin-top:10px}
  body.delivery-bangla .bn-hero p{font-size:14px;line-height:1.7}
  body.delivery-bangla .bn-simple-kpis{grid-template-columns:1fr 1fr;gap:10px}
  body.delivery-bangla .bn-simple-kpis>div{padding:14px 12px;border-radius:18px}
  body.delivery-bangla .bn-simple-kpis strong{font-size:28px}
  body.delivery-bangla .bn-game-card{padding:18px;border-radius:24px}
  body.delivery-bangla .bn-game-card .game-progress-head{display:grid;grid-template-columns:1fr auto;align-items:start;gap:10px}
  body.delivery-bangla .bn-game-card h3{font-size:22px}
  body.delivery-bangla .bn-game-card .game-points{min-width:88px;padding:10px}
  body.delivery-bangla .bn-game-card .game-points span{font-size:29px}
  body.delivery-bangla .bn-game-card .game-mini-stats{grid-template-columns:1fr 1fr}
  body.delivery-bangla .bn-section-title{align-items:flex-end;margin-top:24px}
  body.delivery-bangla .bn-section-title h3{font-size:21px}
  body.delivery-bangla .bn-section-title .btn{font-size:12px;padding:9px 11px}
  body.delivery-bangla .bn-delivery-card{padding:15px 14px 14px;border-radius:21px}
  body.delivery-bangla .bn-delivery-card .row{gap:8px}
  body.delivery-bangla .bn-delivery-card .row>div:first-child{min-width:0}
  body.delivery-bangla .bn-delivery-card h3{font-size:18px;overflow-wrap:anywhere}
  body.delivery-bangla .bn-delivery-card .delivery-meta{font-size:13px;line-height:1.75}
  body.delivery-bangla .bn-delivery-card .delivery-actions{grid-template-columns:1fr}
  body.delivery-bangla .bn-delivery-card .delivery-actions .btn{min-height:50px;font-size:15px}
  body.delivery-bangla .proof-audit{align-items:flex-start}
  body.delivery-bangla .bn-leader-list .leader-row{padding:12px 10px;grid-template-columns:auto auto minmax(0,1fr) auto}
  .app-loading,.load-error{min-height:260px;border-radius:22px;padding:26px 18px}
}

/* Bengali leaderboard readability + premium visual fix v16 */
body.delivery-bangla .bn-leader-list{
  gap:12px;
}
body.delivery-bangla .bn-leader-list .leader-row{
  position:relative;
  display:grid;
  grid-template-columns:46px 46px minmax(0,1fr) auto;
  gap:12px;
  align-items:center;
  min-height:84px;
  padding:13px 16px;
  border-radius:20px;
  background:linear-gradient(135deg,#0f1f39 0%,#111a2d 100%);
  border:1px solid rgba(137,174,226,.13);
  box-shadow:0 12px 28px rgba(5,20,48,.12);
  color:#fff;
  overflow:hidden;
}
body.delivery-bangla .bn-leader-list .leader-row::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:4px;
  background:#4c78b8;
  opacity:.75;
}
body.delivery-bangla .bn-leader-list .leader-row.rank-1::before{background:#ffc63d}
body.delivery-bangla .bn-leader-list .leader-row.rank-2::before{background:#cbd6e4}
body.delivery-bangla .bn-leader-list .leader-row.rank-3::before{background:#e69a69}
body.delivery-bangla .bn-leader-list .leader-row.is-me{
  background:linear-gradient(135deg,#0e4fa4 0%,#0c6cc7 100%);
  border-color:rgba(142,210,255,.58);
  box-shadow:0 14px 32px rgba(4,88,180,.24),inset 0 1px 0 rgba(255,255,255,.08);
}
body.delivery-bangla .bn-leader-list .leader-row.is-me::after{
  content:"";
  position:absolute;
  width:160px;
  height:160px;
  right:-86px;
  top:-84px;
  border-radius:50%;
  background:rgba(255,255,255,.06);
  pointer-events:none;
}
body.delivery-bangla .bn-leader-list .leader-rank{
  color:#fff;
  text-align:center;
  position:relative;
  z-index:1;
}
body.delivery-bangla .bn-rank-medal{
  display:grid;
  place-items:center;
  width:40px;
  height:40px;
  border-radius:13px;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.08);
  font-family:var(--font-ui)!important;
  font-size:20px;
  line-height:1;
}
body.delivery-bangla .bn-leader-list .rank-1 .bn-rank-medal{background:rgba(255,198,61,.14);border-color:rgba(255,211,107,.22)}
body.delivery-bangla .bn-leader-list .rank-2 .bn-rank-medal{background:rgba(207,220,237,.11);border-color:rgba(219,229,242,.18)}
body.delivery-bangla .bn-leader-list .rank-3 .bn-rank-medal{background:rgba(230,154,105,.11);border-color:rgba(240,181,141,.18)}
body.delivery-bangla .bn-leader-list .leader-avatar{
  width:42px;
  height:42px;
  border-radius:50%;
  background:#244a76;
  color:#fff;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);
  font-family:var(--font-ui)!important;
  font-weight:800;
  position:relative;
  z-index:1;
}
body.delivery-bangla .bn-leader-list .rank-1 .leader-avatar{background:linear-gradient(135deg,#815c00,#d89b12);color:#fff4cc}
body.delivery-bangla .bn-leader-list .rank-2 .leader-avatar{background:linear-gradient(135deg,#4d5a6e,#7d8da6)}
body.delivery-bangla .bn-leader-list .rank-3 .leader-avatar{background:linear-gradient(135deg,#7b4930,#a96845)}
body.delivery-bangla .bn-leader-list .leader-row.is-me .leader-avatar{background:linear-gradient(135deg,#254d7e,#3c6b9f)}
body.delivery-bangla .bn-leader-list .leader-person{
  min-width:0;
  color:#fff;
  position:relative;
  z-index:1;
}
body.delivery-bangla .bn-leader-list .bn-leader-name{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
  flex-wrap:wrap;
}
body.delivery-bangla .bn-leader-list .leader-person b{
  display:block;
  min-width:0;
  color:#fff!important;
  font-family:var(--font-bangla)!important;
  font-size:17px;
  line-height:1.25;
  font-weight:700;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  text-shadow:0 1px 1px rgba(0,0,0,.12);
}
body.delivery-bangla .bn-leader-list .leader-person small{
  display:flex;
  align-items:center;
  gap:5px 8px;
  flex-wrap:wrap;
  margin-top:5px;
  color:#a8c8ea!important;
  font-family:var(--font-bangla)!important;
  font-size:12px;
  line-height:1.45;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
}
body.delivery-bangla .bn-leader-list .leader-row.is-me .leader-person small{color:#d5ebff!important}
body.delivery-bangla .bn-leader-list .leader-person small span:not(:last-child)::after{
  content:"•";
  margin-left:8px;
  color:#5f86b5;
}
body.delivery-bangla .bn-leader-list .leader-row.is-me .leader-person small span:not(:last-child)::after{color:#8fcaff}
body.delivery-bangla .bn-leader-list .you-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:3px 7px;
  border-radius:999px;
  background:#e8f5ff;
  color:#0a5eb2!important;
  border:1px solid rgba(255,255,255,.7);
  font-family:var(--font-bangla)!important;
  font-size:10px;
  line-height:1;
  font-weight:800;
  margin:0;
  box-shadow:0 4px 10px rgba(4,53,109,.12);
}
body.delivery-bangla .bn-leader-list .leader-score{
  text-align:right;
  min-width:58px;
  position:relative;
  z-index:1;
}
body.delivery-bangla .bn-leader-list .leader-score strong{
  display:block;
  color:#ffd43b!important;
  font-family:var(--font-bangla)!important;
  font-size:25px;
  line-height:1;
  font-weight:800;
}
body.delivery-bangla .bn-leader-list .leader-score span{
  display:block;
  margin-top:5px;
  color:#a9c2df!important;
  font-family:var(--font-bangla)!important;
  font-size:10px;
  line-height:1;
}
body.delivery-bangla .bn-leader-list .leader-row.is-me .leader-score span{color:#d7ebff!important}

@media(max-width:560px){
  body.delivery-bangla .bn-leader-list .leader-row{
    grid-template-columns:38px 38px minmax(0,1fr) auto;
    gap:9px;
    min-height:78px;
    padding:12px 12px;
    border-radius:18px;
  }
  body.delivery-bangla .bn-rank-medal{width:34px;height:34px;border-radius:11px;font-size:17px}
  body.delivery-bangla .bn-leader-list .leader-avatar{width:36px;height:36px;font-size:11px}
  body.delivery-bangla .bn-leader-list .leader-person b{font-size:15px}
  body.delivery-bangla .bn-leader-list .leader-person small{font-size:10.5px;gap:3px 6px}
  body.delivery-bangla .bn-leader-list .leader-person small span:not(:last-child)::after{margin-left:6px}
  body.delivery-bangla .bn-leader-list .leader-score{min-width:50px}
  body.delivery-bangla .bn-leader-list .leader-score strong{font-size:21px}
}

@media(max-width:390px){
  body.delivery-bangla .bn-leader-list .leader-row{
    grid-template-columns:34px 34px minmax(0,1fr) 48px;
    gap:7px;
    padding:11px 9px;
  }
  body.delivery-bangla .bn-rank-medal{width:31px;height:31px;font-size:15px}
  body.delivery-bangla .bn-leader-list .leader-avatar{width:32px;height:32px}
  body.delivery-bangla .bn-leader-list .leader-person b{font-size:14px}
  body.delivery-bangla .bn-leader-list .leader-person small{font-size:9.5px}
  body.delivery-bangla .bn-leader-list .leader-score strong{font-size:19px}
}

/* v17 — public client complaint portal on login screen */
.client-enabled-login .login-panel{padding:24px}
.portal-card{width:min(620px,100%);padding:24px}
.portal-switch{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:5px;border-radius:15px;background:#edf3fb;border:1px solid #d9e4f1;margin-bottom:24px}
.portal-tab{min-height:44px;border:0;border-radius:11px;background:transparent;color:#58708f;font-family:Montserrat,Lexend,sans-serif;font-weight:800;padding:10px 12px}
.portal-tab.active{background:#fff;color:#0d5bd7;box-shadow:0 5px 16px rgba(20,54,99,.10)}
.portal-pane{display:none}.portal-pane.active{display:block;animation:portalIn .2s ease}
@keyframes portalIn{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:none}}
.login-brand-copy{position:relative;z-index:1}.kicker.light{color:#cfe2ff}
.login-trust-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.login-trust-row span{font-size:12px;font-family:Montserrat,Lexend,sans-serif;font-weight:700;padding:8px 10px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.07);color:#eaf4ff}
.client-help-link{width:100%;border:0;background:transparent;color:#0d5bd7;font-weight:800;font-family:Montserrat,Lexend,sans-serif;margin-top:16px;padding:10px;text-align:center}
.client-help-link:hover{text-decoration:underline}
.client-portal-head{display:flex;gap:13px;align-items:flex-start;margin-bottom:12px}.client-help-icon{width:45px;height:45px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(135deg,#e9f2ff,#d8e8ff);color:#0d5bd7;font-family:Bebas Neue,Montserrat,sans-serif;font-size:27px;font-weight:900;flex:0 0 auto}.client-portal-head h2{margin:2px 0 5px}.client-portal-head .sub{margin:0}
.complaint-public-grid{gap:10px}.complaint-public-grid .field{margin:7px 0}.complaint-public-grid textarea{min-height:115px}.optional{font-weight:500;color:#8b9bb1;font-size:11px}.field-help{display:block;color:#7f90a7;font-size:11px;line-height:1.45}.complaint-submit{margin-top:10px;min-height:48px}.client-privacy-note{margin-top:11px;padding:10px 12px;background:#f6f9fd;border:1px solid #e2eaf4;border-radius:12px;color:#73859c;font-size:11px;line-height:1.5}.hp-field{position:absolute!important;left:-99999px!important;width:1px!important;height:1px!important;opacity:0!important}
.complaint-success{text-align:center;padding:22px 8px 8px}.success-check{width:66px;height:66px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;background:linear-gradient(135deg,#17a977,#38d39f);color:#fff;font-size:34px;font-weight:900;box-shadow:0 12px 28px rgba(23,169,119,.22)}.complaint-success h3{font-size:23px;margin:6px 0}.complaint-success p{color:#6d7e94;line-height:1.55}.complaint-reference{display:inline-block;margin:10px 0 18px;padding:12px 18px;border-radius:13px;background:#10213d;color:#fff;font-family:Montserrat,Lexend,sans-serif;font-size:17px;font-weight:900;letter-spacing:.04em}.success-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap}
.public-complaint{border-left:4px solid #0d5bd7}.public-complaint-meta{display:flex;align-items:center;gap:8px 12px;flex-wrap:wrap;margin-top:9px;color:#536b89;font-size:11px}.public-complaint-meta span:not(.badge){background:#eef5ff;padding:5px 8px;border-radius:8px}.public-complaint-meta b{color:#27476f}
@media(max-width:760px){.client-enabled-login .login-brand{display:none}.client-enabled-login .login-panel{padding:12px;align-items:flex-start;min-height:100vh}.portal-card{padding:18px 15px;border-radius:20px;margin-top:10px}.portal-switch{position:sticky;top:8px;z-index:2;background:rgba(237,243,251,.94);backdrop-filter:blur(10px)}.complaint-public-grid{grid-template-columns:1fr}.complaint-public-grid .span2{grid-column:auto}.client-portal-head h2{font-size:24px}.client-help-icon{width:42px;height:42px}.complaint-reference{font-size:14px;max-width:100%;overflow-wrap:anywhere}}

/* v18 Client Login + Client Portal */
.portal-switch.triple{grid-template-columns:repeat(3,minmax(0,1fr))}
.portal-switch.triple .portal-tab{padding:10px 8px;font-size:12px;white-space:nowrap}
.client-login-icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;background:linear-gradient(135deg,#0d5bd7,#4b95ff);color:#fff;font-family:"Bebas Neue",Montserrat,sans-serif;font-size:31px;box-shadow:0 12px 28px rgba(13,91,215,.24);margin-bottom:14px}
.client-login-features{display:grid;gap:8px;margin:17px 0 5px}.client-login-features span{position:relative;padding:9px 12px 9px 34px;border-radius:12px;background:#f4f8fe;color:#49627e;font-size:12px;font-weight:700}.client-login-features span:before{content:"✓";position:absolute;left:12px;top:8px;color:#16845f;font-weight:900}
.client-portal-body{background:#f3f7fd}.client-portal-body .content{max-width:1320px}.client-portal-body .sidebar{background:linear-gradient(180deg,#071d42,#0b2e64)}
.client-home-hero{display:flex;align-items:center;gap:18px;padding:24px;border-radius:24px;background:linear-gradient(135deg,#073f9e,#0d66e9 58%,#66a9ff);color:#fff;box-shadow:0 18px 42px rgba(15,73,159,.2);overflow:hidden;position:relative}.client-home-hero:after{content:"";position:absolute;width:230px;height:230px;border:1px solid rgba(255,255,255,.14);border-radius:50%;right:-85px;top:-120px;box-shadow:0 0 0 48px rgba(255,255,255,.05)}.client-home-logo{width:76px;height:66px;display:grid;place-items:center;border-radius:18px;background:#fff;padding:6px;flex:0 0 auto;z-index:1}.client-home-logo img{width:100%;height:100%;object-fit:contain}.client-home-hero>div:last-child{z-index:1}.client-home-hero h2{font-size:34px;margin:3px 0 5px}.client-home-hero p{margin:0;color:#e1edff}
.client-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:18px 0}.client-kpi{border:1px solid #dbe5f2;background:#fff;border-radius:18px;padding:18px;text-align:left;color:#10213d;box-shadow:0 8px 22px rgba(29,58,101,.07)}button.client-kpi{cursor:pointer}.client-kpi span{display:block;color:#657b99;font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.04em}.client-kpi strong{display:block;font-family:"Bebas Neue",Montserrat,sans-serif;font-size:32px;margin-top:7px;line-height:1}.client-kpi small{display:block;color:#7d8da5;margin-top:6px}
.client-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px}.client-action-card{border:0;text-align:left;padding:19px;border-radius:20px;background:linear-gradient(135deg,#eaf3ff,#fff);border:1px solid #d7e5f7;color:#16385f;box-shadow:0 8px 22px rgba(28,63,110,.06)}.client-action-card:hover{transform:translateY(-1px)}.client-action-card.danger-lite{background:linear-gradient(135deg,#fff0f2,#fff);border-color:#f1d8dd}.client-action-icon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:#0d5bd7;color:#fff;font-size:23px;font-weight:900;margin-bottom:11px}.danger-lite .client-action-icon{background:#c33b43}.client-action-card b{display:block;font-size:16px}.client-action-card small{display:block;line-height:1.5;color:#6e7f95;margin-top:4px}.client-home-grid{margin-top:0}
.client-mini-row{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding:11px 0;border-bottom:1px solid #edf2f8}.client-mini-row:last-child{border-bottom:0}.client-mini-row b{display:block;font-size:13px}.client-mini-row small{display:block;color:#7c8ca3;font-size:11px;margin-top:3px}
.client-section-hero{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:22px 24px;margin-bottom:16px;border-radius:22px;background:linear-gradient(135deg,#eaf3ff,#fff);border:1px solid #d9e6f6}.client-section-hero.complaint-hero{background:linear-gradient(135deg,#fff0f2,#fff);border-color:#f1d8dd}.client-section-hero h2{font-size:30px;margin:4px 0 4px}.client-section-hero p{margin:0;color:#687d98}
.client-request-list{display:grid;gap:13px}.client-request-card{background:#fff;border:1px solid #dce6f2;border-radius:18px;padding:17px 18px;box-shadow:0 7px 22px rgba(27,56,98,.06)}.client-request-card.staff{border-left:4px solid #5fa8ff}.complaint-client-card{border-left:4px solid #ff6a7a}.client-request-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.client-request-top h3{margin:6px 0 4px;font-size:17px}.client-request-top small{color:#7d8ba0}.client-request-card>p{color:#53677f;line-height:1.55;margin:13px 0 0}.client-request-type{display:inline-flex;padding:5px 9px;border-radius:999px;background:#e9f2ff;color:#0d5bd7;font-size:11px;font-weight:900}.client-request-type.danger{background:#ffebee;color:#b52f3c}.client-response{display:grid;gap:4px;padding:12px 13px;margin-top:13px;border-radius:13px;background:#eef7f3;border:1px solid #d6eee4}.client-response b{font-size:12px;color:#16845f}.client-response span{font-size:13px;color:#294c42}.client-response small{font-size:11px;color:#76958a}.client-form-intro{display:grid;gap:3px;padding:12px 14px;border-radius:13px;background:#eef5ff;color:#294b75;margin-bottom:13px}.client-form-intro.complaint{background:#fff0f2;color:#773541}.client-form-intro span{font-size:12px;opacity:.8}
@media(max-width:760px){.portal-switch.triple{grid-template-columns:1fr}.portal-switch.triple .portal-tab{font-size:13px}.portal-switch.triple{position:static}.client-home-hero{padding:18px;border-radius:20px}.client-home-logo{width:62px;height:54px}.client-home-hero h2{font-size:27px}.client-kpis{grid-template-columns:1fr}.client-kpi{padding:15px}.client-action-grid{grid-template-columns:1fr}.client-section-hero{display:block;padding:18px}.client-section-hero .btn{margin-top:13px;width:100%}.client-request-top{gap:9px}.client-request-card{padding:15px}.client-home-grid{grid-template-columns:1fr}}

/* v24 login password visibility toggle */
.password-input-wrap{position:relative;display:flex;align-items:center}
.password-input-wrap input{padding-right:54px!important}
.password-toggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:40px;height:40px;border:0;border-radius:11px;background:transparent;color:#60779a;display:flex;align-items:center;justify-content:center;padding:0;transition:background .16s ease,color .16s ease,transform .16s ease;z-index:2}
.password-toggle:hover{background:#edf4ff;color:#0d5bd7}
.password-toggle:focus-visible{outline:3px solid rgba(13,91,215,.22);outline-offset:1px;background:#edf4ff;color:#0d5bd7}
.password-toggle:active{transform:translateY(-50%) scale(.96)}
.password-toggle svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.password-toggle .eye-closed{display:none}
.password-toggle.showing .eye-open{display:none}
.password-toggle.showing .eye-closed{display:block}
@media(max-width:760px){.password-toggle{width:44px;height:44px;right:5px}.password-input-wrap input{padding-right:56px!important}}

/* v25 — keep the app top bar permanently visible on mobile */
@media(max-width:760px){
  .topbar{
    position:fixed!important;
    top:0;
    left:0;
    right:0;
    width:100%;
    z-index:52!important;
    margin:0;
    transform:translateZ(0);
    -webkit-transform:translateZ(0);
  }
  .main{
    padding-top:68px;
  }
  body.delivery-bangla .main{
    padding-top:70px;
  }
  body.sidebar-open .topbar{
    z-index:52!important;
  }
}

/* v26 Central Pricing + Multi-location Warehouse */
.case-rule-banner,.case-order-intro{display:flex;align-items:flex-start;gap:12px;padding:14px 16px;border:1px solid #cfe0f5;background:linear-gradient(135deg,#f4f9ff,#edf5ff);border-radius:16px;margin-bottom:16px}.case-rule-banner b,.case-order-intro b{color:#0b4db7;white-space:nowrap}.case-rule-banner span,.case-order-intro span{color:#607694;font-size:13px;line-height:1.45}.stock-form-hint{padding:12px 14px;border-radius:12px;background:#0f1f39;color:#dbe9ff;font-size:13px}.stock-form-hint b{color:#fff}.optional{font-size:11px;color:#8292a7;font-weight:500}

.price-hero,.warehouse-hero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px;border-radius:22px;background:linear-gradient(135deg,#082b61,#0d65df);color:#fff;margin-bottom:18px;overflow:hidden;position:relative}.price-hero:after,.warehouse-hero:after{content:"";position:absolute;width:230px;height:230px;border-radius:50%;border:1px solid rgba(255,255,255,.14);right:-80px;top:-110px;box-shadow:0 0 0 42px rgba(255,255,255,.04)}.price-hero>*,.warehouse-hero>*{position:relative;z-index:1}.price-hero h2,.warehouse-hero h2{margin:4px 0 7px;font-size:32px}.price-hero p,.warehouse-hero p{margin:0;color:#d9e9ff;max-width:720px;line-height:1.55}.price-hero-actions,.warehouse-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.price-kpis,.warehouse-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-bottom:18px}.warehouse-kpis{grid-template-columns:repeat(4,minmax(0,1fr))}.price-kpis>div,.warehouse-kpis>div{background:#fff;border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 8px 22px rgba(22,50,92,.06)}.price-kpis span,.warehouse-kpis span{display:block;color:#657791;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.price-kpis strong,.warehouse-kpis strong{display:block;font-size:30px;margin:5px 0;color:#0b2448}.price-kpis small,.warehouse-kpis small{color:#8795a9}.commercial-grid{align-items:start}.product-price-list,.seller-commission-list{display:grid;gap:12px}.product-price-row,.seller-commission-card{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid #e1e9f4;border-radius:16px;background:#fbfdff}.product-badge{width:60px;height:60px;border-radius:16px;background:linear-gradient(135deg,#0d5bd7,#57a0ff);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:22px;font-weight:900}.product-badge small{font-size:10px;color:#d9eaff}.product-price-copy{min-width:0;flex:1}.product-price-copy b,.product-price-copy span,.product-price-copy strong{display:block}.product-price-copy b{font-size:14px}.product-price-copy span{font-size:11px;color:#7f8ca0;margin-top:3px}.product-price-copy strong{font-size:20px;color:#0b4db7;margin-top:2px}.seller-commission-card>div{flex:1;min-width:0}.seller-title{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.seller-title b{font-size:15px}.commission-lock{padding:5px 8px;border-radius:999px;background:#eaf8f2;color:#0e805d;font-size:11px;font-weight:900}.seller-commission-card small{color:#7c8ba0}.seller-commission-value{margin-top:8px;font-size:13px;color:#546b89}.seller-commission-value b{color:#0c4fae}.movement-card{margin-top:18px}.extra-stock-pill{display:inline-flex;padding:6px 9px;border-radius:999px;background:#e7f8ef;color:#0c7b54;font-weight:900}.stock-table small{color:#7b8a9f}.commercial-invoice{align-items:center}.invoice-meta,.invoice-seller{color:#74849a;font-size:12px;margin-top:4px}.invoice-seller{color:#496685}.invoice-money{text-align:right;display:grid;gap:3px}.invoice-money small,.invoice-money span{color:#7e8da2;font-size:11px}.invoice-money strong{font-size:18px;color:#0d5bd7}

.bn-warehouse-hero{background:linear-gradient(145deg,#07275d,#0e6ce9);color:#fff;border-radius:26px;padding:22px;margin-bottom:14px;box-shadow:0 18px 40px rgba(13,91,215,.18)}.bn-warehouse-hero>span{font-size:13px;color:#bcd9ff}.bn-warehouse-hero h2{font-family:var(--font-bn,inherit);font-size:28px;margin:4px 0 6px}.bn-warehouse-hero p{font-family:var(--font-bn,inherit);margin:0;color:#dcecff;line-height:1.6}.bn-warehouse-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:18px}.bn-warehouse-kpis>div{background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:12px;text-align:center}.bn-warehouse-kpis b{display:block;font-size:24px}.bn-warehouse-kpis span{display:block;font-family:var(--font-bn,inherit);font-size:12px;color:#d7e9ff;margin-top:2px}.bn-warehouse-actions{display:flex;justify-content:flex-end;margin-bottom:12px}.bn-stock-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.bn-stock-card{background:#fff;border:1px solid #dce7f5;border-radius:20px;padding:16px;box-shadow:0 10px 26px rgba(26,58,102,.07)}.bn-stock-card.shortage{border-color:#ffc5cb;background:#fffafa}.bn-stock-head{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}.bn-stock-head span:first-child{font-weight:900;color:#0d5bd7}.bn-stock-head h3{font-family:var(--font-bn,inherit);margin:2px 0 0;font-size:25px}.bn-stock-location{margin:12px 0;padding:10px 12px;border-radius:12px;background:#f3f7fc;font-family:var(--font-bn,inherit);font-weight:800}.bn-stock-location small{display:block;color:#7d8ba0;font-weight:500;margin-top:2px}.bn-stock-numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.bn-stock-numbers div{background:#f6f9fd;border-radius:12px;padding:10px;text-align:center}.bn-stock-numbers b{display:block;font-size:21px;color:#0b2b59}.bn-stock-numbers span{display:block;font-family:var(--font-bn,inherit);font-size:11px;color:#687b94;margin-top:2px}

@media(max-width:1100px){.price-kpis{grid-template-columns:repeat(3,1fr)}.warehouse-kpis{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.price-hero,.warehouse-hero{display:block;padding:20px}.price-hero h2,.warehouse-hero h2{font-size:27px}.price-hero-actions,.warehouse-actions{justify-content:flex-start;margin-top:14px}.price-kpis,.warehouse-kpis{grid-template-columns:1fr 1fr}.commercial-grid{grid-template-columns:1fr}.product-price-row,.seller-commission-card{align-items:flex-start}.bn-stock-grid{grid-template-columns:1fr}.bn-warehouse-kpis{grid-template-columns:1fr 1fr}.bn-warehouse-kpis>div:last-child{grid-column:1/-1}.stock-table-wrap{overflow:auto}.invoice-money{text-align:left}}
@media(max-width:430px){.price-kpis,.warehouse-kpis{grid-template-columns:1fr}.product-badge{width:52px;height:52px}.price-hero-actions .btn,.warehouse-actions .btn{flex:1 1 45%}.bn-stock-numbers{grid-template-columns:1fr 1fr}.bn-stock-numbers>div:last-child{grid-column:1/-1}}

/* v27 operational readiness helpers */
.ops-warning{display:flex;align-items:flex-start;gap:12px;padding:13px 15px;margin:0 0 14px;border-radius:14px;border:1px solid #dbe6f4;background:#f8fbff;color:#334c6d;flex-wrap:wrap}
.ops-warning b{font-family:var(--font-ui,inherit);font-size:13px}.ops-warning span{font-size:12px;line-height:1.5;color:#61748f;flex:1 1 260px}.ops-warning.danger{background:#fff3f4;border-color:#ffd0d5}.ops-warning.danger b{color:#b72c39}.ops-warning.amber{background:#fff9ed;border-color:#ffe1a8}.ops-warning.amber b{color:#9d6400}.needs-setup-row td{background:#fff9f0!important}.needs-setup-row td:first-child{box-shadow:inset 3px 0 0 #f3a321}.row-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.btn.danger{background:#fff0f1;color:#b72c39}.btn:disabled{opacity:.48;cursor:not-allowed}.warn-text{color:#c4453f!important}.stock-form-hint{padding:11px 12px;border-radius:12px;background:#f3f7fc;border:1px solid #dfe9f4;color:#5e718d;font-size:12px;line-height:1.55}.stock-form-hint b{color:#17375f}
@media(max-width:760px){.ops-warning{padding:12px}.row-actions{min-width:150px}.row-actions .btn{flex:1 1 auto}.needs-setup-row td:first-child{box-shadow:none}.needs-setup-row{border-left:3px solid #f3a321}}

/* v28: make Warehouse and Pricing impossible to miss */
.ops-quick-access{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:16px 0 18px}
.ops-quick-card{appearance:none;border:1px solid #d6e3f3;background:#fff;border-radius:18px;padding:16px 18px;text-align:left;cursor:pointer;box-shadow:0 8px 24px rgba(14,47,87,.06);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;color:#0b294f;font:inherit}
.ops-quick-card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(14,47,87,.10);border-color:#9fc5ff}
.ops-quick-card span{display:block;font-family:Montserrat,Lexend,sans-serif;font-size:11px;font-weight:800;letter-spacing:.08em;color:#1260d7;margin-bottom:5px}
.ops-quick-card b{display:block;font-family:'Bebas Neue',Montserrat,sans-serif;font-size:24px;line-height:1.05;letter-spacing:.01em;color:#0b2445}
.ops-quick-card small{display:block;margin-top:6px;color:#687d98;font-size:12px;line-height:1.45}
.ops-quick-card.warehouse{background:linear-gradient(135deg,#ffffff 0%,#edf6ff 100%)}
.ops-quick-card.pricing{background:linear-gradient(135deg,#ffffff 0%,#f7f3ff 100%)}
@media(max-width:760px){.ops-quick-access{grid-template-columns:1fr;gap:10px;margin:12px 0 14px}.ops-quick-card{border-radius:15px;padding:14px 15px}.ops-quick-card b{font-size:22px}}

/* v30 - invoice print action restored */
.invoice-row-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;flex-wrap:wrap}
.invoice-print-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:92px;border-color:#b9d0f1;background:#f4f8ff;color:#075dd8;font-weight:800}
.invoice-print-btn:hover{background:#e7f1ff;border-color:#88b2ef}
.invoice-print-icon{font-size:17px;line-height:1}
@media(max-width:760px){.commercial-invoice{align-items:flex-start}.invoice-row-actions{justify-content:flex-start;align-items:flex-start}.invoice-print-btn{min-height:42px}.invoice-money{min-width:130px}}