/* THE FLOW premium dashboard UI v1.6.32 */
:root{
  --radius-xl:22px;--radius-lg:16px;--radius-md:12px;
  --shadow-xl:0 34px 110px rgba(0,0,0,.42);
  --shadow-lg:0 22px 70px rgba(0,0,0,.28);
  --shadow-md:0 12px 38px rgba(0,0,0,.18);
}
body[data-theme="premium"],body[data-theme="royal"]{
  --bg:#070817;--panel:#10152a;--panel2:#141a33;--line:#2b3659;
  --muted:#8d9aba;--text:#f6f8ff;--cyan:#67e8ff;--blue:#536dfe;
  --green:#4be0a5;--amber:#ffc96b;--red:#ff6d88;
}
body[data-theme="premium"]{
  background:
    radial-gradient(circle at 82% -8%,rgba(68,87,255,.20),transparent 30%),
    radial-gradient(circle at 11% 78%,rgba(0,217,255,.08),transparent 27%),
    linear-gradient(155deg,#070817,#050a13 68%);
  background-attachment:fixed;
}
body[data-theme="premium"] .app-shell{background:transparent}

/* Brand */
.flow-logo{
  position:relative;width:46px;height:46px;flex:0 0 46px;border-radius:15px;
  display:grid;place-items:center;overflow:hidden;
  background:linear-gradient(145deg,#111d3d,#091127);
  border:1px solid rgba(103,232,255,.35);
  box-shadow:0 0 38px rgba(83,109,254,.28),inset 0 1px 0 rgba(255,255,255,.09);
}
.flow-logo:before,.flow-logo:after{
  content:"";position:absolute;width:33px;height:18px;border:3px solid transparent;
  border-top-color:#67e8ff;border-radius:50%;transform:rotate(-14deg);
}
.flow-logo:after{border-top-color:#765cff;transform:rotate(166deg)}
.flow-logo b{position:relative;z-index:2;color:#f3fbff;font-size:21px;font-weight:950;font-style:italic;letter-spacing:-.07em}
.flow-logo i{position:absolute;width:7px;height:7px;border-radius:50%;background:#4be0a5;right:7px;top:8px;box-shadow:0 0 14px #4be0a5;animation:flowLogoPulse 2s ease-in-out infinite}
.login-brand .flow-logo{width:54px;height:54px;border-radius:17px}
.brand-mark{display:none!important}
@keyframes flowLogoPulse{50%{transform:scale(1.38);opacity:.65}}
@keyframes flowEnter{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:none}}
@keyframes flowShimmer{from{transform:translateX(-160%)}to{transform:translateX(280%)}}

/* Layout / navigation */
body[data-theme="premium"] .sidebar{
  background:linear-gradient(180deg,rgba(12,18,39,.98),rgba(6,9,18,.99));
  border-right-color:#27365c;box-shadow:18px 0 60px rgba(2,4,11,.34);
  backdrop-filter:blur(24px);
}
body[data-theme="premium"] .topbar{
  height:82px;background:rgba(9,15,34,.88);border-bottom-color:#27365c;
  box-shadow:0 12px 42px rgba(2,4,11,.34);backdrop-filter:blur(24px) saturate(1.15);
}
body[data-theme="premium"] .content{max-width:1580px}
.nav-ico{
  width:31px!important;height:31px!important;display:inline-grid!important;place-items:center!important;
  margin-right:10px!important;border:1px solid #2c3d65;border-radius:10px;
  background:linear-gradient(145deg,#121d39,#0b1328);color:#94a9cb;
  transition:.18s ease;
}
.nav-ico svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sidebar nav button{display:flex;align-items:center;min-height:50px;border-radius:12px!important;font-weight:720}
.sidebar nav button:hover .nav-ico,.sidebar nav button.active .nav-ico{
  color:#83edff;border-color:#49699b;background:linear-gradient(145deg,#173157,#111b39);
  box-shadow:0 0 24px rgba(103,232,255,.12);
}
.sidebar nav button.active{background:linear-gradient(90deg,rgba(83,109,254,.18),transparent)!important}
.side-card{background:linear-gradient(145deg,#101b35,#0a1125)!important;border-color:#2c3f68!important}
.profile{border-top-color:#26375c!important}

/* Core surfaces */
.view.active{animation:flowEnter .2s ease-out}
body[data-theme="premium"] .panel,
body[data-theme="premium"] .setting-card,
body[data-theme="premium"] .stat,
body[data-theme="premium"] .finance-stat{
  background:linear-gradient(145deg,rgba(18,26,53,.94),rgba(10,16,35,.94));
  border-color:#29385e;box-shadow:0 18px 55px rgba(2,4,11,.27),inset 0 1px 0 rgba(255,255,255,.035);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
body[data-theme="premium"] .panel:hover,
body[data-theme="premium"] .setting-card:hover,
body[data-theme="premium"] .stat:hover,
body[data-theme="premium"] .finance-stat:hover{
  border-color:#40598b;box-shadow:0 24px 70px rgba(2,4,11,.38),inset 0 1px 0 rgba(255,255,255,.05);
  transform:translateY(-2px);
}
body[data-theme="premium"] .hero-strip{
  background:
    radial-gradient(circle at 82% 38%,rgba(86,105,255,.20),transparent 22%),
    radial-gradient(circle at 20% 120%,rgba(53,216,255,.10),transparent 35%),
    linear-gradient(120deg,#111b3b,#090e1f 65%);
  border-color:#334c7d;box-shadow:0 24px 90px rgba(2,4,11,.40),inset 0 1px 0 rgba(255,255,255,.04);
}
body[data-theme="premium"] .hero-strip:before{
  content:"";position:absolute;left:-25%;top:0;width:38%;height:1px;
  background:linear-gradient(90deg,transparent,#67e8ff,transparent);animation:flowShimmer 5s linear infinite;
}
body[data-theme="premium"] .hero-strip h2{font-size:40px;letter-spacing:-.035em}
body[data-theme="premium"] .orb{background:radial-gradient(circle,#385bff 0,#13234b 50%,transparent 58%);box-shadow:0 0 95px rgba(91,98,255,.27)}

/* Buttons / fields */
body[data-theme="premium"] .primary{
  border:1px solid rgba(143,238,255,.12);
  background:linear-gradient(135deg,#32cfff,#536dfe 55%,#725cff);
  box-shadow:0 13px 34px rgba(52,94,255,.22);transition:.18s ease;
}
body[data-theme="premium"] .primary:hover{filter:brightness(1.08);transform:translateY(-1px);box-shadow:0 16px 42px rgba(52,94,255,.31)}
body[data-theme="premium"] .secondary,
body[data-theme="premium"] .icon-btn{
  background:linear-gradient(145deg,#151d39,#0d142b);border-color:#30436d;color:#dce8ff;
}
body[data-theme="premium"] .secondary:hover,
body[data-theme="premium"] .icon-btn:hover{background:#172343;border-color:#496493}
body[data-theme="premium"] .field input,
body[data-theme="premium"] .field select,
body[data-theme="premium"] .field textarea,
body[data-theme="premium"] .assign,
body[data-theme="premium"] .theme-picker{
  background:#0b1227;border-color:#2b3c64;color:#f4f8ff;min-height:44px;
}
body[data-theme="premium"] .field input:focus,
body[data-theme="premium"] .field select:focus,
body[data-theme="premium"] .field textarea:focus{
  border-color:#5b79ff;box-shadow:0 0 0 3px rgba(83,109,254,.13),0 10px 28px rgba(4,8,21,.33);
}
body[data-theme="premium"] .modal{
  background:radial-gradient(circle at 100% 0,rgba(83,109,254,.11),transparent 28%),linear-gradient(145deg,#121a34,#0a1124);
  border-color:#385080;box-shadow:0 45px 135px rgba(0,0,0,.72);
}
body[data-theme="premium"] .login-card{
  background:radial-gradient(circle at 100% 0,rgba(83,109,254,.13),transparent 33%),linear-gradient(145deg,#111936,#090f22);
  border-color:#334a79;box-shadow:0 45px 130px rgba(0,0,0,.67);
}

/* Global search */
.global-search-wrap{position:relative;z-index:75}
.search.global{
  width:min(380px,32vw);height:44px;border-radius:13px;
  transition:border-color .18s,box-shadow .18s,width .18s;
}
body[data-theme="premium"] .search.global{
  background:linear-gradient(145deg,#111a34,#0a1125);border-color:#304268;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.search.global:focus-within{width:min(430px,36vw)}
body[data-theme="premium"] .search.global:focus-within{
  border-color:#6785ff;box-shadow:0 0 0 3px rgba(83,109,254,.12),0 18px 44px rgba(2,4,11,.33);
}
.global-search-results{
  position:absolute;right:0;top:calc(100% + 12px);width:min(520px,calc(100vw - 30px));
  max-height:min(590px,72vh);overflow:auto;padding:10px;border:1px solid #354d80;
  border-radius:19px;background:linear-gradient(155deg,rgba(16,26,54,.97),rgba(8,14,32,.98) 72%);
  box-shadow:0 35px 110px rgba(0,0,0,.72);backdrop-filter:blur(28px) saturate(1.18);
  animation:flowEnter .16s ease-out;
}
.global-search-results header{display:flex;justify-content:space-between;align-items:center;padding:10px 11px 12px;border-bottom:1px solid #253861}
.global-search-results header b{font-size:11px}.global-search-results header small{color:var(--muted);font-size:8px}
.search-result{
  display:grid!important;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:11px;
  width:100%;min-height:60px;margin-top:5px;padding:10px 11px!important;border:1px solid transparent!important;
  border-radius:13px!important;background:transparent!important;color:var(--text)!important;text-align:left!important;
}
.search-result:hover,.search-result.active{background:linear-gradient(90deg,rgba(83,109,254,.10),rgba(53,216,255,.05))!important;border-color:#405a8b!important}
.search-result .sr-icon{width:36px;height:36px;border:1px solid #3b5887;border-radius:11px;display:grid;place-items:center;color:#80ecff;background:linear-gradient(145deg,#172c50,#101a35);font-weight:900;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.search-result div{min-width:0}.search-result b,.search-result small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.search-result b{font-size:10px}.search-result small{margin-top:3px;color:var(--muted);font-size:8px}.search-result em{font-style:normal;color:#7388aa;font-size:8px;text-transform:uppercase}
.search-empty{padding:30px 20px;text-align:center;color:var(--muted);font-size:10px}

/* Notifications */
.notification-center{position:relative;z-index:76}
.icon-btn{position:relative;width:44px;height:44px;padding:0!important;display:grid;place-items:center;border-radius:12px;cursor:pointer}
.icon-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.icon-btn.active{border-color:#607cf7!important;color:#a5eeff!important;box-shadow:0 0 0 3px rgba(83,109,254,.11)}
.notify-badge{position:absolute;right:-5px;top:-6px;min-width:19px;height:19px;padding:0 5px;border:2px solid #090f22;border-radius:999px;background:linear-gradient(135deg,#ff5b7e,#ff355f);color:#fff;display:grid;place-items:center;font-size:8px;font-weight:950;box-shadow:0 4px 12px rgba(255,53,95,.35)}
.notification-dropdown{
  position:absolute;right:0;top:52px;width:min(440px,calc(100vw - 28px));max-height:min(650px,calc(100vh - 110px));
  overflow:auto;border:1px solid #354d80;border-radius:19px;
  background:linear-gradient(155deg,rgba(16,26,54,.98),rgba(8,14,32,.99) 76%);
  box-shadow:0 35px 110px rgba(0,0,0,.72);z-index:90;backdrop-filter:blur(28px) saturate(1.18);
  animation:flowEnter .16s ease-out;
}
.notification-dropdown>header{position:sticky;top:0;display:flex;align-items:flex-start;justify-content:space-between;padding:18px;border-bottom:1px solid #2a3d68;background:rgba(16,26,53,.96);backdrop-filter:blur(16px);z-index:2}
.notification-dropdown header span{color:#79e9ff;font-size:8px;font-weight:900;letter-spacing:.18em}.notification-dropdown header h3{margin:5px 0 0;font-size:16px}
.notification-head-actions{display:flex;gap:6px}.notification-head-actions button{min-height:30px;padding:0 9px;border:1px solid rgba(255,255,255,.10);border-radius:8px;background:rgba(255,255,255,.04);color:#dcecff;font-size:8px;font-weight:850}
.notification-permission{margin:12px;border:1px solid #2d4e77;border-radius:13px;padding:12px;display:flex;align-items:center;justify-content:space-between;gap:10px;background:#0d1a32}
.notification-permission.granted{border-color:rgba(41,150,109,.40);background:#12352b}.notification-permission.denied{border-color:rgba(163,68,86,.40);background:#321b24}
.notification-permission b{display:block;font-size:9px}.notification-permission small{display:block;margin-top:3px;color:#8298b3;font-size:8px}.notification-permission button{border:1px solid #3a7896;border-radius:8px;background:#153b55;color:#a8efff;padding:7px 9px;font-size:8px;font-weight:900}
.notification-list{padding:0 12px 12px}.notification-item{display:grid;grid-template-columns:9px minmax(0,1fr) auto;gap:10px;align-items:center;padding:13px 8px;border-bottom:1px solid #1f3153;border-radius:10px}.notification-item.unread{background:linear-gradient(90deg,rgba(83,109,254,.06),rgba(53,216,255,.025))}
.notification-dot{width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 0 12px rgba(255,189,74,.5)}.notification-item.critical .notification-dot,.notification-item.expired .notification-dot{background:var(--red);box-shadow:0 0 12px rgba(255,85,113,.55)}.notification-item.info .notification-dot{background:var(--cyan)}
.notification-item>div{min-width:0}.notification-item b,.notification-item small,.notification-item p{display:block}.notification-item b{font-size:10px}.notification-item small{color:#758ba8;font-size:8px}.notification-item p{margin:4px 0 0;color:#bfcee1;font-size:9px;line-height:1.45}.notification-item button{border:1px solid #315b82;border-radius:8px;background:#102b47;color:#86eaff;padding:7px 9px;font-size:8px;white-space:nowrap}.notification-empty{padding:38px 18px;text-align:center;color:var(--muted)}.notification-empty b{display:block;color:var(--text);margin-bottom:5px}

/* Install / PWA */
.install-btn{display:flex;align-items:center;justify-content:center;gap:7px;min-width:120px;height:44px;border-radius:12px!important}
.install-btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.9}
body[data-theme="premium"] .install-btn{background:linear-gradient(145deg,#17203d,#10172d);border-color:#34486f;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
body[data-theme="premium"] .install-btn:hover{border-color:#5c72a4;background:#1b2948}
.pwa-installed{color:var(--green)!important;border-color:rgba(75,224,165,.35)!important}
body[data-theme="premium"] .theme-picker{height:44px;border-radius:12px}

/* Pricing / notices */
.finance-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:0 0 15px}
.finance-stat{position:relative;overflow:hidden;min-height:128px;padding:18px;border:1px solid var(--line);border-radius:16px}
.finance-stat:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-28px;top:-29px;background:color-mix(in srgb,var(--tone,var(--cyan)) 10%,transparent)}
.finance-stat .fi{width:37px;height:37px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--tone,var(--cyan)) 34%,var(--line));border-radius:11px;background:color-mix(in srgb,var(--tone,var(--cyan)) 12%,transparent);color:var(--tone,var(--cyan));font-weight:950;box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}
.finance-stat small{display:block;margin-top:12px;color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.1em;font-weight:900}.finance-stat b{display:block;margin-top:3px;font-size:26px}.finance-stat p{margin:3px 0 0;color:var(--muted);font-size:9px}.finance-stat.green{--tone:var(--green)}.finance-stat.amber{--tone:var(--amber)}
.analytics-visuals{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(270px,.5fr);gap:14px;margin-bottom:14px}.analytics-card{padding:19px}.bars{display:grid;gap:13px;margin-top:18px}.bars>div>span{display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:10px}.bars>div>span b{color:var(--text)}.bars>div>i{display:block;height:8px;margin-top:7px;border-radius:999px;background:color-mix(in srgb,var(--line) 72%,transparent);overflow:hidden}.bars>div>i>em{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--cyan),var(--blue));transition:width .45s ease}.bars>div>i>em.green{background:linear-gradient(90deg,#2fc58b,var(--green))}.bars>div>i>em.amber{background:linear-gradient(90deg,#cf8d25,var(--amber))}.bars>div>i>em.red{background:linear-gradient(90deg,#c33a57,var(--red))}
.profit-ring{--margin:0deg;width:164px;height:164px;margin:18px auto 12px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--green) var(--margin),color-mix(in srgb,var(--line) 75%,transparent) 0);position:relative;box-shadow:0 0 65px rgba(66,219,163,.10)}.profit-ring:before{content:"";position:absolute;inset:13px;border-radius:50%;background:var(--panel)}.profit-ring section{position:relative;text-align:center}.profit-ring b{display:block;font-size:31px}.profit-ring small{color:var(--muted);font-size:9px;text-transform:uppercase}.profit-copy{text-align:center;color:var(--muted);font-size:10px;line-height:1.55}
.notice-composer{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(310px,.85fr);gap:14px}.notice-form,.notice-preview{padding:20px}.notice-preview{display:flex;flex-direction:column}.notice-preview-card{margin-top:13px;padding:17px;border:1px solid #30456f;border-radius:15px;background:linear-gradient(145deg,#141e3d,#0d142a);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}.notice-preview-card .np-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.notice-preview-card h4{margin:9px 0 5px;font-size:14px}.notice-preview-card p{margin:0;color:var(--muted);font-size:10px;line-height:1.6;white-space:pre-wrap}.notice-audience{display:flex;align-items:center;gap:8px;margin-top:auto;padding-top:14px;color:var(--muted);font-size:9px}

/* Tables */
body[data-theme="premium"] .table-panel{border-color:#2b3b63}
body[data-theme="premium"] .table-wrap{background:linear-gradient(180deg,rgba(13,21,44,.5),transparent)}
body[data-theme="premium"] th{position:sticky;top:0;background:rgba(11,19,41,.95);border-color:#27375e;color:#91a9ca;backdrop-filter:blur(10px);z-index:2}
body[data-theme="premium"] td{border-color:#1d2b4c;color:#c4d2e8}
body[data-theme="premium"] tbody tr{transition:background .14s ease}
body[data-theme="premium"] tbody tr:hover{background:rgba(83,109,254,.045)}
body[data-theme="premium"] .row-actions button{background:#101d38;border-color:#2d4971;color:#9eeeff}
body[data-theme="premium"] .row-actions button:hover{background:#172b4c;border-color:#4778a9}
.green-text{color:var(--green)!important}.red-text{color:var(--red)!important}.money{font-variant-numeric:tabular-nums;white-space:nowrap}

body[data-theme="premium"] ::selection{background:rgba(83,109,254,.42);color:#fff}
body[data-theme="premium"] ::-webkit-scrollbar{width:9px;height:9px}
body[data-theme="premium"] ::-webkit-scrollbar-track{background:#080d1d}
body[data-theme="premium"] ::-webkit-scrollbar-thumb{background:#2f436c;border-radius:999px;border:2px solid #080d1d}
body[data-theme="premium"] ::-webkit-scrollbar-thumb:hover{background:#46618f}


/* Production health */
.production-health-panel{margin-top:16px}
.production-health-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:15px}
.health-loading{grid-column:1/-1;padding:18px;border:1px dashed #344c77;border-radius:12px;color:var(--muted);font-size:10px;text-align:center}
.health-item{min-height:78px;display:grid;grid-template-columns:10px minmax(0,1fr) auto;align-items:center;gap:10px;padding:13px 14px;border:1px solid #293d63;border-radius:13px;background:linear-gradient(145deg,#101a34,#0a1126)}
.health-item .health-dot{width:8px;height:8px;border-radius:50%;background:var(--red);box-shadow:0 0 14px rgba(255,85,113,.45)}
.health-item.ok .health-dot{background:var(--green);box-shadow:0 0 14px rgba(75,224,165,.45)}
.health-item b{display:block;font-size:10px}.health-item small{display:block;margin-top:4px;color:var(--muted);font-size:8px}
.health-item strong{font-size:8px;text-transform:uppercase;letter-spacing:.08em;color:var(--red)}
.health-item.ok strong{color:var(--green)}
.health-checked{margin-top:9px;color:#6f84a3;font-size:8px;text-align:right}
@media(max-width:900px){.production-health-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.production-health-grid{grid-template-columns:1fr}.health-item{min-height:70px}}

@media(max-width:1100px){
  body[data-theme="premium"] .topbar{padding-inline:18px}.top-actions{gap:7px}
  .search.global{width:245px}.search.global:focus-within{width:285px}
  .finance-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .analytics-visuals,.notice-composer{grid-template-columns:1fr}
}
@media(max-width:900px){
  .install-btn{min-width:44px;width:44px;padding:0!important}.install-btn span{display:none}
  .search.global{width:210px}.search.global:focus-within{width:245px}
}
@media(max-width:760px){
  body[data-theme="premium"] .topbar{height:72px;padding:10px 12px}
  .global-search-wrap{display:none}.theme-picker{display:none}
  .notification-dropdown{position:fixed;left:10px;right:10px;top:74px;width:auto;max-height:calc(100dvh - 155px)}
  .content{padding-inline:12px}.panel,.setting-card,.stat,.finance-stat{border-radius:14px}
  .hero-strip{padding:23px 20px}.hero-strip h2{font-size:30px!important}
  .finance-stats{grid-template-columns:1fr 1fr}
}
@media(max-width:430px){.finance-stats{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.view.active,.flow-logo i,body[data-theme="premium"] .hero-strip:before{animation:none!important}}


/* v1.6.33 interaction polish */
.top-actions{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}
.theme-toggle,.refresh-icon{
  width:44px;height:44px;padding:0!important;display:grid;place-items:center;
  border:1px solid #30436d;border-radius:12px;
  background:linear-gradient(145deg,#151d39,#0d142b);color:#dce8ff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:transform .16s ease,border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
.theme-toggle:hover,.refresh-icon:hover{
  transform:translateY(-1px);border-color:#5a75a7;background:#1a2949;
  box-shadow:0 12px 28px rgba(2,4,11,.28),inset 0 1px 0 rgba(255,255,255,.05);
}
.theme-toggle svg,.refresh-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle svg{transition:transform .25s ease,color .2s ease}
.theme-toggle:hover svg{transform:rotate(20deg);color:#ffd66f}
.theme-toggle:active svg{transform:rotate(55deg) scale(.92)}
.theme-toggle[data-theme-current="premium"]{color:#ffd86e;border-color:#705f42;background:linear-gradient(145deg,#28243a,#16182d)}
.theme-toggle[data-theme-current="aurora"]{color:#ff8ed8;border-color:#69436e}
.theme-toggle[data-theme-current="emerald"]{color:#5ce4ae;border-color:#315c4e}
.theme-toggle[data-theme-current="royal"]{color:#9f91ff;border-color:#4a4675}
.theme-toggle[data-theme-current="graphite"]{color:#d4dde6;border-color:#46515d}
.theme-toggle[data-theme-current="light"]{color:#f4a62f;border-color:#9a793e;background:#fff7e8}
.quick-add{
  min-height:44px!important;border-radius:12px!important;padding-inline:15px!important;
  display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
}
.quick-add svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.install-btn{white-space:nowrap}
.topbar #pageTitle{letter-spacing:-.025em;font-weight:850}
.topbar #crumb{font-size:8px;letter-spacing:.18em}
.search.global>span:first-child{display:grid;place-items:center;width:20px;height:20px;color:#8ca8c8;font-size:0}
.search.global>span:first-child:before{
  content:"";width:12px;height:12px;border:1.8px solid currentColor;border-radius:50%;
  box-shadow:5px 5px 0 -4px currentColor;transform:translate(-1px,-1px);
}
.search.global small{padding:3px 6px;border:1px solid #2e4269;border-radius:6px;background:#0d1730;color:#8094b5!important}
.section-intro h2{letter-spacing:-.025em;font-weight:850}.section-intro p{max-width:720px;line-height:1.6}
.panel-head h3{letter-spacing:-.012em}.eyebrow{font-weight:950}
.status{font-weight:850;letter-spacing:.01em}
.row-actions button,.seg-control button{font-weight:820}
.setting-card h3{letter-spacing:-.015em}
.modal h2{letter-spacing:-.025em}

/* keep overlays above content and prevent the raw stacked appearance seen in the broken build */
.global-search-results.hidden,.notification-dropdown.hidden{display:none!important}
.global-search-results,.notification-dropdown{isolation:isolate}
.topbar,.sidebar,.modal-backdrop{isolation:isolate}

/* theme-specific top control contrast */
body[data-theme="light"] .theme-toggle,
body[data-theme="light"] .refresh-icon,
body[data-theme="light"] .icon-btn,
body[data-theme="light"] .install-btn{
  background:#fff;border-color:#d4e0e8;color:#27445a;box-shadow:0 8px 24px rgba(54,82,102,.10)
}
body[data-theme="light"] .global-search-results,
body[data-theme="light"] .notification-dropdown{
  background:rgba(255,255,255,.98);border-color:#c9d9e5;color:#142b3b;
  box-shadow:0 28px 80px rgba(42,67,84,.20)
}
body[data-theme="light"] .search-result{color:#142b3b!important}
body[data-theme="light"] .search-result .sr-icon{background:#eef5fa;border-color:#cadbe7;color:#087da8}
body[data-theme="light"] .notification-dropdown>header{background:rgba(248,252,255,.97);border-color:#d7e3eb}
body[data-theme="light"] .notification-item p{color:#516d80}

@media(max-width:1180px){
  .top-actions{gap:6px}.install-btn{min-width:44px;width:44px;padding:0!important}
  .install-btn span{display:none}.quick-add{padding-inline:12px!important}
}
@media(max-width:900px){
  .refresh-icon{display:none}.quick-add{width:44px;padding:0!important;justify-content:center}
  .quick-add span{display:none}
}



/* SVG icon normalization */
.stat-icon svg,.mobile-nav svg,.finance-stat .fi svg,.mini-avatar svg{
  width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
}
.stat-icon{display:grid!important;place-items:center!important}
.mobile-nav button>span{
  width:28px;height:28px;display:grid!important;place-items:center!important;margin:0 auto 2px;
  border-radius:9px;color:#839ab7;transition:.16s ease;
}
.mobile-nav button>span svg{width:17px;height:17px}
.mobile-nav button.active>span{
  color:#79eaff;background:linear-gradient(145deg,rgba(83,109,254,.18),rgba(53,216,255,.08));
  box-shadow:inset 0 0 0 1px rgba(103,232,255,.16);
}
.mobile-nav button:hover>span{color:#9fefff}
body[data-theme="light"] .mobile-nav button>span{color:#657f91}
body[data-theme="light"] .mobile-nav button.active>span{color:#087da8;background:#e9f6fb}



/* v1.6.35 deep theme + responsive UI audit */
body[data-theme="midnight"]{--bg:#050b14;--panel:#0b1523;--panel2:#0d1928;--line:#1b3049;--muted:#7890a8;--text:#eef8ff;--cyan:#35d8ff;--blue:#168cf1;--green:#36e19b;--amber:#ffbd4a;--red:#ff5571}
body[data-theme="aurora"]{--bg:#12091e;--panel:#21102f;--panel2:#28143a;--line:#5a306e;--muted:#bd9bc9;--text:#fff5ff;--cyan:#ff70cf;--blue:#875fff;--green:#66e5ad;--amber:#ffc86c;--red:#ff7b9d}
body[data-theme="emerald"]{--bg:#06130f;--panel:#0b2119;--panel2:#0d291f;--line:#1d4c3b;--muted:#82aa9b;--text:#effff8;--cyan:#48e5a9;--blue:#28a87c;--green:#5cf2b7;--amber:#f4c964;--red:#ff7188}
body[data-theme="royal"]{--bg:#0b0a20;--panel:#151333;--panel2:#1a1740;--line:#39356d;--muted:#a7a0d0;--text:#f8f7ff;--cyan:#8e8cff;--blue:#6555f5;--green:#61dfae;--amber:#ffc86f;--red:#ff7692}
body[data-theme="graphite"]{--bg:#0c0f13;--panel:#151a20;--panel2:#1a2027;--line:#303944;--muted:#98a2ad;--text:#f5f7f9;--cyan:#d2e1ea;--blue:#75879a;--green:#63d6a7;--amber:#e7b967;--red:#ed7185}
body[data-theme="light"]{--bg:#eef4f8;--panel:#ffffff;--panel2:#f7fafc;--line:#ccdbe5;--muted:#60798c;--text:#112636;--cyan:#008bbd;--blue:#365ed7;--green:#13855d;--amber:#a86b05;--red:#c13b54;color-scheme:light}

/* all themes use the same advanced component system */
body[data-theme]{
  color:var(--text);
  background:
    radial-gradient(circle at 84% -8%,color-mix(in srgb,var(--blue) 15%,transparent),transparent 30%),
    radial-gradient(circle at 9% 82%,color-mix(in srgb,var(--cyan) 8%,transparent),transparent 27%),
    var(--bg);
  transition:background-color .22s ease,color .18s ease;
}
body[data-theme] .sidebar{
  background:linear-gradient(180deg,color-mix(in srgb,var(--panel) 96%,transparent),color-mix(in srgb,var(--bg) 98%,transparent));
  border-right-color:var(--line);box-shadow:16px 0 55px color-mix(in srgb,var(--bg) 60%,transparent);backdrop-filter:blur(24px);
}
body[data-theme] .topbar{
  background:color-mix(in srgb,var(--bg) 83%,transparent);border-bottom-color:var(--line);
  box-shadow:0 10px 36px color-mix(in srgb,var(--bg) 42%,transparent);backdrop-filter:blur(24px) saturate(1.12);
}
body[data-theme] .panel,
body[data-theme] .setting-card,
body[data-theme] .stat,
body[data-theme] .finance-stat,
body[data-theme] .release-card{
  background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 96%,transparent),color-mix(in srgb,var(--panel2) 92%,transparent));
  border-color:var(--line);box-shadow:var(--shadow-md),inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent);
}
body[data-theme] .panel:hover,
body[data-theme] .setting-card:hover,
body[data-theme] .stat:hover,
body[data-theme] .finance-stat:hover,
body[data-theme] .release-card:hover{
  border-color:color-mix(in srgb,var(--cyan) 35%,var(--line));
}
body[data-theme] .field input,
body[data-theme] .field select,
body[data-theme] .field textarea,
body[data-theme] .assign{
  background:color-mix(in srgb,var(--panel2) 94%,var(--bg));
  border-color:var(--line);color:var(--text);
}
body[data-theme] .field input:focus,
body[data-theme] .field select:focus,
body[data-theme] .field textarea:focus{
  border-color:color-mix(in srgb,var(--cyan) 55%,var(--line));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--cyan) 11%,transparent);
}
body[data-theme] .secondary,
body[data-theme] .icon-btn,
body[data-theme] .theme-toggle,
body[data-theme] .refresh-icon{
  background:linear-gradient(145deg,color-mix(in srgb,var(--panel2) 96%,transparent),color-mix(in srgb,var(--panel) 96%,transparent));
  border-color:var(--line);color:var(--text);
}
body[data-theme] .secondary:hover,
body[data-theme] .icon-btn:hover,
body[data-theme] .theme-toggle:hover,
body[data-theme] .refresh-icon:hover{
  border-color:color-mix(in srgb,var(--cyan) 42%,var(--line));
  background:color-mix(in srgb,var(--cyan) 7%,var(--panel2));
}
body[data-theme] .search.global{
  width:100%;height:44px;background:linear-gradient(145deg,color-mix(in srgb,var(--panel2) 96%,transparent),color-mix(in srgb,var(--panel) 96%,transparent));
  border-color:var(--line);color:var(--muted);box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent);
}
body[data-theme] .search.global input{color:var(--text)}
body[data-theme] .search.global:focus-within{
  width:100%;border-color:color-mix(in srgb,var(--cyan) 58%,var(--line));
  box-shadow:0 0 0 3px color-mix(in srgb,var(--cyan) 10%,transparent),0 15px 38px color-mix(in srgb,var(--bg) 45%,transparent);
}
body[data-theme] .global-search-results,
body[data-theme] .notification-dropdown{
  background:linear-gradient(155deg,color-mix(in srgb,var(--panel2) 98%,transparent),color-mix(in srgb,var(--bg) 98%,transparent) 76%);
  border-color:color-mix(in srgb,var(--cyan) 28%,var(--line));
  box-shadow:var(--shadow-xl);color:var(--text);
}
body[data-theme] .global-search-results header,
body[data-theme] .notification-dropdown>header{
  background:color-mix(in srgb,var(--panel2) 94%,transparent);border-color:var(--line);
}
body[data-theme] .search-result .sr-icon{
  color:var(--cyan);background:color-mix(in srgb,var(--cyan) 8%,var(--panel2));border-color:color-mix(in srgb,var(--cyan) 30%,var(--line));
}
body[data-theme] .search-result:hover,
body[data-theme] .search-result.active{
  background:linear-gradient(90deg,color-mix(in srgb,var(--blue) 10%,transparent),color-mix(in srgb,var(--cyan) 5%,transparent))!important;
  border-color:color-mix(in srgb,var(--cyan) 34%,var(--line))!important;
}
body[data-theme] .notification-permission,
body[data-theme] .notice-preview-card{
  background:color-mix(in srgb,var(--panel2) 94%,var(--bg));border-color:var(--line);
}
body[data-theme] .notification-item{border-color:color-mix(in srgb,var(--line) 80%,transparent)}
body[data-theme] .table-wrap{background:linear-gradient(180deg,color-mix(in srgb,var(--panel2) 38%,transparent),transparent)}
body[data-theme] th{
  background:color-mix(in srgb,var(--panel2) 95%,transparent);color:color-mix(in srgb,var(--muted) 88%,var(--text));
  border-color:var(--line);
}
body[data-theme] td{color:color-mix(in srgb,var(--text) 78%,var(--muted));border-color:color-mix(in srgb,var(--line) 80%,transparent)}
body[data-theme] tbody tr:hover{background:color-mix(in srgb,var(--cyan) 4%,transparent)}
body[data-theme] .row-actions button{
  background:color-mix(in srgb,var(--panel2) 92%,transparent);border-color:var(--line);color:color-mix(in srgb,var(--cyan) 78%,var(--text));
}
body[data-theme] .row-actions button:hover{border-color:color-mix(in srgb,var(--cyan) 42%,var(--line));background:color-mix(in srgb,var(--cyan) 7%,var(--panel2))}
body[data-theme] .modal{
  background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--blue) 12%,transparent),transparent 28%),linear-gradient(145deg,var(--panel),var(--panel2));
  border-color:color-mix(in srgb,var(--cyan) 30%,var(--line));box-shadow:var(--shadow-xl);color:var(--text);
}
body[data-theme] .login-card{
  background:radial-gradient(circle at 100% 0,color-mix(in srgb,var(--blue) 12%,transparent),transparent 33%),linear-gradient(145deg,var(--panel),var(--panel2));
  border-color:color-mix(in srgb,var(--cyan) 28%,var(--line));color:var(--text);
}

/* fixed topbar geometry: no search/dropdown collisions */
.topbar{gap:18px}
.topbar>div:first-child{flex:0 0 auto;min-width:145px}
.top-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex:1 1 auto;min-width:0;margin-left:auto;overflow:visible}
.global-search-wrap{position:relative;z-index:75;flex:1 1 330px;min-width:190px;max-width:430px}
.search.global{max-width:none!important}
.install-btn,.theme-toggle,.refresh-icon,.quick-add,.notification-center{flex:0 0 auto}
.global-search-results{right:auto;left:0}
.notification-dropdown{right:0}

/* modern icon normalization */
.search.global .search-glyph{width:18px;height:18px;display:grid;place-items:center;color:var(--muted);flex:0 0 auto}
.search.global .search-glyph svg,.sr-icon svg,.finance-stat .fi svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.sr-icon{display:grid!important;place-items:center!important}
.finance-stat .fi{font-size:0}

/* theme transition without flashing layout */
body.theme-switching .sidebar,
body.theme-switching .topbar,
body.theme-switching .panel,
body.theme-switching .setting-card,
body.theme-switching .stat,
body.theme-switching .finance-stat,
body.theme-switching .modal,
body.theme-switching .search.global,
body.theme-switching .global-search-results,
body.theme-switching .notification-dropdown{
  transition:background .22s ease,border-color .22s ease,color .18s ease,box-shadow .22s ease!important;
}

/* light theme clarity */
body[data-theme="light"] .sidebar,body[data-theme="light"] .topbar{box-shadow:0 12px 36px rgba(36,61,80,.10)}
body[data-theme="light"] .search.global small{background:#eef5f8!important;border-color:#cbdce5!important;color:#617b8c!important}
body[data-theme="light"] .notify-badge{border-color:#fff}
body[data-theme="light"] .global-search-results,body[data-theme="light"] .notification-dropdown{box-shadow:0 28px 85px rgba(46,70,88,.20)}
body[data-theme="light"] .profile{color:var(--text)}
body[data-theme="light"] .mobile-nav{background:rgba(248,252,255,.96)!important}

/* responsive audit */
@media(max-width:1240px){
  .install-btn{min-width:44px!important;width:44px;padding:0!important}.install-btn span{display:none}
  .global-search-wrap{flex-basis:260px;max-width:330px}
}
@media(max-width:1060px){
  .quick-add{width:44px;padding:0!important;justify-content:center}.quick-add span{display:none}
  .refresh-icon{display:none}
  .global-search-wrap{flex-basis:220px;max-width:270px}
}
@media(max-width:900px){
  .topbar{gap:10px}.topbar>div:first-child{min-width:120px}
  .topbar #pageTitle{font-size:17px}.global-search-wrap{min-width:170px;max-width:220px}
}
@media(max-width:820px){
  .install-btn{display:none!important}
}
@media(max-width:760px){
  .topbar>div:first-child{min-width:0}.top-actions{flex:0 0 auto}
  .global-search-wrap{display:none}.notification-center,.theme-toggle,.quick-add{display:grid}
  .notification-dropdown{left:10px;right:10px}
}



/* v1.6.35 header CTA placement fix */
.topbar{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  flex-wrap:nowrap!important;
  overflow:visible!important;
}
.topbar>div:first-child{
  flex:0 0 auto!important;
  min-width:150px;
}
.top-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:nowrap!important;
  flex:1 1 auto!important;
  min-width:0!important;
  margin-left:auto!important;
  overflow:visible!important;
}
.global-search-wrap{
  flex:1 1 360px!important;
  min-width:220px!important;
  max-width:570px!important;
}
#quickAddBtn.quick-add{
  order:99!important;
  flex:0 0 auto!important;
  align-self:center!important;
  margin:0 0 0 4px!important;
  width:auto!important;
  min-width:132px!important;
  height:44px!important;
  padding:0 16px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  white-space:nowrap!important;
}
#quickAddBtn.quick-add span{display:inline!important}
@media(max-width:1280px){
  .global-search-wrap{max-width:390px!important;min-width:180px!important}
  .install-btn{width:44px!important;min-width:44px!important;padding:0!important}
  .install-btn span{display:none!important}
}
@media(max-width:1080px){
  #refreshBtn{display:none!important}
  .global-search-wrap{max-width:300px!important;min-width:160px!important}
}
@media(max-width:900px){
  #quickAddBtn.quick-add{min-width:116px!important;padding-inline:13px!important}
}
@media(max-width:760px){
  .global-search-wrap{display:none!important}
  #quickAddBtn.quick-add{
    min-width:44px!important;width:44px!important;padding:0!important;margin-left:2px!important;
  }
  #quickAddBtn.quick-add span{display:none!important}
}



/* v1.6.36 refined glass UI */
:root{
  --glass-border:color-mix(in srgb,var(--text) 10%,var(--line));
  --glass-highlight:color-mix(in srgb,var(--text) 5%,transparent);
}

/* clean Flow logo */
.flow-logo{
  width:48px!important;height:48px!important;border-radius:16px!important;padding:5px!important;
  background:
    radial-gradient(circle at 25% 15%,color-mix(in srgb,var(--cyan) 18%,transparent),transparent 38%),
    linear-gradient(145deg,color-mix(in srgb,var(--panel2) 84%,transparent),color-mix(in srgb,var(--bg) 80%,transparent))!important;
  border:1px solid color-mix(in srgb,var(--cyan) 26%,var(--line))!important;
  box-shadow:0 12px 34px color-mix(in srgb,var(--bg) 45%,transparent),inset 0 1px 0 var(--glass-highlight)!important;
  backdrop-filter:blur(18px) saturate(1.15);
}
.flow-logo:before,.flow-logo:after,.flow-logo>b,.flow-logo>i{display:none!important}
.flow-logo .flow-mark{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 5px 12px color-mix(in srgb,var(--blue) 26%,transparent))}
.flow-logo:hover{transform:translateY(-1px) scale(1.02);border-color:color-mix(in srgb,var(--cyan) 46%,var(--line));box-shadow:0 16px 42px color-mix(in srgb,var(--blue) 18%,transparent),inset 0 1px 0 var(--glass-highlight)!important}
.brand .flow-logo{flex-basis:48px!important}
.login-brand .flow-logo{width:58px!important;height:58px!important;border-radius:18px!important}
body[data-theme="light"] .flow-logo{background:linear-gradient(145deg,rgba(255,255,255,.92),rgba(239,247,252,.78))!important;box-shadow:0 12px 32px rgba(61,91,110,.14),inset 0 1px 0 #fff!important}

/* universal frosted glass surfaces */
body[data-theme] .topbar,
body[data-theme] .sidebar,
body[data-theme] .panel,
body[data-theme] .setting-card,
body[data-theme] .stat,
body[data-theme] .finance-stat,
body[data-theme] .release-card,
body[data-theme] .modal,
body[data-theme] .login-card{
  backdrop-filter:blur(22px) saturate(1.12);
  -webkit-backdrop-filter:blur(22px) saturate(1.12);
}
body[data-theme] .panel,
body[data-theme] .setting-card,
body[data-theme] .stat,
body[data-theme] .finance-stat,
body[data-theme] .release-card{
  border-color:var(--glass-border)!important;
  box-shadow:
    0 18px 52px color-mix(in srgb,var(--bg) 33%,transparent),
    inset 0 1px 0 var(--glass-highlight)!important;
}
body[data-theme] .panel:before,
body[data-theme] .setting-card:before{
  pointer-events:none;
}
body[data-theme] .topbar{
  border-bottom-color:var(--glass-border)!important;
  box-shadow:0 12px 42px color-mix(in srgb,var(--bg) 34%,transparent),inset 0 -1px 0 color-mix(in srgb,var(--text) 3%,transparent)!important;
}

/* refined command search */
.global-search-wrap{
  flex:1 1 390px!important;
  max-width:520px!important;
  min-width:220px!important;
}
.search.global{
  position:relative;
  width:100%!important;height:46px!important;
  gap:10px!important;padding:0 10px 0 12px!important;
  border-radius:15px!important;
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--panel2) 70%,transparent),color-mix(in srgb,var(--panel) 55%,transparent))!important;
  border:1px solid color-mix(in srgb,var(--cyan) 16%,var(--line))!important;
  box-shadow:
    0 10px 30px color-mix(in srgb,var(--bg) 28%,transparent),
    inset 0 1px 0 var(--glass-highlight)!important;
  backdrop-filter:blur(20px) saturate(1.18);
  -webkit-backdrop-filter:blur(20px) saturate(1.18);
}
.search.global:before{
  content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:linear-gradient(115deg,color-mix(in srgb,var(--cyan) 5%,transparent),transparent 35%,color-mix(in srgb,var(--blue) 5%,transparent));
}
.search.global:focus-within{
  width:100%!important;
  border-color:color-mix(in srgb,var(--cyan) 55%,var(--line))!important;
  box-shadow:
    0 0 0 3px color-mix(in srgb,var(--cyan) 9%,transparent),
    0 18px 48px color-mix(in srgb,var(--blue) 14%,transparent),
    inset 0 1px 0 var(--glass-highlight)!important;
}
.search.global .search-glyph{
  position:relative;z-index:1;width:30px;height:30px;border-radius:10px;
  display:grid;place-items:center;color:color-mix(in srgb,var(--cyan) 70%,var(--text));
  background:color-mix(in srgb,var(--cyan) 7%,transparent);
  border:1px solid color-mix(in srgb,var(--cyan) 15%,transparent);
  flex:0 0 30px;
}
.search.global .search-glyph svg{width:15px!important;height:15px!important}
.search.global input{
  position:relative;z-index:1;min-width:0;flex:1 1 auto;
  font-size:12px!important;font-weight:650;letter-spacing:.005em;
}
.search.global input::placeholder{color:color-mix(in srgb,var(--muted) 82%,transparent)}
.search-shortcut{
  position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;
  height:25px;padding:0 7px;border-radius:7px;
  border:1px solid color-mix(in srgb,var(--text) 9%,var(--line));
  background:color-mix(in srgb,var(--panel2) 65%,transparent);
  color:color-mix(in srgb,var(--muted) 90%,var(--text));
  box-shadow:inset 0 1px 0 var(--glass-highlight);
  font:800 8px/1 ui-monospace,SFMono-Regular,Consolas,monospace;
  white-space:nowrap;
}
.global-search-results{
  margin-top:2px!important;padding:8px!important;
  border-radius:17px!important;
  border-color:color-mix(in srgb,var(--cyan) 24%,var(--line))!important;
  background:
    linear-gradient(155deg,color-mix(in srgb,var(--panel2) 86%,transparent),color-mix(in srgb,var(--bg) 90%,transparent))!important;
  box-shadow:0 30px 90px color-mix(in srgb,var(--bg) 68%,transparent),inset 0 1px 0 var(--glass-highlight)!important;
  backdrop-filter:blur(30px) saturate(1.18)!important;
}
.global-search-results header{padding:9px 10px 11px!important}
.search-result{border-radius:11px!important;min-height:56px!important}
.search-result .sr-icon{width:34px!important;height:34px!important;border-radius:10px!important}

/* glass theme/system controls */
.notification-center .icon-btn,
.theme-toggle,
.refresh-icon,
.install-btn{
  height:44px!important;
  border-radius:13px!important;
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--panel2) 68%,transparent),color-mix(in srgb,var(--panel) 56%,transparent))!important;
  border:1px solid color-mix(in srgb,var(--text) 9%,var(--line))!important;
  box-shadow:0 10px 28px color-mix(in srgb,var(--bg) 24%,transparent),inset 0 1px 0 var(--glass-highlight)!important;
  backdrop-filter:blur(18px) saturate(1.16);
  -webkit-backdrop-filter:blur(18px) saturate(1.16);
}
.theme-toggle{
  width:44px!important;
  color:#ffd36a!important;
  border-color:color-mix(in srgb,#ffd36a 28%,var(--line))!important;
  background:
    radial-gradient(circle at 50% 45%,rgba(255,211,106,.12),transparent 48%),
    linear-gradient(145deg,color-mix(in srgb,var(--panel2) 70%,transparent),color-mix(in srgb,var(--panel) 56%,transparent))!important;
}
.theme-toggle:hover{
  transform:translateY(-1px) rotate(2deg);
  color:#ffe08f!important;
  border-color:color-mix(in srgb,#ffd36a 48%,var(--line))!important;
  box-shadow:0 13px 34px rgba(255,190,68,.12),inset 0 1px 0 var(--glass-highlight)!important;
}
.theme-toggle svg{width:18px!important;height:18px!important;filter:drop-shadow(0 0 7px rgba(255,211,106,.28))}
.notification-center .icon-btn:hover,
.refresh-icon:hover,
.install-btn:hover{
  border-color:color-mix(in srgb,var(--cyan) 35%,var(--line))!important;
  background:color-mix(in srgb,var(--cyan) 6%,var(--panel2))!important;
}
.notification-dropdown{
  border-radius:18px!important;
  border-color:color-mix(in srgb,var(--cyan) 22%,var(--line))!important;
  background:
    linear-gradient(155deg,color-mix(in srgb,var(--panel2) 87%,transparent),color-mix(in srgb,var(--bg) 92%,transparent))!important;
  box-shadow:0 32px 95px color-mix(in srgb,var(--bg) 68%,transparent),inset 0 1px 0 var(--glass-highlight)!important;
  backdrop-filter:blur(30px) saturate(1.18)!important;
}

/* light glass overrides */
body[data-theme="light"] .search.global,
body[data-theme="light"] .notification-center .icon-btn,
body[data-theme="light"] .theme-toggle,
body[data-theme="light"] .refresh-icon,
body[data-theme="light"] .install-btn{
  background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(244,250,253,.68))!important;
  border-color:rgba(123,157,178,.25)!important;
  box-shadow:0 10px 28px rgba(45,76,95,.09),inset 0 1px 0 #fff!important;
}
body[data-theme="light"] .global-search-results,
body[data-theme="light"] .notification-dropdown{
  background:rgba(250,253,255,.92)!important;
  border-color:rgba(124,157,180,.30)!important;
  box-shadow:0 28px 80px rgba(42,68,86,.16),inset 0 1px 0 #fff!important;
}
body[data-theme="light"] .search-shortcut{background:rgba(238,246,250,.88);border-color:#cfdee7;color:#607a8d}

/* preserve right-side CTA and responsive geometry */
@media(max-width:1280px){
  .global-search-wrap{max-width:390px!important}
}
@media(max-width:1080px){
  .global-search-wrap{max-width:300px!important}
  .search-shortcut{display:none}
}
@media(max-width:760px){
  .global-search-wrap{display:none!important}
  .flow-logo{width:44px!important;height:44px!important}
}



/* v1.6.37 CANONICAL THEME LAYER */
:root{
  --ui-radius:16px;
  --ui-radius-sm:11px;
  --ui-glass:color-mix(in srgb,var(--panel) 74%,transparent);
  --ui-glass-strong:color-mix(in srgb,var(--panel2) 88%,transparent);
  --ui-border:color-mix(in srgb,var(--text) 9%,var(--line));
  --ui-border-accent:color-mix(in srgb,var(--cyan) 32%,var(--line));
  --ui-shadow:0 20px 58px color-mix(in srgb,var(--bg) 34%,transparent);
  --ui-shadow-soft:0 11px 32px color-mix(in srgb,var(--bg) 24%,transparent);
}
body[data-theme]{
  background:
    radial-gradient(circle at 86% -10%,color-mix(in srgb,var(--blue) 14%,transparent),transparent 32%),
    radial-gradient(circle at 12% 88%,color-mix(in srgb,var(--cyan) 8%,transparent),transparent 28%),
    linear-gradient(150deg,color-mix(in srgb,var(--bg) 96%,#000),var(--bg));
  background-attachment:fixed;
}
body[data-theme] .app-shell{background:transparent!important}
body[data-theme] .sidebar{
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--panel) 82%,transparent),color-mix(in srgb,var(--bg) 90%,transparent))!important;
  border-right:1px solid var(--ui-border)!important;
  box-shadow:18px 0 60px color-mix(in srgb,var(--bg) 38%,transparent)!important;
  backdrop-filter:blur(28px) saturate(1.12)!important;
  -webkit-backdrop-filter:blur(28px) saturate(1.12)!important;
}
body[data-theme] .topbar{
  background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 80%,transparent),color-mix(in srgb,var(--panel) 62%,transparent))!important;
  border-bottom:1px solid var(--ui-border)!important;
  box-shadow:0 14px 42px color-mix(in srgb,var(--bg) 30%,transparent),inset 0 -1px 0 color-mix(in srgb,var(--text) 3%,transparent)!important;
  backdrop-filter:blur(28px) saturate(1.16)!important;
  -webkit-backdrop-filter:blur(28px) saturate(1.16)!important;
}
body[data-theme] .panel,
body[data-theme] .setting-card,
body[data-theme] .stat,
body[data-theme] .finance-stat,
body[data-theme] .release-card{
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--panel) 80%,transparent),color-mix(in srgb,var(--panel2) 68%,transparent))!important;
  border:1px solid var(--ui-border)!important;
  border-radius:var(--ui-radius)!important;
  box-shadow:var(--ui-shadow),inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent)!important;
  backdrop-filter:blur(22px) saturate(1.10)!important;
  -webkit-backdrop-filter:blur(22px) saturate(1.10)!important;
}
body[data-theme] .panel:hover,
body[data-theme] .setting-card:hover,
body[data-theme] .stat:hover,
body[data-theme] .finance-stat:hover,
body[data-theme] .release-card:hover{
  transform:translateY(-2px)!important;
  border-color:var(--ui-border-accent)!important;
  box-shadow:0 25px 66px color-mix(in srgb,var(--bg) 40%,transparent),inset 0 1px 0 color-mix(in srgb,var(--text) 5%,transparent)!important;
}
body[data-theme] .hero-strip{
  border:1px solid color-mix(in srgb,var(--cyan) 26%,var(--line))!important;
  background:
    radial-gradient(circle at 84% 36%,color-mix(in srgb,var(--blue) 18%,transparent),transparent 23%),
    radial-gradient(circle at 18% 116%,color-mix(in srgb,var(--cyan) 10%,transparent),transparent 34%),
    linear-gradient(122deg,color-mix(in srgb,var(--panel2) 88%,transparent),color-mix(in srgb,var(--bg) 86%,transparent))!important;
  box-shadow:0 25px 78px color-mix(in srgb,var(--bg) 44%,transparent),inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent)!important;
}

/* Single-icon command search: explicitly suppress all legacy/pseudo icons */
.search.global::before,
.search.global::after,
.global-search-wrap::before,
.global-search-wrap::after,
.search.global .search-glyph{
  content:none!important;
  display:none!important;
}
.global-search-wrap{
  flex:1 1 400px!important;
  min-width:220px!important;
  max-width:530px!important;
}
.search.global{
  position:relative!important;
  width:100%!important;
  height:46px!important;
  max-width:none!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  padding:0 10px 0 13px!important;
  border-radius:15px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 18%,var(--line))!important;
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--panel2) 72%,transparent),color-mix(in srgb,var(--panel) 56%,transparent))!important;
  box-shadow:var(--ui-shadow-soft),inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent)!important;
  backdrop-filter:blur(20px) saturate(1.16)!important;
  -webkit-backdrop-filter:blur(20px) saturate(1.16)!important;
}
.search.global:focus-within{
  width:100%!important;
  border-color:color-mix(in srgb,var(--cyan) 58%,var(--line))!important;
  box-shadow:
    0 0 0 3px color-mix(in srgb,var(--cyan) 9%,transparent),
    0 18px 48px color-mix(in srgb,var(--blue) 14%,transparent),
    inset 0 1px 0 color-mix(in srgb,var(--text) 5%,transparent)!important;
}
.search-icon{
  display:block!important;
  width:17px!important;
  height:17px!important;
  flex:0 0 17px!important;
  fill:none!important;
  stroke:color-mix(in srgb,var(--cyan) 72%,var(--text))!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.search.global input{
  flex:1 1 auto!important;
  min-width:0!important;
  width:auto!important;
  color:var(--text)!important;
  font-size:12px!important;
  font-weight:650!important;
  letter-spacing:.003em!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
.search.global input::-webkit-search-decoration,
.search.global input::-webkit-search-cancel-button,
.search.global input::-webkit-search-results-button,
.search.global input::-webkit-search-results-decoration{
  display:none!important;
  -webkit-appearance:none!important;
}
.search.global input::placeholder{color:color-mix(in srgb,var(--muted) 82%,transparent)!important}
.search-shortcut{
  height:24px!important;
  padding:0 7px!important;
  border-radius:7px!important;
  border:1px solid color-mix(in srgb,var(--text) 8%,var(--line))!important;
  background:color-mix(in srgb,var(--panel2) 56%,transparent)!important;
  color:color-mix(in srgb,var(--muted) 88%,var(--text))!important;
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent)!important;
  font:800 8px/1 ui-monospace,SFMono-Regular,Consolas,monospace!important;
}
.global-search-results{
  left:0!important;right:auto!important;top:calc(100% + 10px)!important;
  width:min(520px,calc(100vw - 30px))!important;
  padding:8px!important;
  border-radius:17px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 24%,var(--line))!important;
  background:
    linear-gradient(155deg,color-mix(in srgb,var(--panel2) 87%,transparent),color-mix(in srgb,var(--bg) 93%,transparent))!important;
  box-shadow:0 32px 92px color-mix(in srgb,var(--bg) 68%,transparent),inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent)!important;
  backdrop-filter:blur(30px) saturate(1.18)!important;
  -webkit-backdrop-filter:blur(30px) saturate(1.18)!important;
}

/* Consistent glass controls */
.notification-center .icon-btn,
.theme-toggle,
.refresh-icon,
.install-btn{
  height:44px!important;
  border-radius:13px!important;
  border:1px solid var(--ui-border)!important;
  background:
    linear-gradient(145deg,color-mix(in srgb,var(--panel2) 66%,transparent),color-mix(in srgb,var(--panel) 54%,transparent))!important;
  box-shadow:var(--ui-shadow-soft),inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent)!important;
  backdrop-filter:blur(19px) saturate(1.14)!important;
  -webkit-backdrop-filter:blur(19px) saturate(1.14)!important;
}
.notification-center .icon-btn:hover,
.theme-toggle:hover,
.refresh-icon:hover,
.install-btn:hover{
  transform:translateY(-1px)!important;
  border-color:var(--ui-border-accent)!important;
  background:color-mix(in srgb,var(--cyan) 6%,var(--panel2))!important;
}
.theme-toggle{
  width:44px!important;
  color:#ffd86f!important;
  border-color:color-mix(in srgb,#ffd86f 30%,var(--line))!important;
  background:
    radial-gradient(circle at 50% 45%,rgba(255,216,111,.11),transparent 52%),
    linear-gradient(145deg,color-mix(in srgb,var(--panel2) 68%,transparent),color-mix(in srgb,var(--panel) 56%,transparent))!important;
}
.theme-toggle svg{width:18px!important;height:18px!important;filter:drop-shadow(0 0 7px rgba(255,216,111,.22))}
.notification-dropdown{
  border:1px solid color-mix(in srgb,var(--cyan) 22%,var(--line))!important;
  background:
    linear-gradient(155deg,color-mix(in srgb,var(--panel2) 88%,transparent),color-mix(in srgb,var(--bg) 93%,transparent))!important;
  box-shadow:0 34px 96px color-mix(in srgb,var(--bg) 68%,transparent),inset 0 1px 0 color-mix(in srgb,var(--text) 4%,transparent)!important;
  backdrop-filter:blur(30px) saturate(1.18)!important;
  -webkit-backdrop-filter:blur(30px) saturate(1.18)!important;
}

/* Forms / tables / navigation */
body[data-theme] .field input,
body[data-theme] .field select,
body[data-theme] .field textarea,
body[data-theme] .assign{
  min-height:44px!important;
  border-radius:var(--ui-radius-sm)!important;
  border:1px solid var(--ui-border)!important;
  background:color-mix(in srgb,var(--panel2) 76%,transparent)!important;
  color:var(--text)!important;
  box-shadow:inset 0 1px 0 color-mix(in srgb,var(--text) 3%,transparent)!important;
}
body[data-theme] .field input:focus,
body[data-theme] .field select:focus,
body[data-theme] .field textarea:focus{
  border-color:color-mix(in srgb,var(--cyan) 52%,var(--line))!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--cyan) 9%,transparent)!important;
}
body[data-theme] th{
  background:color-mix(in srgb,var(--panel2) 92%,transparent)!important;
  color:color-mix(in srgb,var(--muted) 88%,var(--text))!important;
  border-bottom:1px solid var(--ui-border)!important;
}
body[data-theme] td{
  border-bottom:1px solid color-mix(in srgb,var(--line) 78%,transparent)!important;
  color:color-mix(in srgb,var(--text) 80%,var(--muted))!important;
}
body[data-theme] tbody tr:hover{background:color-mix(in srgb,var(--cyan) 4%,transparent)!important}
.sidebar nav button{
  border-radius:12px!important;
  transition:background .16s ease,color .16s ease,transform .16s ease!important;
}
.sidebar nav button:hover{transform:translateX(2px)}
.sidebar nav button.active{
  background:linear-gradient(90deg,color-mix(in srgb,var(--blue) 14%,transparent),transparent)!important;
  color:var(--text)!important;
}
.sidebar nav button.active .nav-ico{
  border-color:color-mix(in srgb,var(--cyan) 42%,var(--line))!important;
  background:color-mix(in srgb,var(--cyan) 9%,var(--panel2))!important;
  color:var(--cyan)!important;
}

/* Light theme */
body[data-theme="light"]{
  --ui-glass:rgba(255,255,255,.72);
  --ui-glass-strong:rgba(255,255,255,.88);
}
body[data-theme="light"] .sidebar,
body[data-theme="light"] .topbar{
  box-shadow:0 14px 38px rgba(47,72,88,.10)!important;
}
body[data-theme="light"] .search.global,
body[data-theme="light"] .notification-center .icon-btn,
body[data-theme="light"] .theme-toggle,
body[data-theme="light"] .refresh-icon,
body[data-theme="light"] .install-btn{
  background:linear-gradient(145deg,rgba(255,255,255,.84),rgba(243,249,252,.70))!important;
  border-color:rgba(119,151,171,.22)!important;
  box-shadow:0 10px 28px rgba(45,76,95,.08),inset 0 1px 0 #fff!important;
}
body[data-theme="light"] .global-search-results,
body[data-theme="light"] .notification-dropdown{
  background:rgba(250,253,255,.93)!important;
  border-color:rgba(124,157,180,.28)!important;
  box-shadow:0 28px 80px rgba(42,68,86,.15),inset 0 1px 0 #fff!important;
}

/* Geometry and responsiveness */
.topbar{gap:16px!important}
.top-actions{
  gap:8px!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  overflow:visible!important;
}
#quickAddBtn.quick-add{
  order:99!important;
  flex:0 0 auto!important;
}
@media(max-width:1280px){
  .global-search-wrap{max-width:390px!important;min-width:180px!important}
}
@media(max-width:1080px){
  .global-search-wrap{max-width:300px!important;min-width:160px!important}
  .search-shortcut{display:none!important}
}
@media(max-width:900px){
  .global-search-wrap{max-width:230px!important;min-width:150px!important}
}
@media(max-width:820px){
  .install-btn{display:none!important}
}
@media(max-width:760px){
  .global-search-wrap{display:none!important}
  .top-actions{gap:6px!important}
}
@media(prefers-reduced-motion:reduce){
  .sidebar nav button:hover,
  body[data-theme] .panel:hover,
  body[data-theme] .setting-card:hover,
  body[data-theme] .stat:hover,
  body[data-theme] .finance-stat:hover,
  .notification-center .icon-btn:hover,
  .theme-toggle:hover,
  .refresh-icon:hover,
  .install-btn:hover{
    transform:none!important;
  }
}



/* v1.6.38 neutral graphite premium — blue only as accent */
body[data-theme="premium"]{
  --bg:#0a0c10;
  --panel:#11151a;
  --panel2:#171c22;
  --line:#2a3139;
  --muted:#8d98a6;
  --text:#f3f5f7;
  --cyan:#8bcbd7;
  --blue:#77839a;
  --green:#55c99b;
  --amber:#dcb56b;
  --red:#df7185;
  background:
    radial-gradient(circle at 82% -12%,rgba(255,255,255,.035),transparent 30%),
    radial-gradient(circle at 10% 82%,rgba(112,180,185,.035),transparent 26%),
    linear-gradient(155deg,#0a0c10,#080a0d 68%)!important;
}
body[data-theme="premium"] .sidebar{
  background:linear-gradient(180deg,rgba(16,20,25,.97),rgba(9,11,14,.99))!important;
  border-right-color:#262d34!important;
  box-shadow:18px 0 58px rgba(0,0,0,.26)!important;
}
body[data-theme="premium"] .topbar{
  background:linear-gradient(180deg,rgba(15,18,23,.90),rgba(10,12,16,.86))!important;
  border-bottom-color:#252c33!important;
  box-shadow:0 12px 38px rgba(0,0,0,.24),inset 0 -1px 0 rgba(255,255,255,.018)!important;
}
body[data-theme="premium"] .panel,
body[data-theme="premium"] .setting-card,
body[data-theme="premium"] .stat,
body[data-theme="premium"] .finance-stat,
body[data-theme="premium"] .release-card{
  background:linear-gradient(145deg,rgba(20,24,30,.90),rgba(13,16,20,.92))!important;
  border-color:#2b323a!important;
  box-shadow:0 18px 52px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.022)!important;
}
body[data-theme="premium"] .panel:hover,
body[data-theme="premium"] .setting-card:hover,
body[data-theme="premium"] .stat:hover,
body[data-theme="premium"] .finance-stat:hover,
body[data-theme="premium"] .release-card:hover{
  border-color:#39434d!important;
  box-shadow:0 24px 62px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.03)!important;
}
body[data-theme="premium"] .hero-strip{
  background:
    radial-gradient(circle at 83% 40%,rgba(120,130,150,.09),transparent 22%),
    radial-gradient(circle at 20% 118%,rgba(120,190,195,.055),transparent 33%),
    linear-gradient(120deg,#151a20,#0d1116 67%)!important;
  border-color:#333b44!important;
  box-shadow:0 24px 72px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.022)!important;
}
body[data-theme="premium"] .hero-strip:after{
  opacity:.34!important;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px)!important;
}
body[data-theme="premium"] .hero-strip h2 em{color:#a5d8df!important}
body[data-theme="premium"] .eyebrow{color:#9ac7ce!important}
body[data-theme="premium"] .orb{
  background:radial-gradient(circle,#252d36,#14191f 57%,transparent 59%)!important;
  box-shadow:0 0 60px rgba(120,150,165,.13)!important;
}
body[data-theme="premium"] .orb i{border-color:rgba(150,205,212,.34)!important}
body[data-theme="premium"] .primary{
  background:linear-gradient(135deg,#6db6bb,#70758f 58%,#7d6f95)!important;
  border-color:rgba(255,255,255,.07)!important;
  box-shadow:0 12px 30px rgba(58,75,86,.24)!important;
  color:#fff!important;
}
body[data-theme="premium"] .primary:hover{
  filter:brightness(1.06)!important;
  box-shadow:0 15px 36px rgba(67,85,96,.28)!important;
}
body[data-theme="premium"] .secondary,
body[data-theme="premium"] .icon-btn,
body[data-theme="premium"] .refresh-icon,
body[data-theme="premium"] .install-btn{
  background:linear-gradient(145deg,rgba(27,32,38,.86),rgba(17,21,26,.90))!important;
  border-color:#303841!important;
  color:#d8dde3!important;
}
body[data-theme="premium"] .secondary:hover,
body[data-theme="premium"] .icon-btn:hover,
body[data-theme="premium"] .refresh-icon:hover,
body[data-theme="premium"] .install-btn:hover{
  background:#20262d!important;
  border-color:#424c56!important;
}
body[data-theme="premium"] .theme-toggle{
  color:#e2bd6c!important;
  border-color:#51472e!important;
  background:
    radial-gradient(circle at 50% 45%,rgba(225,183,91,.08),transparent 52%),
    linear-gradient(145deg,rgba(30,30,28,.88),rgba(18,19,20,.91))!important;
}
body[data-theme="premium"] .theme-toggle:hover{
  color:#f0ce84!important;
  border-color:#6b5a34!important;
  background:#26231b!important;
}
body[data-theme="premium"] .search.global{
  padding-left:16px!important;
  background:linear-gradient(145deg,rgba(26,31,36,.82),rgba(16,19,23,.86))!important;
  border-color:#313941!important;
  box-shadow:0 10px 28px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.022)!important;
}
body[data-theme="premium"] .search.global:focus-within{
  border-color:#4a5961!important;
  box-shadow:0 0 0 3px rgba(140,190,195,.06),0 16px 40px rgba(0,0,0,.24)!important;
}
body[data-theme="premium"] .search.global input::placeholder{color:#7e8894!important}
body[data-theme="premium"] .search-shortcut{
  background:rgba(255,255,255,.025)!important;
  border-color:#333a42!important;
  color:#7f8993!important;
}
body[data-theme="premium"] .global-search-results,
body[data-theme="premium"] .notification-dropdown{
  background:linear-gradient(155deg,rgba(22,27,33,.97),rgba(11,14,18,.985) 76%)!important;
  border-color:#323b44!important;
  box-shadow:0 32px 88px rgba(0,0,0,.50),inset 0 1px 0 rgba(255,255,255,.022)!important;
}
body[data-theme="premium"] .search-result:hover,
body[data-theme="premium"] .search-result.active{
  background:linear-gradient(90deg,rgba(130,150,160,.08),rgba(120,190,195,.025))!important;
  border-color:#3d4852!important;
}
body[data-theme="premium"] .search-result .sr-icon{
  color:#9dcbd1!important;
  background:#1b2228!important;
  border-color:#354049!important;
}
body[data-theme="premium"] .notification-permission,
body[data-theme="premium"] .notice-preview-card,
body[data-theme="premium"] .side-card{
  background:linear-gradient(145deg,#171c21,#111519)!important;
  border-color:#2f373f!important;
}
body[data-theme="premium"] .field input,
body[data-theme="premium"] .field select,
body[data-theme="premium"] .field textarea,
body[data-theme="premium"] .assign{
  background:#13181d!important;
  border-color:#2e363e!important;
  color:#eef1f4!important;
}
body[data-theme="premium"] .field input:focus,
body[data-theme="premium"] .field select:focus,
body[data-theme="premium"] .field textarea:focus{
  border-color:#4b5a63!important;
  box-shadow:0 0 0 3px rgba(140,190,195,.055)!important;
}
body[data-theme="premium"] th{
  background:#12171c!important;
  color:#8995a0!important;
  border-color:#2a3138!important;
}
body[data-theme="premium"] td{
  color:#c4cbd1!important;
  border-color:#242b31!important;
}
body[data-theme="premium"] tbody tr:hover{background:rgba(255,255,255,.018)!important}
body[data-theme="premium"] .row-actions button{
  background:#171d22!important;
  border-color:#303942!important;
  color:#bdd8dc!important;
}
body[data-theme="premium"] .row-actions button:hover{
  background:#20272d!important;
  border-color:#414c55!important;
}
body[data-theme="premium"] .sidebar nav button.active{
  background:linear-gradient(90deg,rgba(135,150,160,.09),transparent)!important;
  color:#f1f3f5!important;
}
body[data-theme="premium"] .sidebar nav button.active .nav-ico{
  color:#a8cfd4!important;
  background:#1c242a!important;
  border-color:#3a454e!important;
  box-shadow:none!important;
}
body[data-theme="premium"] .nav-ico{
  background:#151b20!important;
  border-color:#303840!important;
  color:#8c98a3!important;
}
body[data-theme="premium"] .flow-logo{
  background:linear-gradient(145deg,#171c21,#101419)!important;
  border-color:#343e46!important;
  box-shadow:0 10px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.025)!important;
}
body[data-theme="premium"] .flow-logo .flow-mark{filter:none!important}

/* Search is intentionally iconless in v1.6.38 */
.search-icon,
.search-glyph,
.search.global>svg,
.search.global>span:not(.sr-icon){
  display:none!important;
}
.search.global{padding-left:16px!important}


/* v1.6 mobile parity — mirrors THE ADMIN navigation and responsive hierarchy */
body.mobile-menu-open{overflow:hidden!important}
#ta-mobile-more-backdrop,#ta-mobile-more-panel{display:none}
@media(max-width:760px){
  body{background-attachment:scroll!important}
  .sidebar{display:none!important}
  .main-panel{margin-left:0!important;width:100%!important;min-width:0!important}
  .topbar{
    position:sticky!important;top:0!important;z-index:80!important;height:auto!important;min-height:112px!important;
    padding:9px 10px 10px!important;display:grid!important;grid-template-columns:minmax(0,1fr)!important;
    align-items:center!important;gap:7px!important;overflow:visible!important;
    background:color-mix(in srgb,var(--bg) 94%,transparent)!important;
    backdrop-filter:blur(22px) saturate(1.08)!important;-webkit-backdrop-filter:blur(22px) saturate(1.08)!important;
  }
  .topbar>div:first-child{grid-column:1!important;min-width:0!important;width:100%!important}
  .topbar p{display:none!important}.topbar h1{margin:0!important;font-size:16px!important;line-height:1.15!important}
  .top-actions{
    grid-column:1!important;width:100%!important;min-width:0!important;margin:0!important;
    display:grid!important;grid-template-columns:minmax(0,1fr) 42px 42px 44px!important;align-items:center!important;gap:6px!important;
  }
  .global-search-wrap{display:block!important;width:100%!important;min-width:0!important;max-width:none!important;position:static!important}
  .search.global{display:flex!important;width:100%!important;max-width:none!important;height:42px!important;min-width:0!important;padding:0 12px!important;border-radius:13px!important}
  .search.global input{font-size:16px!important;min-width:0!important}.search-shortcut{display:none!important}
  #installAppBtn,#refreshBtn{display:none!important}
  .notification-center{display:block!important;position:static!important}
  .notification-center .icon-btn,.theme-toggle,#quickAddBtn.quick-add{
    width:42px!important;min-width:42px!important;height:42px!important;min-height:42px!important;margin:0!important;padding:0!important;border-radius:12px!important;
  }
  #quickAddBtn.quick-add{width:44px!important;min-width:44px!important}
  #quickAddBtn.quick-add span{display:none!important}
  .notification-dropdown,.global-search-results{
    position:fixed!important;top:108px!important;left:10px!important;right:10px!important;width:auto!important;
    max-height:calc(100dvh - 190px - env(safe-area-inset-bottom))!important;overflow:auto!important;overscroll-behavior:contain!important;
  }
  .mobile-sections{display:none!important}
  .content{width:100%!important;max-width:none!important;min-width:0!important;overflow-x:hidden!important;padding:12px 10px calc(88px + env(safe-area-inset-bottom))!important}
  .hero-strip{min-height:188px!important;padding:20px 17px!important;border-radius:15px!important}
  .hero-strip h2{font-size:27px!important;line-height:1.02!important;max-width:100%!important}
  .hero-strip p{max-width:100%!important;font-size:11px!important;line-height:1.5!important;margin-bottom:16px!important}
  .orb{display:none!important}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;margin:10px 0!important}
  .stat{min-height:102px!important;padding:12px!important;gap:8px!important;border-radius:13px!important}
  .stat b{font-size:22px!important}
  .dashboard-grid,.settings-grid,.analytics-visuals,.notice-composer,.release-grid,.install-steps,.device-grid{grid-template-columns:minmax(0,1fr)!important;gap:10px!important}
  .finance-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .panel,.setting-card,.release-card{border-radius:13px!important}
  .panel:not(.table-panel),.setting-card{padding:14px!important}
  .table-panel{padding:0!important}.table-panel .panel-head{padding:14px!important}
  .table-wrap{width:100%!important;max-width:100%!important;overflow-x:auto!important;overscroll-behavior-x:contain!important;-webkit-overflow-scrolling:touch}
  table{min-width:760px!important}
  .section-intro{display:block!important;margin-bottom:13px!important}.section-intro h2{font-size:22px!important;line-height:1.15!important}
  .section-intro p{font-size:11px!important;line-height:1.5!important}.section-actions{margin-top:10px!important}
  .form-grid{grid-template-columns:minmax(0,1fr)!important}.full{grid-column:auto!important}
  input,textarea,select{font-size:16px!important}
  .modal-backdrop{padding:8px!important}.modal{width:100%!important;max-width:620px!important;max-height:94dvh!important;padding:54px 15px 20px!important;border-radius:16px!important}
  .modal .close{width:40px!important;height:40px!important;right:10px!important;top:10px!important}
  .mobile-nav{
    position:fixed!important;display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;
    left:0!important;right:0!important;bottom:0!important;z-index:90!important;
    height:calc(68px + env(safe-area-inset-bottom))!important;padding:0 2px env(safe-area-inset-bottom)!important;
    overflow:hidden!important;border-top:1px solid var(--ui-border)!important;
    background:color-mix(in srgb,var(--bg) 95%,transparent)!important;
    box-shadow:0 -10px 35px color-mix(in srgb,var(--bg) 38%,transparent)!important;
    backdrop-filter:blur(22px) saturate(1.08)!important;-webkit-backdrop-filter:blur(22px) saturate(1.08)!important;
  }
  .mobile-nav>button{
    position:relative!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;
    gap:3px!important;width:auto!important;min-width:0!important;height:68px!important;min-height:68px!important;margin:0!important;padding:0 2px!important;
    border:0!important;border-radius:0!important;background:transparent!important;color:var(--muted)!important;box-shadow:none!important;
  }
  .mobile-nav>button>span{display:grid!important;place-items:center!important;width:22px!important;height:22px!important;margin:0!important}
  .mobile-nav>button>span svg{width:19px!important;height:19px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.85!important;stroke-linecap:round!important;stroke-linejoin:round!important}
  .mobile-nav>button>small{display:block!important;width:100%!important;font-size:8px!important;line-height:10px!important;font-weight:700!important;white-space:normal!important;overflow:hidden!important;text-overflow:ellipsis!important;text-align:center!important}
  .mobile-nav>button.active{color:var(--cyan)!important;background:transparent!important}
  .mobile-nav>button.active:after{content:"";position:absolute;left:25%;right:25%;bottom:4px;height:2px;border-radius:999px;background:var(--cyan);box-shadow:0 0 10px color-mix(in srgb,var(--cyan) 55%,transparent)}
  #ta-mobile-more-backdrop{display:block;position:fixed;inset:0;z-index:998;border:0;background:rgba(2,8,14,.62);padding:0;touch-action:none}
  #ta-mobile-more-panel{
    display:block;position:fixed;left:10px;right:10px;bottom:calc(78px + env(safe-area-inset-bottom));z-index:999;
    max-height:min(58dvh,520px);overflow:auto;overscroll-behavior:contain;padding:10px;
    border:1px solid color-mix(in srgb,var(--cyan) 28%,var(--line));border-radius:18px;
    background:linear-gradient(155deg,color-mix(in srgb,var(--panel2) 94%,transparent),color-mix(in srgb,var(--bg) 97%,transparent));
    box-shadow:0 22px 70px rgba(0,0,0,.55);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);touch-action:manipulation;isolation:isolate;
  }
  #ta-mobile-more-backdrop.hidden,#ta-mobile-more-panel.hidden{display:none!important}
  .ta-more-title{display:flex;align-items:center;justify-content:space-between;padding:4px 6px 10px;color:var(--cyan);font-size:12px;letter-spacing:.07em}
  .ta-more-title button{width:40px;height:40px;border:1px solid var(--ui-border);border-radius:11px;background:var(--panel);color:var(--text);font-size:20px}
  .ta-more-list{display:grid;gap:6px}
  .ta-more-list>button{min-height:48px;width:100%;padding:11px 13px;border:1px solid var(--ui-border);border-radius:12px;background:color-mix(in srgb,var(--panel) 86%,transparent);color:var(--text);font-size:13px;font-weight:800;text-align:left;touch-action:manipulation}
  .ta-more-list>button.active{border-color:color-mix(in srgb,var(--cyan) 70%,var(--line));color:var(--cyan);background:color-mix(in srgb,var(--cyan) 8%,var(--panel))}
  .toast{bottom:calc(82px + env(safe-area-inset-bottom))!important;left:10px!important;right:10px!important;text-align:center!important}
}
@media(max-width:430px){
  .topbar{padding-inline:8px!important}.top-actions{grid-template-columns:minmax(0,1fr) 40px 40px 42px!important;gap:5px!important}
  .notification-center .icon-btn,.theme-toggle{width:40px!important;min-width:40px!important;height:40px!important}
  #quickAddBtn.quick-add{width:42px!important;min-width:42px!important;height:40px!important}
  .content{padding-inline:8px!important}.hero-strip{min-height:168px!important;padding:18px 15px!important}.hero-strip h2{font-size:24px!important}
  .panel-head{gap:8px!important;flex-wrap:wrap!important}.finance-stats{grid-template-columns:1fr 1fr!important}
  #ta-mobile-more-panel{left:8px;right:8px}
}
@media(max-width:350px){.stats-grid,.finance-stats{grid-template-columns:1fr!important}.mobile-nav>button>small{font-size:7px!important}}



/* v1.6.39 THE ADMIN-style client action hierarchy */
.client-actions{
  position:relative;
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
  flex-wrap:nowrap!important;
  min-width:360px;
}
.client-actions .action-btn,
.client-actions .action-more>summary{
  min-height:38px!important;
  height:38px!important;
  padding:0 12px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  border-radius:10px!important;
  border:1px solid #343b43!important;
  background:linear-gradient(145deg,#1b2025,#13171b)!important;
  color:#d7dce1!important;
  font-size:10px!important;
  font-weight:800!important;
  line-height:1!important;
  white-space:nowrap!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  transition:background .15s ease,border-color .15s ease,transform .15s ease!important;
}
.client-actions .action-btn:hover,
.client-actions .action-more>summary:hover{
  transform:translateY(-1px)!important;
  background:#22282e!important;
  border-color:#46505a!important;
  color:#f2f4f6!important;
}
.client-actions .action-btn svg,
.client-actions .action-more>summary svg{
  width:14px!important;
  height:14px!important;
  flex:0 0 14px;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.client-actions .action-more{
  position:relative;
  flex:0 0 auto;
}
.client-actions .action-more>summary{
  list-style:none;
  cursor:pointer;
  user-select:none;
}
.client-actions .action-more>summary::-webkit-details-marker{display:none}
.client-actions .action-more[open]>summary{
  background:#262d33!important;
  border-color:#515d67!important;
}
.action-menu{
  position:absolute;
  z-index:90;
  right:0;
  top:calc(100% + 8px);
  width:190px;
  padding:7px;
  border:1px solid #343d45;
  border-radius:13px;
  background:linear-gradient(155deg,rgba(27,32,38,.98),rgba(14,17,20,.99));
  box-shadow:0 24px 70px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.025);
  backdrop-filter:blur(22px) saturate(1.08);
  -webkit-backdrop-filter:blur(22px) saturate(1.08);
}
.action-menu-item{
  width:100%!important;
  min-height:38px!important;
  padding:0 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:9px!important;
  border:1px solid transparent!important;
  border-radius:9px!important;
  background:transparent!important;
  color:#cdd3d9!important;
  font-size:10px!important;
  font-weight:750!important;
  text-align:left!important;
}
.action-menu-item:hover{
  background:#242a30!important;
  border-color:#343d45!important;
  color:#fff!important;
}
.action-menu-item svg{
  width:15px!important;height:15px!important;flex:0 0 15px;
  fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;
  stroke-linecap:round!important;stroke-linejoin:round!important;
}
.action-menu-item.warning{color:#e6c27b!important}
.action-menu-item.warning:hover{background:#2b2419!important;border-color:#57452b!important}
.action-menu-item.success{color:#72d8ad!important}
.action-menu-item.success:hover{background:#172820!important;border-color:#2e5946!important}
.action-menu-item.danger{color:#e98a9a!important}
.action-menu-item.danger:hover{background:#2c1b20!important;border-color:#5c333d!important}

/* WhatsApp is a separate THE ADMIN-style table action, not a blue utility button */
.wa-sender{
  min-width:138px;
  min-height:46px!important;
  padding:7px 11px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:9px!important;
  border:1px solid #285447!important;
  border-radius:11px!important;
  background:linear-gradient(145deg,#16261f,#101b17)!important;
  color:#7eddb4!important;
  text-align:left!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
}
.wa-sender:hover{
  background:#193025!important;
  border-color:#39705d!important;
  transform:translateY(-1px)!important;
}
.wa-sender>svg{
  width:18px!important;height:18px!important;flex:0 0 18px;
  fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;
  stroke-linecap:round!important;stroke-linejoin:round!important;
}
.wa-sender>span{display:flex;flex-direction:column;gap:2px;min-width:0;font-size:10px;font-weight:850}
.wa-sender small{
  display:block;
  max-width:110px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#789a8a!important;
  font-size:8px!important;
  font-weight:650!important;
}

/* never paint routine client buttons blue */
body[data-theme] .client-actions .action-btn,
body[data-theme] .client-actions .action-more>summary{
  background:linear-gradient(145deg,color-mix(in srgb,var(--panel2) 92%,#111),color-mix(in srgb,var(--panel) 94%,#111))!important;
  border-color:color-mix(in srgb,var(--text) 10%,var(--line))!important;
  color:color-mix(in srgb,var(--text) 82%,var(--muted))!important;
}
body[data-theme="light"] .client-actions .action-btn,
body[data-theme="light"] .client-actions .action-more>summary{
  background:linear-gradient(145deg,#fff,#f4f7f9)!important;
  border-color:#d3dde3!important;
  color:#445662!important;
}
body[data-theme="light"] .action-menu{
  background:rgba(252,254,255,.98);
  border-color:#d0dbe2;
  box-shadow:0 22px 60px rgba(54,76,90,.18);
}
body[data-theme="light"] .action-menu-item{color:#4b5e6b!important}
body[data-theme="light"] .action-menu-item:hover{background:#f0f5f8!important;border-color:#d7e2e8!important;color:#1e303c!important}
body[data-theme="light"] .wa-sender{
  background:linear-gradient(145deg,#f4fbf7,#edf7f1)!important;
  border-color:#bcdcca!important;color:#25845f!important;
}
body[data-theme="light"] .wa-sender small{color:#6f9081!important}

/* absolute search cleanup: no visual icon can exist inside the command bar */
.search.global.iconless{
  padding-left:16px!important;
}
.search.global.iconless::before,
.search.global.iconless::after,
.search.global.iconless>svg,
.search.global.iconless>.search-icon,
.search.global.iconless>.search-glyph,
.search.global.iconless>span:first-child{
  content:none!important;
  display:none!important;
  width:0!important;
  height:0!important;
  margin:0!important;
  padding:0!important;
}
.search.global.iconless input{
  padding-left:0!important;
  background-image:none!important;
}
.search.global.iconless input::-webkit-search-decoration,
.search.global.iconless input::-webkit-search-cancel-button,
.search.global.iconless input::-webkit-search-results-button,
.search.global.iconless input::-webkit-search-results-decoration{
  display:none!important;
  -webkit-appearance:none!important;
}

/* prevent the bell from visually merging into search */
.global-search-wrap{margin-right:5px!important}
.notification-center{margin-left:3px!important}

@media(max-width:1180px){
  .client-actions{min-width:330px}
  .client-actions .action-btn,
  .client-actions .action-more>summary{padding-inline:10px!important}
}
@media(max-width:760px){
  .client-actions{
    min-width:310px;
    display:grid!important;
    grid-template-columns:repeat(4,max-content)!important;
    justify-content:start!important;
  }
  .action-menu{right:auto;left:0}
  .wa-sender{min-width:132px}
}



/* v1.6.40 THE ADMIN screenshot parity: Clients & Expiry Center */
.clients-directory .panel-head{
  min-height:88px;
  padding:18px 18px 16px!important;
  align-items:flex-start!important;
}
.clients-directory .panel-head>div>span{
  color:#6ddcf0!important;
  letter-spacing:.16em!important;
}
.clients-directory .panel-head>div>h3{
  margin-top:10px!important;
  font-size:20px!important;
  font-weight:500!important;
}
.clients-directory .panel-head>b{
  color:#64ddf3!important;
  font-size:10px!important;
  font-weight:900!important;
}
.clients-directory .filter-row{
  padding:10px 18px 12px;
  border-top:1px solid color-mix(in srgb,var(--line) 72%,transparent);
}
.clients-directory table{
  min-width:1320px!important;
  table-layout:fixed;
}
.clients-directory th{
  height:52px!important;
  padding:0 17px!important;
  font-size:9px!important;
  letter-spacing:.12em!important;
  text-transform:uppercase;
  color:#6f879c!important;
}
.clients-directory th:nth-child(1){width:205px}
.clients-directory th:nth-child(2){width:175px}
.clients-directory th:nth-child(3){width:205px}
.clients-directory th:nth-child(4){width:122px}
.clients-directory th:nth-child(5){width:124px}
.clients-directory th:nth-child(6){width:115px}
.clients-directory th:nth-child(7){width:475px}
.clients-directory td{
  min-height:112px;
  padding:20px 17px!important;
  vertical-align:middle!important;
}
.clients-directory tbody tr{
  height:148px;
}
.clients-directory .client-cell{
  gap:12px!important;
}
.clients-directory .mini-avatar{
  width:46px!important;height:46px!important;flex:0 0 46px!important;
  border-radius:999px!important;
  background:linear-gradient(145deg,#2586b8,#31c3e1)!important;
  color:white!important;
  border:0!important;
  font-size:10px!important;
  box-shadow:0 8px 22px rgba(40,160,205,.15)!important;
}
.clients-directory .client-cell b{
  font-size:13px!important;
  color:#d6dde4!important;
}
.clients-directory .client-cell small{
  margin-top:4px!important;
  font-size:9px!important;
  line-height:1.45!important;
  color:#72869a!important;
  max-width:120px;
  overflow-wrap:anywhere;
}
.directory-wa{
  min-width:126px!important;
  min-height:62px!important;
  padding:9px 12px!important;
  gap:5px!important;
  justify-content:center!important;
  text-align:center!important;
  border-color:#198f62!important;
  background:linear-gradient(145deg,#103e2f,#0c3025)!important;
  color:#73efb4!important;
}
.directory-wa:hover{
  border-color:#28b47c!important;
  background:linear-gradient(145deg,#154b39,#10382b)!important;
}
.directory-wa .wa-star{
  display:inline!important;
  flex:0 0 auto;
  color:#68f0b0!important;
  font-size:13px!important;
}
.directory-wa>span:last-child{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:4px!important;
  font-size:10px!important;
  font-weight:850!important;
}
.directory-wa small{
  max-width:112px!important;
  color:#74ad93!important;
  font-size:8px!important;
}
.license-copy{
  width:176px!important;
  min-height:62px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:9px!important;
  padding:10px 12px!important;
  border:1px solid #24465d!important;
  border-radius:12px!important;
  background:linear-gradient(145deg,#0f1c27,#0b151e)!important;
  color:#63dff4!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.018)!important;
}
.license-copy:hover{
  border-color:#35647f!important;
  background:#122331!important;
}
.license-copy code{
  font:800 9px/1.55 ui-monospace,SFMono-Regular,Consolas,monospace!important;
  color:#69e2f6!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
}
.license-copy span{
  color:#65daf0!important;
  font-size:9px!important;
  font-weight:700!important;
}
.directory-actions{
  display:grid!important;
  grid-template-columns:repeat(4,max-content)!important;
  gap:10px 10px!important;
  align-items:center!important;
  justify-content:start!important;
}
.dir-action{
  min-width:76px!important;
  height:48px!important;
  padding:0 16px!important;
  border-radius:12px!important;
  font-size:11px!important;
  font-weight:850!important;
  white-space:nowrap!important;
  transition:transform .14s ease,border-color .14s ease,background .14s ease!important;
}
.dir-action.neutral{
  border:1px solid #31586a!important;
  background:linear-gradient(145deg,#15303c,#102631)!important;
  color:#d6e1e7!important;
}
.dir-action.neutral:hover{
  transform:translateY(-1px)!important;
  border-color:#44758a!important;
  background:#183a48!important;
}
.dir-action.warning{border:1px solid var(--amber)!important;background:var(--panel2)!important;color:var(--amber)!important}
.dir-action.warning:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.dir-action.rebind{
  min-width:110px!important;
}
.dir-action:disabled{
  opacity:.42!important;
  cursor:not-allowed!important;
  transform:none!important;
}
.dir-action.danger{
  border:1px solid #a63e59!important;
  background:linear-gradient(145deg,#662137,#4c1728)!important;
  color:#ffd9df!important;
}
.dir-action.danger:hover{
  transform:translateY(-1px)!important;
  background:#74243d!important;
  border-color:#c6536f!important;
}
.clients-directory .status{
  min-width:66px;
  justify-content:center;
  padding:7px 10px!important;
  border-radius:999px!important;
}

/* Expiry center screenshot parity */
.expiry-intro{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin-bottom:24px!important;
}
.expiry-intro h2{
  margin:12px 0 8px!important;
  font-size:36px!important;
  font-weight:500!important;
}
.expiry-intro p{
  font-size:11px!important;
  color:#74899c!important;
}
.expiry-segments{
  display:flex!important;
  align-items:center!important;
  gap:0!important;
  padding:5px!important;
  border:1px solid #273846!important;
  border-radius:12px!important;
  background:#0c151e!important;
}
.expiry-segments button{
  min-width:66px!important;
  height:40px!important;
  padding:0 14px!important;
  border:0!important;
  border-radius:8px!important;
  background:transparent!important;
  color:#71879a!important;
  font-size:9px!important;
  font-weight:750!important;
}
.expiry-segments button:hover{
  color:#b9c7d1!important;
  background:#12212d!important;
}
.expiry-segments button.active{
  background:#1e4c6f!important;
  color:#bce8ff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.expiry-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:20px!important;
}
.expiry-card{
  position:relative;
  min-height:438px;
  padding:26px 27px!important;
  border:1px solid #274354!important;
  border-top:3px solid #27728e!important;
  border-radius:20px!important;
  background:linear-gradient(155deg,#101b27,#0d1721)!important;
  box-shadow:0 18px 45px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.018)!important;
  overflow:hidden;
}
.expiry-card:nth-child(3n+2){border-top-color:#4b3a92!important}
.expiry-card:nth-child(3n+3){border-top-color:#236d5b!important}
.expiry-card:before{
  content:"";
  position:absolute;
  inset:-50px -80px auto auto;
  width:240px;height:210px;
  background:radial-gradient(circle,rgba(26,116,153,.18),transparent 68%);
  pointer-events:none;
}
.expiry-card-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  margin-bottom:20px!important;
}
.expiry-card .mini-avatar{
  width:46px!important;height:46px!important;border-radius:999px!important;
  background:linear-gradient(145deg,#2387b7,#35c4de)!important;
  color:#fff!important;border:0!important;
}
.expiry-card h3{
  margin:0 0 8px!important;
  font-size:20px!important;
  font-weight:500!important;
  color:#e1e6eb!important;
}
.expiry-phone{
  margin:0 0 28px!important;
  color:#71869a!important;
  font-size:10px!important;
}
.expiry-card dl{
  display:grid!important;
  gap:0!important;
  margin:0 0 25px!important;
}
.expiry-card dl>div{
  min-height:38px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  border-bottom:1px solid #20303d!important;
}
.expiry-card dt{
  color:#648096!important;
  font-size:8px!important;
}
.expiry-card dd{
  margin:0!important;
  color:#c6d0d8!important;
  font-size:9px!important;
  text-align:right!important;
}
.expiry-whatsapp{
  width:100%!important;
  height:61px!important;
  margin-top:auto!important;
  border:1px solid #24b679!important;
  border-radius:12px!important;
  background:linear-gradient(135deg,#1faa70,#25c980)!important;
  color:#fff!important;
  font-size:15px!important;
  font-weight:900!important;
  box-shadow:0 12px 28px rgba(31,170,112,.18)!important;
}
.expiry-whatsapp:hover{
  filter:brightness(1.05)!important;
  transform:translateY(-1px)!important;
}
.expiry-empty{
  grid-column:1/-1;
  min-height:220px;
  border:1px dashed #33414c;
  border-radius:18px;
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
}

@media(max-width:1250px){
  .expiry-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .clients-directory table{min-width:1250px!important}
}
@media(max-width:860px){
  .expiry-intro{align-items:flex-start!important;flex-direction:column!important}
  .expiry-segments{width:100%!important}
  .expiry-segments button{flex:1 1 0!important;min-width:0!important}
  .expiry-grid{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .clients-directory table{min-width:1180px!important}
  .clients-directory tbody tr{height:auto}
  .directory-actions{grid-template-columns:repeat(3,max-content)!important}
  .dir-action{height:42px!important;min-width:72px!important;padding-inline:12px!important}
  .expiry-card{min-height:auto;padding:20px!important}
  .expiry-intro h2{font-size:29px!important}
}



/* v1.6.41 THE ADMIN defaults — system-wide responsive layout */
html,body{
  width:100%;
  max-width:100%;
  overflow-x:hidden!important;
}
#app,.app-shell,.main-panel,.content,.view,
.panel,.table-panel,.table-wrap,
.dashboard-grid,.settings-grid,.analytics-visuals,.notice-composer,
.finance-stats,.stats-grid,.form-grid,.release-grid,.install-steps,.device-grid{
  min-width:0!important;
  max-width:100%;
  box-sizing:border-box;
}
.main-panel{
  overflow-x:hidden!important;
}
.content{
  width:100%!important;
  max-width:none!important;
  overflow-x:hidden!important;
}
.panel,.setting-card,.release-card{
  max-width:100%!important;
}

/* THE ADMIN table defaults: fit desktop viewport first, scroll only inside table on small screens */
.table-wrap{
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
}
.table-wrap::-webkit-scrollbar{display:none}
table{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  table-layout:auto;
}
th{
  padding:12px 12px!important;
  font-size:9px!important;
  line-height:1.2!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
}
td{
  padding:14px 12px!important;
  font-size:10px!important;
  line-height:1.45!important;
  white-space:normal!important;
  overflow-wrap:anywhere;
  word-break:normal;
}
td code,
td small,
td b,
td span{
  max-width:100%;
  overflow-wrap:anywhere;
}
.row-actions{
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
  flex-wrap:wrap!important;
  min-width:0!important;
}
.row-actions button,
.row-actions .secondary{
  min-height:36px;
  padding:0 10px;
  border-radius:9px;
  font-size:9px;
}

/* Client Directory: same proportions as THE ADMIN, without forced 1320px width */
.clients-directory{
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.clients-directory .table-wrap{
  overflow-x:hidden!important;
}
.clients-directory table{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  table-layout:fixed!important;
}
.clients-directory th{
  height:46px!important;
  padding:0 10px!important;
}
.clients-directory th:nth-child(1){width:15%!important}
.clients-directory th:nth-child(2){width:13%!important}
.clients-directory th:nth-child(3){width:15%!important}
.clients-directory th:nth-child(4){width:9%!important}
.clients-directory th:nth-child(5){width:9%!important}
.clients-directory th:nth-child(6){width:8%!important}
.clients-directory th:nth-child(7){width:31%!important}
.clients-directory td{
  min-height:0!important;
  padding:15px 10px!important;
  vertical-align:middle!important;
}
.clients-directory tbody tr{
  height:auto!important;
  min-height:96px!important;
}
.clients-directory .client-cell{
  gap:9px!important;
  min-width:0!important;
}
.clients-directory .mini-avatar{
  width:40px!important;
  height:40px!important;
  flex:0 0 40px!important;
  font-size:9px!important;
}
.clients-directory .client-cell>div{
  min-width:0!important;
}
.clients-directory .client-cell b{
  font-size:11px!important;
  line-height:1.3!important;
}
.clients-directory .client-cell small{
  margin-top:3px!important;
  max-width:100%!important;
  font-size:8px!important;
  line-height:1.35!important;
}
.directory-wa{
  width:100%!important;
  min-width:0!important;
  max-width:132px!important;
  min-height:52px!important;
  padding:7px 8px!important;
  margin:0 auto 0 0!important;
}
.directory-wa>span:last-child{
  min-width:0!important;
  font-size:9px!important;
}
.directory-wa small{
  max-width:100%!important;
  font-size:7.5px!important;
}
.license-copy{
  width:100%!important;
  max-width:160px!important;
  min-width:0!important;
  min-height:52px!important;
  padding:8px 9px!important;
  gap:6px!important;
}
.license-copy code{
  min-width:0!important;
  font-size:8px!important;
  line-height:1.45!important;
}
.license-copy span{
  font-size:8px!important;
}
.clients-directory .status{
  min-width:0!important;
  width:auto!important;
  padding:6px 8px!important;
  font-size:8px!important;
}
.directory-actions{
  width:100%!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:6px!important;
  align-items:center!important;
}
.dir-action{
  width:100%!important;
  min-width:0!important;
  height:38px!important;
  padding:0 7px!important;
  border-radius:9px!important;
  font-size:9px!important;
  font-weight:800!important;
}
.dir-action.rebind{
  min-width:0!important;
}

/* Common component defaults copied from THE ADMIN scale */
.section-intro{
  gap:18px;
  margin-bottom:20px!important;
}
.section-intro h2{
  font-size:28px!important;
  line-height:1.12!important;
}
.section-intro p{
  max-width:760px;
  font-size:11px!important;
  line-height:1.5!important;
}
.panel-head{
  gap:12px;
}
.panel-head>div{
  min-width:0;
}
input,textarea,select{
  max-width:100%;
  min-width:0;
}
.form-grid>*,
.settings-grid>*,
.dashboard-grid>*,
.analytics-visuals>*,
.notice-composer>*,
.finance-stats>*,
.stats-grid>*{
  min-width:0!important;
}

/* Expiry defaults: THE ADMIN 3 → 2 → 1 pattern, compact cards */
.expiry-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:15px!important;
}
.expiry-card{
  min-width:0!important;
  min-height:360px!important;
  padding:19px!important;
  border-radius:16px!important;
}
.expiry-card h3{
  font-size:17px!important;
}
.expiry-card dl{
  margin:15px 0 18px!important;
}
.expiry-card dl>div{
  min-height:34px!important;
}
.expiry-whatsapp{
  height:48px!important;
  font-size:12px!important;
}

/* Desktop compression before any scroll is needed */
@media(max-width:1280px){
  .clients-directory th:nth-child(1){width:14%!important}
  .clients-directory th:nth-child(2){width:12%!important}
  .clients-directory th:nth-child(3){width:14%!important}
  .clients-directory th:nth-child(4){width:9%!important}
  .clients-directory th:nth-child(5){width:9%!important}
  .clients-directory th:nth-child(6){width:8%!important}
  .clients-directory th:nth-child(7){width:34%!important}
  .clients-directory th,.clients-directory td{padding-inline:8px!important}
  .directory-actions{gap:5px!important}
  .dir-action{height:36px!important;padding-inline:5px!important;font-size:8.5px!important}
  .directory-wa{max-width:120px!important}
  .license-copy{max-width:145px!important}
}
@media(max-width:1100px){
  .expiry-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .clients-directory .mini-avatar{width:36px!important;height:36px!important;flex-basis:36px!important}
  .clients-directory .client-cell b{font-size:10px!important}
  .clients-directory .client-cell small{font-size:7.5px!important}
  .clients-directory th,.clients-directory td{padding-inline:6px!important}
  .directory-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .directory-wa{min-height:48px!important;padding-inline:6px!important}
  .license-copy{min-height:48px!important;padding-inline:7px!important}
}
@media(max-width:900px){
  .section-intro h2{font-size:24px!important}
  .table-panel .panel-head{padding:15px!important}
  th{font-size:8px!important;padding-inline:8px!important}
  td{font-size:9px!important;padding-inline:8px!important}
  .row-actions button,.row-actions .secondary{min-height:34px;padding-inline:8px;font-size:8px}
}
@media(max-width:760px){
  /* page never scrolls sideways; dense tables may swipe internally, with scrollbar hidden */
  .table-wrap{
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none!important;
  }
  .table-wrap::-webkit-scrollbar{display:none!important}
  table{min-width:760px!important}
  .clients-directory table{min-width:760px!important}
  .clients-directory th:nth-child(1){width:120px!important}
  .clients-directory th:nth-child(2){width:110px!important}
  .clients-directory th:nth-child(3){width:125px!important}
  .clients-directory th:nth-child(4){width:85px!important}
  .clients-directory th:nth-child(5){width:85px!important}
  .clients-directory th:nth-child(6){width:70px!important}
  .clients-directory th:nth-child(7){width:240px!important}
  .directory-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .expiry-grid{grid-template-columns:minmax(0,1fr)!important}
  .expiry-card{min-height:auto!important}
}



/* v1.6.42 client directory has no visible license key */
.clients-directory .license-copy{display:none!important}
.clients-directory th:nth-child(1){width:18%!important}
.clients-directory th:nth-child(2){width:15%!important}
.clients-directory th:nth-child(3){width:10%!important}
.clients-directory th:nth-child(4){width:10%!important}
.clients-directory th:nth-child(5){width:9%!important}
.clients-directory th:nth-child(6){width:38%!important}

@media(max-width:1280px){
  .clients-directory th:nth-child(1){width:17%!important}
  .clients-directory th:nth-child(2){width:14%!important}
  .clients-directory th:nth-child(3){width:10%!important}
  .clients-directory th:nth-child(4){width:10%!important}
  .clients-directory th:nth-child(5){width:8%!important}
  .clients-directory th:nth-child(6){width:41%!important}
}
@media(max-width:760px){
  .clients-directory th:nth-child(1){width:130px!important}
  .clients-directory th:nth-child(2){width:120px!important}
  .clients-directory th:nth-child(3){width:90px!important}
  .clients-directory th:nth-child(4){width:90px!important}
  .clients-directory th:nth-child(5){width:75px!important}
  .clients-directory th:nth-child(6){width:255px!important}
}



/* v1.6.43 THE ADMIN parity: search, notifications, notices */
.top-actions{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  flex-wrap:nowrap!important;
}
.global-search-wrap{
  position:relative!important;
  z-index:30!important;
  flex:0 1 280px!important;
  width:280px!important;
  min-width:210px!important;
  max-width:280px!important;
  margin:0!important;
}
.search.admin-search{
  position:relative!important;
  width:280px!important;
  max-width:100%!important;
  height:40px!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  padding:0 12px!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:color-mix(in srgb,var(--panel2) 84%,var(--bg))!important;
  color:var(--muted)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.search.admin-search::before,
.search.admin-search::after{display:none!important;content:none!important}
.search.admin-search .search-one-icon{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  width:auto!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  color:var(--muted)!important;
  font-size:17px!important;
  line-height:1!important;
}
.search.admin-search input{
  min-width:0!important;
  width:100%!important;
  flex:1 1 auto!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  background-image:none!important;
  color:var(--text)!important;
  font-size:12px!important;
  font-weight:500!important;
  box-shadow:none!important;
  appearance:none!important;
  -webkit-appearance:none!important;
}
.search.admin-search input::placeholder{color:var(--muted)!important}
.search.admin-search input::-webkit-search-decoration,
.search.admin-search input::-webkit-search-cancel-button,
.search.admin-search input::-webkit-search-results-button,
.search.admin-search input::-webkit-search-results-decoration{
  display:none!important;
  -webkit-appearance:none!important;
}
.search-clear{
  flex:0 0 auto!important;
  width:24px!important;
  height:24px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
  border:0!important;
  border-radius:7px!important;
  background:transparent!important;
  color:var(--muted)!important;
  font-size:18px!important;
  line-height:1!important;
  cursor:pointer!important;
}
.search-clear:hover{background:color-mix(in srgb,var(--text) 7%,transparent)!important;color:var(--text)!important}
.search-clear.hidden{display:none!important}

.global-search-results{
  position:absolute!important;
  top:calc(100% + 10px)!important;
  right:0!important;
  left:auto!important;
  width:min(480px,calc(100vw - 28px))!important;
  max-height:min(520px,70vh)!important;
  overflow:auto!important;
  padding:9px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 18%,var(--line))!important;
  border-radius:18px!important;
  background:color-mix(in srgb,var(--panel2) 96%,transparent)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.50)!important;
  backdrop-filter:blur(22px)!important;
  -webkit-backdrop-filter:blur(22px)!important;
}
.global-search-results header{
  display:flex!important;
  justify-content:space-between!important;
  align-items:center!important;
  padding:8px 10px 10px!important;
  border:0!important;
  color:var(--text)!important;
  background:transparent!important;
}
.global-search-results header b{font-size:11px!important}
.global-search-results header small{color:var(--muted)!important;font-size:9px!important}
.global-search-results .search-result{
  display:flex!important;
  width:100%!important;
  min-height:58px!important;
  align-items:center!important;
  gap:10px!important;
  margin:0!important;
  padding:10px!important;
  border:0!important;
  border-radius:12px!important;
  background:transparent!important;
  color:var(--text)!important;
  text-align:left!important;
  cursor:pointer!important;
}
.global-search-results .search-result:hover{
  background:color-mix(in srgb,var(--cyan) 7%,transparent)!important;
}
.global-search-results .sr-avatar{
  width:34px!important;
  height:34px!important;
  flex:0 0 34px!important;
  font-size:8px!important;
}
.global-search-results .search-result>div{
  display:grid!important;
  min-width:0!important;
  flex:1 1 auto!important;
  gap:2px!important;
}
.global-search-results .search-result b{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  font-size:10px!important;
}
.global-search-results .search-result small{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:var(--muted)!important;
  font-size:9px!important;
}
.global-search-results .search-result em{
  flex:0 0 auto!important;
  font-style:normal!important;
  color:var(--muted)!important;
  font-size:8px!important;
  text-transform:uppercase!important;
}
.global-search-results .search-empty{
  margin:8px!important;
  padding:16px!important;
  border-radius:12px!important;
  background:color-mix(in srgb,var(--text) 4%,transparent)!important;
  color:var(--muted)!important;
  text-align:center!important;
  font-size:9px!important;
}

/* THE ADMIN notification center */
.notification-center{position:relative!important;z-index:31!important;flex:0 0 auto!important;margin:0!important}
.notify-btn{
  position:relative!important;
  width:40px!important;
  min-width:40px!important;
  height:40px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  border-radius:10px!important;
  background:color-mix(in srgb,var(--panel2) 88%,var(--bg))!important;
  border:1px solid var(--line)!important;
  color:var(--text)!important;
  font-size:16px!important;
  box-shadow:none!important;
}
.notify-btn.active,
.notify-btn:hover{
  border-color:color-mix(in srgb,var(--cyan) 35%,var(--line))!important;
  background:color-mix(in srgb,var(--cyan) 6%,var(--panel2))!important;
}
.notify-btn>span{display:block!important;line-height:1!important}
.notify-btn>i{
  position:absolute!important;
  right:-3px!important;
  top:-4px!important;
  min-width:15px!important;
  width:auto!important;
  height:15px!important;
  padding:0 4px!important;
  border-radius:999px!important;
  display:grid!important;
  place-items:center!important;
  background:var(--red)!important;
  color:white!important;
  font-size:8px!important;
  font-style:normal!important;
  font-weight:900!important;
  line-height:1!important;
}
.notify-btn>i.hidden{display:none!important}

.notification-dropdown{
  position:absolute!important;
  top:50px!important;
  right:0!important;
  width:min(390px,calc(100vw - 28px))!important;
  max-height:min(620px,calc(100vh - 105px))!important;
  overflow:auto!important;
  border:1px solid color-mix(in srgb,var(--cyan) 18%,var(--line))!important;
  border-radius:18px!important;
  background:color-mix(in srgb,var(--panel2) 97%,transparent)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.54)!important;
  backdrop-filter:blur(22px)!important;
  -webkit-backdrop-filter:blur(22px)!important;
  z-index:90!important;
}
.notification-dropdown>header{
  position:sticky!important;
  top:0!important;
  z-index:2!important;
  display:flex!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:12px!important;
  padding:17px!important;
  border-bottom:1px solid var(--line)!important;
  background:color-mix(in srgb,var(--panel2) 94%,transparent)!important;
  backdrop-filter:blur(14px)!important;
}
.notification-dropdown>header span{
  color:var(--cyan)!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.18em!important;
}
.notification-dropdown>header h3{
  margin:4px 0 0!important;
  font-size:16px!important;
}
.notification-head-actions{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
}
.notification-head-actions button{
  min-height:30px!important;
  padding:0 9px!important;
  border:1px solid color-mix(in srgb,var(--text) 8%,var(--line))!important;
  border-radius:8px!important;
  background:color-mix(in srgb,var(--text) 4%,transparent)!important;
  color:var(--text)!important;
  font-size:8px!important;
  font-weight:800!important;
  cursor:pointer!important;
}
.notification-head-actions button:disabled{opacity:.45!important;cursor:not-allowed!important}

.push-state{
  margin:12px!important;
  padding:11px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:10px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 22%,var(--line))!important;
  border-radius:12px!important;
  background:color-mix(in srgb,var(--cyan) 5%,var(--panel2))!important;
}
.push-state.granted{
  border-color:color-mix(in srgb,var(--green) 30%,var(--line))!important;
  background:color-mix(in srgb,var(--green) 8%,var(--panel2))!important;
}
.push-state.denied{
  border-color:color-mix(in srgb,var(--red) 28%,var(--line))!important;
  background:color-mix(in srgb,var(--red) 7%,var(--panel2))!important;
}
.push-state b{display:block!important;font-size:9px!important}
.push-state small{display:block!important;margin-top:3px!important;color:var(--muted)!important;font-size:8px!important;line-height:1.4!important}
.push-state button{
  flex:0 0 auto!important;
  min-height:30px!important;
  padding:0 9px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 32%,var(--line))!important;
  border-radius:8px!important;
  background:color-mix(in srgb,var(--cyan) 8%,var(--panel2))!important;
  color:var(--cyan)!important;
  font-size:8px!important;
  font-weight:900!important;
}

.notification-list{
  padding:0 12px 12px!important;
}
.notification-list article{
  display:grid!important;
  grid-template-columns:9px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
  min-height:72px!important;
  padding:12px 4px!important;
  border-bottom:1px solid color-mix(in srgb,var(--line) 75%,transparent)!important;
}
.notification-list article.urgent{background:color-mix(in srgb,var(--amber) 4%,transparent)!important}
.notification-list article.expired{background:color-mix(in srgb,var(--red) 4%,transparent)!important}
.notification-dot{
  width:8px!important;
  height:8px!important;
  border-radius:50%!important;
  background:var(--cyan)!important;
  box-shadow:0 0 12px color-mix(in srgb,var(--cyan) 44%,transparent)!important;
}
.notification-list article.urgent .notification-dot{background:var(--amber)!important;box-shadow:0 0 12px color-mix(in srgb,var(--amber) 50%,transparent)!important}
.notification-list article.expired .notification-dot{background:var(--red)!important;box-shadow:0 0 12px color-mix(in srgb,var(--red) 50%,transparent)!important}
.notification-list article>div:nth-child(2){min-width:0!important;display:flex!important;flex-direction:column!important}
.notification-list article b{font-size:10px!important}
.notification-list article small{
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:var(--muted)!important;
  font:8px ui-monospace,SFMono-Regular,Menlo,monospace!important;
}
.notification-list article p{
  margin:4px 0 0!important;
  color:color-mix(in srgb,var(--text) 72%,var(--muted))!important;
  font-size:9px!important;
  line-height:1.4!important;
}
.notification-actions{
  display:flex!important;
  flex-direction:column!important;
  gap:5px!important;
  align-items:stretch!important;
}
.notification-actions button{
  white-space:nowrap!important;
  min-height:30px!important;
  padding:0 8px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 26%,var(--line))!important;
  border-radius:7px!important;
  background:color-mix(in srgb,var(--cyan) 7%,var(--panel2))!important;
  color:var(--cyan)!important;
  font-size:8px!important;
  font-weight:800!important;
}
.notification-empty{
  min-height:150px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  color:var(--muted)!important;
}
.notification-empty span{font-size:24px!important;color:var(--green)!important}
.notification-empty b{margin-top:6px!important;color:var(--text)!important;font-size:11px!important}
.notification-empty small{margin-top:3px!important;font-size:8px!important}

/* Notices page uses THE ADMIN current-activity language */
.notice-admin-intro{margin-bottom:16px!important}
.notice-summary{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:10px!important;
  margin-bottom:14px!important;
}
.notice-summary article{
  padding:14px 15px!important;
  border:1px solid var(--line)!important;
  border-radius:13px!important;
  background:color-mix(in srgb,var(--panel) 88%,transparent)!important;
}
.notice-summary small{
  color:var(--muted)!important;
  font-size:8px!important;
  text-transform:uppercase!important;
  letter-spacing:.08em!important;
}
.notice-summary b{display:block!important;margin-top:4px!important;font-size:22px!important}
.admin-notice-composer{
  grid-template-columns:minmax(0,1.15fr) minmax(290px,.85fr)!important;
  gap:14px!important;
}
.notice-form textarea{min-height:145px!important}
.notice-sticky-label{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}
.notice-sticky-label input{
  width:16px!important;
  height:16px!important;
  min-height:0!important;
  flex:0 0 16px!important;
}
.notice-admin-history{
  margin-top:14px!important;
  padding:0!important;
  overflow:hidden!important;
}
.notice-admin-history>.panel-head{
  padding:17px 18px!important;
  border-bottom:1px solid var(--line)!important;
}
.notice-admin-list{
  display:block!important;
  padding:0 14px 14px!important;
}
.notice-admin-item{
  display:grid!important;
  grid-template-columns:9px minmax(0,1fr) auto!important;
  gap:11px!important;
  align-items:center!important;
  min-height:88px!important;
  padding:14px 4px!important;
  border-bottom:1px solid color-mix(in srgb,var(--line) 75%,transparent)!important;
}
.notice-admin-item.urgent{background:color-mix(in srgb,var(--amber) 4%,transparent)!important}
.notice-admin-item.expired{background:color-mix(in srgb,var(--red) 4%,transparent)!important}
.notice-admin-copy{min-width:0!important}
.notice-admin-copy>b{
  display:block!important;
  font-size:10px!important;
}
.notice-admin-copy>small{
  display:block!important;
  margin-top:2px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:var(--muted)!important;
  font:8px ui-monospace,SFMono-Regular,Menlo,monospace!important;
}
.notice-admin-copy>p{
  margin:5px 0 0!important;
  color:color-mix(in srgb,var(--text) 74%,var(--muted))!important;
  font-size:9px!important;
  line-height:1.45!important;
}
.notice-admin-meta{
  display:flex!important;
  gap:6px!important;
  flex-wrap:wrap!important;
  margin-top:8px!important;
}
.notice-admin-meta span{
  padding:4px 7px!important;
  border:1px solid var(--line)!important;
  border-radius:999px!important;
  color:var(--muted)!important;
  background:color-mix(in srgb,var(--text) 3%,transparent)!important;
  font-size:7.5px!important;
}
.notice-admin-actions{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:5px!important;
}
.notice-admin-actions button{
  min-height:30px!important;
  padding:0 9px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 25%,var(--line))!important;
  border-radius:7px!important;
  background:color-mix(in srgb,var(--cyan) 6%,var(--panel2))!important;
  color:var(--cyan)!important;
  font-size:8px!important;
  font-weight:800!important;
}
.notice-preview-card{min-height:175px!important}

/* THE ADMIN control sizing */
#installAppBtn,.theme-toggle,.refresh-icon,#quickAddBtn{
  height:40px!important;
}
#quickAddBtn{min-width:116px!important}
#installAppBtn{min-width:108px!important}

@media(max-width:1000px){
  .global-search-wrap{width:210px!important;min-width:180px!important;max-width:210px!important;flex-basis:210px!important}
  .search.admin-search{width:210px!important}
  .admin-notice-composer{grid-template-columns:1fr!important}
}
@media(max-width:760px){
  .global-search-wrap{display:none!important}
  .notification-center{display:block!important}
  .notify-btn{display:grid!important}
  .notification-dropdown{
    position:fixed!important;
    top:74px!important;
    right:10px!important;
    left:10px!important;
    width:auto!important;
    max-height:calc(100dvh - 155px)!important;
  }
  .notification-dropdown>header{padding:15px!important}
  .push-state{margin:10px!important}
  .notification-list{padding:0 10px 12px!important}
  .notification-list article{grid-template-columns:9px minmax(0,1fr) auto!important}
  .notice-summary{grid-template-columns:1fr 1fr 1fr!important}
  .notice-admin-item{grid-template-columns:9px minmax(0,1fr)!important}
  .notice-admin-actions{grid-column:2;flex-direction:row!important}
  #installAppBtn{display:none!important}
  #quickAddBtn{min-width:40px!important;width:40px!important}
  #quickAddBtn span{display:none!important}
}
@media(max-width:480px){
  .notice-summary{grid-template-columns:1fr!important}
  .notice-admin-history>.panel-head{align-items:flex-start!important;flex-direction:column!important}
}



/* v1.6.44 THE ADMIN mobile parity + dashboard switcher + WhatsApp icons */
.dashboard-switcher{
  min-width:158px;
  max-width:190px;
  height:40px;
  display:flex;
  align-items:center;
  gap:7px;
  padding:0 9px;
  border:1px solid var(--line);
  border-radius:10px;
  background:color-mix(in srgb,var(--panel2) 88%,var(--bg));
  color:var(--muted);
  flex:0 0 auto;
}
.dashboard-switcher.hidden{display:none!important}
.dashboard-switcher>span{
  flex:0 0 auto;
  color:var(--cyan);
  font-size:14px;
  line-height:1;
}
.dashboard-switcher select{
  width:100%;
  min-width:0;
  height:30px;
  padding:0 20px 0 0;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:var(--text)!important;
  font-size:10px!important;
  font-weight:750!important;
  box-shadow:none!important;
}
.dashboard-switcher select option{
  background:var(--panel2);
  color:var(--text);
}

/* WhatsApp uses one consistent green icon language everywhere */
.sidebar nav button[data-view="messages"] .nav-ico,
.mobile-nav button[data-view="messages"]>span{
  color:#55d99a!important;
  border-color:color-mix(in srgb,#55d99a 30%,var(--line))!important;
  background:color-mix(in srgb,#55d99a 8%,var(--panel2))!important;
}
.sidebar nav button[data-view="messages"]:hover .nav-ico,
.sidebar nav button[data-view="messages"].active .nav-ico,
.mobile-nav button[data-view="messages"].active>span{
  color:#75ebb0!important;
  border-color:color-mix(in srgb,#55d99a 48%,var(--line))!important;
  background:color-mix(in srgb,#55d99a 13%,var(--panel2))!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,#55d99a 8%,transparent),0 0 20px color-mix(in srgb,#55d99a 10%,transparent)!important;
}
.wa-star{
  width:20px!important;
  height:20px!important;
  display:grid!important;
  place-items:center!important;
  flex:0 0 20px!important;
  color:#72e8ad!important;
  font-size:0!important;
}
.wa-star svg,
.wa-action svg,
.expiry-whatsapp svg{
  width:16px!important;
  height:16px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.directory-wa{
  color:#72e8ad!important;
}
.directory-wa svg{color:#72e8ad!important}

.whatsapp-intro{
  align-items:flex-end!important;
}
.whatsapp-filters{
  display:flex!important;
  align-items:center!important;
  gap:4px!important;
  padding:4px!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:color-mix(in srgb,var(--panel2) 88%,var(--bg))!important;
}
.whatsapp-filters button{
  min-height:32px!important;
  padding:0 12px!important;
  border:0!important;
  border-radius:7px!important;
  background:transparent!important;
  color:var(--muted)!important;
  font-size:8px!important;
  font-weight:850!important;
}
.whatsapp-filters button.active{
  background:color-mix(in srgb,#55d99a 13%,var(--panel2))!important;
  color:#76ebb2!important;
}
.whatsapp-panel{
  padding:0!important;
  overflow:hidden!important;
}
.whatsapp-panel>.panel-head{
  padding:16px 18px!important;
  border-bottom:1px solid var(--line)!important;
}
.whatsapp-panel>.panel-head>b{
  color:#67dca5!important;
  font-size:9px!important;
}
.whatsapp-row-actions{
  gap:6px!important;
}
.wa-action{
  min-height:36px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  padding:0 11px!important;
  border-radius:9px!important;
  font-size:9px!important;
  font-weight:850!important;
}
.wa-action.send{
  border:1px solid color-mix(in srgb,#55d99a 40%,var(--line))!important;
  background:color-mix(in srgb,#55d99a 11%,var(--panel2))!important;
  color:#74e9b0!important;
}
.wa-action.send:hover{
  background:color-mix(in srgb,#55d99a 17%,var(--panel2))!important;
  border-color:color-mix(in srgb,#55d99a 58%,var(--line))!important;
}
.wa-action.detail{
  border:1px solid var(--line)!important;
  background:color-mix(in srgb,var(--text) 4%,var(--panel2))!important;
  color:color-mix(in srgb,var(--text) 82%,var(--muted))!important;
}
.expiry-whatsapp{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  border-color:color-mix(in srgb,#55d99a 42%,var(--line))!important;
  background:linear-gradient(135deg,color-mix(in srgb,#55d99a 18%,#10251b),#123526)!important;
  color:#79edb5!important;
  box-shadow:0 12px 28px rgba(31,140,92,.13)!important;
}

/* THE ADMIN compact tablet behavior */
@media(max-width:1100px){
  .topbar{gap:9px!important}
  .dashboard-switcher{min-width:140px;max-width:160px}
  .global-search-wrap{max-width:210px!important}
  .finance-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .release-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .analytics-visuals{grid-template-columns:1fr!important}
}

/* THE ADMIN mobile shell */
@media(max-width:760px){
  html,body,#app,.app-shell{
    width:100%!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }
  .sidebar{display:none!important}
  .main-panel{
    margin-left:0!important;
    width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
  }
  .topbar{
    position:sticky!important;
    top:0!important;
    z-index:70!important;
    width:100%!important;
    height:72px!important;
    min-height:72px!important;
    padding:10px 12px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(108px,138px) auto!important;
    align-items:center!important;
    gap:8px!important;
    overflow:visible!important;
  }
  .topbar>div:first-child{
    min-width:0!important;
  }
  .topbar>div:first-child p{
    display:none!important;
  }
  .topbar h1,
  #pageTitle{
    margin:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:16px!important;
    line-height:1.15!important;
  }
  .dashboard-switcher{
    width:100%!important;
    min-width:0!important;
    max-width:138px!important;
    height:38px!important;
    padding:0 7px!important;
    border-radius:9px!important;
  }
  .dashboard-switcher>span{font-size:12px!important}
  .dashboard-switcher select{
    font-size:8.5px!important;
    font-weight:800!important;
  }
  .top-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:5px!important;
    flex:0 0 auto!important;
    min-width:0!important;
  }
  .global-search-wrap,
  #installAppBtn,
  .refresh-icon{
    display:none!important;
  }
  .notification-center,
  .theme-toggle,
  #quickAddBtn{
    display:grid!important;
    flex:0 0 38px!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    padding:0!important;
    place-items:center!important;
  }
  #quickAddBtn span{display:none!important}
  #quickAddBtn svg,
  .theme-toggle svg{width:17px!important;height:17px!important}
  .notify-btn{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
  }
  .mobile-sections{display:none!important}
  .content{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:15px 13px calc(92px + env(safe-area-inset-bottom))!important;
    overflow-x:hidden!important;
  }
  .view{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow-x:hidden!important;
  }
  .section-intro{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:12px!important;
    margin-bottom:15px!important;
  }
  .section-intro h2{
    font-size:24px!important;
    line-height:1.1!important;
  }
  .section-intro p{
    margin-top:6px!important;
    font-size:10px!important;
    line-height:1.5!important;
  }
  .section-actions{
    width:100%!important;
  }
  .section-actions>.primary,
  .section-actions>.secondary{
    width:100%!important;
  }
  .hero-strip{
    min-height:225px!important;
    padding:22px!important;
    border-radius:17px!important;
  }
  .hero-strip h2{font-size:28px!important}
  .hero-strip p{max-width:78%!important;font-size:10px!important}
  .orb{
    position:absolute!important;
    right:-52px!important;
    bottom:-58px!important;
    width:150px!important;
    height:150px!important;
    opacity:.45!important;
  }
  .stats-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }
  .stat{
    min-width:0!important;
    min-height:108px!important;
    padding:13px!important;
    gap:8px!important;
  }
  .stat-icon{width:34px!important;height:34px!important}
  .stat b{font-size:22px!important}
  .stat p{font-size:8px!important}
  .dashboard-grid,
  .analytics-visuals,
  .notice-composer,
  .admin-notice-composer,
  .settings-grid,
  .release-grid,
  .install-steps,
  .device-grid{
    grid-template-columns:minmax(0,1fr)!important;
    gap:11px!important;
  }
  .finance-stats{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }
  .finance-stat{
    min-width:0!important;
    padding:13px!important;
  }
  .form-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
  .field.full{grid-column:1!important}
  .panel{
    min-width:0!important;
    max-width:100%!important;
    padding:14px!important;
    border-radius:14px!important;
  }
  .panel-head{
    gap:8px!important;
    flex-wrap:wrap!important;
  }
  .panel-head h3{font-size:13px!important}
  input,textarea,select,button{
    max-width:100%;
  }
  .modal-backdrop{
    align-items:flex-end!important;
    padding:8px!important;
  }
  .modal{
    width:100%!important;
    max-width:none!important;
    max-height:92dvh!important;
    overflow:auto!important;
    border-radius:18px 18px 12px 12px!important;
    padding:18px!important;
  }

  /* client directory becomes cards: no horizontal scroll */
  .clients-directory{
    padding:0!important;
    overflow:visible!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  .clients-directory .panel-head{
    min-height:0!important;
    padding:14px 2px!important;
    border:0!important;
  }
  .clients-directory .filter-row{
    padding:0 0 10px!important;
    display:flex!important;
    gap:6px!important;
    overflow:auto!important;
    scrollbar-width:none!important;
  }
  .clients-directory .filter-row::-webkit-scrollbar{display:none!important}
  .clients-directory .table-wrap{
    overflow:visible!important;
  }
  .clients-directory table,
  .clients-directory tbody,
  .clients-directory tr,
  .clients-directory td{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  .clients-directory table{min-width:0!important}
  .clients-directory thead{display:none!important}
  .clients-directory tbody{
    display:grid!important;
    gap:10px!important;
  }
  .clients-directory tr{
    min-height:0!important;
    padding:14px!important;
    border:1px solid var(--line)!important;
    border-radius:15px!important;
    background:color-mix(in srgb,var(--panel) 94%,transparent)!important;
    box-shadow:0 10px 28px color-mix(in srgb,var(--bg) 38%,transparent)!important;
  }
  .clients-directory td{
    min-height:0!important;
    padding:8px 0!important;
    border:0!important;
  }
  .clients-directory td+td{
    border-top:1px solid color-mix(in srgb,var(--line) 65%,transparent)!important;
  }
  .clients-directory .client-cell{
    align-items:center!important;
  }
  .clients-directory .mini-avatar{
    width:40px!important;
    height:40px!important;
    flex-basis:40px!important;
  }
  .directory-wa{
    width:100%!important;
    max-width:none!important;
    min-height:44px!important;
    justify-content:flex-start!important;
    text-align:left!important;
    margin:0!important;
  }
  .directory-wa>span:last-child{
    align-items:flex-start!important;
  }
  .directory-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .dir-action{
    width:100%!important;
    min-width:0!important;
    height:38px!important;
  }

  /* WhatsApp page becomes cards too */
  .whatsapp-intro{
    align-items:stretch!important;
  }
  .whatsapp-filters{
    width:100%!important;
    overflow:auto!important;
    scrollbar-width:none!important;
  }
  .whatsapp-filters::-webkit-scrollbar{display:none!important}
  .whatsapp-filters button{
    flex:1 0 auto!important;
  }
  .whatsapp-panel{
    padding:0!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
  }
  .whatsapp-panel>.panel-head{
    padding:12px 2px!important;
    border:0!important;
  }
  #messagesRows.table-wrap{overflow:visible!important}
  #messagesRows table,
  #messagesRows tbody,
  #messagesRows tr,
  #messagesRows td{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  #messagesRows table{min-width:0!important}
  #messagesRows thead{display:none!important}
  #messagesRows tbody{
    display:grid!important;
    gap:10px!important;
  }
  #messagesRows tr{
    padding:13px!important;
    border:1px solid var(--line)!important;
    border-radius:14px!important;
    background:color-mix(in srgb,var(--panel) 94%,transparent)!important;
  }
  #messagesRows td{
    padding:7px 0!important;
    border:0!important;
  }
  #messagesRows td+td{
    border-top:1px solid color-mix(in srgb,var(--line) 65%,transparent)!important;
  }
  .whatsapp-row-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .wa-action{width:100%!important}

  .expiry-grid{
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
  }
  .expiry-card{
    min-height:auto!important;
    padding:17px!important;
  }
  .notice-summary{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .notice-summary article{padding:11px!important}
  .notice-summary b{font-size:18px!important}

  /* other dense tables stay inside their own swipe region, never the page */
  .table-wrap{
    width:100%!important;
    max-width:100%!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  .table-wrap::-webkit-scrollbar{display:none!important}
  .table-wrap table:not(.clients-directory table){
    max-width:none!important;
  }

  .mobile-nav{
    position:fixed!important;
    inset:auto 0 0!important;
    z-index:80!important;
    display:flex!important;
    height:68px!important;
    padding:0 6px env(safe-area-inset-bottom)!important;
    align-items:stretch!important;
    justify-content:space-around!important;
    border-top:1px solid var(--line)!important;
    background:color-mix(in srgb,var(--bg) 95%,transparent)!important;
    backdrop-filter:blur(18px)!important;
    -webkit-backdrop-filter:blur(18px)!important;
  }
  .mobile-nav button{
    width:auto!important;
    flex:1 1 0!important;
    min-width:0!important;
    padding:5px 2px!important;
    border:0!important;
    background:transparent!important;
    color:var(--muted)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:2px!important;
  }
  .mobile-nav button>span{
    width:28px!important;
    height:28px!important;
    display:grid!important;
    place-items:center!important;
    margin:0 auto!important;
    border-radius:9px!important;
  }
  .mobile-nav button>span svg{width:17px!important;height:17px!important}
  .mobile-nav button small{
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:7px!important;
  }
  .mobile-nav button.active{
    color:var(--cyan)!important;
  }
  #ta-mobile-more-backdrop{
    position:fixed!important;
    inset:0!important;
    z-index:81!important;
    border:0!important;
    background:rgba(0,0,0,.46)!important;
    backdrop-filter:blur(4px)!important;
  }
  #ta-mobile-more-panel{
    position:fixed!important;
    left:10px!important;
    right:10px!important;
    bottom:76px!important;
    z-index:82!important;
    max-height:65dvh!important;
    overflow:auto!important;
    padding:12px!important;
    border:1px solid var(--line)!important;
    border-radius:16px!important;
    background:color-mix(in srgb,var(--panel2) 97%,transparent)!important;
    box-shadow:0 24px 70px rgba(0,0,0,.45)!important;
    backdrop-filter:blur(20px)!important;
  }
  .ta-more-title{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    padding:2px 2px 10px!important;
  }
  .ta-more-title button{
    width:32px!important;
    height:32px!important;
    padding:0!important;
    border:1px solid var(--line)!important;
    border-radius:9px!important;
    background:transparent!important;
    color:var(--text)!important;
  }
  .ta-more-list{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:7px!important;
  }
  .ta-more-list button{
    min-height:42px!important;
    padding:0 10px!important;
    border:1px solid var(--line)!important;
    border-radius:10px!important;
    background:color-mix(in srgb,var(--text) 4%,var(--panel2))!important;
    color:var(--text)!important;
    font-size:9px!important;
    font-weight:800!important;
  }
  .notification-dropdown{
    position:fixed!important;
    top:74px!important;
    right:10px!important;
    left:10px!important;
    width:auto!important;
    max-height:calc(100dvh - 155px)!important;
  }
  .toast{
    left:12px!important;
    right:12px!important;
    bottom:82px!important;
    width:auto!important;
    text-align:center!important;
  }
}

@media(max-width:480px){
  .topbar{
    grid-template-columns:minmax(0,1fr) minmax(96px,118px) auto!important;
    padding-inline:9px!important;
    gap:5px!important;
  }
  .dashboard-switcher{max-width:118px!important}
  .top-actions{gap:3px!important}
  .notification-center,
  .theme-toggle,
  #quickAddBtn,
  .notify-btn{
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    flex-basis:36px!important;
  }
  .content{padding-inline:10px!important}
  .stats-grid,
  .finance-stats{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  .notice-summary{grid-template-columns:1fr!important}
  .hero-strip p{max-width:100%!important}
  .orb{opacity:.28!important}
  .ta-more-list{grid-template-columns:1fr!important}
}



/* v1.6.45 authoritative mobile header parity from THE ADMIN responsive-critical.css */
.mobile-profile-switch{
  position:relative!important;
  overflow:hidden!important;
}
.mobile-profile-switch:before{
  content:""!important;
  position:absolute!important;
  inset:-2px!important;
  background:linear-gradient(100deg,#13bfff33,#8658ff44,#1ee1a333)!important;
  background-size:220% 100%!important;
  animation:switchColor 4s linear infinite!important;
  pointer-events:none!important;
}
.mobile-profile-switch>span,
.mobile-profile-switch>select{
  position:relative!important;
  z-index:1!important;
}
.mobile-profile-switch select{
  appearance:auto!important;
  -webkit-appearance:auto!important;
}
.mobile-profile-switch select:focus{outline:0!important}
@keyframes switchColor{to{background-position:220% 0}}

@media(max-width:760px){
  /* THE ADMIN latest mobile header uses two real rows, not one squeezed bar */
  .topbar{
    height:auto!important;
    min-height:112px!important;
    padding:10px 12px!important;
    display:grid!important;
    grid-template-columns:minmax(74px,.72fr) minmax(0,1.28fr)!important;
    grid-template-rows:auto auto!important;
    gap:8px!important;
    align-items:center!important;
    overflow:visible!important;
  }
  .topbar>div:first-child{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
  }
  .topbar>div:first-child p{display:none!important}
  .topbar h1,
  #pageTitle{
    max-width:100%!important;
    margin:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:15px!important;
    line-height:1.15!important;
  }

  .dashboard-switcher,
  .mobile-profile-switch{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:40px!important;
    padding:0 9px!important;
    display:flex!important;
  }
  .dashboard-switcher.hidden,
  .mobile-profile-switch.hidden{display:none!important}
  .mobile-profile-switch select{
    min-width:0!important;
    width:100%!important;
    height:36px!important;
    padding:0 22px 0 5px!important;
    font-size:11px!important;
  }

  /* second row: Search + Notification + Add Client only */
  .top-actions{
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 38px auto!important;
    gap:7px!important;
    align-items:center!important;
    justify-self:stretch!important;
  }
  .global-search-wrap{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
  }
  .search.admin-search{
    display:flex!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    height:38px!important;
    padding:0 10px!important;
  }
  .search.admin-search input{
    min-width:0!important;
    width:100%!important;
    font-size:16px!important;
  }
  .global-search-results{
    left:0!important;
    right:auto!important;
    width:min(480px,calc(100vw - 24px))!important;
    max-width:calc(100vw - 24px)!important;
  }

  #installAppBtn,
  .install-btn,
  #themeToggleBtn,
  .theme-toggle,
  #refreshBtn,
  .refresh-icon{
    display:none!important;
  }
  .notification-center{
    display:block!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    margin:0!important;
  }
  .notify-btn{
    display:grid!important;
    place-items:center!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
  }
  #quickAddBtn,
  .quick-add{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:auto!important;
    min-width:88px!important;
    height:38px!important;
    padding:0 10px!important;
    font-size:9px!important;
    white-space:nowrap!important;
    gap:0!important;
  }
  #quickAddBtn svg{display:none!important}
  #quickAddBtn span{display:inline!important}

  /* no switcher available: let the title use the full first row */
  .topbar:has(.dashboard-switcher.hidden)>div:first-child{
    grid-column:1/-1!important;
  }

  .content{
    padding-top:14px!important;
  }
}

@media(max-width:430px){
  .topbar{
    grid-template-columns:minmax(62px,.62fr) minmax(0,1.38fr)!important;
    padding-inline:9px!important;
  }
  .topbar h1,
  #pageTitle{
    font-size:13px!important;
  }
  .mobile-profile-switch select{
    font-size:10px!important;
  }
  .top-actions{
    grid-template-columns:minmax(0,1fr) 36px 80px!important;
  }
  .notification-center,
  .notify-btn{
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
  }
  #quickAddBtn,
  .quick-add{
    min-width:80px!important;
    width:80px!important;
    height:36px!important;
    padding-inline:7px!important;
  }
}

@media(max-width:350px){
  .topbar{
    grid-template-columns:56px minmax(0,1fr)!important;
  }
  .top-actions{
    grid-template-columns:minmax(0,1fr) 72px!important;
  }
  .top-actions .notification-center,
  .top-actions .notify-btn{
    display:none!important;
  }
  #quickAddBtn,
  .quick-add{
    min-width:72px!important;
    width:72px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .mobile-profile-switch:before{animation:none!important}
}



/* v1.6.46 final mobile header correction */
@media(max-width:760px){
  .topbar{
    height:auto!important;
    min-height:112px!important;
    display:grid!important;
    grid-template-columns:minmax(74px,.72fr) minmax(0,1.28fr)!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    gap:8px!important;
    padding:10px 12px!important;
    overflow:visible!important;
  }
  .topbar>div:first-child{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
  }
  .mobile-profile-switch,
  .dashboard-switcher{
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    width:100%!important;
    max-width:none!important;
    align-self:center!important;
  }

  /* FLOW keeps Theme as one extra compact slot while preserving THE ADMIN shell */
  .top-actions{
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 38px 38px minmax(88px,auto)!important;
    align-items:center!important;
    gap:7px!important;
    overflow:visible!important;
    margin:0!important;
  }
  .top-actions>*{
    min-width:0!important;
    align-self:center!important;
    position:relative!important;
  }

  .global-search-wrap{
    display:block!important;
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    order:0!important;
  }
  .search.admin-search{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:38px!important;
    padding:0 10px!important;
  }
  .search.admin-search input{
    display:block!important;
    min-width:0!important;
    width:100%!important;
    font-size:16px!important;
  }

  .notification-center{
    display:block!important;
    grid-column:2!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    margin:0!important;
    order:0!important;
  }
  .notify-btn{
    display:grid!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    place-items:center!important;
  }

  #themeToggleBtn,
  .theme-toggle{
    display:grid!important;
    grid-column:3!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    padding:0!important;
    place-items:center!important;
    order:0!important;
    margin:0!important;
  }

  #installAppBtn,
  .install-btn,
  #refreshBtn,
  .refresh-icon{
    display:none!important;
    width:0!important;
    min-width:0!important;
    height:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;
  }

  #quickAddBtn,
  #quickAddBtn.quick-add,
  .quick-add{
    display:flex!important;
    grid-column:4!important;
    width:auto!important;
    min-width:88px!important;
    height:38px!important;
    padding:0 10px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
    white-space:nowrap!important;
    order:0!important;
    margin:0!important;
    font-size:9px!important;
  }
  #quickAddBtn svg{display:none!important}
  #quickAddBtn span{display:inline!important}

  .global-search-results{
    top:calc(100% + 8px)!important;
    left:0!important;
    right:auto!important;
    width:min(480px,calc(100vw - 24px))!important;
    max-width:calc(100vw - 24px)!important;
    z-index:120!important;
  }
}

@media(max-width:430px){
  .topbar{
    grid-template-columns:minmax(62px,.62fr) minmax(0,1.38fr)!important;
    padding-inline:9px!important;
  }
  .top-actions{
    grid-template-columns:minmax(0,1fr) 36px 36px 80px!important;
    gap:5px!important;
  }
  .notification-center,
  .notify-btn,
  #themeToggleBtn,
  .theme-toggle{
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
  }
  #quickAddBtn,
  #quickAddBtn.quick-add,
  .quick-add{
    width:80px!important;
    min-width:80px!important;
    height:36px!important;
    padding-inline:6px!important;
  }
}

@media(max-width:350px){
  .topbar{
    grid-template-columns:56px minmax(0,1fr)!important;
  }
  .top-actions{
    grid-template-columns:minmax(0,1fr) 32px 32px 70px!important;
    gap:4px!important;
  }
  .notification-center,
  .notify-btn,
  #themeToggleBtn,
  .theme-toggle{
    display:grid!important;
    width:32px!important;
    min-width:32px!important;
    height:34px!important;
  }
  #quickAddBtn,
  #quickAddBtn.quick-add,
  .quick-add{
    width:70px!important;
    min-width:70px!important;
    height:34px!important;
    padding-inline:4px!important;
    font-size:8px!important;
  }
}



/* v1.6.47 canonical dashboard layer — final authority */
:root{
  --flow-control-h:40px;
  --flow-control-r:10px;
  --flow-section-gap:18px;
}
html,body,#app,.app-shell,.main-panel,.content,.view{
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}
body{overflow-x:hidden!important}
.main-panel,.content,.view{overflow-x:hidden!important}
.content{
  padding:22px 22px 30px!important;
}
.section-intro{
  margin-bottom:var(--flow-section-gap)!important;
  gap:14px!important;
}
.section-intro h2{
  margin:7px 0 5px!important;
  font-size:28px!important;
  line-height:1.14!important;
  letter-spacing:-.02em!important;
}
.section-intro p{
  margin:0!important;
  max-width:760px!important;
  font-size:11px!important;
  line-height:1.5!important;
}
.panel-head{
  gap:10px!important;
}
.section-actions>button,
.panel-head>button,
.modal-actions>button,
.setting-card>button{
  min-height:var(--flow-control-h)!important;
  padding:0 13px!important;
  border-radius:var(--flow-control-r)!important;
  font-size:9px!important;
  font-weight:850!important;
}
.filter-row>button,
.seg-control>button{
  min-height:34px!important;
  padding:0 11px!important;
  border-radius:9px!important;
  font-size:8.5px!important;
}
input,select,textarea,button{
  box-sizing:border-box!important;
}

/* Header: THE ADMIN proportions with THE FLOW direct theme picker */
.topbar{
  min-width:0!important;
}
.top-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:nowrap!important;
  gap:8px!important;
  min-width:0!important;
}
.global-search-wrap{
  flex:0 1 280px!important;
  width:280px!important;
  min-width:180px!important;
  max-width:280px!important;
}
.search.admin-search{
  height:var(--flow-control-h)!important;
}
.notification-center,
.notify-btn,
#refreshBtn,
.refresh-icon{
  flex:0 0 40px!important;
  width:40px!important;
  min-width:40px!important;
  height:40px!important;
}
#installAppBtn{
  flex:0 0 auto!important;
  min-width:104px!important;
  height:40px!important;
}
#quickAddBtn,
#quickAddBtn.quick-add{
  flex:0 0 auto!important;
  min-width:112px!important;
  height:40px!important;
  padding-inline:12px!important;
}

/* Direct theme picker */
.theme-picker-wrap{
  position:relative!important;
  z-index:34!important;
  flex:0 0 auto!important;
  min-width:0!important;
}
.theme-picker-btn{
  height:40px!important;
  min-width:116px!important;
  padding:0 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:color-mix(in srgb,var(--panel2) 90%,var(--bg))!important;
  color:var(--text)!important;
  box-shadow:none!important;
  font-size:9px!important;
  font-weight:850!important;
  cursor:pointer!important;
}
.theme-picker-btn:hover,
.theme-picker-btn[aria-expanded="true"]{
  border-color:color-mix(in srgb,var(--cyan) 34%,var(--line))!important;
  background:color-mix(in srgb,var(--cyan) 6%,var(--panel2))!important;
}
.theme-picker-icon{
  width:15px!important;
  height:15px!important;
  flex:0 0 15px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  color:var(--cyan)!important;
}
.theme-picker-menu{
  position:absolute!important;
  top:calc(100% + 8px)!important;
  right:0!important;
  width:220px!important;
  padding:8px!important;
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:6px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 18%,var(--line))!important;
  border-radius:14px!important;
  background:color-mix(in srgb,var(--panel2) 97%,transparent)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.48)!important;
  backdrop-filter:blur(20px)!important;
  -webkit-backdrop-filter:blur(20px)!important;
}
.theme-picker-menu.hidden{display:none!important}
.theme-picker-menu button{
  min-width:0!important;
  min-height:38px!important;
  padding:0 9px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:7px!important;
  border:1px solid transparent!important;
  border-radius:9px!important;
  background:transparent!important;
  color:var(--text)!important;
  font-size:8.5px!important;
  font-weight:800!important;
}
.theme-picker-menu button:hover,
.theme-picker-menu button.active{
  border-color:color-mix(in srgb,var(--cyan) 25%,var(--line))!important;
  background:color-mix(in srgb,var(--cyan) 7%,var(--panel2))!important;
}
.theme-swatch{
  width:14px!important;
  height:14px!important;
  flex:0 0 14px!important;
  border-radius:50%!important;
  border:1px solid rgba(255,255,255,.16)!important;
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.12)!important;
}
[data-theme-choice="premium"] .theme-swatch{background:linear-gradient(135deg,#525f69,#8bcbd7)!important}
[data-theme-choice="light"] .theme-swatch{background:linear-gradient(135deg,#fff,#c7dbe6)!important}
[data-theme-choice="midnight"] .theme-swatch{background:linear-gradient(135deg,#091426,#284a74)!important}
[data-theme-choice="aurora"] .theme-swatch{background:linear-gradient(135deg,#114a55,#7253a2)!important}
[data-theme-choice="emerald"] .theme-swatch{background:linear-gradient(135deg,#0d392b,#55d99a)!important}
[data-theme-choice="royal"] .theme-swatch{background:linear-gradient(135deg,#23205a,#8e8cff)!important}
[data-theme-choice="graphite"] .theme-swatch{background:linear-gradient(135deg,#181b1f,#6f7882)!important}

/* Settings: narrow-safe and direct theme selection */
.settings-grid{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
  width:100%!important;
  min-width:0!important;
}
.setting-card{
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.setting-card>*{
  max-width:100%!important;
}
.setting-card p,
.setting-card small,
.setting-card label,
.setting-card code{
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
.setting-card code{
  display:block!important;
  white-space:normal!important;
}
.setting-card input:not([type="checkbox"]),
.setting-card select,
.setting-card textarea{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
}
.settings-theme-control{
  margin-top:13px!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  gap:7px!important;
  min-width:0!important;
}
.settings-theme-control>label{
  color:var(--muted)!important;
  font-size:8px!important;
  font-weight:850!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.theme-settings-select{
  width:100%!important;
  min-width:0!important;
  height:42px!important;
  padding:0 34px 0 11px!important;
  border:1px solid var(--line)!important;
  border-radius:10px!important;
  background:var(--panel2)!important;
  color:var(--text)!important;
  font-size:10px!important;
  font-weight:800!important;
}
.settings-theme-control small{
  color:var(--muted)!important;
  font-size:8.5px!important;
}

/* Tablet compression before switching to the two-row mobile header */
@media(max-width:1180px) and (min-width:761px){
  .global-search-wrap{width:220px!important;max-width:220px!important}
  #installAppBtn{
    min-width:40px!important;
    width:40px!important;
    padding:0!important;
  }
  #installAppBtn span{display:none!important}
  .theme-picker-btn{
    min-width:42px!important;
    width:42px!important;
    padding:0!important;
  }
  #quickAddBtn,#quickAddBtn.quick-add{min-width:100px!important}
}
@media(max-width:930px) and (min-width:761px){
  .global-search-wrap{width:185px!important;max-width:185px!important;min-width:150px!important}
  #refreshBtn,.refresh-icon{display:none!important}
}

/* THE ADMIN two-row mobile header, with FLOW theme picker as one compact slot */
@media(max-width:760px){
  .content{
    padding:14px 12px calc(88px + env(safe-area-inset-bottom))!important;
  }
  .topbar{
    height:auto!important;
    min-height:112px!important;
    padding:10px 12px!important;
    display:grid!important;
    grid-template-columns:minmax(74px,.72fr) minmax(0,1.28fr)!important;
    grid-template-rows:auto auto!important;
    gap:8px!important;
    align-items:center!important;
    overflow:visible!important;
  }
  .topbar>div:first-child{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
  }
  .topbar>div:first-child p{display:none!important}
  .topbar h1,#pageTitle{
    margin:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:15px!important;
    line-height:1.15!important;
  }
  .mobile-profile-switch,
  .dashboard-switcher{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
  }
  .top-actions{
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 38px 38px 88px!important;
    gap:7px!important;
    align-items:center!important;
    justify-self:stretch!important;
  }
  .global-search-wrap{
    display:block!important;
    grid-column:1!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    margin:0!important;
  }
  .search.admin-search{
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:38px!important;
    padding:0 10px!important;
  }
  .search.admin-search input{
    min-width:0!important;
    width:100%!important;
    font-size:16px!important;
  }
  .notification-center,
  .notify-btn{
    display:grid!important;
    grid-column:2!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    place-items:center!important;
    margin:0!important;
  }
  .theme-picker-wrap{
    display:block!important;
    grid-column:3!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    z-index:92!important;
  }
  .theme-picker-btn{
    display:grid!important;
    place-items:center!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    padding:0!important;
  }
  .theme-picker-icon{
    width:17px!important;
    height:17px!important;
  }
  .theme-picker-menu{
    position:fixed!important;
    top:108px!important;
    left:auto!important;
    right:12px!important;
    width:min(260px,calc(100vw - 24px))!important;
    max-height:calc(100dvh - 190px)!important;
    overflow:auto!important;
    z-index:130!important;
  }
  #quickAddBtn,
  #quickAddBtn.quick-add{
    display:flex!important;
    grid-column:4!important;
    width:88px!important;
    min-width:88px!important;
    height:38px!important;
    padding:0 9px!important;
    align-items:center!important;
    justify-content:center!important;
    white-space:nowrap!important;
    font-size:9px!important;
  }
  #quickAddBtn svg{display:none!important}
  #quickAddBtn span{display:inline!important}
  #installAppBtn,.install-btn,#refreshBtn,.refresh-icon{
    display:none!important;
    width:0!important;
    min-width:0!important;
    height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
  }
  .settings-grid{
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
  }
  .setting-card{
    width:100%!important;
    min-width:0!important;
    padding:15px!important;
  }
}

@media(max-width:430px){
  .content{
    padding-left:9px!important;
    padding-right:9px!important;
  }
  .topbar{
    grid-template-columns:minmax(62px,.62fr) minmax(0,1.38fr)!important;
    padding-inline:9px!important;
  }
  .topbar h1,#pageTitle{font-size:13px!important}
  .top-actions{
    grid-template-columns:minmax(0,1fr) 36px 36px 80px!important;
    gap:5px!important;
  }
  .notification-center,.notify-btn,
  .theme-picker-wrap,.theme-picker-btn{
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
  }
  #quickAddBtn,#quickAddBtn.quick-add{
    width:80px!important;
    min-width:80px!important;
    height:36px!important;
    padding-inline:6px!important;
  }
  .theme-picker-menu{
    top:106px!important;
    right:9px!important;
    width:calc(100vw - 18px)!important;
  }
  .setting-card{
    padding:13px!important;
    border-radius:13px!important;
  }
  .setting-card h3{
    font-size:13px!important;
    line-height:1.3!important;
  }
  .setting-card p{
    font-size:10px!important;
  }
  .theme-settings-select,
  .setting-card input:not([type="checkbox"]),
  .setting-card select,
  .setting-card textarea{
    font-size:16px!important;
  }
  .setting-card button{
    max-width:100%!important;
  }
}

@media(max-width:350px){
  .topbar{
    grid-template-columns:56px minmax(0,1fr)!important;
  }
  .top-actions{
    grid-template-columns:minmax(0,1fr) 32px 32px 70px!important;
    gap:4px!important;
  }
  .notification-center,.notify-btn,
  .theme-picker-wrap,.theme-picker-btn{
    width:32px!important;
    min-width:32px!important;
    height:34px!important;
  }
  #quickAddBtn,#quickAddBtn.quick-add{
    width:70px!important;
    min-width:70px!important;
    height:34px!important;
    padding-inline:4px!important;
    font-size:8px!important;
  }
  .theme-picker-menu{
    grid-template-columns:1fr!important;
  }
  .setting-card{
    padding:12px!important;
  }
}


/* v1.6.48 compact live controls */
.sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}
#installAppBtn.compact-header-icon{
  flex:0 0 40px!important;
  width:40px!important;
  min-width:40px!important;
  height:40px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
}
#installAppBtn.compact-header-icon svg{
  width:16px!important;
  height:16px!important;
  margin:0!important;
}
.theme-picker-wrap{
  width:40px!important;
  min-width:40px!important;
  height:40px!important;
  flex:0 0 40px!important;
}
.theme-picker-btn.theme-cycle-btn{
  width:40px!important;
  min-width:40px!important;
  height:40px!important;
  padding:0!important;
  display:grid!important;
  place-items:center!important;
  gap:0!important;
}
.theme-picker-btn.theme-cycle-btn .theme-picker-icon{
  width:17px!important;
  height:17px!important;
  flex:0 0 17px!important;
  transition:transform .24s ease,color .2s ease!important;
}
.theme-picker-btn.theme-cycle-btn:hover .theme-picker-icon{
  transform:rotate(18deg)!important;
  color:#ffd76a!important;
}
.settings-theme-control{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  margin-top:12px!important;
}
@media(max-width:760px){
  .theme-picker-wrap,
  .theme-picker-btn.theme-cycle-btn{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
  }
}
@media(max-width:430px){
  .theme-picker-wrap,
  .theme-picker-btn.theme-cycle-btn{
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
  }
}


/* v1.6.49 seller sync + package delivery polish */
.seller-synced-row{
  background:linear-gradient(90deg,color-mix(in srgb,var(--cyan) 3%,transparent),transparent 42%)!important;
}
.seller-source{
  display:inline-flex!important;
  align-items:center!important;
  gap:4px!important;
  padding:2px 6px!important;
  margin-left:3px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 24%,var(--line))!important;
  border-radius:999px!important;
  background:color-mix(in srgb,var(--cyan) 7%,var(--panel2))!important;
  color:var(--cyan)!important;
  font-size:7px!important;
  font-weight:900!important;
  letter-spacing:.06em!important;
  vertical-align:middle!important;
}
.seller-managed-note{
  min-height:30px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 9px!important;
  border:1px solid color-mix(in srgb,var(--green) 25%,var(--line))!important;
  border-radius:8px!important;
  background:color-mix(in srgb,var(--green) 7%,var(--panel2))!important;
  color:var(--green)!important;
  font-size:8px!important;
  font-weight:900!important;
}
.created-hero{
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  padding:14px!important;
  border:1px solid color-mix(in srgb,var(--green) 20%,var(--line))!important;
  border-radius:14px!important;
  background:linear-gradient(145deg,color-mix(in srgb,var(--green) 6%,var(--panel2)),var(--panel))!important;
  margin-bottom:12px!important;
}
.created-hero .ok{
  width:38px!important;
  height:38px!important;
  flex:0 0 38px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:12px!important;
  background:color-mix(in srgb,var(--green) 13%,var(--panel2))!important;
  border:1px solid color-mix(in srgb,var(--green) 30%,var(--line))!important;
  color:var(--green)!important;
  font-size:18px!important;
  font-weight:950!important;
}
.package-preview{
  max-height:220px!important;
  overflow:auto!important;
  margin-top:10px!important;
  padding:13px 14px!important;
  border:1px solid var(--line)!important;
  border-radius:12px!important;
  background:color-mix(in srgb,var(--panel2) 94%,var(--bg))!important;
  color:var(--muted)!important;
  font-size:9px!important;
  line-height:1.65!important;
  white-space:pre-wrap!important;
}
.package-send-cta{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  min-width:176px!important;
  background:linear-gradient(135deg,#23b46f,#168b55)!important;
  box-shadow:0 10px 28px rgba(35,180,111,.18)!important;
}
.package-send-cta svg{
  width:15px!important;
  height:15px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.package-send-cta:hover{
  transform:translateY(-1px)!important;
  filter:brightness(1.05)!important;
}
@media(max-width:560px){
  .package-send-cta{width:100%!important;min-width:0!important}
  .created-hero{align-items:flex-start!important}
}


/* v1.6.50 deep mobile responsive hardening */
@media(max-width:760px){
  html,body,#app,.app-shell,.main-panel,.content,.view{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  body,.app-shell,.main-panel,.content,.view{overflow-x:hidden!important}

  .topbar{
    min-height:calc(112px + env(safe-area-inset-top))!important;
    padding-top:calc(10px + env(safe-area-inset-top))!important;
  }
  .topbar>*{min-width:0!important}
  .top-actions{
    grid-template-columns:minmax(0,1fr) 38px 38px 88px!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  .notification-dropdown{
    top:calc(118px + env(safe-area-inset-top))!important;
    left:8px!important;
    right:8px!important;
    width:auto!important;
    max-width:calc(100vw - 16px)!important;
    max-height:calc(100dvh - 205px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
    overflow:auto!important;
    overscroll-behavior:contain!important;
  }
  .theme-picker-menu{
    top:calc(118px + env(safe-area-inset-top))!important;
    right:8px!important;
    width:min(260px,calc(100vw - 16px))!important;
    max-height:calc(100dvh - 205px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
    overflow:auto!important;
  }
  .global-search-results{
    max-width:calc(100vw - 16px)!important;
    overflow:auto!important;
  }

  .content{
    padding-left:10px!important;
    padding-right:10px!important;
    padding-bottom:calc(88px + env(safe-area-inset-bottom))!important;
  }
  .panel,.setting-card,.release-card,.expiry-card{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .panel-head,.section-intro,.section-actions{min-width:0!important}
  .panel-head>*,
  .section-intro>*{min-width:0!important}
  .panel-head h3,.section-intro h2,.section-intro p{
    overflow-wrap:anywhere!important;
  }

  .table-wrap{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-x:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .table-wrap table{max-width:none!important}
  .clients-directory table{min-width:760px!important}

  .modal-backdrop,.wa-choice-backdrop{
    align-items:flex-end!important;
    justify-content:center!important;
    padding:8px!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
  }
  .modal,.wa-choice{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 16px - env(safe-area-inset-top))!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    border-radius:18px 18px 0 0!important;
    padding-left:14px!important;
    padding-right:14px!important;
    padding-bottom:calc(16px + env(safe-area-inset-bottom))!important;
  }
  .modal input,.modal select,.modal textarea,.wa-choice button{
    max-width:100%!important;
    min-width:0!important;
  }
  .modal-actions{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
  }
  .modal-actions>button{
    width:100%!important;
    min-width:0!important;
    min-height:42px!important;
    white-space:normal!important;
  }
  .modal-actions .package-send-cta{
    grid-column:1/-1!important;
    min-height:44px!important;
  }
  .package-preview,.result-box{
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
    white-space:pre-wrap!important;
  }
  .package-preview{
    max-height:min(34dvh,250px)!important;
    overflow:auto!important;
  }
  .created-hero{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .created-hero>div:last-child{min-width:0!important}
  .created-hero h2,.created-hero p{overflow-wrap:anywhere!important}
  .wa-app-grid{grid-template-columns:minmax(0,1fr)!important}
  .wa-app{
    width:100%!important;
    min-width:0!important;
    min-height:72px!important;
  }

  .mobile-nav{
    height:calc(68px + env(safe-area-inset-bottom))!important;
    padding-bottom:env(safe-area-inset-bottom)!important;
  }
  .mobile-nav button{min-height:48px!important}
  #ta-mobile-more-panel{
    bottom:calc(76px + env(safe-area-inset-bottom))!important;
    max-height:calc(65dvh - env(safe-area-inset-bottom))!important;
  }
}

@media(max-width:430px){
  .top-actions{
    grid-template-columns:minmax(0,1fr) 36px 36px 80px!important;
    gap:5px!important;
  }
  .notification-center,.notify-btn,
  .theme-picker-wrap,.theme-picker-btn.theme-cycle-btn{
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
  }
  #quickAddBtn,#quickAddBtn.quick-add{
    width:80px!important;
    min-width:80px!important;
    height:36px!important;
  }
  .modal-actions{grid-template-columns:minmax(0,1fr)!important}
  .modal-actions .package-send-cta{grid-column:auto!important}
}

@media(max-width:350px){
  .topbar{
    grid-template-columns:56px minmax(0,1fr)!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .top-actions{
    grid-template-columns:minmax(0,1fr) 36px 36px 70px!important;
    gap:4px!important;
  }
  .notification-center,.notify-btn,
  .theme-picker-wrap,.theme-picker-btn.theme-cycle-btn{
    display:grid!important;
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
  }
  #quickAddBtn,#quickAddBtn.quick-add{
    width:70px!important;
    min-width:70px!important;
    height:36px!important;
    padding-inline:3px!important;
  }
  .content{padding-left:8px!important;padding-right:8px!important}
}


/* v1.6.51 overall UI/UX hardening */
html{scrollbar-gutter:stable}
button{touch-action:manipulation}
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
a:focus-visible{
  outline:2px solid var(--cyan)!important;
  outline-offset:2px!important;
}
button:disabled{
  cursor:not-allowed!important;
  opacity:.56!important;
  transform:none!important;
}
code{
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}

/* Sidebar stays usable on short laptop screens instead of clipping lower navigation. */
.sidebar{overflow:hidden!important}
.sidebar>.brand,
.sidebar>.side-card,
.sidebar>.profile{flex:0 0 auto!important}
.sidebar nav{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-width:thin!important;
  scrollbar-color:color-mix(in srgb,var(--cyan) 22%,var(--line)) transparent!important;
  padding-right:3px!important;
}
.sidebar nav::-webkit-scrollbar{width:5px!important}
.sidebar nav::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--cyan) 22%,var(--line))!important;
  border-radius:999px!important;
}
.profile>div{min-width:0!important;flex:1 1 auto!important}
.profile b,.profile small{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}

/* Blocking surfaces own the viewport; background content must not move underneath them. */
body:has(.modal-backdrop:not(.hidden)),
body:has(.wa-choice-backdrop),
body:has(#ta-mobile-more-backdrop:not(.hidden)){
  overflow:hidden!important;
}
.modal-backdrop,.wa-choice-backdrop,
.notification-dropdown,.global-search-results,#ta-mobile-more-panel{
  overscroll-behavior:contain!important;
}

/* Consistent icon language in the top bar. */
.search-one-icon,
.switch-icon{
  display:grid!important;
  place-items:center!important;
  flex:0 0 auto!important;
}
.search-one-icon svg{
  width:16px!important;
  height:16px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.9!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.switch-icon svg{
  width:16px!important;
  height:16px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.notify-btn .notification-bell{
  width:18px!important;
  height:18px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.search-clear{
  min-width:30px!important;
  min-height:30px!important;
  display:grid!important;
  place-items:center!important;
  padding:0!important;
}

/* Long content must shrink inside its own card instead of widening the page. */
.panel-head,.section-intro,.section-actions,
.panel-head>*,.section-intro>*,
.client-cell,.client-cell>div,
.notification-list article,.notification-list article>div,
.activity-row,.activity-row>div,
.setting-card,.setting-card>*{
  min-width:0!important;
}
.panel-head h3,.section-intro h2,.section-intro p,
.notification-list article p,
.activity-row b,.activity-row small,
.setting-card h3,.setting-card p,.setting-card small,.setting-card label{
  overflow-wrap:anywhere!important;
  word-break:break-word!important;
}
.activity-row time{white-space:nowrap!important}
.settings-grid{align-items:stretch!important}
.setting-card{height:100%!important}
.setting-card input:not([type="checkbox"]),
.setting-card select,.setting-card textarea{
  max-width:100%!important;
}

/* Notification actions should never squeeze message copy into an unreadable sliver. */
.notification-actions{min-width:0!important}
.notification-actions button{min-height:36px!important}

/* Tablet header gets two real rows while retaining the desktop sidebar. */
@media(max-width:900px) and (min-width:761px){
  .sidebar{width:190px!important;padding-left:12px!important;padding-right:12px!important}
  .main-panel{margin-left:190px!important}
  .content{padding-left:14px!important;padding-right:14px!important}
  .topbar{
    height:auto!important;
    min-height:108px!important;
    padding:10px 14px!important;
    display:grid!important;
    grid-template-columns:minmax(90px,.72fr) minmax(170px,1.28fr)!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    gap:8px!important;
  }
  .topbar>div:first-child{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
  }
  .topbar>div:first-child p{display:none!important}
  .topbar h1,#pageTitle{
    font-size:16px!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
  .dashboard-switcher,.mobile-profile-switch{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
    width:min(230px,100%)!important;
    min-width:0!important;
    max-width:230px!important;
  }
  .topbar:has(.dashboard-switcher.hidden)>div:first-child{grid-column:1/-1!important}
  .top-actions{
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    display:flex!important;
    justify-content:flex-end!important;
  }
  .global-search-wrap{
    flex:1 1 190px!important;
    width:auto!important;
    min-width:140px!important;
    max-width:none!important;
  }
  .search.admin-search{width:100%!important;max-width:none!important}
  #quickAddBtn,#quickAddBtn.quick-add{min-width:96px!important}
}

/* Compact vertical layout for short notebook screens. */
@media(max-height:760px) and (min-width:761px){
  .sidebar{padding-top:14px!important;padding-bottom:12px!important}
  .brand{padding-bottom:12px!important}
  .sidebar nav button{min-height:42px!important;padding-top:6px!important;padding-bottom:6px!important}
  .nav-ico{width:28px!important;height:28px!important}
  .side-card{padding:9px 10px!important}
  .profile{padding-top:10px!important;margin-top:7px!important}
}

/* Touch screens should not get desktop hover movement that causes visual jumps. */
@media(hover:none),(pointer:coarse){
  body[data-theme] .panel:hover,
  body[data-theme] .setting-card:hover,
  body[data-theme] .stat:hover,
  body[data-theme] .finance-stat:hover,
  .sidebar nav button:hover,
  .primary:hover,
  .package-send-cta:hover{
    transform:none!important;
  }
}

@media(max-width:760px){
  html{scrollbar-gutter:auto}
  .section-actions{
    width:100%!important;
    display:flex!important;
    flex-wrap:wrap!important;
    gap:7px!important;
  }
  .section-actions>button{min-height:42px!important}
  .notification-list article{
    min-width:0!important;
  }
  .notification-list article p{
    max-width:100%!important;
  }
}

@media(max-width:430px){
  .notification-list article{
    grid-template-columns:9px minmax(0,1fr)!important;
    align-items:start!important;
  }
  .notification-actions{
    grid-column:2!important;
    width:100%!important;
    margin-top:5px!important;
  }
  .notification-actions button{
    width:100%!important;
    white-space:normal!important;
  }
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;
    animation-iteration-count:1!important;
    transition-duration:.001ms!important;
    scroll-behavior:auto!important;
  }
}


/* v1.6.52 FlowView production skin */
body[data-theme="flowview"]{
  --bg:#08090a;
  --panel:#101213;
  --panel2:#131617;
  --line:rgba(255,255,255,.09);
  --muted:#8a9290;
  --text:#f5f6f2;
  --cyan:#9affc5;
  --blue:#6fdba0;
  --green:#9affc5;
  --amber:#f1cf78;
  --red:#ff8f9e;
  --ui-border:rgba(255,255,255,.09);
  --ui-glass:rgba(15,17,18,.80);
  --ui-glass-strong:rgba(15,17,18,.94);
  color-scheme:dark;
  background:
    radial-gradient(circle at 50% -8%,rgba(116,255,180,.08),transparent 29rem),
    radial-gradient(circle at 92% 82%,rgba(105,93,255,.045),transparent 28rem),
    linear-gradient(180deg,#0b0d0f 0%,#08090a 58%,#090a0b 100%)!important;
}
body[data-theme="flowview"] .app-shell{
  background:
    radial-gradient(circle at 54% 1%,rgba(125,255,183,.055),transparent 28rem),
    linear-gradient(180deg,rgba(255,255,255,.008),transparent 38%)!important;
}
body[data-theme="flowview"] .sidebar{
  background:linear-gradient(180deg,rgba(13,15,16,.985),rgba(8,9,10,.995))!important;
  border-right-color:rgba(255,255,255,.075)!important;
  box-shadow:14px 0 48px rgba(0,0,0,.23)!important;
}
body[data-theme="flowview"] .topbar{
  background:rgba(8,9,10,.82)!important;
  border-bottom-color:rgba(255,255,255,.075)!important;
  box-shadow:0 12px 38px rgba(0,0,0,.17)!important;
  backdrop-filter:blur(22px) saturate(1.08)!important;
}
body[data-theme="flowview"] .mobile-nav{
  background:rgba(8,9,10,.94)!important;
  border-top-color:rgba(255,255,255,.08)!important;
  box-shadow:0 -12px 42px rgba(0,0,0,.26)!important;
}
body[data-theme="flowview"] .flow-mark stop:first-child{stop-color:#b4ffd0!important}
body[data-theme="flowview"] .flow-mark stop:nth-child(2){stop-color:#75e9a7!important}
body[data-theme="flowview"] .flow-mark stop:last-child{stop-color:#44c982!important}
body[data-theme="flowview"] .flow-mark path[fill="#f6fbff"]{fill:#f5f6f2!important}
body[data-theme="flowview"] .flow-mark circle:first-of-type{fill:#9affc5!important}
body[data-theme="flowview"] .flow-mark circle:last-of-type{fill:#d4ffe4!important}

body[data-theme="flowview"] .login-screen{
  background:
    radial-gradient(circle at 50% 22%,rgba(126,255,181,.09),transparent 24rem),
    #08090a!important;
}
body[data-theme="flowview"] .login-card{
  border-color:rgba(255,255,255,.10)!important;
  background:linear-gradient(150deg,rgba(20,23,23,.97),rgba(10,11,12,.98))!important;
  box-shadow:0 35px 120px rgba(0,0,0,.62)!important;
}
body[data-theme="flowview"] .login-card p,
body[data-theme="flowview"] .login-card small{color:#89918e!important}

body[data-theme="flowview"] .panel,
body[data-theme="flowview"] .setting-card,
body[data-theme="flowview"] .stat,
body[data-theme="flowview"] .finance-stat,
body[data-theme="flowview"] .release-card,
body[data-theme="flowview"] .expiry-card{
  border-color:rgba(255,255,255,.085)!important;
  background:rgba(255,255,255,.025)!important;
  box-shadow:0 18px 54px rgba(0,0,0,.18)!important;
  backdrop-filter:blur(16px)!important;
}
body[data-theme="flowview"] .panel:hover,
body[data-theme="flowview"] .setting-card:hover,
body[data-theme="flowview"] .stat:hover,
body[data-theme="flowview"] .finance-stat:hover,
body[data-theme="flowview"] .release-card:hover,
body[data-theme="flowview"] .expiry-card:hover{
  border-color:rgba(154,255,197,.18)!important;
  background:rgba(255,255,255,.035)!important;
  box-shadow:0 22px 64px rgba(0,0,0,.24),0 0 26px rgba(126,255,181,.025)!important;
}
body[data-theme="flowview"] .hero-strip{
  border-color:rgba(255,255,255,.10)!important;
  background:
    radial-gradient(circle at 82% 30%,rgba(126,255,181,.10),transparent 22rem),
    linear-gradient(150deg,rgba(28,32,31,.96),rgba(12,14,14,.94))!important;
  box-shadow:0 34px 100px rgba(0,0,0,.31)!important;
}
body[data-theme="flowview"] .hero-strip:before{
  background:linear-gradient(90deg,transparent,rgba(154,255,197,.75),transparent)!important;
  opacity:.5!important;
}
body[data-theme="flowview"] .hero-strip em,
body[data-theme="flowview"] .eyebrow,
body[data-theme="flowview"] .panel-head>div>span{color:#9affc5!important}
body[data-theme="flowview"] .orb{
  background:radial-gradient(circle,rgba(126,255,181,.22) 0,rgba(25,61,45,.26) 43%,transparent 64%)!important;
  box-shadow:0 0 100px rgba(126,255,181,.10)!important;
}
body[data-theme="flowview"] .orb>span{color:#d8ffe7!important}

body[data-theme="flowview"] .sidebar nav button{color:#8f9693!important}
body[data-theme="flowview"] .sidebar nav button:hover,
body[data-theme="flowview"] .sidebar nav button.active{
  color:#f6f7f3!important;
  background:linear-gradient(90deg,rgba(154,255,197,.075),transparent)!important;
}
body[data-theme="flowview"] .nav-ico{
  border-color:rgba(255,255,255,.07)!important;
  background:rgba(255,255,255,.025)!important;
  color:#9ca4a0!important;
}
body[data-theme="flowview"] .sidebar nav button.active .nav-ico{
  border-color:rgba(154,255,197,.19)!important;
  background:rgba(154,255,197,.075)!important;
  color:#9affc5!important;
  box-shadow:0 0 22px rgba(126,255,181,.05)!important;
}
body[data-theme="flowview"] .side-card,
body[data-theme="flowview"] .profile{
  border-color:rgba(255,255,255,.075)!important;
  background:rgba(255,255,255,.018)!important;
}

body[data-theme="flowview"] input,
body[data-theme="flowview"] select,
body[data-theme="flowview"] textarea,
body[data-theme="flowview"] .assign,
body[data-theme="flowview"] .search.admin-search,
body[data-theme="flowview"] .icon-btn,
body[data-theme="flowview"] .refresh-icon,
body[data-theme="flowview"] .theme-picker-btn{
  border-color:rgba(255,255,255,.09)!important;
  background:rgba(255,255,255,.032)!important;
  color:#f5f6f2!important;
  box-shadow:none!important;
}
body[data-theme="flowview"] input:focus,
body[data-theme="flowview"] select:focus,
body[data-theme="flowview"] textarea:focus,
body[data-theme="flowview"] .search.admin-search:focus-within{
  border-color:rgba(154,255,197,.34)!important;
  box-shadow:0 0 0 3px rgba(154,255,197,.045)!important;
}
body[data-theme="flowview"] .primary{
  border:1px solid rgba(255,255,255,.5)!important;
  background:#f3f4ef!important;
  color:#101311!important;
  box-shadow:0 10px 28px rgba(0,0,0,.22)!important;
}
body[data-theme="flowview"] .primary:hover{
  background:#fff!important;
  filter:none!important;
  box-shadow:0 14px 36px rgba(0,0,0,.30)!important;
}
body[data-theme="flowview"] .secondary{
  border-color:rgba(255,255,255,.11)!important;
  background:rgba(255,255,255,.04)!important;
  color:#edf3ef!important;
}
body[data-theme="flowview"] .secondary:hover{
  border-color:rgba(154,255,197,.18)!important;
  background:rgba(154,255,197,.055)!important;
}
body[data-theme="flowview"] .theme-cycle-btn{color:#9affc5!important}
body[data-theme="flowview"] .theme-cycle-btn:hover .theme-picker-icon{color:#d7ffe6!important}

body[data-theme="flowview"] th{
  background:rgba(255,255,255,.018)!important;
  color:#737b78!important;
  border-bottom-color:rgba(255,255,255,.075)!important;
}
body[data-theme="flowview"] td{
  color:#c6cbc8!important;
  border-bottom-color:rgba(255,255,255,.055)!important;
}
body[data-theme="flowview"] tbody tr:hover{background:rgba(154,255,197,.022)!important}
body[data-theme="flowview"] .mini-avatar,
body[data-theme="flowview"] .stat-icon,
body[data-theme="flowview"] .fi{
  border-color:rgba(154,255,197,.13)!important;
  background:rgba(31,64,49,.50)!important;
  color:#a8ffcb!important;
}
body[data-theme="flowview"] .status.active,
body[data-theme="flowview"] .op-status.sent{
  border-color:rgba(154,255,197,.14)!important;
  background:rgba(154,255,197,.07)!important;
  color:#a9ffcc!important;
}
body[data-theme="flowview"] ::selection{
  background:rgba(154,255,197,.22);
  color:#fff;
}


/* v1.6.53 interaction and state polish */
/* Stronger empty states without adding noisy illustration assets. */
.empty,
.search-empty,
.notification-empty{
  max-width:100%!important;
  overflow-wrap:anywhere!important;
}
.empty{
  position:relative!important;
  min-height:138px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
  padding:30px 18px!important;
  border-radius:14px!important;
  background:
    radial-gradient(circle at 50% 10%,color-mix(in srgb,var(--cyan) 5%,transparent),transparent 55%),
    color-mix(in srgb,var(--panel2) 58%,transparent)!important;
}
.empty::before{
  content:""!important;
  width:34px!important;
  height:34px!important;
  margin-bottom:4px!important;
  border-radius:11px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 14%,var(--line))!important;
  background:
    radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--cyan) 18%,transparent) 0 2px,transparent 3px),
    color-mix(in srgb,var(--cyan) 5%,var(--panel2))!important;
  box-shadow:0 8px 24px color-mix(in srgb,var(--cyan) 4%,transparent)!important;
}
.empty b{
  margin:0!important;
  color:var(--text)!important;
  font-size:11px!important;
}
.empty:not(b){font-size:9px!important}

/* Table polish: readable headers and contained scroll. */
.table-wrap{
  scrollbar-width:thin!important;
  scrollbar-color:color-mix(in srgb,var(--cyan) 18%,var(--line)) transparent!important;
}
.table-wrap::-webkit-scrollbar{height:7px!important;width:7px!important}
.table-wrap::-webkit-scrollbar-track{background:transparent!important}
.table-wrap::-webkit-scrollbar-thumb{
  background:color-mix(in srgb,var(--cyan) 18%,var(--line))!important;
  border-radius:999px!important;
}
@media(min-width:761px){
  .table-wrap thead th{
    position:sticky!important;
    top:0!important;
    z-index:3!important;
    backdrop-filter:blur(12px)!important;
    box-shadow:0 1px 0 var(--line)!important;
  }
}

/* Dense actions stay aligned and use the same icon proportions. */
.row-actions,.directory-actions,.whatsapp-row-actions{
  align-items:center!important;
}
.row-actions button,.dir-action,.wa-action{
  min-height:34px!important;
  line-height:1.1!important;
}
.dir-action{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:5px!important;
}
.action-ico{
  width:13px!important;
  height:13px!important;
  flex:0 0 13px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.assign{
  min-height:36px!important;
  max-width:100%!important;
}

/* Modal and toast interaction polish. */
.close{
  width:38px!important;
  height:38px!important;
  right:12px!important;
  top:12px!important;
  display:grid!important;
  place-items:center!important;
  line-height:1!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease!important;
}
.close:hover{
  background:color-mix(in srgb,var(--cyan) 8%,var(--panel2))!important;
  border-color:color-mix(in srgb,var(--cyan) 20%,var(--line))!important;
}
.close:active{transform:scale(.96)!important}
.toast{
  max-width:min(390px,calc(100vw - 24px))!important;
  line-height:1.45!important;
  overflow-wrap:anywhere!important;
  backdrop-filter:blur(16px)!important;
  animation:flowToastEnter .22s ease-out both!important;
}
@keyframes flowToastEnter{
  from{opacity:0;transform:translateY(8px) scale(.985)}
  to{opacity:1;transform:none}
}

/* Search and notification empty content feel intentional, not broken. */
.search-empty{
  margin:0!important;
  padding:24px 14px!important;
  text-align:center!important;
  color:var(--muted)!important;
  font-size:9px!important;
}
.notification-empty{
  min-height:150px!important;
  display:grid!important;
  place-items:center!important;
  align-content:center!important;
  gap:5px!important;
  text-align:center!important;
}
.notification-empty>span{
  width:34px!important;
  height:34px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  border:1px solid color-mix(in srgb,var(--green) 18%,var(--line))!important;
  background:color-mix(in srgb,var(--green) 7%,var(--panel2))!important;
  color:var(--green)!important;
}

/* Mobile toast must never hide behind the bottom nav. */
@media(max-width:760px){
  .toast{
    left:8px!important;
    right:8px!important;
    bottom:calc(78px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-width:none!important;
    padding:12px 13px!important;
    border-radius:12px!important;
  }
  .empty{
    min-height:118px!important;
    padding:24px 14px!important;
  }
  .close{
    width:40px!important;
    height:40px!important;
  }
  .row-actions button,.dir-action,.wa-action{
    min-height:40px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .toast{animation:none!important}
}


/* v1.6.54 package CTA touch target */
.package-send-cta{
  min-height:42px!important;
  padding-top:9px!important;
  padding-bottom:9px!important;
}


/* v1.6.55 icon and accessibility unification */
.action-primary,.button-ico,.icon-close,.search-clear{display:inline-flex!important;align-items:center!important;justify-content:center!important}
.action-primary{gap:7px!important}
.button-ico{width:15px!important;height:15px!important;flex:0 0 15px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.icon-close svg,.search-clear svg{width:15px!important;height:15px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important}
.close.icon-close{border:1px solid color-mix(in srgb,var(--line) 88%,var(--cyan) 12%)!important}
.search-clear{color:var(--muted)!important}
.search-clear:hover,.icon-close:hover{color:var(--text)!important}
.search-result .sr-icon{width:36px!important;height:36px!important;flex:0 0 36px!important;display:grid!important;place-items:center!important;border:1px solid color-mix(in srgb,var(--cyan) 16%,var(--line))!important;border-radius:11px!important;color:var(--cyan)!important;background:color-mix(in srgb,var(--cyan) 6%,var(--panel2))!important;box-shadow:inset 0 1px rgba(255,255,255,.025)!important}
.search-result .sr-icon svg{width:17px!important;height:17px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important}
[data-view][aria-current="page"]{position:relative!important}
body[data-theme="flowview"] [data-view][aria-current="page"]::after{content:""!important;position:absolute!important;right:8px!important;width:4px!important;height:4px!important;border-radius:50%!important;background:var(--cyan)!important;box-shadow:0 0 10px color-mix(in srgb,var(--cyan) 55%,transparent)!important}
.view.active{animation:flowEnter .22s cubic-bezier(.2,.72,.24,1)!important}
.modal-backdrop:not(.hidden){animation:flowBackdropIn .18s ease-out both!important}
.modal-backdrop:not(.hidden) .modal{animation:flowModalIn .22s cubic-bezier(.2,.78,.24,1) both!important}
@keyframes flowBackdropIn{from{opacity:0}to{opacity:1}}
@keyframes flowModalIn{from{opacity:0;transform:translateY(8px) scale(.988)}to{opacity:1;transform:none}}
@media(max-width:760px){.section-actions .action-primary{justify-content:center!important}}
@media(prefers-reduced-motion:reduce){.view.active,.modal-backdrop:not(.hidden),.modal-backdrop:not(.hidden) .modal{animation:none!important}}


/* v1.6.56 tablet modal action containment */
@media(min-width:761px) and (max-width:900px){
  .modal-actions{
    flex-wrap:wrap!important;
    align-items:stretch!important;
  }
  .modal-actions>button{
    min-height:42px!important;
  }
  .modal-actions .package-send-cta{
    flex:1 1 220px!important;
    min-height:44px!important;
    max-width:100%!important;
    white-space:normal!important;
  }
}


/* v1.6.57 global modal action containment */
.modal-actions{
  flex-wrap:wrap!important;
  min-width:0!important;
  max-width:100%!important;
}
.modal-actions>button{
  max-width:100%!important;
}
.modal-actions .package-send-cta{
  min-height:44px!important;
  max-width:100%!important;
  white-space:normal!important;
}


/* v1.6.58 content hierarchy cleanup */
.single-panel-view .section-intro{
  margin-bottom:10px!important;
  align-items:flex-end!important;
}
.single-panel-view .section-actions{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:8px!important;
  margin-top:0!important;
}
.section-count{
  min-height:34px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0 10px!important;
  border:1px solid color-mix(in srgb,var(--cyan) 13%,var(--line))!important;
  border-radius:9px!important;
  background:color-mix(in srgb,var(--cyan) 4%,var(--panel2))!important;
  color:var(--muted)!important;
  font-size:8.5px!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
.single-panel-view>.table-panel,
.single-panel-view>.whatsapp-panel{
  margin-top:0!important;
}
.single-panel-view .clients-directory .filter-row{
  border-top:0!important;
}
.section-tools{flex-wrap:wrap!important}

/* One containment model for every modal action row. */
.modal-actions{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(140px,1fr))!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
}
.modal-actions>button{
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:42px!important;
  white-space:normal!important;
}
.modal-actions .package-send-cta{
  min-width:0!important;
  max-width:100%!important;
  min-height:44px!important;
  white-space:normal!important;
}
@media(min-width:431px) and (max-width:760px){
  .modal-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .modal-actions .package-send-cta{grid-column:1/-1!important}
}
@media(max-width:430px){
  .single-panel-view .section-intro{margin-bottom:8px!important}
  .single-panel-view .section-actions{
    width:100%!important;
    justify-content:space-between!important;
    align-items:center!important;
  }
  .section-count{
    min-height:32px!important;
    padding:0 8px!important;
  }
  .modal-actions{grid-template-columns:minmax(0,1fr)!important}
  .modal-actions .package-send-cta{grid-column:auto!important}
}

/* v1.6.59 direct theme picker completion */
[data-theme-choice="flowview"] .theme-swatch{background:linear-gradient(135deg,#0f1715,#9affc5)!important}
.theme-picker-menu button[aria-checked="true"]{border-color:color-mix(in srgb,var(--cyan) 30%,var(--line))!important;background:color-mix(in srgb,var(--cyan) 8%,var(--panel2))!important}
.theme-picker-menu button:focus-visible{outline:2px solid var(--cyan)!important;outline-offset:1px!important}
.theme-setting-card .settings-theme-control{max-width:360px}
@media(max-width:760px){.theme-picker-menu{overscroll-behavior:contain!important}.theme-setting-card .settings-theme-control{max-width:none}}

/* 2026-10 premium icon, card and motion polish */
:root{
  --flow-ease:cubic-bezier(.2,.72,.24,1);
  --flow-shadow-soft:0 14px 34px rgba(0,0,0,.16);
  --flow-shadow-lift:0 22px 54px rgba(0,0,0,.24);
}

/* Icon system: crisp SVGs inside dimensional, theme-aware holders. */
.nav-ico,
.stat-icon,
.finance-stat .fi,
.search-result .sr-icon,
.mini-avatar,
.mobile-nav button>span{
  position:relative!important;
  overflow:hidden!important;
  border-radius:12px!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.10),
    inset 0 -1px rgba(0,0,0,.18),
    0 8px 20px rgba(0,0,0,.20)!important;
  transition:
    transform .22s var(--flow-ease),
    border-color .22s ease,
    background .22s ease,
    box-shadow .22s ease,
    color .22s ease!important;
}
.nav-ico::after,
.stat-icon::after,
.finance-stat .fi::after,
.search-result .sr-icon::after,
.mobile-nav button>span::after{
  content:""!important;
  position:absolute!important;
  inset:1px!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  background:linear-gradient(135deg,rgba(255,255,255,.10),transparent 42%)!important;
  opacity:.42!important;
}
.nav-ico svg,
.stat-icon svg,
.finance-stat .fi svg,
.search-result .sr-icon svg,
.mobile-nav button>span svg,
.button-ico,
.action-ico,
.wa-action svg,
.expiry-whatsapp svg,
.notify-btn svg,
.refresh-icon svg,
.theme-picker-icon,
.search-one-icon svg,
.switch-icon svg{
  vector-effect:non-scaling-stroke!important;
  shape-rendering:geometricPrecision!important;
  transition:transform .2s var(--flow-ease),filter .2s ease!important;
}
.nav-ico svg,
.stat-icon svg,
.finance-stat .fi svg,
.search-result .sr-icon svg,
.mobile-nav button>span svg{
  filter:drop-shadow(0 3px 5px rgba(0,0,0,.20))!important;
}
.sidebar nav button.active .nav-ico,
.mobile-nav button.active>span{
  transform:translateY(-1px) scale(1.045)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.14),
    0 10px 26px color-mix(in srgb,var(--cyan) 15%,transparent)!important;
}

/* Topbar actions feel like one premium icon family. */
.notify-btn,
.refresh-icon,
.theme-picker-btn,
.install-btn,
.search-clear{
  box-shadow:
    inset 0 1px rgba(255,255,255,.055),
    0 7px 18px rgba(0,0,0,.14)!important;
  transition:
    transform .18s var(--flow-ease),
    box-shadow .18s ease,
    border-color .18s ease,
    background .18s ease!important;
}
.notify-btn svg,
.refresh-icon svg,
.theme-picker-btn svg,
.install-btn svg{
  width:17px!important;
  height:17px!important;
}

/* Cards/boxes: stronger hierarchy without bulky gradients. */
.panel,
.setting-card,
.stat,
.finance-stat,
.expiry-card,
.release-card{
  border-radius:18px!important;
  border-color:color-mix(in srgb,var(--line) 88%,var(--cyan) 12%)!important;
  box-shadow:
    inset 0 1px rgba(255,255,255,.045),
    inset 0 -1px rgba(0,0,0,.10),
    var(--flow-shadow-soft)!important;
  transition:
    transform .24s var(--flow-ease),
    border-color .24s ease,
    box-shadow .24s ease,
    background .24s ease!important;
}
.panel,
.setting-card,
.expiry-card,
.release-card{
  position:relative!important;
  isolation:isolate!important;
}
.panel-head{
  min-height:42px;
}
.section-count{
  box-shadow:inset 0 1px rgba(255,255,255,.05),0 5px 14px rgba(0,0,0,.10)!important;
}
.filter-row>button,
.seg-control>button,
.row-actions button,
.dir-action,
.wa-action{
  box-shadow:inset 0 1px rgba(255,255,255,.045),0 5px 13px rgba(0,0,0,.10)!important;
  transition:
    transform .16s var(--flow-ease),
    border-color .16s ease,
    background .16s ease,
    box-shadow .16s ease,
    color .16s ease!important;
}
.row-actions button svg,
.dir-action svg,
.wa-action svg,
.action-primary svg{
  flex:0 0 auto!important;
}
.status,
.op-status{
  box-shadow:inset 0 1px rgba(255,255,255,.045),0 4px 12px rgba(0,0,0,.08)!important;
}

/* Controlled entrance animations: cards arrive smoothly instead of popping in. */
.stat,
.finance-stat,
.expiry-card{
  animation:flowCardRise .34s var(--flow-ease) both;
}
.stat:nth-child(2),
.finance-stat:nth-child(2),
.expiry-card:nth-child(2){animation-delay:.035s}
.stat:nth-child(3),
.finance-stat:nth-child(3),
.expiry-card:nth-child(3){animation-delay:.07s}
.stat:nth-child(4),
.finance-stat:nth-child(4),
.expiry-card:nth-child(4){animation-delay:.105s}
@keyframes flowCardRise{
  from{opacity:0;transform:translateY(7px) scale(.992)}
  to{opacity:1;transform:none}
}
@keyframes flowActiveIconGlow{
  0%,100%{box-shadow:inset 0 1px rgba(255,255,255,.12),0 8px 20px color-mix(in srgb,var(--cyan) 9%,transparent)}
  50%{box-shadow:inset 0 1px rgba(255,255,255,.16),0 10px 28px color-mix(in srgb,var(--cyan) 18%,transparent)}
}
.sidebar nav button.active .nav-ico,
.mobile-nav button.active>span{
  animation:flowActiveIconGlow 3.2s ease-in-out infinite!important;
}

/* Desktop pointer polish only: no hover jump on touch screens. */
@media(hover:hover) and (pointer:fine){
  .sidebar nav button:hover .nav-ico{
    transform:translateX(2px) scale(1.04)!important;
  }
  .stat:hover,
  .finance-stat:hover,
  .expiry-card:hover,
  .setting-card:hover,
  .release-card:hover{
    transform:translateY(-3px)!important;
    border-color:color-mix(in srgb,var(--cyan) 28%,var(--line))!important;
    box-shadow:
      inset 0 1px rgba(255,255,255,.065),
      var(--flow-shadow-lift),
      0 0 28px color-mix(in srgb,var(--cyan) 4%,transparent)!important;
  }
  .panel:hover{
    border-color:color-mix(in srgb,var(--cyan) 22%,var(--line))!important;
    box-shadow:
      inset 0 1px rgba(255,255,255,.055),
      0 20px 50px rgba(0,0,0,.21)!important;
  }
  .notify-btn:hover,
  .refresh-icon:hover,
  .theme-picker-btn:hover,
  .install-btn:hover{
    transform:translateY(-1px)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.075),0 10px 24px rgba(0,0,0,.19)!important;
  }
  .row-actions button:hover svg,
  .dir-action:hover svg,
  .wa-action:hover svg,
  .action-primary:hover svg,
  .notify-btn:hover svg,
  .refresh-icon:hover svg,
  .theme-picker-btn:hover svg{
    transform:scale(1.08)!important;
  }
  .filter-row>button:hover,
  .seg-control>button:hover,
  .row-actions button:hover,
  .dir-action:hover,
  .wa-action:hover{
    transform:translateY(-1px)!important;
  }
}

/* Press feedback works on mouse and touch without changing layout. */
.primary:active,
.secondary:active,
.row-actions button:active,
.dir-action:active,
.wa-action:active,
.notify-btn:active,
.refresh-icon:active,
.theme-picker-btn:active,
.mobile-nav button:active>span{
  transform:scale(.975)!important;
}

/* Mobile cards get premium containment but stay flat/stable. */
@media(max-width:760px){
  .panel,
  .setting-card,
  .stat,
  .finance-stat,
  .expiry-card,
  .release-card{
    border-radius:15px!important;
    box-shadow:inset 0 1px rgba(255,255,255,.04),0 9px 24px rgba(0,0,0,.15)!important;
  }
  .clients-directory tbody tr,
  .whatsapp-panel tbody tr,
  .table-panel:has(td[data-label]) tbody tr{
    border-color:color-mix(in srgb,var(--line) 88%,var(--cyan) 12%)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.035),0 8px 20px rgba(0,0,0,.14)!important;
  }
  .nav-ico,
  .stat-icon,
  .finance-stat .fi,
  .search-result .sr-icon,
  .mini-avatar,
  .mobile-nav button>span{
    box-shadow:inset 0 1px rgba(255,255,255,.08),0 5px 13px rgba(0,0,0,.16)!important;
  }
}

/* Respect accessibility settings and eliminate decorative movement. */
@media(prefers-reduced-motion:reduce){
  .stat,
  .finance-stat,
  .expiry-card,
  .sidebar nav button.active .nav-ico,
  .mobile-nav button.active>span{
    animation:none!important;
  }
  .nav-ico,
  .stat-icon,
  .finance-stat .fi,
  .search-result .sr-icon,
  .mini-avatar,
  .mobile-nav button>span,
  .panel,
  .setting-card,
  .stat,
  .finance-stat,
  .expiry-card,
  .release-card,
  .notify-btn,
  .refresh-icon,
  .theme-picker-btn,
  .row-actions button,
  .dir-action,
  .wa-action{
    transition:none!important;
  }
}

/* 2026-10 surface rhythm and navigation polish */

/* Header/search: cleaner glass surface and stronger focus hierarchy. */
.topbar{
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--bg) 90%,transparent),color-mix(in srgb,var(--bg) 82%,transparent))!important;
  backdrop-filter:blur(18px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.08)!important;
  box-shadow:0 1px 0 color-mix(in srgb,var(--line) 78%,transparent),0 10px 30px rgba(0,0,0,.08)!important;
}
.search.admin-search{
  position:relative!important;
  overflow:hidden!important;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease!important;
}
.search.admin-search::after{
  content:""!important;
  position:absolute!important;
  left:10px!important;
  right:10px!important;
  bottom:0!important;
  height:1px!important;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent)!important;
  transform:scaleX(0)!important;
  opacity:.8!important;
  transition:transform .22s var(--flow-ease)!important;
}
.search.admin-search:focus-within::after{transform:scaleX(1)!important}
.search.admin-search:focus-within{
  background:color-mix(in srgb,var(--panel2) 94%,var(--cyan) 6%)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--cyan) 8%,transparent),0 10px 26px rgba(0,0,0,.12)!important;
}

/* Dropdowns: consistent floating surfaces. */
.global-search-results,
.notification-dropdown,
.theme-picker-menu{
  border-color:color-mix(in srgb,var(--line) 82%,var(--cyan) 18%)!important;
  box-shadow:0 28px 74px rgba(0,0,0,.32),inset 0 1px rgba(255,255,255,.055)!important;
  animation:flowSurfaceDrop .2s var(--flow-ease) both!important;
}
@keyframes flowSurfaceDrop{
  from{opacity:0;transform:translateY(-5px) scale(.992)}
  to{opacity:1;transform:none}
}
.theme-picker-menu button[aria-checked="true"]::after{
  content:"✓"!important;
  margin-left:auto!important;
  color:var(--cyan)!important;
  font-size:10px!important;
  font-weight:950!important;
}

/* Data tables: rows feel interactive without becoming noisy. */
.table-wrap tbody tr{
  transition:background .18s ease,box-shadow .18s ease,transform .18s var(--flow-ease)!important;
}
.table-wrap td{
  transition:border-color .18s ease,color .18s ease!important;
}
@media(hover:hover) and (pointer:fine) and (min-width:761px){
  .table-wrap tbody tr:hover{
    background:
      linear-gradient(90deg,color-mix(in srgb,var(--cyan) 5%,transparent),transparent 46%)!important;
    box-shadow:inset 3px 0 color-mix(in srgb,var(--cyan) 46%,transparent)!important;
  }
  .table-wrap tbody tr:hover td{
    color:var(--text)!important;
    border-bottom-color:color-mix(in srgb,var(--line) 78%,var(--cyan) 22%)!important;
  }
}
.table-wrap tbody tr:focus-within{
  background:color-mix(in srgb,var(--cyan) 5%,transparent)!important;
  box-shadow:inset 3px 0 color-mix(in srgb,var(--cyan) 48%,transparent)!important;
}

/* Modal/results: stronger nested boxes and calmer spacing. */
.modal{
  border-color:color-mix(in srgb,var(--line) 74%,var(--cyan) 26%)!important;
  box-shadow:0 38px 110px rgba(0,0,0,.46),inset 0 1px rgba(255,255,255,.055)!important;
}
.modal h2{line-height:1.2!important}
.result-box,
.package-preview,
.notice-preview,
.created-hero{
  border-radius:14px!important;
  border-color:color-mix(in srgb,var(--line) 82%,var(--cyan) 18%)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.04),0 9px 24px rgba(0,0,0,.10)!important;
}
.modal-backdrop:not(.hidden) .result-box,
.modal-backdrop:not(.hidden) .package-preview,
.modal-backdrop:not(.hidden) .notice-preview,
.modal-backdrop:not(.hidden) .created-hero{
  animation:flowNestedRise .28s var(--flow-ease) both!important;
}
@keyframes flowNestedRise{
  from{opacity:0;transform:translateY(5px)}
  to{opacity:1;transform:none}
}

/* Empty states get a soft breathing focal point. */
.empty::before,
.notification-empty>span{
  animation:flowEmptyPulse 3.6s ease-in-out infinite!important;
}
@keyframes flowEmptyPulse{
  0%,100%{transform:scale(1);box-shadow:0 8px 24px color-mix(in srgb,var(--cyan) 4%,transparent)}
  50%{transform:scale(1.035);box-shadow:0 10px 30px color-mix(in srgb,var(--cyan) 10%,transparent)}
}

/* Mobile bottom navigation: premium dock treatment, same geometry. */
@media(max-width:760px){
  .mobile-nav{
    background:color-mix(in srgb,var(--bg) 88%,transparent)!important;
    backdrop-filter:blur(20px) saturate(1.12)!important;
    -webkit-backdrop-filter:blur(20px) saturate(1.12)!important;
    border-top-color:color-mix(in srgb,var(--line) 76%,var(--cyan) 24%)!important;
    box-shadow:0 -10px 34px rgba(0,0,0,.18),inset 0 1px rgba(255,255,255,.04)!important;
  }
  .mobile-nav button{
    position:relative!important;
    transition:color .18s ease!important;
  }
  .mobile-nav button::before{
    content:""!important;
    position:absolute!important;
    left:12px!important;
    right:12px!important;
    top:4px!important;
    bottom:4px!important;
    border-radius:13px!important;
    background:color-mix(in srgb,var(--cyan) 7%,transparent)!important;
    opacity:0!important;
    transform:scale(.88)!important;
    transition:opacity .2s ease,transform .2s var(--flow-ease)!important;
    pointer-events:none!important;
  }
  .mobile-nav button.active::before{
    opacity:1!important;
    transform:scale(1)!important;
  }
  .mobile-nav button>span,
  .mobile-nav button>small{
    position:relative!important;
    z-index:1!important;
  }
  .global-search-results,
  .notification-dropdown,
  .theme-picker-menu{
    border-radius:16px!important;
  }
}

/* Keep animations decorative and accessible. */
@media(prefers-reduced-motion:reduce){
  .global-search-results,
  .notification-dropdown,
  .theme-picker-menu,
  .modal-backdrop:not(.hidden) .result-box,
  .modal-backdrop:not(.hidden) .package-preview,
  .modal-backdrop:not(.hidden) .notice-preview,
  .modal-backdrop:not(.hidden) .created-hero,
  .empty::before,
  .notification-empty>span{
    animation:none!important;
  }
  .search.admin-search::after,
  .table-wrap tbody tr,
  .table-wrap td,
  .mobile-nav button::before{
    transition:none!important;
  }
}

/* 2026-10 deep state and feedback unification */

/* Replace text glyphs with the same stroked SVG language used everywhere else. */
.notification-empty .empty-state-icon svg,
.created-hero .ok svg{
  width:18px!important;
  height:18px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2.1!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  vector-effect:non-scaling-stroke!important;
}
.created-hero .ok{
  display:grid!important;
  place-items:center!important;
  box-shadow:inset 0 1px rgba(255,255,255,.10),0 10px 28px color-mix(in srgb,var(--green) 13%,transparent)!important;
}
.op-status{
  display:inline-flex!important;
  align-items:center!important;
  gap:6px!important;
  text-transform:capitalize!important;
}
.op-status::before{
  content:""!important;
  width:6px!important;
  height:6px!important;
  flex:0 0 6px!important;
  border-radius:50%!important;
  background:currentColor!important;
  box-shadow:0 0 0 3px color-mix(in srgb,currentColor 10%,transparent)!important;
}

/* Feedback states: toast, loading, disabled and keyboard focus now follow one system. */
.toast{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  border-radius:13px!important;
}
.toast::before{
  content:""!important;
  width:8px!important;
  height:8px!important;
  flex:0 0 8px!important;
  border-radius:50%!important;
  background:currentColor!important;
  box-shadow:0 0 0 4px color-mix(in srgb,currentColor 9%,transparent)!important;
}
.health-loading{
  position:relative!important;
  overflow:hidden!important;
  min-height:72px!important;
  border:1px solid color-mix(in srgb,var(--line) 84%,var(--cyan) 16%)!important;
  border-radius:14px!important;
  background:color-mix(in srgb,var(--panel2) 78%,transparent)!important;
}
.health-loading::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:linear-gradient(100deg,transparent 24%,rgba(255,255,255,.055) 46%,transparent 68%)!important;
  transform:translateX(-100%)!important;
  animation:flowLoadingSweep 1.55s ease-in-out infinite!important;
}
@keyframes flowLoadingSweep{to{transform:translateX(100%)}}

button:disabled,
input:disabled,
select:disabled,
textarea:disabled{
  opacity:.52!important;
  cursor:not-allowed!important;
  filter:saturate(.65)!important;
  box-shadow:none!important;
}
button:disabled:active,
button:disabled:hover{
  transform:none!important;
}
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
button:focus-visible,
a:focus-visible{
  outline:2px solid color-mix(in srgb,var(--cyan) 78%,white 22%)!important;
  outline-offset:2px!important;
}

/* Long values and dense controls stay contained at every width. */
.client-cell,
.directory-actions,
.row-actions,
.whatsapp-row-actions,
.section-actions,
.notification-actions{
  min-width:0!important;
}
.client-cell>div,
.client-cell b,
.client-cell small,
.metric-row span,
.metric-row b,
.notification-item p,
.setting-card p{
  min-width:0!important;
  overflow-wrap:anywhere!important;
}
.row-actions button,
.dir-action,
.wa-action,
.section-actions button{
  text-wrap:balance!important;
}

/* Mobile filter/control strips feel deliberate rather than clipped. */
@media(max-width:760px){
  .filter-row,
  .seg-control,
  .whatsapp-filters{
    scroll-snap-type:x proximity!important;
    overscroll-behavior-x:contain!important;
  }
  .filter-row>button,
  .seg-control>button,
  .whatsapp-filters>button{
    scroll-snap-align:start!important;
    flex:0 0 auto!important;
  }
  .toast{
    min-height:46px!important;
  }
}

/* Decorative motion remains optional. */
@media(prefers-reduced-motion:reduce){
  .health-loading::after{animation:none!important}
}

/* 2026-10 dashboard audit hardening */
.notice-admin-copy> b{display:flex!important;align-items:center!important;gap:6px!important;min-width:0!important}
.notice-pin{width:18px!important;height:18px!important;flex:0 0 18px!important;display:inline-grid!important;place-items:center!important;border:1px solid color-mix(in srgb,var(--amber) 26%,var(--line))!important;border-radius:6px!important;background:color-mix(in srgb,var(--amber) 7%,var(--panel2))!important;color:var(--amber)!important}
.notice-pin svg{width:11px!important;height:11px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.9!important;stroke-linecap:round!important;stroke-linejoin:round!important;vector-effect:non-scaling-stroke!important}
/* 2026-10 mobile nav active-state deconflict */
@media(max-width:760px){
  .mobile-nav>button.active:after{display:none!important}
  .mobile-nav button.active>span{animation:none!important}
}
/* 2026-10 repeat-render animation guard */
body.dashboard-settled .stat,
body.dashboard-settled .finance-stat,
body.dashboard-settled .expiry-card{
  animation:none!important;
}

/* THE FLOW Reports Command Center — THE ADMIN report parity */
.reports-content{display:none;flex-direction:column;gap:18px}
.reports-content.active{display:flex!important}
.report-hero{position:relative;overflow:hidden;display:flex;align-items:flex-end;justify-content:space-between;gap:22px;padding:24px;border:1px solid color-mix(in srgb,var(--cyan) 18%,var(--line));border-radius:24px;background:linear-gradient(118deg,#061627,#0b3d5b 50%,#28245f);box-shadow:0 22px 70px rgba(0,0,0,.2);color:#f8fbff}
.report-hero:before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-68px;top:-145px;background:radial-gradient(circle,rgba(69,215,255,.35),transparent 68%);pointer-events:none}
.report-hero:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:190px;bottom:-170px;background:radial-gradient(circle,rgba(138,125,255,.32),transparent 70%);pointer-events:none}
.report-hero-copy,.report-export-actions{position:relative;z-index:1}.report-hero-copy h2{margin:7px 0 7px;font-size:clamp(25px,3vw,38px);line-height:1.02;letter-spacing:-.045em}.report-hero-copy p{max-width:760px;margin:0;color:#a9c3d5}
.report-hero-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.report-hero-chips span{padding:6px 9px;border:1px solid rgba(151,211,247,.16);border-radius:999px;background:rgba(3,18,32,.34);color:#c5deee;font-size:10px;font-weight:750}
.report-export-actions{display:flex;gap:10px;flex-wrap:wrap}.report-export-actions button,.report-filter-actions button{min-height:42px;border:1px solid var(--line);border-radius:12px;padding:0 15px;background:color-mix(in srgb,var(--panel2) 88%,var(--bg));color:var(--text);font-weight:800;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:7px}.report-export-actions button svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.report-export-actions button:disabled{opacity:.42;cursor:not-allowed}.report-export-actions .primary{background:linear-gradient(135deg,var(--blue),color-mix(in srgb,var(--blue) 55%,#704dff));color:#fff;border-color:transparent}
.report-filter-panel{overflow:visible}.report-filter-grid{display:grid;grid-template-columns:repeat(5,minmax(145px,1fr));gap:12px;margin-top:16px}.report-filter-grid label{display:flex;flex-direction:column;gap:7px;color:var(--muted);font-size:10px;font-weight:800}.report-filter-grid input,.report-filter-grid select{width:100%;min-height:42px;border:1px solid var(--line);border-radius:11px;background:color-mix(in srgb,var(--panel2) 94%,var(--bg));color:var(--text);padding:0 12px;outline:none}.report-filter-grid input:focus,.report-filter-grid select:focus{border-color:color-mix(in srgb,var(--cyan) 65%,var(--line));box-shadow:0 0 0 3px color-mix(in srgb,var(--cyan) 9%,transparent)}.report-search{grid-column:span 2}.report-filter-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px}.report-notice{font-size:10px;color:var(--cyan);font-weight:800}
.report-kpis{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr));gap:12px}.report-kpis article{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:18px;padding:17px;background:linear-gradient(145deg,color-mix(in srgb,var(--panel) 97%,transparent),color-mix(in srgb,var(--panel2) 92%,transparent));box-shadow:var(--shadow-md)}.report-kpis article:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-32px;top:-36px;background:radial-gradient(circle,color-mix(in srgb,var(--cyan) 17%,transparent),transparent 68%)}.report-kpis small{display:block;color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-size:8px}.report-kpis b{display:block;margin-top:7px;font-size:20px;line-height:1.15}.report-kpis span{display:block;margin-top:6px;color:var(--muted);font-size:9px}.report-kpi-icon{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;margin-bottom:13px;background:linear-gradient(145deg,color-mix(in srgb,var(--cyan) 16%,transparent),color-mix(in srgb,var(--blue) 12%,transparent));border:1px solid color-mix(in srgb,var(--cyan) 18%,var(--line));color:var(--cyan)}.report-kpi-icon svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.report-visual-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(280px,.45fr);gap:14px}.report-trend-card,.report-health-card{min-height:330px}.report-chart-legend{display:flex;gap:10px;flex-wrap:wrap;color:var(--muted);font-size:9px}.report-chart-legend span{display:flex;align-items:center;gap:5px}.report-chart-legend i{width:8px;height:8px;border-radius:3px}.report-chart-legend .revenue{background:#45d7ff}.report-chart-legend .profit{background:#32e6a1}
.report-trend-stage{position:relative;height:240px;margin-top:14px;padding:8px 6px 0}.report-trend-grid{position:absolute;inset:8px 6px 39px;display:flex;flex-direction:column;justify-content:space-between;pointer-events:none}.report-trend-grid i{display:block;border-top:1px dashed color-mix(in srgb,var(--muted) 15%,transparent)}.report-trend-bars{position:relative;height:100%;display:flex;align-items:flex-end;gap:8px}.report-trend-col{height:100%;min-width:0;flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center}.report-trend-pair{height:184px;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:3px}.report-trend-pair>i{display:block;width:28%;min-width:7px;max-width:24px;border-radius:7px 7px 2px 2px;transition:.22s ease}.trend-revenue{background:linear-gradient(180deg,#57ddff,#158db8);box-shadow:0 8px 18px rgba(69,215,255,.12)}.trend-profit{background:linear-gradient(180deg,#4cebb0,#169d6f);box-shadow:0 8px 18px rgba(50,230,161,.1)}.report-trend-col>b{margin-top:7px;font-size:8px;color:var(--text)}.report-trend-col>small{margin-top:3px;color:var(--muted);font-size:7px}.report-chart-empty{width:100%;align-self:center;text-align:center;color:var(--muted);font-size:11px}
.report-donut-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:22px}.report-donut-wrap{position:relative;display:grid;place-items:center;min-width:0}.report-donut{position:relative;width:108px;height:108px;max-width:100%;aspect-ratio:1;border-radius:50%;display:grid;place-items:center;filter:drop-shadow(0 13px 24px rgba(0,0,0,.15))}.report-donut i{position:absolute;inset:9px;border-radius:50%;background:var(--panel);border:1px solid var(--line)}.report-donut-wrap>b{position:absolute;top:41px;font-size:16px;z-index:2}.report-donut-wrap>small{display:block;margin-top:8px;color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.06em}.report-health-lines{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:20px}.report-health-lines div{padding:12px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel2) 60%,transparent)}.report-health-lines span{display:block;color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.06em}.report-health-lines b{display:block;margin-top:5px;font-size:11px}.report-status-list{display:flex;gap:6px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}.report-status-list .report-status{gap:5px}.report-status-list .report-status i{font-style:normal;font-weight:900}.report-status-list .report-status small{font-size:7px;color:var(--muted)}
.report-breakdowns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.report-mini-table{display:flex;flex-direction:column;gap:8px;margin-top:12px}.report-mini-table .report-break-row{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(120px,.85fr) minmax(90px,1fr) 86px minmax(120px,.8fr);align-items:center;gap:10px;padding:11px 12px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--panel2) 55%,transparent)}.report-break-copy{min-width:0}.report-break-copy b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.report-break-copy span,.report-break-row em{display:block;margin-top:3px;color:var(--muted);font-size:9px;font-style:normal}.report-break-track{height:7px;border-radius:999px;background:color-mix(in srgb,var(--muted) 12%,transparent);overflow:hidden}.report-break-track i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#45d7ff,#6c7dff);box-shadow:0 0 14px rgba(69,215,255,.14)}.report-break-row strong{font-size:10px}.report-empty-copy{padding:20px;text-align:center;color:var(--muted)}
.report-detail-panel{min-width:0}.report-table-wrap{overflow:auto;margin-top:12px;border:1px solid var(--line);border-radius:14px}.report-table{width:100%;min-width:1250px;border-collapse:separate;border-spacing:0}.report-table th{position:sticky;top:0;z-index:1;text-align:left;padding:11px 12px;background:color-mix(in srgb,var(--panel2) 96%,#071927);color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid var(--line)}.report-table td{padding:11px 12px;border-bottom:1px solid var(--line);font-size:10px;vertical-align:middle}.report-table tr:last-child td{border-bottom:0}.report-table td small{display:block;margin-top:3px;color:var(--muted)}.report-status{display:inline-flex;align-items:center;border-radius:999px;padding:5px 8px;background:color-mix(in srgb,var(--muted) 13%,transparent);color:var(--text);font-size:8px;text-transform:capitalize}.report-status.active,.report-status.paid{background:color-mix(in srgb,var(--green) 12%,transparent);color:var(--green)}.report-status.expired,.report-status.revoked,.report-status.suspended,.report-status.refunded{background:color-mix(in srgb,var(--red) 12%,transparent);color:var(--red)}.report-status.unused,.report-status.pending,.report-status.partial{background:color-mix(in srgb,var(--amber) 12%,transparent);color:var(--amber)}.report-empty{text-align:center!important;padding:28px!important;color:var(--muted)!important}.green-text{color:var(--green)!important}.red-text{color:var(--red)!important}
@media(max-width:1180px){.report-filter-grid{grid-template-columns:repeat(3,minmax(150px,1fr))}.report-kpis{grid-template-columns:repeat(3,minmax(150px,1fr))}.report-visual-grid{grid-template-columns:1fr}.report-health-card{min-height:0}.report-donut-grid,.report-health-lines{max-width:430px}}
@media(max-width:820px){.report-hero{align-items:stretch;flex-direction:column}.report-export-actions{width:100%}.report-export-actions button{flex:1}.report-filter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.report-search{grid-column:span 2}.report-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.report-breakdowns{grid-template-columns:1fr}.report-mini-table .report-break-row{grid-template-columns:minmax(110px,1fr) auto}.report-break-track{grid-column:1/3}.report-break-row strong,.report-break-row em{text-align:right}}
@media(max-width:600px){.report-hero{padding:19px;border-radius:19px}.report-hero-copy h2{font-size:27px}.report-export-actions{display:grid;grid-template-columns:1fr 1fr}.report-filter-grid{grid-template-columns:1fr}.report-search{grid-column:auto}.report-kpis{grid-template-columns:1fr 1fr}.report-kpis article{padding:14px}.report-kpis b{font-size:16px}.report-trend-card{min-height:300px}.report-trend-stage{height:212px;padding-left:0;padding-right:0}.report-trend-pair{height:155px;gap:2px}.report-trend-pair>i{min-width:5px}.report-trend-col>b{font-size:7px;writing-mode:vertical-rl;transform:rotate(180deg);height:35px}.report-trend-col>small{display:none}.report-donut{width:104px;height:104px}.report-donut-wrap>b{top:39px;font-size:15px}}
@media(max-width:390px){.report-export-actions{grid-template-columns:1fr}.report-kpis{grid-template-columns:1fr}.report-donut-grid,.report-health-lines{grid-template-columns:1fr}.report-donut-wrap>b{top:39px}}


/* 2026-10 mobile header plus + app-only WhatsApp launch */
@media(max-width:760px){
  .topbar{grid-template-columns:minmax(0,1fr) minmax(96px,122px) auto!important}
  .top-actions{flex-wrap:nowrap!important;white-space:nowrap!important}
  #quickAddBtn.quick-add{
    width:38px!important;min-width:38px!important;max-width:38px!important;
    height:38px!important;min-height:38px!important;padding:0!important;
    display:grid!important;place-items:center!important;border-radius:10px!important;
    font-size:0!important;line-height:1!important;
  }
  #quickAddBtn.quick-add svg,#quickAddBtn.quick-add span{display:none!important}
  #quickAddBtn.quick-add::before{
    content:"+";
    display:block;
    font-size:25px;
    line-height:1;
    font-weight:500;
    transform:translateY(-1px);
  }
}


/* 2026-10 screenshot-verified compact mobile header */
@media(max-width:760px){
  .topbar{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:9px 10px 8px!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(104px,136px)!important;
    grid-template-rows:38px 40px!important;
    column-gap:8px!important;
    row-gap:7px!important;
    align-items:center!important;
    overflow:visible!important;
  }
  .topbar>div:first-child{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
    width:auto!important;
  }
  .topbar>div:first-child p{display:none!important}
  .topbar h1,#pageTitle{
    margin:0!important;
    min-width:0!important;
    max-width:100%!important;
    font-size:16px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .dashboard-switcher,.mobile-profile-switch{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:stretch!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:38px!important;
    padding:0 8px!important;
  }
  .dashboard-switcher select{
    min-width:0!important;
    font-size:9px!important;
  }
  .top-actions{
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 38px 38px 38px!important;
    gap:6px!important;
    align-items:center!important;
    justify-content:stretch!important;
    flex:none!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  .global-search-wrap{
    display:block!important;
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:38px!important;
    margin:0!important;
  }
  .search.admin-search{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:38px!important;
    padding:0 10px!important;
  }
  .search.admin-search input{
    min-width:0!important;
    width:100%!important;
    font-size:12px!important;
    text-overflow:ellipsis!important;
  }
  #installAppBtn,
  #installAppBtn.install-btn,
  #installAppBtn.compact-header-icon,
  #refreshBtn,
  #refreshBtn.refresh-icon{
    display:none!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    height:0!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
  }
  .notification-center{
    grid-column:2!important;
    display:block!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    margin:0!important;
  }
  .top-actions #notificationCenter.notification-center{
    display:grid!important;
    place-items:center!important;
    visibility:visible!important;
    opacity:1!important;
  }
  #notificationBtn.notify-btn,
  .notify-btn{
    display:grid!important;
    place-items:center!important;
    visibility:visible!important;
    opacity:1!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    padding:0!important;
  }
  .theme-picker-wrap{
    grid-column:3!important;
    display:block!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    margin:0!important;
  }
  .theme-picker-btn.theme-cycle-btn{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    padding:0!important;
  }
  #quickAddBtn,#quickAddBtn.quick-add{
    grid-column:4!important;
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    height:38px!important;
    min-height:38px!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    align-self:center!important;
    justify-self:end!important;
    border-radius:10px!important;
    font-size:0!important;
  }
  #quickAddBtn svg,#quickAddBtn span{display:none!important}
  #quickAddBtn::before{
    content:"+"!important;
    display:block!important;
    font-size:25px!important;
    line-height:1!important;
    font-weight:500!important;
    transform:translateY(-1px)!important;
  }
  .notification-dropdown{
    top:104px!important;
    left:10px!important;
    right:10px!important;
    width:auto!important;
  }
  .global-search-results{
    position:fixed!important;
    top:104px!important;
    left:10px!important;
    right:10px!important;
    width:auto!important;
    max-width:none!important;
  }
}
@media(max-width:360px){
  .topbar{
    grid-template-columns:minmax(0,1fr) 108px!important;
    padding-left:8px!important;
    padding-right:8px!important;
    column-gap:6px!important;
  }
  .top-actions{
    grid-template-columns:minmax(0,1fr) 34px 34px 34px!important;
    gap:5px!important;
  }
  .notification-center,.notify-btn,
  .theme-picker-wrap,.theme-picker-btn.theme-cycle-btn,
  #quickAddBtn,#quickAddBtn.quick-add{
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    height:36px!important;
    min-height:36px!important;
  }
  .global-search-wrap,.search.admin-search{height:36px!important}
  .search.admin-search{padding-inline:8px!important}
  .search.admin-search input{font-size:11px!important}
}

/* 2026-10 final 320px mobile header guard */
@media(max-width:760px){
  .topbar{
    box-sizing:border-box!important;
    min-height:0!important;
    max-height:100px!important;
    padding:8px 8px!important;
    grid-template-columns:minmax(0,1fr) minmax(96px,128px)!important;
    grid-template-rows:36px 38px!important;
    column-gap:7px!important;
    row-gap:6px!important;
  }
  .dashboard-switcher,.mobile-profile-switch{
    height:36px!important;
    min-height:36px!important;
    padding-inline:7px!important;
  }
  .top-actions{
    height:38px!important;
    min-height:38px!important;
    grid-template-columns:minmax(0,1fr) 36px 36px 36px!important;
    gap:5px!important;
    align-items:center!important;
  }
  .global-search-wrap,.search.admin-search{
    height:36px!important;
    min-height:36px!important;
  }
  .notification-center,
  .theme-picker-wrap{
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    display:grid!important;
    place-items:center!important;
    align-self:center!important;
    justify-self:center!important;
    margin:0!important;
    padding:0!important;
  }
  #notificationBtn.notify-btn,
  #themePickerBtn.theme-picker-btn,
  #quickAddBtn.quick-add{
    width:36px!important;
    min-width:36px!important;
    max-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    margin:0!important;
    padding:0!important;
    align-self:center!important;
    justify-self:center!important;
    transform:none!important;
  }
  .notification-dropdown,
  .global-search-results{top:98px!important}
}
@media(max-width:360px){
  .topbar{
    grid-template-columns:minmax(0,1fr) 104px!important;
    column-gap:6px!important;
  }
  .top-actions{
    grid-template-columns:minmax(0,1fr) 34px 34px 34px!important;
    gap:4px!important;
  }
  .notification-center,.theme-picker-wrap,
  #notificationBtn.notify-btn,#themePickerBtn.theme-picker-btn,#quickAddBtn.quick-add{
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
  }
}
/* 2026-10 dashboard copy and theme refinement */
:root{--flow-radius-lg:18px;--flow-radius-md:14px;--flow-copy-max:720px}
.section-intro{align-items:flex-start!important;gap:18px!important}
.section-intro h2{letter-spacing:-.035em!important;line-height:1.02!important}
.section-intro p,.hero-strip p,.report-hero-copy p,.setting-card p{max-width:var(--flow-copy-max)!important;line-height:1.62!important}
.eyebrow,.panel-head span,.report-hero-copy>.eyebrow{letter-spacing:.12em!important;font-weight:850!important}
.panel,.setting-card,.stat,.finance-stat,.expiry-card,.report-hero,.report-panel{border-radius:var(--flow-radius-lg)!important}
.panel-head,.section-actions,.row-actions,.directory-actions{min-width:0!important}
.panel-head h3{letter-spacing:-.015em!important;line-height:1.18!important}
.table-wrap thead th{font-size:8px!important;letter-spacing:.08em!important;text-transform:uppercase!important;color:color-mix(in srgb,var(--muted) 88%,var(--text) 12%)!important}
.table-wrap tbody td{vertical-align:middle!important}
.empty{min-height:120px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;gap:7px!important;padding:24px!important;border:1px dashed color-mix(in srgb,var(--line) 78%,var(--cyan) 22%)!important;border-radius:var(--flow-radius-md)!important;background:color-mix(in srgb,var(--panel2) 72%,transparent)!important;text-align:center!important}
.empty b{color:var(--text)!important;font-size:12px!important}
.section-count,.status,.op-status,.seller-managed-note{border-radius:999px!important}
.primary,.secondary,.row-actions button,.dir-action,.wa-action,.filter-row>button,.seg-control>button{border-radius:11px!important}
.seller-account-list{display:grid!important;gap:8px!important;margin-top:12px!important}
.seller-account-item{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;min-width:0!important;padding:11px 12px!important;border:1px solid var(--line)!important;border-radius:12px!important;background:color-mix(in srgb,var(--panel2) 88%,transparent)!important}
.seller-account-item>div{min-width:0!important}
.seller-account-item b,.seller-account-item small{display:block!important;overflow-wrap:anywhere!important}
.seller-account-item small{margin-top:3px!important;color:var(--muted)!important;font-size:8px!important}
.theme-picker-menu{padding:7px!important;gap:5px!important}
.theme-picker-menu button{min-height:34px!important;border-radius:10px!important;font-weight:750!important}
.theme-settings-select{min-height:42px!important;border-radius:12px!important}
body[data-theme="flowview"] .panel,body[data-theme="flowview"] .setting-card,body[data-theme="flowview"] .stat{background:color-mix(in srgb,var(--panel) 96%,#9affc5 4%)!important}
body[data-theme="light"] .panel,body[data-theme="light"] .setting-card,body[data-theme="light"] .stat{box-shadow:0 14px 34px rgba(24,34,30,.08),inset 0 1px rgba(255,255,255,.8)!important}
body[data-theme="midnight"] .panel,body[data-theme="midnight"] .setting-card,body[data-theme="midnight"] .stat,body[data-theme="graphite"] .panel,body[data-theme="graphite"] .setting-card,body[data-theme="graphite"] .stat{border-color:color-mix(in srgb,var(--line) 88%,white 12%)!important}
body[data-theme="aurora"] .panel,body[data-theme="emerald"] .panel,body[data-theme="royal"] .panel{backdrop-filter:saturate(1.05)!important}
@media(max-width:760px){
  .section-intro{gap:12px!important}
  .section-intro p,.hero-strip p,.report-hero-copy p{line-height:1.55!important}
  .empty{min-height:105px!important;padding:20px 14px!important}
  .seller-account-item{align-items:flex-start!important;flex-direction:column!important}
  .seller-account-item button{width:100%!important}
}


/* 2026-10 no-swipe mobile data cards
   Mobile dashboard data stays inside one viewport. Dense desktop tables become
   stacked cards instead of horizontal swipe regions. */
@media(max-width:760px){
  html,body,#app,.app-shell,.main-panel,.content,.view{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow-x:hidden!important;
  }

  /* Add Client / Add Account / Seller forms: strict single-column mobile layout. */
  #modalBody,
  #modalBody .form-grid,
  #modalBody .field,
  #modalBody .field.full{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  #modalBody .form-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
  }
  #modalBody .field,
  #modalBody .field.full{
    grid-column:1!important;
    margin-top:0!important;
  }
  #modalBody input,
  #modalBody select,
  #modalBody textarea{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  #modalBody .price-profit{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    gap:8px!important;
    flex-wrap:wrap!important;
  }

  /* Standard dashboard tables become stacked cards on phones. */
  .table-panel:not(.clients-directory){
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }
  .table-panel:not(.clients-directory) .table-wrap,
  .report-table-wrap{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }
  .table-panel:not(.clients-directory) table,
  .table-panel:not(.clients-directory) tbody,
  .table-panel:not(.clients-directory) tr,
  .table-panel:not(.clients-directory) td,
  .report-table-wrap table,
  .report-table-wrap tbody,
  .report-table-wrap tr,
  .report-table-wrap td{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .table-panel:not(.clients-directory) table,
  .report-table-wrap table{
    min-width:0!important;
    table-layout:fixed!important;
  }
  .table-panel:not(.clients-directory) thead,
  .report-table-wrap thead{
    display:none!important;
  }
  .table-panel:not(.clients-directory) tbody,
  .report-table-wrap tbody{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:10px!important;
  }
  .table-panel:not(.clients-directory) tbody tr,
  .report-table-wrap tbody tr{
    margin:0!important;
    padding:13px!important;
    border:1px solid color-mix(in srgb,var(--line) 88%,var(--cyan) 12%)!important;
    border-radius:14px!important;
    background:color-mix(in srgb,var(--panel) 95%,transparent)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.035),0 8px 20px rgba(0,0,0,.14)!important;
    overflow:hidden!important;
  }
  .table-panel:not(.clients-directory) tbody td,
  .report-table-wrap tbody td{
    min-height:0!important;
    padding:8px 0!important;
    border:0!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
    word-break:break-word!important;
  }
  .table-panel:not(.clients-directory) tbody td+td,
  .report-table-wrap tbody td+td{
    border-top:1px solid color-mix(in srgb,var(--line) 65%,transparent)!important;
  }
  .table-panel:not(.clients-directory) td[data-label],
  .report-table-wrap td[data-label]{
    display:grid!important;
    grid-template-columns:minmax(82px,30%) minmax(0,1fr)!important;
    align-items:start!important;
    gap:10px!important;
  }
  .table-panel:not(.clients-directory) td[data-label]::before,
  .report-table-wrap td[data-label]::before{
    content:attr(data-label)!important;
    color:var(--muted)!important;
    font-size:8px!important;
    font-weight:900!important;
    letter-spacing:.07em!important;
    line-height:1.35!important;
    text-transform:uppercase!important;
  }
  .table-panel:not(.clients-directory) td[colspan],
  .report-table-wrap td[colspan]{
    display:block!important;
    padding:0!important;
  }
  .table-panel:not(.clients-directory) td[colspan]::before,
  .report-table-wrap td[colspan]::before{
    content:none!important;
  }
  .table-panel:not(.clients-directory) .client-cell,
  .table-panel:not(.clients-directory) .client-cell>div,
  .report-table-wrap .client-cell,
  .report-table-wrap .client-cell>div{
    min-width:0!important;
    max-width:100%!important;
  }
  .table-panel:not(.clients-directory) .row-actions,
  .report-table-wrap .row-actions{
    width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(auto-fit,minmax(105px,1fr))!important;
    gap:6px!important;
    align-items:stretch!important;
  }
  .table-panel:not(.clients-directory) .row-actions>*,
  .report-table-wrap .row-actions>*{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  .table-panel:not(.clients-directory) .row-actions .assign,
  .report-table-wrap .row-actions .assign{
    grid-column:1/-1!important;
  }

  /* No horizontal data rail on mobile. */
  .table-wrap,
  .report-table-wrap{
    overscroll-behavior-x:none!important;
    -webkit-overflow-scrolling:auto!important;
  }
}

/* 2026-10 isolated mobile dashboard scrolling
   Header/bottom navigation stay outside the scroll container.
   Only dashboard content scrolls vertically on phones. */
@media(max-width:760px){
  html,body{
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
    overflow:hidden!important;
    overscroll-behavior:none!important;
  }
  body{
    position:static!important;
    touch-action:auto!important;
  }
  #app.app-shell{
    width:100%!important;
    height:100dvh!important;
    min-height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
  }
  .main-panel{
    width:100%!important;
    height:100dvh!important;
    min-height:0!important;
    max-height:100dvh!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
  }
  .topbar{
    position:relative!important;
    top:auto!important;
    flex:0 0 auto!important;
    width:100%!important;
  }
  .content{
    flex:1 1 auto!important;
    width:100%!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-x:none!important;
    overscroll-behavior-y:contain!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-y!important;
    scroll-behavior:auto!important;
    padding-bottom:calc(88px + env(safe-area-inset-bottom))!important;
  }
  .view{
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
  }
  .view.active{
    display:block!important;
    overflow:visible!important;
  }
  .mobile-nav{
    flex:0 0 auto!important;
  }
  body.mobile-menu-open .content{
    overflow-y:hidden!important;
    touch-action:none!important;
  }
  .dashboard-switcher:not(.hidden),
  .mobile-profile-switch:not(.hidden){
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
  }
}

/* 2026-10 quiet profile dashboard switch + client scroll performance */
.profile-panel{
  display:grid!important;
  gap:9px!important;
  padding:11px!important;
  margin-top:auto!important;
  border-top:1px solid var(--line)!important;
  background:color-mix(in srgb,var(--panel2) 72%,transparent)!important;
}
.profile-identity{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-width:0!important;
}
.profile-identity>div{min-width:0!important;flex:1 1 auto!important}
.profile-identity b,.profile-identity small{
  display:block!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.profile-identity b{font-size:10px!important;color:var(--text)!important}
.profile-identity small{margin-top:2px!important;font-size:8px!important;color:var(--muted)!important}
.profile-actions{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:6px!important;
}
.profile-action{
  min-width:0!important;
  min-height:34px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  padding:0 8px!important;
  border:1px solid var(--line)!important;
  border-radius:9px!important;
  background:color-mix(in srgb,var(--panel) 82%,transparent)!important;
  color:var(--text)!important;
  font-size:8px!important;
  font-weight:800!important;
}
.profile-action svg{
  width:14px!important;
  height:14px!important;
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:1.8!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
}
.profile-action.danger{color:var(--red)!important}

.switch-target-list{
  display:grid!important;
  gap:8px!important;
  margin:16px 0!important;
}
.switch-target{
  width:100%!important;
  min-height:58px!important;
  display:grid!important;
  grid-template-columns:36px minmax(0,1fr) 18px!important;
  align-items:center!important;
  gap:10px!important;
  padding:10px 12px!important;
  border:1px solid var(--line)!important;
  border-radius:13px!important;
  background:color-mix(in srgb,var(--panel2) 90%,transparent)!important;
  color:var(--text)!important;
  text-align:left!important;
}
.switch-target>span:nth-child(2){min-width:0!important}
.switch-target b,.switch-target small{display:block!important}
.switch-target b{font-size:10px!important}
.switch-target small{margin-top:3px!important;color:var(--muted)!important;font-size:8px!important}
.switch-target-icon{
  width:34px!important;height:34px!important;display:grid!important;place-items:center!important;
  border:1px solid color-mix(in srgb,var(--cyan) 24%,var(--line))!important;
  border-radius:10px!important;background:color-mix(in srgb,var(--cyan) 7%,var(--panel2))!important;color:var(--cyan)!important;
}
.switch-target-icon svg,.switch-chevron{
  width:16px!important;height:16px!important;fill:none!important;stroke:currentColor!important;stroke-width:1.8!important;stroke-linecap:round!important;stroke-linejoin:round!important;
}
.switch-chevron{color:var(--muted)!important}

.mobile-profile-card{display:none}

@media(max-width:760px){
  /* Header is now quiet: no dashboard-switch select in the top bar. */
  .topbar{
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:36px 38px!important;
  }
  .topbar>div:first-child{
    grid-column:1/-1!important;
    grid-row:1!important;
  }
  .top-actions{
    grid-column:1/-1!important;
    grid-row:2!important;
  }

  /* Avoid expensive live blur repaint while long client lists are moving. */
  .topbar,.mobile-nav{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    background:color-mix(in srgb,var(--bg) 98%,var(--panel2) 2%)!important;
  }

  .mobile-profile-card{
    display:grid!important;
    gap:9px!important;
    margin-top:10px!important;
    padding:11px!important;
    border:1px solid var(--line)!important;
    border-radius:13px!important;
    background:color-mix(in srgb,var(--panel) 92%,transparent)!important;
  }
  .mobile-profile-identity{
    display:flex!important;align-items:center!important;gap:9px!important;min-width:0!important;
  }
  .mobile-profile-identity>div{min-width:0!important;flex:1 1 auto!important}
  .mobile-profile-identity b,.mobile-profile-identity small{
    display:block!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  }
  .mobile-profile-identity b{font-size:10px!important}
  .mobile-profile-identity small{margin-top:2px!important;color:var(--muted)!important;font-size:8px!important}
  .mobile-profile-actions{
    display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important;
  }
  .mobile-profile-actions button{
    min-height:38px!important;border:1px solid var(--line)!important;border-radius:10px!important;
    background:color-mix(in srgb,var(--panel2) 88%,transparent)!important;color:var(--text)!important;font-size:8px!important;font-weight:850!important;
  }
  .mobile-profile-actions button.danger{color:var(--red)!important}

  /* Clients: one vertical gesture owner. No nested horizontal scroller or snap. */
  .clients-directory,
  .clients-directory .table-wrap,
  .clients-directory table,
  .clients-directory tbody,
  .clients-directory tr,
  .clients-directory td{
    touch-action:pan-y!important;
    overscroll-behavior-x:none!important;
  }
  .clients-directory .table-wrap{
    overflow:visible!important;
    -webkit-overflow-scrolling:auto!important;
    overscroll-behavior:auto!important;
  }
  .clients-directory .filter-row{
    scroll-snap-type:none!important;
    overscroll-behavior:auto!important;
    touch-action:pan-x pan-y!important;
  }
  .clients-directory tbody tr{
    content-visibility:auto!important;
    contain-intrinsic-size:250px!important;
    contain:layout paint style!important;
    animation:none!important;
    transition:none!important;
    transform:none!important;
    box-shadow:0 1px 0 color-mix(in srgb,var(--line) 70%,transparent)!important;
  }
  .clients-directory tbody td,
  .clients-directory .client-cell,
  .clients-directory .directory-actions,
  .clients-directory .directory-wa,
  .clients-directory .dir-action{
    transition:none!important;
    transform:none!important;
    will-change:auto!important;
  }
  .clients-directory .directory-wa,
  .clients-directory .dir-action{
    touch-action:pan-y!important;
  }
  .clients-directory .panel,
  .clients-directory{
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
  }

  /* Keep dashboard content as the only vertical scroll surface. */
  .content{
    overscroll-behavior-y:auto!important;
    scroll-snap-type:none!important;
  }
}

/* v1.6.60 accessibility and responsive finish
   Presentation-only polish: no auth, persistence, licensing or client behavior changes. */
:root{
  --flow-focus-ring:color-mix(in srgb,var(--cyan) 72%,white 28%);
  --flow-focus-shadow:0 0 0 3px color-mix(in srgb,var(--cyan) 18%,transparent);
}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
button,input,select,textarea{font:inherit}
button,[role="button"],a,input,select,textarea{-webkit-tap-highlight-color:transparent}
button:focus-visible,[role="button"]:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--flow-focus-ring)!important;
  outline-offset:2px!important;
  box-shadow:var(--flow-focus-shadow)!important;
}
button:disabled,input:disabled,select:disabled,textarea:disabled{
  opacity:.52!important;cursor:not-allowed!important;filter:saturate(.72)
}
.section-intro h1,.section-intro h2,.panel-head h2,.panel-head h3,.modal h2,.modal h3{text-wrap:balance}
.section-intro p,.panel-head p,.panel-head small,.field small,.setting-card p,.empty-state p{overflow-wrap:anywhere}
.panel-head{min-width:0;gap:12px}.panel-head>div,.panel-head>section{min-width:0}.panel-head h2,.panel-head h3{line-height:1.24}
.money,code,.mono,[data-mono]{font-variant-numeric:tabular-nums}
.empty-state,.empty-mini,.search-empty,.notification-empty{border-radius:14px}
.empty-state{
  min-height:150px;display:grid;place-items:center;align-content:center;gap:6px;padding:28px 18px;
  border:1px dashed color-mix(in srgb,var(--line) 82%,var(--cyan) 18%);
  background:color-mix(in srgb,var(--panel) 94%,transparent);text-align:center
}
.empty-state-icon{
  width:42px!important;height:42px!important;border-radius:12px!important;display:grid!important;place-items:center!important;
  background:color-mix(in srgb,var(--cyan) 8%,var(--panel2))!important;
  border:1px solid color-mix(in srgb,var(--cyan) 22%,var(--line))!important;color:var(--cyan)!important
}
.empty-state-icon svg{width:19px!important;height:19px!important}
.empty-state h3,.empty-state b{margin:0;color:var(--text)}
.empty-state p,.empty-state small{max-width:520px;margin:0;color:var(--muted);line-height:1.55}
.modal-backdrop{
  padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));
  overscroll-behavior:contain
}
.modal{
  width:min(720px,100%);max-height:calc(100dvh - max(32px,env(safe-area-inset-top) + env(safe-area-inset-bottom)));
  overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable
}
.modal>.close,.icon-close{touch-action:manipulation}.modal-actions{gap:8px}
.table-wrap,.report-table-wrap{scrollbar-gutter:stable both-edges}
.table-wrap td code,.report-table-wrap td code,.result-box,.package-preview,.client-cell b,.client-cell small{overflow-wrap:anywhere;word-break:break-word}
.filter-row,.segmented,.tabs{scrollbar-width:thin}
.theme-picker-menu,.global-search-results,.notification-dropdown,.switch-target-list{overscroll-behavior:contain}
.theme-choice,.search-result,.notification-item,.switch-target{contain:layout paint}
.profile-action,.switch-target,.theme-choice,.search-result,.notification-head-actions button{touch-action:manipulation}
.toast,[role="status"]{max-width:min(460px,calc(100vw - 24px));overflow-wrap:anywhere}
@media(hover:hover) and (pointer:fine){.theme-choice:hover,.switch-target:hover,.search-result:hover{transform:translateY(-1px)}}
@media(hover:none){
  .panel:hover,.setting-card:hover,.stat:hover,.finance-stat:hover,.theme-choice:hover,.switch-target:hover,.search-result:hover{transform:none!important}
}
@media(max-width:1100px) and (min-width:761px){
  .content{padding-inline:18px!important}
  .finance-stats,.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .analytics-visuals,.notice-composer{grid-template-columns:minmax(0,1fr)!important}
  .modal{width:min(680px,calc(100vw - 40px))}
}
@media(max-width:760px){
  .content{scroll-padding-top:10px;scroll-padding-bottom:calc(96px + env(safe-area-inset-bottom))}
  .section-intro{min-width:0!important;gap:8px!important}
  .section-intro h2{font-size:clamp(22px,7vw,29px)!important;line-height:1.08!important}
  .section-intro p{max-width:100%!important;font-size:10px!important;line-height:1.55!important}
  .panel-head{min-width:0!important;align-items:flex-start!important}.panel-head>div,.panel-head>section{min-width:0!important}
  .modal-backdrop{
    align-items:flex-end!important;
    padding:max(10px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) max(8px,env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left))!important
  }
  .modal{
    width:100%!important;max-width:100%!important;max-height:calc(100dvh - max(18px,env(safe-area-inset-top)))!important;
    border-radius:18px 18px 14px 14px!important;padding-bottom:max(16px,env(safe-area-inset-bottom))!important
  }
  .modal>.close,.icon-close{min-width:40px!important;min-height:40px!important}
  .modal-actions{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(118px,1fr))!important;width:100%!important}
  .modal-actions>button,.modal-actions>a,.wa-action,.profile-action,.switch-target,.theme-choice,.notification-head-actions button{min-height:40px!important}
  .field label{font-size:9px!important;line-height:1.35!important}
  .field input,.field select,.field textarea{min-height:42px!important}
  .empty-state{min-height:132px;padding:22px 14px}.empty-state p,.empty-state small{font-size:9px}
}
@media(max-width:430px){
  .modal-actions{grid-template-columns:minmax(0,1fr)!important}
  .theme-picker-menu,.global-search-results,.notification-dropdown{max-width:calc(100vw - 16px)!important}
  .toast,[role="status"]{left:8px!important;right:8px!important;width:auto!important;max-width:none!important}
}
@media(prefers-contrast:more){
  .panel,.setting-card,.stat,.finance-stat,.modal,.theme-choice,.search-result,.notification-item,.switch-target{
    border-color:color-mix(in srgb,var(--line) 55%,var(--text) 45%)!important
  }
  .muted,small,.field label{color:color-mix(in srgb,var(--muted) 70%,var(--text) 30%)!important}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
}


/* 2026-10 mobile density refinement: switch, client form/cards, pricing, icons */
.header-switch-btn{display:none}
@media(max-width:760px){
  /* Five compact header controls: search + switch + bell + theme + add. */
  .topbar{
    min-height:0!important;
    max-height:none!important;
    padding:9px 8px!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:36px 40px!important;
    row-gap:7px!important;
  }
  .topbar>div:first-child{
    grid-column:1/-1!important;
    grid-row:1!important;
    min-width:0!important;
  }
  .top-actions{
    grid-column:1/-1!important;
    grid-row:2!important;
    width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) repeat(4,38px)!important;
    gap:6px!important;
    align-items:center!important;
    margin:0!important;
  }
  .top-actions:not(:has(#mobileHeaderSwitchBtn:not(.hidden))){
    grid-template-columns:minmax(0,1fr) repeat(3,38px)!important;
  }
  .global-search-wrap{
    display:block!important;
    grid-column:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:38px!important;
    margin:0!important;
  }
  .search.admin-search{
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    padding:0 10px!important;
    border-radius:11px!important;
  }
  .search.admin-search input{
    min-width:0!important;
    font-size:11px!important;
    text-overflow:ellipsis!important;
  }
  .header-switch-btn:not(.hidden),
  #notificationBtn.notify-btn,
  #themePickerBtn.theme-picker-btn,
  #quickAddBtn.quick-add{
    width:38px!important;
    min-width:38px!important;
    max-width:38px!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    margin:0!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    align-self:center!important;
    justify-self:center!important;
    border:1px solid color-mix(in srgb,var(--line) 86%,var(--cyan) 14%)!important;
    border-radius:11px!important;
    background:color-mix(in srgb,var(--panel2) 94%,transparent)!important;
    color:var(--text)!important;
    box-shadow:inset 0 1px rgba(255,255,255,.045),0 5px 14px rgba(0,0,0,.12)!important;
  }
  .header-switch-btn svg,
  #notificationBtn svg,
  #themePickerBtn svg,
  #quickAddBtn svg{
    display:block!important;
    width:18px!important;
    height:18px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.9!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
  }
  .header-switch-btn{color:var(--cyan)!important}
  #themePickerBtn{color:var(--green)!important}
  #quickAddBtn{color:var(--text)!important;background:color-mix(in srgb,var(--text) 94%,var(--panel))!important}
  body[data-theme="light"] #quickAddBtn{color:#fff!important;background:#18323f!important}
  #quickAddBtn span{display:none!important}
  #quickAddBtn::before{display:none!important;content:none!important}
  .notification-center,.theme-picker-wrap{
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    margin:0!important;
    display:grid!important;
    place-items:center!important;
  }

  /* Client create/edit modal is a real mobile sheet above bottom navigation. */
  #modal{
    z-index:1200!important;
  }
  body:has(#modal:not(.hidden)) .mobile-nav{
    opacity:0!important;
    pointer-events:none!important;
    transform:translateY(100%)!important;
  }
  #modal[data-modal-kind="client"]{
    padding:6px!important;
    align-items:flex-end!important;
  }
  #modal[data-modal-kind="client"] .modal{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 12px)!important;
    margin:0!important;
    padding:48px 13px 12px!important;
    border-radius:18px 18px 12px 12px!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain!important;
    scrollbar-gutter:auto!important;
  }
  #modal[data-modal-kind="client"] #modalBody>h2{
    margin:0 0 5px!important;
    font-size:22px!important;
  }
  #modal[data-modal-kind="client"] #modalBody>p{
    margin:0 0 12px!important;
    font-size:9px!important;
    line-height:1.5!important;
    color:var(--muted)!important;
  }
  #modal[data-modal-kind="client"] .form-grid{
    width:100%!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:9px!important;
  }
  #modal[data-modal-kind="client"] .field{
    min-width:0!important;
    margin:0!important;
  }
  #modal[data-modal-kind="client"] .field:has(#cUser),
  #modal[data-modal-kind="client"] .field:has(#cEmail),
  #modal[data-modal-kind="client"] .field:has(#cWhatsApp),
  #modal[data-modal-kind="client"] .field:has(#cPass),
  #modal[data-modal-kind="client"] .field:has(#cName),
  #modal[data-modal-kind="client"] .field:has(#cSeller),
  #modal[data-modal-kind="client"] .field:has(#cAccount),
  #modal[data-modal-kind="client"] .field.full{
    grid-column:1/-1!important;
  }
  #modal[data-modal-kind="client"] .field label{
    margin-bottom:5px!important;
    font-size:8px!important;
    letter-spacing:.055em!important;
  }
  #modal[data-modal-kind="client"] input,
  #modal[data-modal-kind="client"] select{
    width:100%!important;
    min-width:0!important;
    min-height:42px!important;
    height:42px!important;
    padding-inline:11px!important;
    font-size:12px!important;
    border-radius:11px!important;
  }
  #modal[data-modal-kind="client"] .field small{
    margin-top:4px!important;
    font-size:7.5px!important;
    line-height:1.4!important;
  }
  #modal[data-modal-kind="client"] .price-profit{
    min-height:48px!important;
    padding:9px 11px!important;
    border-radius:11px!important;
  }
  #modal[data-modal-kind="client"] .price-profit span{font-size:8px!important}
  #modal[data-modal-kind="client"] .price-profit b{font-size:16px!important}
  #modal[data-modal-kind="client"] .modal-actions{
    position:sticky!important;
    bottom:-1px!important;
    z-index:3!important;
    grid-template-columns:1fr 1.35fr!important;
    gap:7px!important;
    margin:12px -3px -3px!important;
    padding:9px 3px 3px!important;
    background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--bg) 94%,var(--panel) 6%) 24%)!important;
  }
  #modal[data-modal-kind="client"] .modal-actions button{
    min-height:43px!important;
    border-radius:11px!important;
  }

  /* Client directory: compact responsive cards instead of one tall field per row. */
  .clients-directory tbody{
    gap:8px!important;
  }
  .clients-directory tbody tr{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:auto auto auto auto!important;
    column-gap:10px!important;
    row-gap:8px!important;
    padding:12px!important;
    border-radius:14px!important;
    contain-intrinsic-size:190px!important;
  }
  .clients-directory tbody td{
    width:auto!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0!important;
    border:0!important;
  }
  .clients-directory tbody td+td{border-top:0!important}
  .clients-directory tbody td:nth-child(1){grid-column:1;grid-row:1}
  .clients-directory tbody td:nth-child(5){grid-column:2;grid-row:1;justify-self:end;align-self:center}
  .clients-directory tbody td:nth-child(2){grid-column:1/-1;grid-row:2}
  .clients-directory tbody td:nth-child(3){grid-column:1;grid-row:3}
  .clients-directory tbody td:nth-child(4){grid-column:2;grid-row:3}
  .clients-directory tbody td:nth-child(6){grid-column:1/-1;grid-row:4}
  .clients-directory tbody td:nth-child(3),
  .clients-directory tbody td:nth-child(4){
    min-height:46px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    padding:7px 9px!important;
    border:1px solid color-mix(in srgb,var(--line) 88%,var(--cyan) 12%)!important;
    border-radius:10px!important;
    background:color-mix(in srgb,var(--panel2) 88%,transparent)!important;
    color:var(--text)!important;
    font-size:9px!important;
  }
  .clients-directory tbody td:nth-child(3)::before{
    content:"Purchase";
  }
  .clients-directory tbody td:nth-child(4)::before{
    content:"Expiry";
  }
  .clients-directory tbody td:nth-child(3)::before,
  .clients-directory tbody td:nth-child(4)::before{
    margin-bottom:3px!important;
    color:var(--muted)!important;
    font-size:7px!important;
    font-weight:850!important;
    letter-spacing:.06em!important;
    text-transform:uppercase!important;
  }
  .clients-directory .client-cell{
    gap:9px!important;
    min-height:42px!important;
  }
  .clients-directory .mini-avatar{
    width:38px!important;
    height:38px!important;
    flex-basis:38px!important;
  }
  .clients-directory .client-cell b{font-size:10px!important}
  .clients-directory .client-cell small{font-size:7.5px!important}
  .clients-directory .directory-wa{
    min-height:40px!important;
    padding:6px 9px!important;
    border-radius:10px!important;
  }
  .clients-directory .directory-wa>span:last-child{font-size:9px!important}
  .clients-directory .directory-wa small{font-size:7.5px!important}
  .clients-directory .status{
    padding:5px 8px!important;
    font-size:7.5px!important;
  }
  .clients-directory .directory-actions{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .clients-directory .dir-action{
    height:35px!important;
    min-height:35px!important;
    padding:0 5px!important;
    border-radius:9px!important;
    font-size:8px!important;
  }

  /* Pricing: keep only the four numbers that matter on mobile. */
  [data-view="pricing"] .finance-stats{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  [data-view="pricing"] .finance-stat{
    min-height:122px!important;
    padding:13px!important;
    border-radius:14px!important;
    background:color-mix(in srgb,var(--panel) 96%,transparent)!important;
  }
  [data-view="pricing"] .finance-stat:nth-child(1),
  [data-view="pricing"] .finance-stat:nth-child(3),
  [data-view="pricing"] .finance-stat:nth-child(7),
  [data-view="pricing"] .finance-stat:nth-child(8){
    display:none!important;
  }
  [data-view="pricing"] .finance-stat:nth-child(2){order:1}
  [data-view="pricing"] .finance-stat:nth-child(5){order:2}
  [data-view="pricing"] .finance-stat:nth-child(6){order:3}
  [data-view="pricing"] .finance-stat:nth-child(4){order:4}
  [data-view="pricing"] .finance-stat .fi{
    width:34px!important;
    height:34px!important;
    border-radius:10px!important;
    box-shadow:none!important;
  }
  [data-view="pricing"] .finance-stat .fi svg{
    width:17px!important;
    height:17px!important;
    stroke-width:1.85!important;
  }
  [data-view="pricing"] .finance-stat small{
    margin-top:9px!important;
    font-size:7.5px!important;
    letter-spacing:.07em!important;
  }
  [data-view="pricing"] .finance-stat b{
    margin-top:4px!important;
    font-size:24px!important;
    line-height:1!important;
  }
  [data-view="pricing"] .finance-stat p{
    margin-top:6px!important;
    font-size:8px!important;
  }
  [data-view="pricing"] .analytics-visuals{
    display:none!important;
  }

  /* Sharper icon treatment across mobile navigation and cards. */
  .mobile-nav button>span,
  .stat-icon,
  .finance-stat .fi,
  .mini-avatar{
    box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--line) 84%,var(--cyan) 16%)!important;
  }
  .mobile-nav button.active>span{
    box-shadow:
      inset 0 0 0 1px color-mix(in srgb,var(--cyan) 36%,var(--line)),
      0 5px 14px color-mix(in srgb,var(--cyan) 10%,transparent)!important;
  }
}
@media(max-width:360px){
  .top-actions{
    grid-template-columns:minmax(0,1fr) repeat(4,34px)!important;
    gap:4px!important;
  }
  .top-actions:not(:has(#mobileHeaderSwitchBtn:not(.hidden))){
    grid-template-columns:minmax(0,1fr) repeat(3,34px)!important;
  }
  .header-switch-btn:not(.hidden),
  #notificationBtn.notify-btn,
  #themePickerBtn.theme-picker-btn,
  #quickAddBtn.quick-add,
  .notification-center,.theme-picker-wrap{
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    height:36px!important;
    min-height:36px!important;
  }
  #modal[data-modal-kind="client"] .form-grid{gap:8px!important}
  .clients-directory .directory-actions{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}


/* Mobile header icon authority: retire the legacy text-plus override. */
@media(max-width:760px){
  button#quickAddBtn.quick-add::before{
    display:none!important;
    content:none!important;
  }
  button#quickAddBtn.quick-add svg{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
  }
  button#quickAddBtn.quick-add span{
    display:none!important;
  }
}


/* 2026-10 mobile client-card containment + profile switch authority */
@media(max-width:760px){
  /* Keep the requested Switch control available in the mobile header. */
  #mobileHeaderSwitchBtn:not(.hidden){
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
  }

  /* Client directory must never inherit desktop table intrinsic width. */
  .clients-directory,
  .clients-directory .table-wrap,
  .clients-directory table,
  .clients-directory tbody{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-inline-size:0!important;
    max-inline-size:100%!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;
  }
  .clients-directory table{
    table-layout:fixed!important;
    inline-size:100%!important;
  }
  .clients-directory tbody{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:9px!important;
  }
  .clients-directory tbody tr{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    inline-size:100%!important;
    max-inline-size:100%!important;
    min-inline-size:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:auto auto auto auto!important;
    column-gap:9px!important;
    row-gap:8px!important;
    padding:12px!important;
  }
  .clients-directory tbody td{
    width:auto!important;
    max-width:100%!important;
    min-width:0!important;
    min-inline-size:0!important;
    max-inline-size:100%!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }
  .clients-directory tbody td:nth-child(1){
    grid-column:1!important;
    grid-row:1!important;
    align-self:center!important;
  }
  .clients-directory tbody td:nth-child(5){
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end!important;
    align-self:center!important;
    overflow:visible!important;
  }
  .clients-directory tbody td:nth-child(2){
    grid-column:1/-1!important;
    grid-row:2!important;
  }
  .clients-directory tbody td:nth-child(3){
    grid-column:1!important;
    grid-row:3!important;
  }
  .clients-directory tbody td:nth-child(4){
    grid-column:2!important;
    grid-row:3!important;
    width:100%!important;
  }
  .clients-directory tbody td:nth-child(3),
  .clients-directory tbody td:nth-child(4){
    min-width:0!important;
    max-width:100%!important;
  }
  .clients-directory tbody td:nth-child(6){
    grid-column:1/-1!important;
    grid-row:4!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }
  .clients-directory .directory-actions{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:6px!important;
    overflow:hidden!important;
  }
  .clients-directory .dir-action{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-inline-size:0!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 8px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .clients-directory .dir-action .action-ico{
    flex:0 0 15px!important;
    width:15px!important;
    height:15px!important;
  }
  .clients-directory .dir-action span{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  .clients-directory .directory-wa{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }
  .clients-directory .client-cell,
  .clients-directory .client-cell>div{
    min-width:0!important;
    max-width:100%!important;
  }

  /* Left profile keeps both requested controls side-by-side. */
  .profile-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  #profileSwitchBtn,#logoutBtn{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
}


/* 2026-10 switch controls visibility authority */
#profilePanel .profile-actions{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
}
#profileSwitchBtn,
#logoutBtn{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  min-width:0!important;
}
#profileSwitchBtn.hidden,
#logoutBtn.hidden{
  display:flex!important;
}
@media(max-width:760px){
  #mobileHeaderSwitchBtn,
  #mobileHeaderSwitchBtn.hidden{
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    pointer-events:auto!important;
  }
  .top-actions{
    grid-template-columns:minmax(0,1fr) repeat(4,38px)!important;
  }
}
@media(max-width:360px){
  .top-actions{
    grid-template-columns:minmax(0,1fr) repeat(4,34px)!important;
  }
}


/* 2026-10 final mobile header row authority */
@media(max-width:760px){
  .topbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    grid-template-rows:auto 40px!important;
    row-gap:8px!important;
    padding:10px 9px!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
  }
  .topbar>div:first-child{
    grid-column:1!important;
    grid-row:1!important;
    min-width:0!important;
    width:100%!important;
  }
  .topbar h1,
  #pageTitle{
    margin:0!important;
    font-size:18px!important;
    line-height:1.15!important;
  }
  .top-actions{
    grid-column:1!important;
    grid-row:2!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) repeat(4,40px)!important;
    gap:6px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0!important;
    align-items:center!important;
    justify-items:stretch!important;
    overflow:visible!important;
  }
  .global-search-wrap{
    grid-column:1!important;
    grid-row:1!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:40px!important;
    margin:0!important;
  }
  .search.admin-search{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:40px!important;
    padding:0 11px!important;
    border-radius:11px!important;
  }
  .search.admin-search input{
    width:100%!important;
    min-width:0!important;
    font-size:12px!important;
  }
  #mobileHeaderSwitchBtn{
    grid-column:2!important;
    grid-row:1!important;
  }
  #notificationCenter{
    grid-column:3!important;
    grid-row:1!important;
  }
  #themePickerWrap{
    grid-column:4!important;
    grid-row:1!important;
  }
  #quickAddBtn{
    grid-column:5!important;
    grid-row:1!important;
  }
  #mobileHeaderSwitchBtn,
  #notificationBtn.notify-btn,
  #themePickerBtn.theme-picker-btn,
  #quickAddBtn.quick-add,
  #notificationCenter,
  #themePickerWrap{
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    height:40px!important;
    min-height:40px!important;
    max-height:40px!important;
    margin:0!important;
    padding:0!important;
    align-self:center!important;
    justify-self:center!important;
  }
  #mobileHeaderSwitchBtn,
  #notificationBtn.notify-btn,
  #themePickerBtn.theme-picker-btn,
  #quickAddBtn.quick-add{
    display:grid!important;
    place-items:center!important;
    border-radius:11px!important;
  }
  #installAppBtn,
  #refreshBtn{
    display:none!important;
  }

  .mobile-profile-actions button{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
  }
  .mobile-profile-actions button svg{
    width:15px!important;
    height:15px!important;
    flex:0 0 15px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.8!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
  }
}
@media(max-width:360px){
  .top-actions{
    grid-template-columns:minmax(0,1fr) repeat(4,34px)!important;
    gap:4px!important;
  }
  #mobileHeaderSwitchBtn,
  #notificationBtn.notify-btn,
  #themePickerBtn.theme-picker-btn,
  #quickAddBtn.quick-add,
  #notificationCenter,
  #themePickerWrap{
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
  }
}


/* 2026-10 mobile add button + feedback visibility authority */
.toast{
  position:fixed!important;
  z-index:5000!important;
  pointer-events:none!important;
}
.toast.bad{
  border-color:color-mix(in srgb,var(--red) 72%,var(--line))!important;
  background:color-mix(in srgb,var(--red) 18%,var(--panel))!important;
  color:color-mix(in srgb,var(--red) 42%,white)!important;
}
@media(max-width:760px){
  .top-actions{
    grid-template-columns:minmax(0,1fr) repeat(4,40px)!important;
    overflow:visible!important;
  }
  .global-search-wrap{
    min-width:0!important;
    max-width:none!important;
    overflow:hidden!important;
  }
  body #quickAddBtn.quick-add{
    grid-column:5!important;
    grid-row:1!important;
    display:grid!important;
    visibility:visible!important;
    opacity:1!important;
    width:40px!important;
    min-width:40px!important;
    max-width:40px!important;
    height:40px!important;
    min-height:40px!important;
    max-height:40px!important;
    flex:0 0 40px!important;
    margin:0!important;
    padding:0!important;
    place-items:center!important;
    overflow:hidden!important;
    pointer-events:auto!important;
  }
  body #quickAddBtn.quick-add svg{
    display:block!important;
    visibility:visible!important;
    opacity:1!important;
    width:18px!important;
    height:18px!important;
  }
  body #quickAddBtn.quick-add span{display:none!important}
  body #quickAddBtn.quick-add::before{display:none!important;content:none!important}

  .toast{
    left:10px!important;
    right:10px!important;
    bottom:calc(84px + env(safe-area-inset-bottom))!important;
    width:auto!important;
    max-width:none!important;
    min-height:48px!important;
    padding:12px 14px!important;
    font-size:11px!important;
    line-height:1.45!important;
    text-align:left!important;
    box-shadow:0 16px 48px rgba(0,0,0,.48)!important;
  }
  body:has(#modal:not(.hidden)) .toast{
    bottom:16px!important;
  }
}
@media(max-width:360px){
  .top-actions{
    grid-template-columns:minmax(0,1fr) repeat(4,34px)!important;
    gap:4px!important;
  }
  body #quickAddBtn.quick-add{
    width:34px!important;
    min-width:34px!important;
    max-width:34px!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    flex-basis:34px!important;
  }
}


/* Mobile pull-to-refresh indicator. The dashboard uses an inner scroll surface, so
   this mirrors native pull refresh without coupling the sidebar/nav to page scroll. */
.pull-refresh-indicator{display:none}
@media(max-width:760px){
  .main-panel{position:relative!important}
  .pull-refresh-indicator{
    position:absolute!important;
    left:50%!important;
    top:92px;
    z-index:69!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    min-height:34px!important;
    padding:0 12px!important;
    border:1px solid color-mix(in srgb,var(--line) 78%,var(--cyan) 22%)!important;
    border-radius:999px!important;
    background:color-mix(in srgb,var(--panel2) 96%,transparent)!important;
    color:var(--muted)!important;
    font-size:8px!important;
    font-weight:850!important;
    letter-spacing:.02em!important;
    box-shadow:0 8px 24px rgba(0,0,0,.18)!important;
    opacity:0!important;
    pointer-events:none!important;
    transform:translate(-50%,calc(-18px + var(--pull-distance,0px))) scale(.96)!important;
    transition:opacity .12s ease,transform .12s ease,color .12s ease,border-color .12s ease!important;
  }
  .pull-refresh-indicator svg{
    width:15px!important;
    height:15px!important;
    flex:0 0 15px!important;
    fill:none!important;
    stroke:currentColor!important;
    stroke-width:1.9!important;
    stroke-linecap:round!important;
    stroke-linejoin:round!important;
  }
  .pull-refresh-indicator.visible{
    opacity:1!important;
  }
  .pull-refresh-indicator.ready{
    color:var(--green)!important;
    border-color:color-mix(in srgb,var(--green) 46%,var(--line))!important;
  }
  .pull-refresh-indicator.refreshing svg{
    animation:flowPullRefreshSpin .72s linear infinite!important;
  }
}
@keyframes flowPullRefreshSpin{to{transform:rotate(360deg)}}


/* 2026-10 FLOW worker mobile paint budget: CSS-only, no data or navigation changes. */
@media(max-width:760px){
  body[data-theme="premium"],body[data-theme="royal"]{background-attachment:scroll!important}
  .theme-picker-menu,.global-search-results,.notification-dropdown,.switch-target-list,
  .report-hero,.report-kpis article,.expiry-card,.notice-admin-item{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
  }
  .report-hero,.report-kpis article,.expiry-card,.notice-admin-item,.project-client-card{
    animation:none!important;
    transition:none!important;
    box-shadow:0 5px 16px rgba(0,0,0,.15)!important;
  }
}

/* Searched client stays in the full actionable Clients directory. */
.clients-directory tbody tr.client-search-target{background:color-mix(in srgb,var(--cyan) 13%,var(--panel))!important;outline:2px solid var(--cyan)!important;outline-offset:-2px!important;border-radius:12px}
.clients-directory tbody tr.client-search-target td{background:transparent!important}

/* Saved password recovery: uses the existing theme and modal surfaces. */
.password-recovery{min-width:0}
.password-recovery .recovery-account{color:var(--text);font-weight:700;overflow-wrap:anywhere}
#modal[data-modal-kind="password-recovery"] .password-recovery .field input{min-height:48px!important;font-size:16px!important;width:100%;min-width:0}
.password-recovery .field label{font-size:12px;color:var(--text);letter-spacing:.04em}
#modal[data-modal-kind="password-recovery"] .password-recovery button{min-height:44px!important;touch-action:manipulation}
.row-actions [data-password-recovery]{min-height:44px!important;font-size:12px!important}
.password-recovery .recovery-tools{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.password-recovery .recovery-tools button{flex:1}
.password-recovery #passwordRecoveryError{color:var(--red);line-height:1.5;min-height:1.5em;overflow-wrap:anywhere}
.password-recovery #recoveredPassword{font-family:ui-monospace,monospace}
.password-recovery #passwordRecoveryCountdown{color:var(--text);font-variant-numeric:tabular-nums}
.password-recovery :is(button,input):focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
@media(max-width:480px){.password-recovery .modal-actions{display:flex;flex-wrap:wrap;gap:8px}.password-recovery .modal-actions button{flex:1;min-width:100px}}
/* Client notice audience search */
#noticeAudienceSearch{margin-bottom:9px!important}
#noticeAudienceMatches{display:block;margin-top:6px;font-size:11px;line-height:1.35;color:var(--muted)}

/* 2026-10-15 isolated client search and interaction responsiveness. */
.client-focus-panel.hidden,.clients-directory.hidden,#clientsDirectoryIntro.hidden,.client-show-more.hidden{display:none!important}
.client-focus-panel{min-width:0;width:100%;max-width:100%}
.client-focus-card{padding:22px!important;min-width:0;overflow-wrap:anywhere}
.client-focus-head{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.client-focus-identity{display:flex;align-items:center;gap:14px;min-width:0}
.client-focus-identity>div{min-width:0}
.client-focus-identity .mini-avatar{width:48px;height:48px;flex:0 0 48px}
.client-focus-identity h3{font-size:20px;line-height:1.3;margin:3px 0;overflow-wrap:anywhere}
.client-focus-identity p{margin:0;color:var(--muted);font-size:13px;overflow-wrap:anywhere}
.client-focus-id{display:flex;gap:8px 18px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:18px 0;padding:13px 16px;border:1px solid var(--line);border-radius:12px;background:var(--panel2)}
.client-focus-id span,.client-focus-stats small{font-size:12px;color:var(--muted)}
.client-focus-id code{color:var(--text);font-size:12px;user-select:text;overflow-wrap:anywhere}
.client-focus-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,165px),1fr));gap:10px}
.client-focus-stats>div{display:flex;flex-direction:column;gap:7px;padding:14px;border-radius:12px;border:1px solid var(--line);background:var(--panel2);min-width:0}
.client-focus-stats b{font-size:14px;color:var(--text);overflow-wrap:anywhere}
.client-focus-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.client-focus-actions button,.client-focus-back,.client-show-more{min-height:44px!important;touch-action:manipulation;font-size:12px!important;cursor:pointer}
.client-focus-actions button:focus-visible,.client-focus-back:focus-visible,.client-show-more:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.client-show-more{display:block;margin:14px auto 20px;padding:10px 18px!important}
.global-search-results{z-index:150!important}
.search.admin-search input{min-width:0}
@media(max-width:760px){
 .global-search-wrap{overflow:visible!important}
 .global-search-results{position:fixed!important;top:100px!important;left:10px!important;right:10px!important;width:auto!important;max-width:none!important;max-height:min(62dvh,440px)!important;overflow-y:auto!important}
 .client-focus-card{padding:16px!important}
 .client-focus-head{align-items:flex-start}
 .client-focus-back{width:100%}
 .client-focus-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .client-focus-stats>div{padding:12px}
 .client-focus-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .client-focus-actions button{width:100%}
 .search.admin-search input{font-size:16px!important}
}
@media(max-width:360px){.client-focus-stats{grid-template-columns:1fr}.client-focus-actions{grid-template-columns:1fr}}


/* Bounded WhatsApp pages keep mobile layout and hit testing small. */
.messages-pagination{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:14px}
.messages-pagination button{min-height:44px;touch-action:manipulation}
.messages-pagination span{font-size:12px;color:var(--muted);text-align:center}
@media(max-width:760px){
  #messagesRows tbody tr{contain:layout paint style;animation:none!important;transition:none!important;box-shadow:none!important}
  #messagesRows td{transition:none!important}
}

/* THE FLOW unified lists, menus and icons - 2026-10-17.
   Theme-token driven, with no background DOM observers or layout polling. */
body[data-theme] select:not([multiple]):not(#mobileSection){
  appearance:none!important;-webkit-appearance:none!important;
  padding-inline-end:38px!important;
  background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),
    linear-gradient(135deg,var(--muted) 50%,transparent 50%)!important;
  background-position:calc(100% - 19px) calc(50% - 1px),
    calc(100% - 13px) calc(50% - 1px)!important;
  background-size:6px 6px!important;background-repeat:no-repeat!important;
  cursor:pointer;color:var(--text)!important;border-color:var(--line)!important;
}
body[data-theme] :is(.global-search-results,.notification-dropdown,.theme-picker-menu,.action-menu,.flow-select-popover){
  color:var(--text)!important;
  border-color:color-mix(in srgb,var(--line) 82%,var(--cyan) 18%)!important;
  background:color-mix(in srgb,var(--panel2) 93%,var(--panel) 7%)!important;
}
body[data-theme] :is(.seller-account-item,.switch-target,.search-result,.notice-admin-item,.notification-item,.report-break-row){
  border-radius:12px!important;
  border-color:color-mix(in srgb,var(--line) 90%,var(--cyan) 10%)!important;
  color:var(--text);
}
body[data-theme] :is(.seller-account-item,.switch-target,.search-result,.notice-admin-item,.notification-item,.report-break-row):focus-within{
  outline:2px solid var(--cyan)!important;outline-offset:2px;
}
body[data-theme] :is(.seller-account-item,.switch-target,.search-result,.notice-admin-item,.notification-item,.report-break-row):hover{
  background-color:color-mix(in srgb,var(--panel2) 86%,var(--cyan) 14%)!important;
}
body[data-theme] :is(.action-menu,.global-search-results,.notification-dropdown) button{touch-action:manipulation}
body[data-theme] :is(.directory-actions,.row-actions,.section-actions,.modal-actions,.notification-actions) button>svg{
  width:16px;height:16px;flex:0 0 16px;
  stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
}
body[data-theme] .seller-account-item small,
body[data-theme] .switch-target small,
body[data-theme] .search-result small{
  color:var(--muted)!important;overflow-wrap:anywhere;
}
.flow-select-popover{
  position:fixed!important;z-index:30000!important;
  box-sizing:border-box!important;display:flex!important;flex-direction:column!important;
  gap:7px!important;min-width:0!important;padding:9px!important;
  border:1px solid var(--line)!important;border-radius:16px!important;
  box-shadow:0 22px 58px rgba(0,0,0,.38)!important;
  overflow:hidden!important;overscroll-behavior:contain;
  color:var(--text);background:var(--panel2);
}
.flow-select-search{
  width:100%!important;flex:none!important;min-height:44px!important;
  padding:10px 13px!important;font-size:14px!important;font-weight:600!important;
  color:var(--text)!important;border:1px solid var(--line)!important;
  border-radius:11px!important;background:var(--panel)!important;outline:none;
}
.flow-select-search:focus{
  border-color:var(--cyan)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--cyan) 16%,transparent)!important;
}
.flow-select-search::placeholder{color:var(--muted)}
.flow-select-menu{
  display:flex!important;flex:1 1 auto!important;flex-direction:column!important;
  gap:3px!important;min-height:0!important;overflow-y:auto!important;
  overscroll-behavior:contain!important;scrollbar-width:thin;
  scrollbar-color:var(--line) transparent;padding:2px!important;
}
.flow-select-option{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:12px!important;width:100%!important;min-height:44px!important;
  flex:0 0 auto!important;padding:10px 12px!important;
  border:1px solid transparent!important;border-radius:10px!important;
  color:var(--text)!important;background:transparent!important;
  font-size:13px!important;font-weight:630!important;line-height:1.4!important;
  text-align:left!important;cursor:pointer!important;touch-action:manipulation;
}
.flow-select-option-label{min-width:0;overflow-wrap:anywhere}
.flow-select-option[aria-selected="true"]{
  color:var(--cyan)!important;
  background:color-mix(in srgb,var(--cyan) 13%,var(--panel2))!important;
  border-color:color-mix(in srgb,var(--cyan) 38%,var(--line))!important;
}
.flow-select-option[aria-selected="true"]::after{
  content:"";display:block;flex:0 0 10px;width:10px;height:6px;
  border-left:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(-45deg) translateY(-2px);
}
.flow-select-option:hover:not(:disabled),.flow-select-option:focus-visible{
  outline:none!important;
  background:color-mix(in srgb,var(--cyan) 9%,var(--panel2))!important;
  border-color:color-mix(in srgb,var(--cyan) 30%,var(--line))!important;
}
.flow-select-option:disabled{opacity:.45!important;cursor:not-allowed!important}
.flow-select-count{
  flex:none!important;padding:8px 10px 3px!important;
  border-top:1px solid var(--line)!important;color:var(--muted)!important;
  font-size:11px!important;line-height:1.4!important;overflow-wrap:anywhere;
}
.flow-select-empty{padding:15px 10px;color:var(--muted);font-size:13px}
@media(max-width:760px){
  .flow-select-popover{border-radius:14px!important;box-shadow:0 13px 36px rgba(0,0,0,.28)!important}
  .flow-select-menu{max-height:52dvh}
  .flow-select-option{min-height:48px!important;font-size:14px!important}
}
@media(prefers-reduced-motion:reduce){
  .flow-select-popover,.flow-select-option{transition:none!important;animation:none!important}
}


/* Android-safe THE FLOW modal select buttons: 2026-10-17 client picker v2 */
body[data-theme] select.flow-select-source,
select.flow-select-source{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.flow-select-trigger{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  width:100%!important;
  min-width:0!important;
  min-height:49px!important;
  padding:11px 15px!important;
  border:1px solid var(--line)!important;
  border-radius:12px!important;
  background:color-mix(in srgb,var(--panel2) 92%,var(--panel) 8%)!important;
  color:var(--text)!important;
  font:inherit!important;
  font-size:13px!important;
  font-weight:650!important;
  text-align:left!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent!important;
}
.flow-select-trigger::after{
  content:"";
  display:block!important;
  flex:0 0 8px!important;
  width:8px!important;height:8px!important;
  border-right:2px solid var(--cyan)!important;
  border-bottom:2px solid var(--cyan)!important;
  transform:rotate(45deg) translateY(-2px)!important;
}
.flow-select-trigger-copy{
  display:flex!important;
  flex:1 1 auto!important;
  flex-direction:column!important;
  gap:5px!important;
  min-width:0!important;
}
.flow-select-trigger-title{
  display:block!important;
  max-width:100%!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  overflow-wrap:anywhere!important;
  font-size:13px!important;
  font-weight:750!important;
  line-height:1.35!important;
  color:inherit!important;
}
.flow-select-trigger-meta,
.flow-select-option-meta{
  display:block!important;
  max-width:100%!important;
  color:var(--muted)!important;
  font-size:11px!important;
  line-height:1.4!important;
  font-weight:600!important;
  overflow-wrap:anywhere!important;
}
.flow-select-trigger:focus-visible,
.flow-select-trigger[aria-expanded="true"]{
  border-color:color-mix(in srgb,var(--cyan) 65%,var(--line))!important;
  outline:2px solid color-mix(in srgb,var(--cyan) 40%,transparent)!important;
  outline-offset:2px!important;
  background:color-mix(in srgb,var(--panel2) 89%,var(--cyan) 11%)!important;
}
.flow-select-trigger:disabled{opacity:.55!important;cursor:not-allowed!important}
.flow-select-trigger.flow-select-placeholder{color:var(--muted)!important}
.flow-select-option-label{
  display:flex!important;
  flex-direction:column!important;
  align-items:flex-start!important;
  gap:5px!important;
  min-width:0!important;
  flex:1 1 auto!important;
  font-weight:750!important;
}
.flow-select-option[aria-selected="true"] .flow-select-option-meta{
  color:color-mix(in srgb,var(--muted) 75%,var(--cyan) 25%)!important;
}
@media(max-width:760px){
  .flow-select-trigger{min-height:49px!important;padding:12px 13px!important}
  .flow-select-option{min-height:53px!important;padding:11px 12px!important}
  .flow-select-popover{max-width:calc(100vw - 16px)!important}
}


/* THE FLOW selector coverage audit v3: every single-select uses a branded button.
   No Android system chooser can be triggered by a hidden select. */
html body select.flow-select-source,
html body .view select.flow-select-source,
html body #modal select.flow-select-source,
html body .mobile-sections select.flow-select-source {
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
  opacity:0!important;
  height:0!important;
  width:0!important;
  position:absolute!important;
}
html body .flow-select-trigger {
  max-width:100%!important;
  box-sizing:border-box!important;
}
html body .flow-select-popover {
  z-index:30000!important;
}
@media(max-width:760px){
 html body .flow-select-option {
   min-height:48px!important;
 }
}