:root{
  --bg:#f5f7fb;--surface:#fff;--surface-2:#f8fafc;--text:#253247;--muted:#718096;
  --border:#d7deea;--border-strong:#aab5c5;--nav:#17233b;--nav-soft:#223150;
  --purple:#6d5ce8;--purple-2:#5a4bd3;--blue:#4e82e7;--teal:#38a3a5;--green:#2f9461;
  --amber:#c58927;--red:#c45454;--shadow:0 10px 30px rgba(28,41,63,.08);
}
*{box-sizing:border-box} html,body{margin:0;min-height:100%;font-family:Inter,system-ui,sans-serif;background:var(--bg);color:var(--text)}
button,input,select{font:inherit}.hidden{display:none!important}
.app-shell{min-height:100vh;display:grid;grid-template-columns:248px minmax(0,1fr)}
.sidebar{position:sticky;top:0;height:100vh;background:linear-gradient(180deg,var(--nav),#121d31);color:#fff;padding:22px 16px;display:flex;flex-direction:column;z-index:30}
.brand{display:flex;gap:11px;align-items:center;padding:2px 5px 24px}.brand-mark,.login-logo{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,var(--purple),var(--blue));font-weight:800;color:#fff;box-shadow:0 8px 20px rgba(91,80,210,.28)}
.brand-name{font-weight:800;font-size:15px}.brand-sub{font-size:11px;color:#9fb0c8;margin-top:2px}
.nav{display:grid;gap:6px}.nav-item{border:0;background:transparent;color:#aebbd0;padding:11px 12px;border-radius:9px;display:flex;align-items:center;gap:10px;text-align:left;font-weight:650;cursor:pointer}
.nav-item:hover{background:rgba(255,255,255,.06);color:#fff}.nav-item.active{background:linear-gradient(90deg,rgba(109,92,232,.24),rgba(78,130,231,.13));color:#fff;box-shadow:inset 3px 0 0 #8a7dff}
.sidebar-foot{margin-top:auto;border-top:1px solid rgba(255,255,255,.09);padding-top:14px}.connection-row{font-size:11px;color:#aebbd0;display:flex;gap:7px;align-items:center;margin-bottom:13px}.connection-dot{width:8px;height:8px;border-radius:50%;background:#718096}.connection-dot.ok{background:#48c78e}.connection-dot.warn{background:#e0a84f}
.user-mini{display:flex;gap:10px;align-items:center}.avatar{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#30405f;font-weight:800}.user-mini-text{display:flex;flex-direction:column;min-width:0}.user-mini-text strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-mini-text span{font-size:10px;color:#9fb0c8;text-transform:capitalize}
.main{min-width:0;padding:24px 26px 40px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}.topbar h1{margin:0;font-size:24px;letter-spacing:-.02em}.topbar p{margin:4px 0 0;color:var(--muted);font-size:12px}.top-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end}
.btn{border:1px solid var(--border);border-radius:9px;padding:8px 12px;background:#fff;color:var(--text);font-weight:700;font-size:12px;cursor:pointer;transition:.15s}.btn:hover{transform:translateY(-1px);box-shadow:0 5px 15px rgba(31,45,65,.07)}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
.btn-primary{background:linear-gradient(135deg,var(--purple),var(--blue));border-color:transparent;color:#fff}.btn-secondary{background:#fff}.btn-ghost{border-color:transparent;background:transparent;color:var(--muted)}.btn-danger{color:#fff;background:var(--red);border-color:var(--red)}.btn-small{padding:6px 9px;font-size:11px}.full{width:100%}
.badge{padding:6px 9px;border-radius:99px;font-size:11px;font-weight:800}.badge.neutral{background:#eef2f7;color:#59687b}.badge.warning{background:#fff5dd;color:#94651c}.badge.success{background:#e8f7ef;color:#28704b}.badge.info{background:#edf4ff;color:#3c659d}.badge.inactive{background:#f1f3f5;color:#7a8492}
.banner{border-radius:10px;padding:10px 13px;margin-bottom:16px;font-size:12px}.banner.warning{background:#fff8e8;border:1px solid #f1d99f;color:#805d1f}
.view{display:none}.view.active{display:block}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(180px,1fr));gap:13px;margin-bottom:14px}.stat-card,.panel{background:var(--surface);border:1px solid var(--border);border-radius:13px;box-shadow:var(--shadow)}.stat-card{padding:17px}.stat-label{text-transform:uppercase;font-size:10px;letter-spacing:.07em;font-weight:800;color:#77869a}.stat-value{font-size:29px;font-weight:800;margin:7px 0 3px;letter-spacing:-.04em}.stat-foot{font-size:11px;color:var(--muted)}
.dashboard-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:14px}.panel{padding:17px}.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}.panel-head h2{margin:0;font-size:15px}.panel-head p{margin:4px 0 0;font-size:11px;color:var(--muted)}.text-btn{border:0;background:transparent;color:var(--blue);font-weight:700;font-size:11px;cursor:pointer}
.system-list{display:grid;gap:10px}.system-row{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:10px;align-items:center;border:1px solid var(--border);border-radius:10px;padding:11px 12px}.system-swatch{width:10px;height:34px;border-radius:6px}.system-row strong{display:block;font-size:12px}.system-row span{font-size:10px;color:var(--muted)}.system-count{font-size:18px!important;color:var(--text)!important;font-weight:800}
.activity-list{display:grid}.activity-item{padding:11px 2px;border-bottom:1px solid #edf0f5;display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:9px;align-items:center}.activity-item:last-child{border-bottom:0}.activity-icon{width:28px;height:28px;border-radius:8px;background:#eef2ff;color:var(--purple);display:grid;place-items:center;font-weight:800}.activity-main strong{display:block;font-size:11px}.activity-main span{font-size:10px;color:var(--muted)}.activity-time{font-size:10px;color:var(--muted)}
.toolbar{display:flex;gap:9px;align-items:center;margin-bottom:13px}.input,.select{border:1px solid var(--border);border-radius:8px;padding:8px 10px;background:#fff;color:var(--text);outline:none;font-size:12px}.input:focus,.select:focus{border-color:#8aa9e8;box-shadow:0 0 0 3px rgba(78,130,231,.10)}.toolbar .input{min-width:240px}.select{min-width:150px}
.table-scroll{overflow:auto;border:1px solid var(--border);border-radius:10px}.management-table{width:100%;border-collapse:collapse;min-width:720px}.management-table th,.management-table td{padding:10px 12px;border-bottom:1px solid var(--border);text-align:left;font-size:11px}.management-table th{background:#f5f7fa;text-transform:uppercase;letter-spacing:.04em;font-size:9px;color:#718096}.management-table tbody tr:hover{background:#f8faff}.management-table .right{text-align:right}.row-actions{display:flex;gap:5px;justify-content:flex-end}
.system-cards{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:12px}.system-card{border:1px solid var(--border);border-radius:12px;padding:15px;background:#fff}.system-card-top{display:flex;justify-content:space-between;gap:10px;align-items:flex-start}.system-card h3{margin:0;font-size:14px}.system-card p{margin:4px 0 12px;color:var(--muted);font-size:10px}.system-meta{display:flex;justify-content:space-between;padding-top:10px;border-top:1px solid #edf0f5;font-size:10px;color:var(--muted)}.color-dot{width:12px;height:12px;border-radius:50%;display:inline-block;margin-right:6px;vertical-align:-1px}
.matrix-panel{padding:0;overflow:hidden}.matrix-panel .panel-head{padding:17px 17px 3px}.matrix-actions{display:flex;gap:8px}.matrix-wrap{overflow:auto;max-height:72vh;border-top:1px solid var(--border)}.settings-table{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:10px}.settings-table th,.settings-table td{border-right:1px solid var(--border-strong);border-bottom:1px solid var(--border-strong);padding:6px 7px;min-width:105px;text-align:center;background:#fff}.settings-table th{position:sticky;top:0;z-index:5;color:#fff;font-size:9px;font-weight:800;line-height:1.25;background:#5d65c5}.settings-table th.platform{background:var(--nav);left:0;z-index:8;min-width:155px}.settings-table th.system{background:#354d74;left:155px;z-index:7;min-width:140px}.settings-table th.deposit{background:#477cbd}.settings-table th.bonus{background:#626cc7}.settings-table th.game{background:#438a9c}.settings-table td.platform{position:sticky;left:0;z-index:4;min-width:155px;background:#eef1f6!important;text-align:left;font-weight:700}.settings-table td.system{position:sticky;left:155px;z-index:3;min-width:140px;background:#f2f6fa!important}.settings-table tbody tr:nth-child(even) td{background:#fafbfd}.settings-table input[type=checkbox]{width:16px;height:16px;accent-color:var(--purple)}.settings-table select,.settings-table input[type=number]{width:100%;min-width:88px;border:1px solid #cfd7e3;border-radius:6px;padding:5px;background:#fff;font-size:10px}.settings-table .number-cell{background:#fffaf0!important}.settings-table .deposit-cell{background:#f1f7fd!important}
.login-screen{min-height:100vh;display:grid;place-items:center;padding:24px;background:radial-gradient(circle at 15% 20%,rgba(109,92,232,.12),transparent 35%),radial-gradient(circle at 85% 75%,rgba(78,130,231,.15),transparent 35%),#f4f7fb}.login-card{width:min(410px,100%);background:#fff;border:1px solid var(--border);border-radius:18px;padding:27px;box-shadow:0 22px 60px rgba(35,49,72,.13)}.login-logo{margin-bottom:15px}.login-card h1{font-size:21px;margin:0}.login-card>p{font-size:12px;color:var(--muted);margin:6px 0 18px}.login-card form{display:grid;gap:8px}.login-card label{font-size:11px;font-weight:700}.login-notice{font-size:11px;padding:9px 10px;border-radius:8px;margin-bottom:13px;background:#f2f5f8;color:#5c6a7c}.login-card .btn{margin-top:7px}.form-error{color:var(--red);font-size:11px;margin-top:10px;min-height:14px}
.modal-backdrop{position:fixed;inset:0;background:rgba(17,27,45,.52);display:grid;place-items:center;padding:18px;z-index:100}.modal{width:min(500px,100%);max-height:90vh;overflow:auto;background:#fff;border-radius:15px;border:1px solid var(--border);box-shadow:0 24px 70px rgba(15,25,43,.25);padding:19px}.modal h2{font-size:16px;margin:0}.modal p{font-size:11px;color:var(--muted);margin:5px 0 15px}.modal-form{display:grid;gap:10px}.modal-form label{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#657287}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:17px}
.toast{position:fixed;right:22px;bottom:22px;z-index:120;background:#1d2b43;color:#fff;border-radius:10px;padding:11px 14px;font-size:11px;box-shadow:0 12px 28px rgba(20,32,52,.2)}
.empty{padding:30px;text-align:center;color:var(--muted);font-size:11px}.pill{display:inline-flex;align-items:center;gap:5px;border-radius:99px;padding:4px 7px;background:#eef2f7;color:#59687b;font-size:10px;font-weight:700}.pill.active{background:#e8f7ef;color:#28704b}.pill.inactive{background:#f3f4f6;color:#7a8492}
@media(max-width:1180px){.stats-grid{grid-template-columns:repeat(2,1fr)}.system-cards{grid-template-columns:repeat(2,1fr)}.dashboard-grid{grid-template-columns:1fr}}
@media(max-width:850px){.app-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;padding:13px}.brand{padding-bottom:10px}.nav{grid-template-columns:repeat(5,minmax(110px,1fr));overflow:auto}.sidebar-foot{display:none}.main{padding:16px}.topbar{align-items:flex-start;flex-direction:column}.top-actions{justify-content:flex-start}.responsive{flex-direction:column}.matrix-actions{width:100%;flex-direction:column}.toolbar{flex-wrap:wrap}.toolbar .input{min-width:100%}}
@media(max-width:600px){.stats-grid,.system-cards{grid-template-columns:1fr}.main{padding:12px}.panel{padding:13px}}


.branding-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr);gap:14px}
.branding-form{display:grid;gap:14px}
.form-section-title{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:#708096;padding-bottom:7px;border-bottom:1px solid #edf0f5}
.form-grid{display:grid;gap:11px}.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.form-grid label{display:block;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:#657287;margin-bottom:5px}
.branding-actions{margin-top:3px}
.preview-panel{align-self:start;position:sticky;top:24px}
.login-preview-shell{padding:20px;border-radius:13px;background:radial-gradient(circle at 15% 20%,rgba(109,92,232,.12),transparent 35%),radial-gradient(circle at 85% 75%,rgba(78,130,231,.12),transparent 35%),#f4f7fb;border:1px solid var(--border)}
.login-preview-card{max-width:370px;margin:auto;background:#fff;border:1px solid var(--border);border-radius:16px;padding:24px;box-shadow:0 15px 40px rgba(35,49,72,.10)}
.login-preview-card h3{margin:0;font-size:18px}.login-preview-card>p{font-size:11px;color:var(--muted);margin:5px 0 17px}
.login-preview-card label{display:block;font-size:10px;font-weight:700;margin:10px 0 5px}
.preview-input{height:34px;border:1px solid var(--border);border-radius:7px;padding:8px 9px;color:#8a93a2;font-size:11px}
.preview-button{margin-top:14px;border-radius:8px;padding:9px;text-align:center;color:#fff;font-size:11px;font-weight:800;background:linear-gradient(135deg,var(--purple),var(--blue))}
@media(max-width:1050px){.branding-grid{grid-template-columns:1fr}.preview-panel{position:static}}
@media(max-width:650px){.form-grid.two{grid-template-columns:1fr}}

.auth-link-btn{
  width:100%;border:0;background:transparent;color:var(--blue);
  font-weight:700;font-size:11px;padding:10px 0 2px;cursor:pointer
}
.auth-link-btn:hover{text-decoration:underline}


/* v6 refinements */
.nav-item b{font:inherit;font-weight:inherit}
.refresh-icon{display:inline-block;margin-right:5px;font-size:15px}
.btn.loading .refresh-icon{animation:v6spin .7s linear infinite}
@keyframes v6spin{to{transform:rotate(360deg)}}

.btn-danger{
  color:#a63f3f;
  background:#fff1f1;
  border-color:#efc9c9;
}
.btn-danger:hover{background:#ffe8e8}

.matrix-panel{overflow:visible!important}
.matrix-head{padding-bottom:5px}
.matrix-tools{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.matrix-count{
  font-size:10px;font-weight:800;color:#738096;
  border:1px solid var(--border);background:#f8fafc;
  padding:7px 9px;border-radius:8px;white-space:nowrap
}
.matrix-wrap{
  margin:0 16px 16px;
  border:1px solid var(--border-strong);
  border-radius:10px;
  overflow:auto;
  max-height:72vh;
  background:#fff;
  scrollbar-gutter:stable both-edges;
}
.matrix-wrap::-webkit-scrollbar{height:11px;width:11px}
.matrix-wrap::-webkit-scrollbar-track{background:#edf1f6;border-radius:8px}
.matrix-wrap::-webkit-scrollbar-thumb{
  background:#aab5c5;border-radius:8px;border:2px solid #edf1f6
}
.matrix-wrap::-webkit-scrollbar-thumb:hover{background:#8997a9}

/* Prevent the first sticky columns from clipping on horizontal scroll. */
.settings-table th.platform{
  left:0!important;
  width:180px!important;min-width:180px!important;max-width:180px!important;
  padding-left:14px!important;text-align:left!important;
  box-shadow:2px 0 0 #8290a3;
  z-index:9!important
}
.settings-table td.platform{
  left:0!important;
  width:180px!important;min-width:180px!important;max-width:180px!important;
  padding-left:14px!important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  box-shadow:2px 0 0 #8290a3;
  z-index:6!important
}
.settings-table th.system{
  left:180px!important;
  width:150px!important;min-width:150px!important;max-width:150px!important;
  box-shadow:2px 0 0 #a2adba;
  z-index:8!important
}
.settings-table td.system{
  left:180px!important;
  width:150px!important;min-width:150px!important;max-width:150px!important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  box-shadow:2px 0 0 #a2adba;
  z-index:5!important
}
.settings-table th,.settings-table td{
  height:38px;
  border-right:1px solid #9aa7b6!important;
  border-bottom:1px solid #9aa7b6!important
}
.settings-table tbody tr:hover td:not(.platform):not(.system){background:#f4f7ff!important}

/* Expanded Branding & Text editor */
.editor-section{
  border:1px solid var(--border);
  border-radius:11px;
  background:#fbfcfe;
  overflow:hidden;
  margin-bottom:11px
}
.editor-section summary{
  cursor:pointer;
  padding:12px 13px;
  font-size:11px;
  font-weight:800;
  color:#536176;
  background:#f6f8fb;
  list-style:none
}
.editor-section summary::-webkit-details-marker{display:none}
.editor-section summary:after{content:"+";float:right;color:#8290a3}
.editor-section[open] summary:after{content:"−"}
.editor-section-body{padding:13px}
.branding-actions{
  display:flex;justify-content:flex-end;gap:8px;
  padding-top:5px;position:sticky;bottom:0;
  background:rgba(255,255,255,.96);
  border-top:1px solid #edf0f5;
  margin-top:4px
}
.delete-confirm{
  background:#fff5f5;
  border:1px solid #efcccc;
  color:#884343;
  padding:10px;border-radius:8px;font-size:11px
}

@media(max-width:850px){
  .matrix-tools{width:100%}
}
@media(max-width:650px){
  .matrix-wrap{margin:0 10px 10px}
  .settings-table th.platform,.settings-table td.platform{
    width:155px!important;min-width:155px!important;max-width:155px!important
  }
  .settings-table th.system,.settings-table td.system{left:155px!important}
}


/* ===========================
   v7 Dashboard + Matrix tools
   =========================== */
.clickable-card{
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.clickable-card:hover{
  transform:translateY(-2px);
  border-color:#b8c5d8;
  box-shadow:0 14px 34px rgba(28,43,68,.10);
}
.clickable-card:after{
  content:"→";
  position:absolute;
  right:16px;
  top:15px;
  color:#9aa7ba;
  font-weight:800;
  font-size:15px;
}
.chart-panel{min-height:330px}
.bar-chart{display:grid;gap:12px}
.chart-empty{padding:28px 10px;text-align:center;color:var(--muted);font-size:11px}
.chart-row{
  display:grid;
  grid-template-columns:minmax(125px,180px) minmax(0,1fr) 42px;
  gap:10px;
  align-items:center;
  cursor:pointer;
  border-radius:9px;
  padding:7px 8px;
  transition:background .14s ease;
}
.chart-row:hover{background:#f7f9fd}
.chart-label{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  font-size:11px;
  font-weight:700;
}
.chart-label span:last-child{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.chart-dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}
.chart-track{
  height:12px;
  border-radius:99px;
  background:#edf1f6;
  overflow:hidden;
  position:relative;
}
.chart-fill{
  height:100%;
  min-width:3px;
  border-radius:99px;
  background:linear-gradient(90deg,var(--purple),var(--blue));
  transition:width .25s ease;
}
.chart-value{
  text-align:right;
  font-size:11px;
  font-weight:800;
  color:#425167;
}
.activity-panel-wide{margin-top:14px}
.activity-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:20px;
}
.matrix-tools .btn{
  white-space:nowrap;
}
.custom-column-head{
  background:linear-gradient(135deg,#7561b5,#5b8cc6)!important;
}
.custom-text-cell input[type=text]{
  width:100%;
  min-width:96px;
  border:1px solid #cfd7e3;
  border-radius:6px;
  padding:5px 6px;
  background:#fff;
  font-size:10px;
}
.custom-select-cell select{
  width:100%;
  min-width:96px;
}
.column-list{
  display:grid;
  gap:8px;
  margin-top:10px;
}
.column-list-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  border:1px solid var(--border);
  border-radius:9px;
  padding:10px 11px;
  background:#fafbfd;
}
.column-list-item strong{font-size:11px;display:block}
.column-list-item span{font-size:10px;color:var(--muted)}
.column-actions{display:flex;gap:5px}
.modal-help{
  font-size:10px;
  color:var(--muted);
  padding:8px 9px;
  border-radius:7px;
  background:#f5f7fa;
}
@media(max-width:850px){
  .activity-grid{grid-template-columns:1fr}
  .chart-row{grid-template-columns:110px minmax(0,1fr) 36px}
}


/* ===========================
   v8 Leader + Multi Preview
   =========================== */
.dashboard-chart-wide{
  margin-bottom:14px;
}
.dashboard-chart-wide .bar-chart{
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:18px;
}
.leader-note{
  margin-bottom:13px;
  padding:11px 12px;
  border:1px solid #d7e2ef;
  border-radius:9px;
  background:#f6f9fd;
  color:#5d6c80;
  font-size:11px;
}
.leader-note strong{color:#34445b}
.system-leaders{
  margin-top:9px;
  padding-top:9px;
  border-top:1px dashed #dfe5ee;
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.leader-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  border-radius:99px;
  padding:4px 7px;
  background:#f0edff;
  color:#5a4bd3;
  font-size:9px;
  font-weight:800;
}
.leader-chip:before{
  content:"♙";
  font-size:10px;
}
.assignment-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
  max-height:290px;
  overflow:auto;
  border:1px solid var(--border);
  border-radius:9px;
  padding:9px;
  background:#fafbfd;
}
.assignment-option{
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid #e2e7ef;
  background:#fff;
  border-radius:8px;
  padding:8px 9px;
  cursor:pointer;
  font-size:11px;
}
.assignment-option:hover{background:#f7f9fd}
.assignment-option input{width:16px;height:16px;accent-color:var(--purple)}
.role-pill{
  display:inline-flex;
  border-radius:99px;
  padding:4px 7px;
  background:#edf4ff;
  color:#426a9f;
  font-size:9px;
  font-weight:800;
}

.preview-panel{
  min-height:560px;
}
.preview-tabs{
  display:flex;
  gap:6px;
  flex-wrap:wrap;
  margin-bottom:10px;
}
.preview-tab{
  border:1px solid var(--border);
  background:#fff;
  color:#657287;
  border-radius:8px;
  padding:7px 9px;
  font-size:10px;
  font-weight:800;
  cursor:pointer;
}
.preview-tab:hover{background:#f6f8fb}
.preview-tab.active{
  background:#243b64;
  color:#fff;
  border-color:#243b64;
}
.multi-preview-shell{
  border:1px solid var(--border);
  border-radius:13px;
  background:
    radial-gradient(circle at 12% 20%,rgba(109,92,232,.10),transparent 32%),
    radial-gradient(circle at 88% 76%,rgba(78,130,231,.10),transparent 32%),
    #f4f7fb;
  min-height:440px;
  padding:18px;
  overflow:hidden;
}
.preview-window{
  width:100%;
  min-height:400px;
  border:1px solid #d5dce8;
  border-radius:13px;
  background:#fff;
  overflow:hidden;
  box-shadow:0 12px 36px rgba(34,48,70,.08);
}
.preview-topbar{
  height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 14px;
  border-bottom:1px solid #e6eaf0;
  background:#fff;
}
.preview-page-title strong{display:block;font-size:12px}
.preview-page-title span{display:block;font-size:8px;color:#7a8798;margin-top:2px}
.preview-mini-btn{
  padding:5px 7px;
  border-radius:6px;
  font-size:8px;
  font-weight:800;
  color:#fff;
  background:linear-gradient(135deg,var(--purple),var(--blue));
}
.preview-body{padding:13px}
.preview-stat-row{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:7px;
}
.preview-stat{
  border:1px solid #dfe5ee;
  border-radius:8px;
  padding:8px;
}
.preview-stat label{
  display:block;
  font-size:6px;
  text-transform:uppercase;
  color:#8290a3;
  font-weight:800;
}
.preview-stat b{display:block;font-size:15px;margin-top:4px}
.preview-card{
  border:1px solid #dfe5ee;
  border-radius:9px;
  margin-top:9px;
  padding:10px;
}
.preview-card h4{font-size:9px;margin:0 0 3px}
.preview-card p{font-size:7px;color:#7c899b;margin:0 0 8px}
.preview-bar{
  display:grid;
  grid-template-columns:72px 1fr 18px;
  align-items:center;
  gap:6px;
  margin:7px 0;
  font-size:7px;
}
.preview-bar-track{
  height:7px;
  border-radius:99px;
  background:#edf1f6;
  overflow:hidden;
}
.preview-bar-fill{
  height:100%;
  border-radius:99px;
  background:linear-gradient(90deg,var(--purple),var(--blue));
}
.preview-table{
  width:100%;
  border-collapse:collapse;
  font-size:7px;
}
.preview-table th,.preview-table td{
  border:1px solid #cfd7e3;
  padding:5px;
  text-align:left;
}
.preview-table th{
  color:#fff;
  background:#5c65c4;
}
.preview-system-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:7px;
}
.preview-system-card{
  border:1px solid #dfe5ee;
  border-radius:8px;
  padding:8px;
}
.preview-system-card strong{display:block;font-size:8px}
.preview-system-card span{font-size:6px;color:#7d8998}
.preview-login-wrap{
  min-height:400px;
  display:grid;
  place-items:center;
  padding:18px;
}
.preview-login-card{
  width:min(310px,90%);
  border:1px solid #d6dce7;
  border-radius:13px;
  background:#fff;
  padding:18px;
  box-shadow:0 10px 30px rgba(31,44,65,.08);
}
.preview-login-card h3{margin:10px 0 3px;font-size:15px}
.preview-login-card p{margin:0 0 12px;font-size:8px;color:#738197}
.preview-login-card label{display:block;font-size:7px;font-weight:800;margin:7px 0 4px}
.preview-login-input{
  border:1px solid #d5dce7;
  border-radius:6px;
  height:28px;
  padding:7px;
  font-size:8px;
  color:#8a96a6;
}
.preview-login-btn{
  margin-top:10px;
  text-align:center;
  border-radius:6px;
  padding:7px;
  color:#fff;
  font-size:8px;
  font-weight:800;
  background:linear-gradient(135deg,var(--purple),var(--blue));
}
@media(max-width:1100px){
  .dashboard-chart-wide .bar-chart{grid-template-columns:1fr}
}
@media(max-width:700px){
  .assignment-grid{grid-template-columns:1fr}
  .preview-stat-row{grid-template-columns:repeat(2,1fr)}
}

.preview-app-grid{
  display:grid;
  grid-template-columns:105px minmax(0,1fr);
  min-height:400px;
}
.preview-side{
  background:#17233b;
  color:#afbdd0;
  padding:10px 7px;
}
.preview-side-brand{
  color:#fff;
  font-size:8px;
  font-weight:800;
  padding:4px 5px 10px;
  border-bottom:1px solid rgba(255,255,255,.08);
  margin-bottom:7px;
}
.preview-side-item{
  padding:6px 6px;
  border-radius:5px;
  font-size:7px;
  font-weight:700;
  margin:2px 0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.preview-side-item.active{
  background:rgba(109,92,232,.28);
  color:#fff;
}
@media(max-width:700px){
  .preview-app-grid{grid-template-columns:82px minmax(0,1fr)}
}


/* ===========================
   v9 RBAC + self signup
   =========================== */
.auth-secondary-actions{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:4px;
}
.users-layout{
  display:grid;
  gap:14px;
}
.permission-panel{
  overflow:hidden;
}
.permission-scroll{
  overflow:auto;
  border:1px solid var(--border);
  border-radius:10px;
}
.permission-table{
  width:max-content;
  min-width:100%;
  border-collapse:collapse;
  font-size:10px;
}
.permission-table th,.permission-table td{
  border-right:1px solid var(--border);
  border-bottom:1px solid var(--border);
  padding:8px 9px;
  text-align:center;
  min-width:115px;
}
.permission-table th:first-child,.permission-table td:first-child{
  min-width:190px;
  text-align:left;
  position:sticky;
  left:0;
  z-index:3;
  background:#f8fafc;
}
.permission-table thead th{
  background:#f2f5f9;
  color:#536176;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.04em;
  font-size:9px;
}
.permission-table thead th:first-child{z-index:4}
.permission-check{
  width:16px;
  height:16px;
  accent-color:var(--purple);
}
.access-chips{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.access-chip{
  display:inline-flex;
  border-radius:99px;
  padding:4px 7px;
  font-size:9px;
  font-weight:800;
  background:#eef4ff;
  color:#466da4;
}
.role-staff{background:#f2f4f7;color:#5e6877}
.role-teacher_qc{background:#edf4ff;color:#40699f}
.role-team_leader{background:#f1edff;color:#624ec0}
.role-admin{background:#eaf7ef;color:#2d7550}
.role-super_admin{background:#fff3dc;color:#8c6119}
.user-access-note{
  padding:9px 10px;
  border:1px solid #d9e2ed;
  background:#f7f9fc;
  border-radius:8px;
  font-size:10px;
  color:#68778b;
}
.pending-access{
  padding:18px;
  border:1px dashed #cbd5e1;
  border-radius:10px;
  color:#6f7d90;
  background:#fafbfd;
  font-size:11px;
  text-align:center;
}
@media(max-width:700px){
  .auth-secondary-actions{flex-direction:column;gap:0}
}

/* Core clean: dashboard keeps only Total Platforms + Total Systems */
.stats-grid{grid-template-columns:repeat(2,minmax(220px,1fr))!important}
@media(max-width:850px){.stats-grid{grid-template-columns:1fr!important}}


/* ==========================================================
   v10.8 — Resource & Account Data Center
   ========================================================== */
.nav-section-label{
  margin:12px 9px 5px;
  font-size:8px;
  font-weight:800;
  letter-spacing:.12em;
  color:#8b97a8;
}
.data-toolbar{grid-template-columns:minmax(220px,1.4fr) minmax(150px,.7fr) minmax(170px,.8fr)}
#view-accounts .data-toolbar{grid-template-columns:minmax(220px,1.4fr) minmax(150px,.7fr) minmax(170px,.8fr) minmax(130px,.5fr)}
.data-info-banner,.credential-warning{
  border:1px solid #e1e7ef;
  background:#f8faff;
  border-radius:9px;
  padding:9px 11px;
  margin-bottom:10px;
  font-size:9px;
  color:#69788d;
}
.credential-warning{background:#fffaf0;border-color:#eee1bd;color:#82652d}
.data-management-table td{vertical-align:middle}
.link-actions{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.open-link-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:4px;
  min-width:52px;padding:5px 8px;border:1px solid #dce4ef;background:#fff;
  border-radius:7px;color:#53647b;text-decoration:none;font-size:8px;font-weight:800
}
.open-link-btn:hover{border-color:#8aa2d7;background:#f7f9ff}
.no-link{color:#a1aab7;font-size:9px}
.account-secret-cell{min-width:180px}
.secret-display{
  display:inline-flex;align-items:center;min-width:88px;height:26px;padding:0 8px;
  border:1px solid #e1e6ed;border-radius:7px;background:#f8fafc;color:#55657a;
  font-size:9px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace
}
.secret-actions{display:flex;gap:5px;align-items:center;flex-wrap:wrap}
.secret-restricted{font-size:8px;color:#9a7a3a;background:#fff8e8;border:1px solid #eedfb7;padding:4px 7px;border-radius:999px;font-weight:800}
.work-type-pill{
  display:inline-flex;padding:4px 7px;border-radius:999px;
  background:#f0f3f8;color:#586a82;font-size:8px;font-weight:800
}
.work-type-pill.WFH{background:#eef5ff;color:#4b6f9c}
.work-type-pill.ONSITE{background:#edf8f1;color:#3c7755}
.csv-import-result{display:grid;gap:6px;margin-top:10px}
.csv-import-result div{font-size:9px;color:#617086}
.data-modal-note{
  font-size:8px;color:#7f8b9b;background:#f7f9fc;border-radius:8px;padding:8px 9px;
  line-height:1.5
}
@media(max-width:900px){
  .data-toolbar,#view-accounts .data-toolbar{grid-template-columns:1fr}
}


/* ==========================================================
   v10.9 — Third Party Group Data
   ========================================================== */
.third-party-tabs{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.panel-subhead{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  margin:4px 0 12px;padding-bottom:10px;border-bottom:1px solid #e8edf3
}
.panel-subhead h3{margin:0;color:#2d3a4d;font-size:12px}
.panel-subhead p{margin:3px 0 0;color:#8592a3;font-size:9px}
.third-party-name{
  font-weight:800;color:#314055
}
.third-party-group-name{color:#56657a;font-size:9px}
@media(max-width:700px){
  .third-party-tabs{width:100%}
  .third-party-tabs .btn{flex:1}
}


/* ==========================================================
   v10.11 — Professional Data UI
   ========================================================== */
.topbar{gap:14px}
.top-actions{position:relative}
.global-search-wrap{
  position:relative;
  width:min(330px,30vw);
  min-width:220px;
}
.global-search-icon{
  position:absolute;left:10px;top:50%;transform:translateY(-50%);
  color:#8491a4;font-size:15px;z-index:2;pointer-events:none
}
.global-search-input{
  width:100%;height:34px;border:1px solid #dce3ed;border-radius:10px;
  background:#fff;padding:0 12px 0 31px;color:#344257;font:inherit;font-size:10px;
  outline:none;transition:.15s ease
}
.global-search-input:focus{border-color:#8478db;box-shadow:0 0 0 3px rgba(116,98,210,.09)}
.global-search-results{
  position:absolute;right:0;top:40px;width:min(430px,80vw);max-height:430px;overflow:auto;
  background:#fff;border:1px solid #dfe5ee;border-radius:12px;box-shadow:0 18px 50px rgba(28,39,57,.18);
  padding:6px;z-index:200
}
.search-result-item{
  width:100%;border:0;background:#fff;display:grid;grid-template-columns:34px minmax(0,1fr) auto;
  gap:9px;align-items:center;padding:9px 10px;border-radius:9px;text-align:left;cursor:pointer
}
.search-result-item:hover{background:#f5f7fc}
.search-result-icon{
  width:30px;height:30px;border-radius:8px;background:#f0efff;color:#6153c4;
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:900
}
.search-result-main{display:grid;gap:2px;min-width:0}
.search-result-main strong{font-size:10px;color:#303e53;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-result-main small{font-size:8px;color:#8995a6;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-result-type{font-size:8px;font-weight:800;color:#69778b;background:#f1f3f6;padding:4px 7px;border-radius:99px}
.search-result-empty{padding:18px;text-align:center;color:#8793a4;font-size:9px}

.dashboard-section-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:10px;margin:3px 1px 8px
}
.dashboard-section-head h2{font-size:12px;color:#2c394d;margin:0}
.dashboard-section-head p{font-size:9px;color:#8793a4;margin:2px 0 0}
.health-average-badge{
  font-size:8px;font-weight:800;background:#f0efff;color:#6255be;border-radius:99px;padding:5px 8px
}
.data-health-grid{
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:12px
}
.health-card{
  background:#fff;border:1px solid #dfe6ef;border-radius:11px;padding:11px;
  display:grid;grid-template-columns:28px minmax(0,1fr) auto;align-items:center;gap:8px;
  box-shadow:0 2px 8px rgba(31,45,61,.035)
}
.health-card:hover{border-color:#b9c6e5;transform:translateY(-1px)}
.health-icon{
  width:28px;height:28px;border-radius:8px;background:#f5f6fa;color:#637087;
  display:flex;align-items:center;justify-content:center;font-weight:900
}
.health-card div{display:grid;gap:1px}
.health-card small{font-size:8px;color:#8490a2;font-weight:800;text-transform:uppercase}
.health-card strong{font-size:18px;color:#2a384d}
.health-card span:last-child{font-size:8px;color:#929dac}
.health-card>b{font-size:12px;color:#a1aabb}

.health-progress-wrap{min-width:110px;display:grid;gap:4px}
.health-progress-top{display:flex;align-items:center;justify-content:space-between;gap:7px}
.health-progress-top strong{font-size:9px;color:#405069}
.health-progress-track{height:5px;border-radius:99px;background:#edf0f5;overflow:hidden}
.health-progress-fill{height:100%;border-radius:99px;background:currentColor}
.health-progress-wrap.complete{color:#3d8b61}
.health-progress-wrap.good{color:#6281c2}
.health-progress-wrap.warn{color:#c08b31}
.health-progress-wrap.bad{color:#c26060}
.health-progress-note{font-size:8px;color:#8a95a5}
.platform-name-action{
  border:0;background:transparent;padding:0;color:#31415a;font:inherit;font-weight:800;cursor:pointer;text-align:left
}
.platform-name-action:hover{color:#5f52c4;text-decoration:underline}
.stale-badge{display:inline-flex;margin-top:3px;padding:3px 6px;border-radius:99px;background:#fff3df;color:#956824;font-size:8px;font-weight:800}

.modal.modal-wide{width:min(920px,96vw)}
.modal.modal-import{width:min(820px,96vw)}
.platform360-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px
}
.platform360-title{display:grid;gap:4px}
.platform360-title h2{display:flex;align-items:center;gap:8px}
.platform360-meta{display:flex;gap:6px;flex-wrap:wrap}
.platform360-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.platform360-section{
  border:1px solid #e1e7ef;border-radius:11px;background:#fff;padding:11px;min-width:0
}
.platform360-section.span-2{grid-column:1/-1}
.platform360-section h3{margin:0 0 8px;font-size:10px;color:#354358}
.platform360-row{
  display:grid;grid-template-columns:125px minmax(0,1fr);gap:8px;padding:6px 0;border-bottom:1px dashed #edf0f4;
  align-items:start
}
.platform360-row:last-child{border-bottom:0}
.platform360-row label{font-size:8px;font-weight:800;text-transform:uppercase;color:#8a95a5}
.platform360-row .value{font-size:9px;color:#4c5c72;min-width:0;overflow-wrap:anywhere}
.platform360-list{display:grid;gap:6px}
.platform360-item{border:1px solid #e8ecf2;border-radius:8px;background:#fafbfd;padding:8px}
.platform360-item strong{font-size:9px;color:#39475c}
.platform360-item small{display:block;margin-top:2px;font-size:8px;color:#8995a6}
.platform360-empty{font-size:9px;color:#949eac;padding:5px 0}
.completion-hero{
  display:flex;align-items:center;gap:12px;border-radius:10px;background:#f7f8fc;padding:10px
}
.completion-ring{
  width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  background:conic-gradient(currentColor var(--pct),#e9edf3 0);position:relative
}
.completion-ring:after{content:"";position:absolute;width:39px;height:39px;background:#fff;border-radius:50%}
.completion-ring b{position:relative;z-index:1;font-size:10px;color:#354358}
.completion-ring.complete{color:#4b966c}.completion-ring.good{color:#657fc3}.completion-ring.warn{color:#c29139}.completion-ring.bad{color:#c36565}
.completion-details{display:grid;gap:3px}
.completion-details strong{font-size:11px;color:#344156}
.completion-details span{font-size:8px;color:#8591a2}

.import-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin:10px 0}
.import-summary-card{border:1px solid #e1e7ee;border-radius:9px;background:#fafbfd;padding:9px;display:grid;gap:2px}
.import-summary-card small{font-size:8px;color:#8894a5;text-transform:uppercase;font-weight:800}
.import-summary-card strong{font-size:16px;color:#344258}
.import-preview-table{width:100%;border-collapse:collapse;font-size:8px}
.import-preview-table th,.import-preview-table td{padding:7px;border-bottom:1px solid #edf0f4;text-align:left}
.import-preview-table th{font-size:8px;color:#7c899c;text-transform:uppercase;background:#fafbfd}
.import-status{display:inline-flex;padding:3px 6px;border-radius:99px;font-size:7px;font-weight:800}
.import-status.new{background:#eaf7ef;color:#347552}
.import-status.update{background:#edf4ff;color:#4c70a5}
.import-status.error{background:#fff0f0;color:#a34d4d}
.import-preview-scroll{max-height:330px;overflow:auto;border:1px solid #e5eaf1;border-radius:9px}
.import-error-list{margin-top:9px;padding:8px;border-radius:8px;background:#fff8f8;color:#9c5555;font-size:8px;max-height:100px;overflow:auto}

@media(max-width:1150px){
  .data-health-grid{grid-template-columns:repeat(3,1fr)}
  .global-search-wrap{width:250px}
}
@media(max-width:850px){
  .global-search-wrap{display:none}
  .data-health-grid{grid-template-columns:repeat(2,1fr)}
  .platform360-grid{grid-template-columns:1fr}
  .platform360-section.span-2{grid-column:auto}
}
@media(max-width:560px){
  .data-health-grid{grid-template-columns:1fr}
  .import-summary-grid{grid-template-columns:repeat(2,1fr)}
}

/* v10.11.1 login diagnostics */
#loginSubmitText.loading{cursor:wait;opacity:.82}
#loginSubmitText:disabled{cursor:wait}
#loginError:not(:empty){margin-top:9px;padding:8px 9px;border:1px solid #f0caca;background:#fff4f4;border-radius:8px}


/* v10.11.2 — pending account state */
.pending-role-panel{min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px}
.pending-role-icon{width:52px;height:52px;border-radius:15px;background:#f0efff;color:#6254c7;display:grid;place-items:center;font-size:22px;font-weight:900}
.pending-role-panel h2{margin:2px 0 0;color:#2d3a50;font-size:16px}
.pending-role-panel>p{max-width:480px;margin:0;color:#7e8a9c;font-size:10px;line-height:1.6}
.pending-role-box{max-width:520px;width:100%;display:grid;gap:3px;padding:11px 13px;border:1px solid #e2e7ef;border-radius:10px;background:#fafbfd;margin:4px 0}
.pending-role-box strong{font-size:10px;color:#46566c}
.pending-role-box span{font-size:9px;color:#8995a6}


/* ==========================================================
   v10.12 — Sidebar customizer, searchable selects, secure creds
   ========================================================== */
:root{
  --sidebar-width-custom:248px;
  --sidebar-bg-custom:#17243b;
  --sidebar-active-custom:#263965;
  --sidebar-accent-custom:#8a7dff;
}
.app-shell{grid-template-columns:var(--sidebar-width-custom) minmax(0,1fr)!important}
.sidebar{background:linear-gradient(180deg,var(--sidebar-bg-custom),color-mix(in srgb,var(--sidebar-bg-custom) 76%,#000))!important}
.nav-item.active{
  background:linear-gradient(90deg,var(--sidebar-active-custom),color-mix(in srgb,var(--sidebar-active-custom) 60%,transparent))!important;
  box-shadow:inset 3px 0 0 var(--sidebar-accent-custom)!important
}
.nav-section-label:empty{display:none!important}

.sidebar-menu-editor{display:grid;gap:7px;margin-top:10px}
.sidebar-menu-row{
  display:grid;grid-template-columns:40px minmax(150px,1fr) 125px 76px 58px 72px;
  gap:6px;align-items:center;border:1px solid #e4e9f0;border-radius:9px;padding:7px;background:#fafbfd
}
.sidebar-menu-row .input,.sidebar-menu-row .select{min-width:0}
.sidebar-menu-row label{font-size:8px;color:#7e8a9c;font-weight:800}
.sidebar-menu-row .menu-visible{display:flex;align-items:center;justify-content:center;gap:4px;font-size:8px;color:#657388}
.sidebar-order-actions{display:flex;gap:3px}
.sidebar-order-actions button{width:28px;height:28px;padding:0}
.color-input{height:36px;padding:3px}

.searchable-select{position:relative}
.searchable-select .searchable-select-query{padding-right:34px}
.searchable-select-arrow{
  position:absolute;right:10px;top:18px;transform:translateY(-50%);color:#748197;pointer-events:none
}
.searchable-select-menu{
  position:absolute;z-index:500;left:0;right:0;top:40px;max-height:230px;overflow:auto;
  border:1px solid #dce3ed;border-radius:9px;background:#fff;box-shadow:0 12px 35px rgba(31,45,61,.16);padding:5px
}
.searchable-select-option{
  display:grid;width:100%;border:0;background:#fff;border-radius:7px;padding:8px 9px;text-align:left;cursor:pointer
}
.searchable-select-option:hover,.searchable-select-option.active{background:#f2f5fb}
.searchable-select-option strong{font-size:9px;color:#35445a}
.searchable-select-option small{font-size:8px;color:#8c97a6;margin-top:2px}
.searchable-select-empty{padding:10px;text-align:center;font-size:8px;color:#929daa}

.protected-value{
  display:inline-flex;min-width:86px;align-items:center;justify-content:flex-start;
  border:1px solid #e1e6ed;background:#f8fafc;border-radius:7px;padding:6px 8px;
  font-size:9px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:#5d6d82
}
.credential-pair{display:grid;gap:5px;min-width:155px}
.credential-pair-line{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.credential-pair-line label{width:54px;font-size:7px;text-transform:uppercase;color:#8c97a7;font-weight:800}
.credential-security-note{
  border:1px solid #dce6f5;background:#f6f9ff;color:#5b6e8a;border-radius:9px;padding:8px 10px;font-size:8px;line-height:1.5
}
.credential-expiry{font-size:7px;color:#9a7a3a}

@media(max-width:1050px){
  .sidebar-menu-row{grid-template-columns:40px 1fr 110px 70px}
  .sidebar-menu-row .sidebar-order-actions,.sidebar-menu-row .menu-visible{grid-column:auto}
}
@media(max-width:700px){
  .sidebar-menu-row{grid-template-columns:1fr}
}


/* ==========================================================
   v10.13 — Typography controls
   ========================================================== */
:root{
  --type-font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --type-body-weight:400;
  --type-sidebar-size:12px;
  --type-sidebar-weight:650;
  --type-section-size:8px;
  --type-section-transform:uppercase;
  --type-page-title-size:24px;
  --type-page-subtitle-size:12px;
  --type-panel-title-size:15px;
  --type-heading-weight:700;
  --type-table-header-size:9px;
  --type-table-header-weight:800;
  --type-table-header-transform:uppercase;
  --type-table-header-spacing:.04em;
  --type-table-body-size:11px;
  --type-table-body-weight:400;
  --type-button-size:12px;
  --type-button-weight:700;
  --type-form-label-size:10px;
  --type-input-size:12px;
}
html,body,button,input,select,textarea{font-family:var(--type-font-family)!important}
body{font-weight:var(--type-body-weight)}

.nav-item{
  font-size:var(--type-sidebar-size)!important;
  font-weight:var(--type-sidebar-weight)!important
}
.nav-section-label{
  font-size:var(--type-section-size)!important;
  text-transform:var(--type-section-transform)!important
}
.topbar h1{
  font-size:var(--type-page-title-size)!important;
  font-weight:var(--type-heading-weight)!important
}
.topbar p{font-size:var(--type-page-subtitle-size)!important}
.panel-head h2,.panel-subhead h3{
  font-size:var(--type-panel-title-size)!important;
  font-weight:var(--type-heading-weight)!important
}
.management-table th{
  font-size:var(--type-table-header-size)!important;
  font-weight:var(--type-table-header-weight)!important;
  text-transform:var(--type-table-header-transform)!important;
  letter-spacing:var(--type-table-header-spacing)!important
}
.management-table td{
  font-size:var(--type-table-body-size)!important;
  font-weight:var(--type-table-body-weight)!important
}
.btn,.btn-small,.text-btn{
  font-size:var(--type-button-size)!important;
  font-weight:var(--type-button-weight)!important
}
.modal-form label,.branding-form label,.form-grid label{
  font-size:var(--type-form-label-size)!important
}
.input,.select,textarea,.searchable-select-query{
  font-size:var(--type-input-size)!important
}
.typography-presets{display:flex;gap:6px;flex-wrap:wrap}
#typographyCustomizationSection .form-grid>div{min-width:0}

/* v10.14 Team Platform Summary */
.team-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:12px}
.team-summary-card{border:1px solid #dfe6ef;border-radius:11px;background:#fff;padding:11px;display:grid;gap:8px;cursor:pointer;box-shadow:0 2px 8px rgba(31,45,61,.035);transition:.15s ease}
.team-summary-card:hover{border-color:#b7c5e4;transform:translateY(-1px);box-shadow:0 5px 14px rgba(31,45,61,.07)}
.team-summary-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.team-summary-name{min-width:0;display:grid;gap:2px}
.team-summary-name small{font-size:7px;color:#8b96a6;text-transform:uppercase;font-weight:800;letter-spacing:.04em}
.team-summary-name strong{font-size:12px;color:#334258;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.team-summary-total{display:flex;align-items:baseline;gap:5px}
.team-summary-total b{font-size:22px;color:#2d3b51}
.team-summary-total span{font-size:8px;color:#8793a4;font-weight:700}
.team-summary-meta{display:flex;align-items:center;justify-content:space-between;gap:7px;font-size:8px;color:#7c899b}
.team-system-breakdown{display:flex;gap:4px;flex-wrap:wrap}
.team-system-chip{display:inline-flex;align-items:center;gap:4px;max-width:100%;padding:4px 6px;border-radius:999px;background:#f3f5f8;color:#68778b;font-size:7px;font-weight:700}
.team-system-chip b{color:#435168}
.team-unassigned-card{background:#fafbfd;border-style:dashed}
.system-team-badge{display:inline-flex;align-items:center;gap:4px;margin-top:5px;border-radius:999px;padding:4px 7px;background:#f0efff;color:#6156b5;font-size:8px;font-weight:800}
@media(max-width:1180px){.team-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:850px){.team-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:540px){.team-summary-grid{grid-template-columns:1fr}}


/* ==========================================================
   v10.15 — Premium dashboard redesign
   ========================================================== */
body{background:#eef3fb}
.app-shell{background:#eef3fb}
.sidebar{
  background:radial-gradient(circle at 15% 10%,rgba(33,73,180,.24),transparent 26%),linear-gradient(180deg,#061c4b 0%,#051634 53%,#07172f 100%)!important;
  border-right:1px solid rgba(255,255,255,.06);box-shadow:8px 0 30px rgba(7,26,64,.12)
}
.brand{padding:14px 14px 11px;border-bottom:0}
.brand-mark{width:42px;height:42px;border-radius:50%;background:linear-gradient(145deg,#673dff,#1564ff);box-shadow:0 7px 18px rgba(38,73,255,.4);font-size:14px}
.brand-name{font-size:15px!important;color:#fff!important;font-weight:800!important;letter-spacing:.01em}
.brand-sub{color:#dbe6ff!important;font-size:9px!important;margin-top:2px}
.nav{padding:8px 9px 140px;gap:3px}
.nav-item{min-height:42px;border-radius:10px!important;color:#eef4ff!important;padding:0 12px!important;gap:11px!important;opacity:.9}
.nav-item span{font-size:16px!important;color:#f4f7ff}
.nav-item b{font-weight:650!important}
.nav-item:hover{background:rgba(62,98,194,.22)!important;opacity:1}
.nav-item.active{background:linear-gradient(100deg,#6752ff,#193dff)!important;box-shadow:0 8px 22px rgba(40,65,255,.32),inset 0 0 0 1px rgba(255,255,255,.16)!important;opacity:1}
.nav-section-label{color:#b7c6eb!important;opacity:.85;padding:16px 12px 6px!important;font-size:7px!important;letter-spacing:.08em!important}
.sidebar-foot{left:9px!important;right:9px!important;bottom:10px!important;border:1px solid rgba(77,118,237,.38)!important;border-radius:12px!important;background:linear-gradient(145deg,rgba(26,60,151,.86),rgba(9,35,87,.9))!important;padding:10px!important;box-shadow:0 8px 25px rgba(0,0,0,.18)}
.connection-row{order:2;color:#d9e7ff!important;font-size:8px!important;margin-top:7px}.connection-dot.ok{box-shadow:0 0 0 3px rgba(43,218,126,.13)}
.user-mini{order:1}.user-mini .avatar{background:linear-gradient(145deg,#ffd45a,#ff8a29)!important;color:#5f3300!important}.user-mini-text strong{color:#fff!important}.user-mini-text span{color:#d8e5ff!important}

.main{background:#eef3fb;padding:0 14px 20px!important;min-width:0}
.topbar{position:sticky;top:0;z-index:80;margin:0 -14px 10px;padding:9px 18px!important;background:linear-gradient(90deg,#071b48,#031332)!important;border-bottom:0!important;box-shadow:0 4px 16px rgba(2,18,50,.16);min-height:56px}
.topbar-title h1{color:#fff!important;font-size:17px!important}.topbar-title p{color:#aebfe3!important}
.dashboard-mode .topbar-title{display:none}
.dashboard-mode .top-actions{margin-left:auto}
.global-search-wrap{width:min(360px,34vw)!important}.global-search-input{background:rgba(26,54,119,.55)!important;border:1px solid rgba(95,129,210,.18)!important;color:#fff!important;border-radius:16px!important;height:38px!important}.global-search-input::placeholder{color:#d0daf0!important}.global-search-icon{color:#fff!important}
.top-refresh{background:rgba(29,61,130,.65)!important;color:#fff!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:16px!important;height:38px}
.top-icon-btn{width:40px;height:38px;border:0;border-radius:14px;background:rgba(29,61,130,.65);color:#fff;position:relative;font-size:17px;cursor:pointer}
.top-alert-count{position:absolute;right:-2px;top:-3px;min-width:17px;height:17px;border-radius:999px;background:#ff3648;color:#fff;font-size:8px;font-weight:800;display:grid;place-items:center;padding:0 4px}.top-alert-count.hidden{display:none}
.top-user-chip{display:flex;align-items:center;gap:8px;padding:2px 8px 2px 4px;border-left:1px solid rgba(255,255,255,.08)}
.top-user-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#ffd65b,#ff8c23 58%,#6a2d00 100%);color:#fff;font-weight:900;box-shadow:0 0 0 2px rgba(255,209,72,.4)}
.top-user-copy{display:grid;gap:1px;min-width:90px}.top-user-copy strong{color:#fff;font-size:10px}.top-user-copy span{color:#d6e2fb;font-size:8px}.top-signout{color:#d7e4ff!important;border:1px solid rgba(255,255,255,.08)!important;border-radius:14px!important}

.premium-dashboard{padding-bottom:2px}
.premium-hero{position:relative;min-height:102px;border-radius:17px;overflow:hidden;display:flex;align-items:center;padding:13px 18px;gap:14px;background:radial-gradient(circle at 62% 80%,rgba(53,230,255,.55),transparent 20%),radial-gradient(circle at 76% 38%,rgba(247,74,255,.55),transparent 18%),linear-gradient(105deg,#078ee7 0%,#083cd8 42%,#5e18cf 73%,#17a9ff 100%);box-shadow:0 10px 28px rgba(31,76,199,.18),inset 0 0 0 1px rgba(255,255,255,.3);margin-bottom:12px}
.premium-hero:before{content:"";position:absolute;inset:-60% 30% -80% 38%;background:repeating-linear-gradient(110deg,transparent 0 18px,rgba(72,238,255,.15) 19px 21px);transform:rotate(-10deg);filter:blur(1px)}
.hero-badge-orb{position:relative;z-index:2;width:65px;height:65px;min-width:65px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#fff6b0,#f8b821 44%,#ff7d16 72%,#7b2a00);box-shadow:0 0 0 2px #b5f4ff,0 0 22px rgba(32,229,255,.8),inset 0 0 12px rgba(255,255,255,.8);font-size:31px;color:#fff2a4;text-shadow:0 2px 3px #8c4a00}
.hero-copy{position:relative;z-index:3;color:#fff;min-width:0}.hero-copy h2{margin:0;font-size:21px!important;font-weight:800!important;letter-spacing:-.02em}.hero-copy p{margin:6px 0 0;font-size:10px;color:#e9f6ff;font-weight:600}.hero-wave{font-size:17px}.hero-energy-art{position:absolute;right:218px;top:0;width:330px;height:100%;pointer-events:none}.hero-energy-ball{position:absolute;right:48px;top:12px;width:72px;height:72px;border-radius:50%;background:radial-gradient(circle at 38% 30%,#fff8a8 0 8%,#ffce34 22%,#ff821f 63%,#ff3b12 100%);box-shadow:0 0 15px #fff3a0,0 0 35px #ff9326,0 0 65px #ff4c1c;display:grid;grid-template-columns:1fr 1fr;place-items:center;padding:13px;color:#e9381c;font-size:12px;transform:rotate(-10deg)}
.hero-energy-ring{position:absolute;border:2px solid rgba(91,242,255,.75);border-radius:50%;filter:drop-shadow(0 0 8px #2ee9ff);transform:rotate(-18deg)}.ring-one{width:220px;height:76px;right:4px;top:10px}.ring-two{width:270px;height:92px;right:-25px;top:4px;border-color:rgba(255,126,255,.55)}
.hero-character-picker{position:relative;z-index:4;margin-left:auto;width:220px;background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.65);border-radius:13px;padding:8px 10px;box-shadow:0 5px 18px rgba(10,41,114,.12)}.hero-character-picker label{display:block;color:#2a3b66;font-size:8px;font-weight:800;margin-bottom:5px}.hero-character-control{display:flex;align-items:center;gap:8px;background:#f7f9ff;border-radius:9px;padding:5px 7px}.hero-character-control>span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#ffd35a,#ff7c17);color:#fff;font-weight:900}.hero-character-control select{width:100%;border:0;outline:0;background:transparent;font-size:9px;font-weight:700;color:#263650}

.premium-kpi-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-bottom:12px}.premium-kpi{position:relative;overflow:hidden;min-height:84px;border-radius:14px;padding:12px;color:#fff;display:flex;align-items:center;gap:11px;box-shadow:0 7px 18px rgba(44,72,151,.14);border:1px solid rgba(255,255,255,.34)}.premium-kpi:after{content:"";position:absolute;width:120px;height:70px;right:-20px;bottom:-35px;border:1px solid rgba(255,255,255,.22);border-radius:50%}.premium-kpi-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.14);font-size:21px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}.premium-kpi>div{display:grid;gap:1px}.premium-kpi small{font-size:8px;font-weight:700;color:#fff}.premium-kpi strong{font-size:22px;line-height:1.1}.premium-kpi div span{font-size:7px;color:rgba(255,255,255,.88)}.kpi-blue{background:linear-gradient(135deg,#087bf4,#0d3ee8)}.kpi-green{background:linear-gradient(135deg,#13b75d,#03846c)}.kpi-purple{background:linear-gradient(135deg,#a04ff5,#5e19df)}.kpi-orange{background:linear-gradient(135deg,#ffb830,#ff682a)}.kpi-teal{background:linear-gradient(135deg,#38daca,#08a7b5)}

.premium-grid{display:grid;gap:10px;margin-bottom:10px}.premium-grid-top{grid-template-columns:minmax(0,2.2fr) minmax(220px,.9fr) minmax(240px,.9fr)}.premium-grid-middle{grid-template-columns:1fr 1fr 1.12fr}.premium-grid-bottom{grid-template-columns:minmax(0,1.8fr) minmax(260px,.82fr) minmax(190px,.55fr)}
.premium-panel{background:#fff;border:1px solid #dfe6f0;border-radius:14px;box-shadow:0 5px 16px rgba(39,60,105,.055);overflow:hidden;min-width:0}.premium-panel-head{min-height:46px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-bottom:1px solid #edf1f6}.premium-panel-head h3{margin:0;color:#18253c;font-size:11px!important;font-weight:800!important}.premium-panel-head p{margin:2px 0 0;color:#8794a7;font-size:7px}.premium-link{border:0;background:transparent;color:#1458f3;font-weight:800;font-size:8px;cursor:pointer;white-space:nowrap}.soft-badge{font-size:7px;font-weight:800;color:#5f54b4;background:#f0efff;border-radius:999px;padding:4px 7px}

.system-overview-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:11px}.system-mini-card{border-radius:11px;background:linear-gradient(145deg,#f8fbff,#eef4fb);border:1px solid #e6ecf3;padding:10px;display:grid;gap:8px;cursor:pointer;transition:.15s}.system-mini-card:hover{transform:translateY(-1px);border-color:#bdcbe8}.system-mini-head{display:flex;align-items:center;gap:7px;min-width:0}.system-flag{width:24px;height:24px;border-radius:7px;background:#fff;display:grid;place-items:center;font-size:14px;box-shadow:0 2px 5px rgba(36,58,99,.08)}.system-mini-head strong{font-size:9px;color:#26344c;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.system-mini-count{font-size:9px;color:#3a4860;font-weight:800}.system-mini-meta{display:flex;gap:10px;color:#66768c;font-size:7px;font-weight:700}.system-mini-progress{display:flex;align-items:center;gap:7px}.system-mini-track{height:6px;background:#e5ebf2;border-radius:99px;overflow:hidden;flex:1}.system-mini-fill{height:100%;background:linear-gradient(90deg,#42bf61,#13a278);border-radius:99px}.system-mini-progress b{font-size:9px}.system-mini-foot{font-size:7px;color:#169256;font-weight:700}
.quick-actions-panel{min-width:0}.quick-action-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:11px}.quick-action{min-height:50px;border:0;border-radius:10px;display:flex;align-items:center;justify-content:center;gap:7px;font-size:8px;font-weight:800;cursor:pointer;transition:.15s}.quick-action:hover{transform:translateY(-1px);filter:saturate(1.1)}.quick-action b{font-size:18px}.quick-action.wide{grid-column:1/-1}.qa-purple{color:#633ad0;background:linear-gradient(135deg,#f1e6ff,#e9d9ff)}.qa-green{color:#168365;background:linear-gradient(135deg,#dff8ee,#d5f4e8)}.qa-blue{color:#1767d8;background:linear-gradient(135deg,#e1f1ff,#dceeff)}.qa-orange{color:#f05a1f;background:linear-gradient(135deg,#fff0df,#ffead5)}.qa-violet{color:#6034ce;background:linear-gradient(135deg,#f0e9ff,#ece6ff)}
.attention-panel{background:linear-gradient(180deg,#fff,#fffaf7)}.attention-panel .premium-panel-head h3{color:#161f32}.attention-count{width:23px;height:23px;border-radius:50%;background:#ff253c;color:#fff;display:grid;place-items:center;font-size:9px;font-weight:900}.attention-list{padding:4px 11px}.attention-item{display:grid;grid-template-columns:24px minmax(0,1fr) auto;align-items:center;gap:7px;padding:8px 0;border-bottom:1px solid #f0f2f5;cursor:pointer}.attention-item:last-child{border-bottom:0}.attention-item-icon{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;font-size:10px}.attention-item strong{font-size:8px;color:#2b374a}.attention-item span{font-size:8px;font-weight:900}.attention-red .attention-item-icon{background:#ffe4e8;color:#f0233d}.attention-orange .attention-item-icon{background:#fff0d9;color:#f29516}.attention-blue .attention-item-icon{background:#e3f2ff;color:#2580e9}.attention-violet .attention-item-icon{background:#eee8ff;color:#7249e7}.attention-all-btn{margin:6px 11px 11px;width:calc(100% - 22px);height:29px;border:0;border-radius:99px;background:linear-gradient(90deg,#ffbd4b,#ff744c);color:#a82915;font-size:8px;font-weight:900;cursor:pointer}
.team-summary-list{padding:3px 11px 7px}.team-summary-row{display:grid;grid-template-columns:minmax(110px,.9fr) 55px minmax(130px,1.35fr) 38px;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid #edf1f5;cursor:pointer}.team-summary-row:last-child{border-bottom:0}.team-summary-identity{display:flex;align-items:center;gap:7px;min-width:0}.team-summary-avatar{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;background:#efe8ff;color:#6b3fe0}.team-summary-identity div{display:grid;min-width:0}.team-summary-identity strong{font-size:8px;color:#29364b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.team-summary-identity span{font-size:7px;color:#8793a4}.team-summary-systems{font-size:7px;color:#667489;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.team-summary-mini-track{height:6px;background:#e8edf3;border-radius:99px;overflow:hidden}.team-summary-mini-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#58b57a,#0fa68c)}.team-summary-score{font-size:9px;font-weight:900;color:#25344b;text-align:right}
.config-health-list{padding:6px 12px}.config-health-row{display:grid;grid-template-columns:115px minmax(0,1fr) 38px;gap:8px;align-items:center;padding:7px 0}.config-health-label{display:flex;align-items:center;gap:7px;font-size:8px;font-weight:700;color:#2d394c}.config-health-icon{width:23px;height:23px;border-radius:8px;display:grid;place-items:center;background:#e9f3ff;color:#1575df}.config-health-track{height:7px;background:#e8edf3;border-radius:99px;overflow:hidden}.config-health-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#36bf68,#19ad8c)}.config-health-row:nth-child(2) .config-health-fill{background:linear-gradient(90deg,#ff6d3e,#f5ba2b)}.config-health-row:nth-child(3) .config-health-fill{background:linear-gradient(90deg,#15b8ae,#16a0cf)}.config-health-row:nth-child(4) .config-health-fill{background:linear-gradient(90deg,#ff7765,#ee5a94)}.config-health-row:nth-child(5) .config-health-fill{background:linear-gradient(90deg,#8052f2,#5367f3)}.config-health-row b{font-size:9px;text-align:right}
.premium-activity-list{padding:3px 11px 7px}.premium-activity-item{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:7px;align-items:center;padding:7px 0;border-bottom:1px solid #edf1f5}.premium-activity-item:last-child{border-bottom:0}.premium-activity-avatar{width:27px;height:27px;border-radius:8px;display:grid;place-items:center;background:#ddecff;color:#1f67c5;font-size:9px;font-weight:900}.premium-activity-main{min-width:0;display:grid;gap:1px}.premium-activity-main strong{font-size:8px;color:#253247;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.premium-activity-main span{font-size:7px;color:#78869a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.premium-activity-time{font-size:7px;color:#6f7c8e;white-space:nowrap}
.coverage-overview{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;padding:13px}.coverage-metric{display:grid;gap:6px}.coverage-metric-head{display:flex;align-items:center;justify-content:space-between;gap:4px;font-size:7px;color:#68768b;font-weight:700}.coverage-metric-head b{font-size:10px;color:#27354a}.coverage-track{height:9px;background:#e8edf4;border-radius:99px;overflow:hidden}.coverage-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#2f7cf5,#6c42e7)}.coverage-metric:nth-child(2) .coverage-fill{background:linear-gradient(90deg,#10b890,#4bc17c)}.coverage-metric:nth-child(3) .coverage-fill{background:linear-gradient(90deg,#e655ff,#7541ef)}.coverage-metric:nth-child(4) .coverage-fill{background:linear-gradient(90deg,#ff913a,#ffbf34)}.coverage-metric:nth-child(5) .coverage-fill{background:linear-gradient(90deg,#17b8c2,#3f72f3)}
.top-systems-list{padding:7px 12px}.top-system-row{display:grid;grid-template-columns:115px minmax(0,1fr) 30px;gap:7px;align-items:center;padding:5px 0}.top-system-row strong{font-size:7px;color:#29374d;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.top-system-track{height:6px;background:#e8edf4;border-radius:99px;overflow:hidden}.top-system-fill{height:100%;border-radius:99px}.top-system-row b{font-size:8px;text-align:right}.premium-cta-card{border-radius:14px;padding:15px;background:radial-gradient(circle at 35% 35%,rgba(80,230,255,.36),transparent 20%),linear-gradient(145deg,#06278a,#3216c9 62%,#8f24f2);color:#fff;display:flex;align-items:center;justify-content:center;gap:10px;box-shadow:0 7px 18px rgba(54,47,198,.17)}.cta-rocket{font-size:37px;filter:drop-shadow(0 5px 10px rgba(0,0,0,.25))}.premium-cta-card strong{font-size:12px;line-height:1.2}.premium-cta-card p{font-size:7px;color:#e6e5ff;line-height:1.45;margin:8px 0 0}

@media(max-width:1280px){.premium-kpi-grid{grid-template-columns:repeat(3,1fr)}.premium-grid-top{grid-template-columns:2fr 1fr}.attention-panel{grid-column:1/-1}.premium-grid-middle{grid-template-columns:1fr 1fr}.recent-panel{grid-column:1/-1}.premium-grid-bottom{grid-template-columns:1.6fr 1fr}.premium-cta-card{grid-column:1/-1}.hero-energy-art{right:190px}.hero-character-picker{width:190px}}
@media(max-width:900px){.premium-kpi-grid{grid-template-columns:repeat(2,1fr)}.premium-grid-top,.premium-grid-middle,.premium-grid-bottom{grid-template-columns:1fr}.system-overview-cards{grid-template-columns:1fr 1fr}.coverage-overview{grid-template-columns:1fr 1fr}.hero-energy-art{display:none}.hero-character-picker{display:none}.top-user-copy{display:none}.global-search-wrap{display:none!important}}
@media(max-width:560px){.premium-kpi-grid{grid-template-columns:1fr}.system-overview-cards{grid-template-columns:1fr}.coverage-overview{grid-template-columns:1fr}.premium-hero{min-height:90px}.hero-copy h2{font-size:16px!important}.hero-badge-orb{width:52px;height:52px;min-width:52px}.top-user-chip{display:none}}

/* ==========================================================
   v10.16 — Reference-matched premium layout and navigation
   ========================================================== */
:root{--sidebar-width-custom:225px}
.app-shell{grid-template-columns:var(--sidebar-width-custom) minmax(0,1fr)!important}
.sidebar{padding:0!important;background:linear-gradient(180deg,#03142e 0%,#071a38 52%,#021329 100%)!important}
.brand{min-height:72px;padding:14px 16px!important;gap:10px}
.brand-mark{width:46px!important;height:46px!important;min-width:46px;border-radius:15px!important;font-size:18px!important}
.brand-name{font-size:14px!important;line-height:1.15}.brand-sub{font-size:10px!important}
.nav{padding:8px 13px 140px!important;gap:4px!important}
.nav-item{min-height:46px!important;padding:0 13px!important;border-radius:11px!important;font-size:12px!important;transition:opacity .18s ease,transform .18s ease,max-height .18s ease,margin .18s ease,padding .18s ease!important}
.nav-item span{font-size:18px!important}.nav-item b{font-size:12px!important;letter-spacing:.01em}
.nav-item.active{background:linear-gradient(100deg,#684dff,#2f27e8)!important;box-shadow:0 10px 25px rgba(53,49,255,.35),inset 0 0 0 1px rgba(255,255,255,.18)!important}
.nav-section-label{appearance:none;width:100%;border:0;background:transparent;color:#a8b9db!important;display:flex!important;align-items:center;justify-content:space-between;text-align:left;cursor:pointer;padding:18px 10px 7px!important;font-family:inherit;font-size:8px!important;font-weight:800;letter-spacing:.09em!important}
.nav-section-label.hidden{display:none!important}.nav-section-label:empty{display:none!important}
.nav-section-chevron{font-size:13px;line-height:1;color:#cbd7ef;transition:transform .18s ease}.nav-section-label.collapsed .nav-section-chevron{transform:rotate(-90deg)}
.nav-section-label:not([data-nav-section="main"]){
  min-height:38px;margin:13px 0 5px;padding:0 8px!important;border:1px solid rgba(133,164,231,.24)!important;
  border-radius:10px;background:linear-gradient(145deg,rgba(37,65,121,.88),rgba(9,31,72,.96))!important;
  display:grid!important;grid-template-columns:22px minmax(0,1fr) 27px;gap:7px;align-items:center;
  color:#f5f8ff!important;font-size:9px!important;letter-spacing:.1em!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),inset 0 -1px 0 rgba(0,0,0,.32),0 7px 15px rgba(0,7,26,.3),0 1px 2px rgba(70,112,218,.24);
  transform:translateZ(0);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease
}
.nav-section-label:not([data-nav-section="main"]):before{
  content:"◆";width:20px;height:20px;border-radius:6px;display:grid;place-items:center;
  background:linear-gradient(145deg,#735dff,#2459e9);color:#dce6ff;font-size:8px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45),inset 0 -2px 3px rgba(0,0,0,.25),0 3px 8px rgba(37,72,226,.4)
}
.nav-section-label[data-nav-section="management"]:before{background:linear-gradient(145deg,#ffcf58,#f07819);color:#fff6cb;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -2px 3px rgba(95,39,0,.28),0 3px 8px rgba(239,132,30,.35)}
.nav-section-label:not([data-nav-section="main"]):hover{transform:translateY(-1px);border-color:rgba(151,183,255,.42)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(0,0,0,.35),0 10px 20px rgba(0,7,26,.4)}
.nav-section-label:not([data-nav-section="main"]):active{transform:translateY(1px);box-shadow:inset 0 2px 5px rgba(0,0,0,.35),0 3px 8px rgba(0,7,26,.25)}
.nav-section-label:not([data-nav-section="main"]) .nav-section-chevron{width:25px;height:25px;border-radius:8px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(77,111,181,.72),rgba(13,37,81,.94));border:1px solid rgba(158,185,240,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.15),0 3px 7px rgba(0,5,20,.3);font-size:14px!important}
.nav-item.section-collapsed-item{display:none!important}
.sidebar-foot{left:13px!important;right:13px!important;bottom:14px!important;padding:11px!important}

.main{padding:0 14px 18px!important;background:#f5f7fb!important}
.topbar{min-height:62px;margin:0 -14px 12px!important;padding:9px 20px!important;background:#03142f!important}
.topbar-title h1{font-size:16px!important}.topbar-title p{font-size:10px!important}.top-actions{gap:9px!important}
.global-search-wrap{width:min(360px,31vw)!important}.top-refresh,.top-icon-btn{height:40px!important}.top-user-avatar{width:40px;height:40px}.top-user-copy strong{font-size:11px}.top-user-copy span{font-size:9px}

.premium-hero{min-height:104px;padding:14px 18px!important;border-radius:14px!important;background-image:linear-gradient(90deg,rgba(2,20,55,.9) 0%,rgba(3,27,85,.35) 45%,rgba(2,14,43,.05) 100%),url("./assets/cosmic-hero-v10-16.png")!important;background-size:cover!important;background-position:center 54%!important;box-shadow:0 8px 24px rgba(12,46,122,.2)!important}
.premium-hero:before,.hero-energy-art{display:none!important}.hero-badge-orb{width:64px;height:64px;min-width:64px;background:rgba(2,18,52,.72)!important;border:1px solid #fff!important;box-shadow:0 0 0 1px rgba(255,194,31,.35)!important;color:#ffd142!important;font-size:31px!important;text-shadow:none!important}
.hero-copy h2{font-size:22px!important}.hero-copy p{font-size:10px!important}.hero-character-picker{width:230px!important;background:rgba(13,34,88,.84)!important;border-color:rgba(255,255,255,.18)!important}.hero-character-picker label{color:#fff!important;font-size:9px!important}.hero-character-control{background:rgba(255,255,255,.08)!important}.hero-character-control select{color:#fff!important}.hero-character-control select option{color:#17243b}

.premium-kpi-grid{grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;margin-bottom:14px!important}.premium-kpi{min-height:102px!important;border-radius:14px!important;padding:14px!important;gap:13px!important}.premium-kpi-icon{width:48px!important;height:48px!important;font-size:24px!important}.premium-kpi small{font-size:10px!important}.premium-kpi strong{font-size:26px!important}.premium-kpi div span{font-size:8px!important}
.premium-grid{gap:12px!important;margin-bottom:12px!important}.premium-grid-top{grid-template-columns:minmax(0,2.2fr) minmax(250px,1fr) minmax(260px,1fr)!important}.premium-grid-middle{grid-template-columns:1.05fr 1fr 1.15fr!important}.premium-grid-bottom{grid-template-columns:minmax(0,1.7fr) minmax(260px,.8fr) minmax(220px,.62fr)!important}
.premium-panel{border-radius:13px!important;border-color:#dfe5ee!important;box-shadow:0 4px 13px rgba(34,56,96,.055)!important}.premium-panel-head{min-height:50px!important;padding:11px 14px!important}.premium-panel-head h3{font-size:13px!important}.premium-panel-head p{font-size:8px!important}.premium-link{font-size:9px!important}
.system-overview-cards{padding:12px!important;gap:11px!important}.system-mini-card{padding:12px!important;min-height:145px}.system-mini-head strong{font-size:10px!important}.system-mini-count{font-size:11px!important}.system-mini-meta,.system-mini-foot{font-size:8px!important}.system-mini-progress b{font-size:10px!important}
.quick-action-grid{padding:12px!important;gap:9px!important}.quick-action{min-height:56px!important;font-size:9px!important}.attention-list{padding:5px 13px!important}.attention-item{padding:9px 0!important}.attention-item strong,.attention-item span{font-size:9px!important}
.team-summary-list,.premium-activity-list{padding:6px 13px 10px!important}.team-summary-row{padding:9px 0!important}.team-summary-identity strong,.premium-activity-main strong{font-size:9px!important}.team-summary-identity span,.team-summary-systems,.premium-activity-main span,.premium-activity-time{font-size:8px!important}
.config-health-list{padding:7px 14px!important}.config-health-row{grid-template-columns:125px minmax(0,1fr) 40px!important;padding:8px 0!important}.config-health-label{font-size:9px!important}.config-health-row b{font-size:10px!important}.coverage-overview{padding:15px!important}.coverage-metric-head{font-size:8px!important}.coverage-metric-head b{font-size:11px!important}.top-systems-list{padding:10px 14px!important}.top-system-row{padding:7px 0!important}.top-system-row strong,.top-system-row b{font-size:9px!important}.premium-cta-card{background:radial-gradient(circle at 25% 70%,rgba(33,201,255,.5),transparent 22%),linear-gradient(145deg,#031b63,#2514aa 58%,#8326ec)!important}.cta-rocket{font-size:48px!important}.premium-cta-card strong{font-size:15px!important}.premium-cta-card p{font-size:9px!important}

.panel{border-radius:13px!important}.data-management-table th{font-size:9px!important}.data-management-table td{font-size:10px!important}.data-management-table tbody tr:hover{background:#f2f6ff!important}.data-info-banner{font-size:9px!important}
.spreadsheet-note{margin-top:4px;color:#7b8799;font-size:8px;max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media(max-width:1180px){.premium-kpi-grid{grid-template-columns:repeat(3,1fr)!important}.premium-grid-top{grid-template-columns:1.7fr 1fr!important}.attention-panel{grid-column:1/-1}.premium-grid-middle{grid-template-columns:1fr 1fr!important}.recent-panel{grid-column:1/-1}.premium-grid-bottom{grid-template-columns:1.5fr 1fr!important}.premium-cta-card{grid-column:1/-1}.hero-character-picker{width:190px!important}}
@media(max-width:900px){.premium-kpi-grid{grid-template-columns:repeat(2,1fr)!important}.premium-grid-top,.premium-grid-middle,.premium-grid-bottom{grid-template-columns:1fr!important}}
@media(max-width:850px){
  .app-shell{grid-template-columns:1fr!important}.sidebar{position:relative!important;height:auto!important}.brand{min-height:62px}.nav{grid-template-columns:repeat(3,minmax(140px,1fr))!important;padding:8px 10px 12px!important;overflow:auto!important}.nav-section-label{display:none!important}.nav-item.section-collapsed-item{display:flex!important}.sidebar-foot{display:none!important}.main{width:100%;padding:0 10px 14px!important}.topbar{margin:0 -10px 10px!important}.top-actions{width:100%;flex-wrap:wrap}.topbar-title{width:100%}
}
@media(max-width:560px){.nav{grid-template-columns:repeat(2,minmax(135px,1fr))!important}.premium-kpi-grid{grid-template-columns:1fr!important}.premium-hero{min-height:94px!important}.hero-copy h2{font-size:17px!important}.hero-copy p{font-size:8px!important}.topbar{position:relative!important}.row-actions{flex-wrap:wrap}.data-toolbar{align-items:stretch!important}.data-toolbar .select,.data-toolbar .input{width:100%;min-width:100%!important}}

/* v10.24: keep every navigation item inside the sidebar on short screens. */
@media(min-width:851px){
  .sidebar{overflow:hidden!important}
  .nav{flex:1 1 auto!important;min-height:0!important;overflow-y:auto!important;overflow-x:hidden!important;padding-bottom:20px!important;scrollbar-width:thin;scrollbar-color:rgba(133,170,230,.45) transparent}
  .nav::-webkit-scrollbar{width:5px}.nav::-webkit-scrollbar-thumb{background:rgba(133,170,230,.45);border-radius:8px}
  .sidebar-foot{flex:0 0 auto!important;margin-top:8px!important}
}

/* ==========================================================
   v10.25 — Time-zone clock and character-free energy hero
   ========================================================== */
.top-timezone-chip{display:flex;align-items:center;gap:8px;min-height:40px;padding:5px 8px;border:1px solid rgba(146,181,235,.2);border-radius:12px;background:linear-gradient(145deg,rgba(20,53,107,.82),rgba(5,28,67,.9));box-shadow:inset 0 1px 0 rgba(255,255,255,.06);color:#fff}
.top-time-icon{width:27px;height:27px;display:grid;place-items:center;border-radius:9px;background:linear-gradient(145deg,#ffb52e,#ff6b1a);box-shadow:0 4px 12px rgba(255,113,31,.25);font-size:14px}
.top-time-copy{display:flex;min-width:68px;flex-direction:column;line-height:1.05}.top-time-copy strong{font-size:11px;letter-spacing:.05em;font-variant-numeric:tabular-nums}.top-time-copy span{margin-top:3px;color:#bcd0ee;font-size:7px;text-transform:uppercase;letter-spacing:.05em}
.top-timezone-chip select{max-width:112px;border:0;border-left:1px solid rgba(255,255,255,.12);outline:0;padding:3px 18px 3px 8px;background:transparent;color:#e9f3ff;font-size:8px;font-weight:750;cursor:pointer}.top-timezone-chip select option{color:#14213b;background:#fff}
.dragon-hero{--hero-accent:#ff9c2f;--hero-glow:rgba(255,117,27,.45);min-height:126px!important;padding:16px 20px!important;overflow:hidden;background-image:linear-gradient(90deg,rgba(2,18,54,.97),rgba(8,33,89,.84) 42%,rgba(37,19,76,.48) 73%,rgba(21,7,42,.7)),url("./assets/cosmic-hero-v10-16.png")!important;background-position:center 54%!important;border:1px solid rgba(255,167,69,.46)!important;box-shadow:0 10px 28px rgba(7,35,93,.25),inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 40px rgba(255,105,30,.1)!important}
.dragon-hero:before{content:"";position:absolute;inset:-90px -20px auto auto;width:470px;height:280px;background:radial-gradient(ellipse,rgba(255,166,48,.25),rgba(157,64,255,.13) 38%,transparent 70%);filter:blur(5px);pointer-events:none}
.dragon-hero .hero-copy{position:relative;z-index:3;max-width:720px}.dragon-hero .hero-copy h2{text-shadow:0 2px 14px rgba(0,0,0,.38)}.dragon-hero .hero-copy p{color:#e6efff!important}
.dragon-orb{position:relative;z-index:3;width:70px!important;height:70px!important;min-width:70px!important;border:2px solid rgba(255,232,153,.95)!important;background:radial-gradient(circle at 34% 28%,#fff5aa 0 5%,#ffbf32 17%,#ff7b1c 56%,#d83b10 100%)!important;box-shadow:0 0 0 3px rgba(255,255,255,.12),0 0 26px rgba(255,137,28,.65),inset -8px -9px 16px rgba(139,23,0,.26)!important;color:#c92c17!important;font-size:26px!important;text-shadow:0 1px 0 rgba(255,244,180,.8)}
.dragon-energy-orbs{position:relative;z-index:3;margin-left:auto;width:290px;height:90px;min-width:250px}.dragon-energy-orb{position:absolute;display:grid;place-items:center;aspect-ratio:1;border:1px solid rgba(255,244,174,.85);border-radius:50%;background:radial-gradient(circle at 32% 27%,#fff4a7 0 4%,#ffbd2d 17%,#ff7319 58%,#c93412 100%);box-shadow:0 0 22px rgba(255,122,28,.56),inset -7px -8px 13px rgba(124,25,0,.26);color:#c72d16;font-size:10px;letter-spacing:-2px;text-shadow:0 1px 0 rgba(255,241,166,.75)}
.dragon-energy-orb.orb-one{width:52px;right:190px;top:20px}.dragon-energy-orb.orb-two{width:67px;right:102px;top:4px}.dragon-energy-orb.orb-three{width:58px;right:24px;top:29px}
@media(max-width:1280px){.top-timezone-chip select{max-width:92px}.top-time-copy{display:none}.dragon-energy-orbs{width:220px;min-width:210px}.dragon-energy-orb.orb-one{right:150px}.dragon-energy-orb.orb-two{right:78px}.dragon-energy-orb.orb-three{right:12px}}
@media(max-width:1050px){.top-timezone-chip select{max-width:104px}.global-search-wrap{display:none!important}.dragon-energy-orbs{display:none}}
@media(max-width:850px){.top-timezone-chip{order:-1}.top-time-copy{display:flex}.top-timezone-chip select{max-width:130px}}
@media(max-width:560px){.top-time-copy{display:none}.top-timezone-chip select{max-width:112px}.dragon-hero{min-height:98px!important}.dragon-orb{width:54px!important;height:54px!important;min-width:54px!important;font-size:20px!important}}

/* ==========================================================
   v10.26 — CSV tools separated from primary create actions
   ========================================================== */
.data-header-actions{display:flex;align-items:stretch;justify-content:flex-end;gap:12px;flex-wrap:wrap}
.csv-tools-panel,.create-action-panel{position:relative;display:flex;align-items:flex-end;min-height:58px;padding:20px 8px 7px;border:1px solid #d7e2f1;border-radius:12px;background:linear-gradient(180deg,#f8fbff,#f1f6fc);box-shadow:0 4px 12px rgba(31,58,105,.06)}
.csv-tools-panel{border-color:#cfdcf0}.create-action-panel{border-color:#bfcdf7;background:linear-gradient(180deg,#f7f8ff,#eef1ff)}
.action-group-label{position:absolute;top:6px;left:9px;color:#657795;font-size:7px;font-weight:850;letter-spacing:.09em;text-transform:uppercase}
.csv-tool-buttons{display:flex;align-items:center;gap:7px}
.csv-tool-buttons .btn{position:relative;min-width:94px;border-radius:8px!important;background:#fff!important;box-shadow:0 2px 7px rgba(33,59,103,.06)}
.csv-tool-buttons .csv-template-btn{border-color:#bcd0e8!important;color:#334a6d!important}
.csv-tool-buttons .csv-import-btn{border-color:#a9d7c6!important;color:#087651!important;background:#f5fffb!important}
.csv-tool-buttons .csv-export-btn{border-color:#b9c8f4!important;color:#3554b9!important;background:#f6f8ff!important}
.create-action-panel>.btn{min-height:34px;white-space:nowrap;box-shadow:0 5px 12px rgba(58,83,211,.18)}
@media(max-width:1180px){.panel-head.responsive,.panel-subhead.responsive{align-items:flex-start}.data-header-actions{width:100%;justify-content:flex-start}.csv-tools-panel{flex:1}.csv-tool-buttons{width:100%}.csv-tool-buttons .btn{flex:1}}
@media(max-width:700px){.data-header-actions{flex-direction:column}.csv-tools-panel,.create-action-panel{width:100%}.csv-tool-buttons{display:grid;grid-template-columns:1fr 1fr 1fr}.csv-tool-buttons .btn{min-width:0}.create-action-panel>.btn{width:100%}}
@media(max-width:480px){.csv-tool-buttons{grid-template-columns:1fr}.csv-tools-panel{padding-top:22px}}

/* ==========================================================
   v10.28 — Always-visible clock and searchable filters
   ========================================================== */
.top-time-copy{display:flex!important;min-width:70px!important}
.top-timezone-chip{flex:0 0 auto!important}
.filter-search-select{position:relative;z-index:24;display:block;min-width:155px;flex:0 1 210px}
.filter-search-input{width:100%;height:36px;padding:0 32px 0 11px;border:1px solid #cbd8ea;border-radius:9px;outline:0;background:#fff;color:#273751;font:inherit;font-size:10px;box-shadow:0 1px 2px rgba(24,43,77,.02);transition:border-color .18s,box-shadow .18s}
.filter-search-input:focus{border-color:#5b72e8;box-shadow:0 0 0 3px rgba(91,114,232,.12)}
.filter-search-arrow{position:absolute;z-index:2;right:10px;top:50%;transform:translateY(-50%);pointer-events:none;color:#5c6d88;font-size:11px}
.native-filter-select-hidden{position:absolute!important;left:0!important;top:0!important;width:1px!important;height:1px!important;margin:0!important;padding:0!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important;clip-path:inset(50%)!important}
.filter-search-menu{position:absolute;z-index:260;left:0;right:0;top:calc(100% + 5px);max-height:230px;overflow-y:auto;padding:5px;border:1px solid #cbd8ea;border-radius:10px;background:#fff;box-shadow:0 14px 30px rgba(18,38,75,.2)}
.filter-search-option{display:block;width:100%;padding:8px 9px;border:0;border-radius:7px;background:transparent;color:#283852;text-align:left;font-size:10px;font-weight:650;cursor:pointer}.filter-search-option:hover,.filter-search-option.active{background:#edf2ff;color:#3154d8}
.filter-search-empty{padding:12px 9px;color:#7b8aa3;font-size:9px;text-align:center}
.toolbar .filter-search-select:first-of-type{margin-left:0}
@media(max-width:1180px){.top-timezone-chip select{max-width:108px}.filter-search-select{flex:1 1 170px}}
@media(max-width:850px){.top-time-copy{display:flex!important}.filter-search-select{width:100%;min-width:100%;flex:1 1 100%}}
@media(max-width:560px){.top-time-copy{display:flex!important;min-width:64px!important}.top-time-copy span{display:none}.top-timezone-chip select{max-width:105px}}

/* ==========================================================
   v10.29 — Editable built-in and custom matrix columns
   ========================================================== */
.matrix-head-content{display:flex;align-items:center;justify-content:center;gap:6px;min-width:86px}
.matrix-head-content>span{overflow:hidden;text-overflow:ellipsis}
.matrix-column-edit{display:inline-grid;place-items:center;flex:0 0 20px;width:20px;height:20px;padding:0;border:1px solid rgba(255,255,255,.45);border-radius:6px;background:rgba(255,255,255,.14);color:#fff;font-size:10px;line-height:1;cursor:pointer;opacity:.76;transition:opacity .18s,background .18s,transform .18s}
.matrix-column-edit:hover,.matrix-column-edit:focus-visible{opacity:1;background:rgba(255,255,255,.28);transform:translateY(-1px);outline:0}
.column-list{max-height:min(58vh,540px);overflow:auto;padding-right:4px}
.column-origin{display:inline-flex;margin-left:5px;padding:2px 6px;border-radius:999px;background:#e7eef8;color:#50617b;font-size:7px;font-style:normal;font-weight:850;letter-spacing:.04em;text-transform:uppercase;vertical-align:middle}
.column-origin.custom{background:#ebe7ff;color:#6043c7}
.column-list-item:hover{border-color:#bccce2;background:#f7faff}
#customColumnOptionsWrap{display:grid;gap:6px;width:100%}
#customColumnOptionsWrap .input{width:100%;min-width:0}
@media(max-width:700px){.matrix-column-edit{opacity:1}.column-list-item{grid-template-columns:1fr}.column-actions{justify-content:flex-start}}

/* ==========================================================
   v10.30 — Per-user credential PIN permission
   ========================================================== */
.pin-permission-option{display:grid!important;grid-template-columns:22px minmax(0,1fr);align-items:start;gap:10px;padding:12px 13px!important;border:1px solid #bcd0ea;border-radius:10px;background:linear-gradient(135deg,#f5f9ff,#eef5ff);cursor:pointer;text-transform:none!important;letter-spacing:0!important}
.pin-permission-option input{width:18px;height:18px;margin:1px 0 0;accent-color:#2563d9}
.pin-permission-option span{display:grid;gap:4px}.pin-permission-option strong{color:#263b59;font-size:11px}.pin-permission-option small{color:#667993;font-size:9px;font-weight:550;line-height:1.45}
#credentialPinQuickBtn{font-size:14px;font-weight:900;color:#dbeafe}

/* v10.31 — Individual CSV tool permissions */
.csv-permission-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.csv-permission-option{display:grid!important;grid-template-columns:20px minmax(0,1fr);align-items:start;gap:8px;padding:10px!important;border:1px solid #d5e0ef;border-radius:10px;background:#f8faff;cursor:pointer;text-transform:none!important;letter-spacing:0!important}
.csv-permission-option:has(input:checked){border-color:#8fb3ed;background:#edf5ff;box-shadow:inset 0 0 0 1px rgba(37,99,217,.08)}
.csv-permission-option input{width:16px;height:16px;margin:1px 0 0;accent-color:#2563d9}.csv-permission-option span{display:grid;gap:3px}.csv-permission-option strong{color:#263b59;font-size:10px}.csv-permission-option small{color:#687b95;font-size:8px;font-weight:550;line-height:1.4}
@media(max-width:640px){.csv-permission-grid{grid-template-columns:1fr}}

/* ==========================================================
   v10.18 — Layout, grid and color polish
   ========================================================== */
:root{
  --sidebar-width-custom:252px;
  --sidebar-bg-custom:#071a38;
  --sidebar-active-custom:#1f5fe0;
  --sidebar-accent-custom:#67a5ff;
  --bg:#eef3f9;
  --surface:#ffffff;
  --surface-2:#f7f9fd;
  --border:#dbe3ef;
  --text:#1d2b42;
  --muted:#6d7d93;
  --blue:#2563d9;
  --purple:#3659d9;
  --shadow:0 8px 28px rgba(32,55,91,.065);
}
.app-shell{grid-template-columns:var(--sidebar-width-custom) minmax(0,1fr)!important}
.sidebar{background:linear-gradient(180deg,#061a38 0%,#082247 58%,#04162f 100%)!important;border-right:1px solid rgba(117,157,223,.16)}
.brand{padding:14px 18px!important}
.nav{padding:10px 14px 146px!important;gap:5px!important}
.nav-item{
  width:100%;min-height:44px!important;height:auto!important;padding:10px 12px!important;gap:11px!important;
  color:#bac8dc!important;border:1px solid transparent!important;line-height:1.25!important
}
.nav-item span{width:20px;min-width:20px;display:grid;place-items:center;font-size:16px!important;color:#d7e3f5}
.nav-item b{min-width:0;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;font-size:11px!important;line-height:1.25!important}
.nav-item:hover{background:rgba(89,132,204,.11)!important;border-color:rgba(118,158,222,.14)!important;color:#fff!important}
.nav-item.active{
  background:linear-gradient(100deg,#2466df,#194bb8)!important;
  border-color:rgba(135,180,255,.42)!important;
  box-shadow:0 8px 20px rgba(10,53,140,.28),inset 0 1px 0 rgba(255,255,255,.16)!important
}
.nav-section-label:not([data-nav-section="main"]){
  margin:14px 0 6px!important;background:linear-gradient(145deg,rgba(27,60,114,.92),rgba(8,33,72,.98))!important;
  border-color:rgba(119,157,220,.28)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 6px 15px rgba(0,10,31,.24)!important
}
.nav-section-label:not([data-nav-section="main"]):before{background:linear-gradient(145deg,#3c7bf0,#2350b8)!important}
.nav-section-label[data-nav-section="management"]:before{background:linear-gradient(145deg,#3ea3d8,#1d5cae)!important;color:#eef8ff!important}
.main{background:linear-gradient(180deg,#f4f7fb 0%,#edf2f8 100%)!important;padding:0 18px 24px!important}
.topbar{margin:0 -18px 16px!important;padding:10px 24px!important;background:linear-gradient(90deg,#041832,#082449)!important;border-bottom:1px solid rgba(110,153,220,.18)}
.panel,.stat-card,.premium-panel{border-color:#dce5f0!important;box-shadow:var(--shadow)!important;background:#fff!important}
.panel{padding:20px!important}
.panel-head{margin-bottom:16px!important;align-items:center!important}
.panel-head h2{font-size:16px!important;color:#1d2b42}.panel-head p{line-height:1.5!important;color:#718198!important}
.toolbar.data-toolbar{
  display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:12px;
  border:1px solid #e1e8f2;border-radius:12px;background:#f8fafd
}
.data-toolbar .input:first-child{flex:1;min-width:280px}
.data-toolbar .select{min-width:170px}
.input,.select,.textarea{border-color:#d5dfec!important;background:#fff!important;color:#24334a!important;border-radius:9px!important}
.input,.select{min-height:38px}.textarea{width:100%;padding:10px 11px;resize:vertical;font:inherit;font-size:12px;line-height:1.5;outline:none}
.input:focus,.select:focus,.textarea:focus{border-color:#5d8de5!important;box-shadow:0 0 0 3px rgba(42,103,218,.11)!important}
.btn{border-radius:9px!important}.btn-primary{background:linear-gradient(135deg,#2d6cdf,#244fc2)!important;box-shadow:0 5px 13px rgba(32,83,186,.18)}
.btn-primary:hover{box-shadow:0 8px 18px rgba(32,83,186,.25)}
.data-info-banner{padding:10px 12px!important;margin-bottom:12px!important;border:1px solid #dce7f6!important;border-radius:9px!important;background:#f4f8fe!important;color:#59708f!important;line-height:1.5!important}
.table-scroll{border-color:#dbe4ef!important;border-radius:11px!important;background:#fff;box-shadow:0 2px 8px rgba(27,50,84,.035)}
.data-management-table th{padding:11px 13px!important;background:#f5f8fc!important;color:#62738b!important;letter-spacing:.055em!important;white-space:nowrap}
.data-management-table td{padding:12px 13px!important;color:#26354b!important;line-height:1.45!important}
.data-management-table tbody tr:nth-child(even){background:#fbfcfe}.data-management-table tbody tr:hover{background:#f2f7ff!important}
.data-management-table tbody tr:last-child td{border-bottom:0}
.row-actions{gap:7px!important;white-space:nowrap}.row-actions .btn{min-width:48px}
#view-spreadsheets .panel{overflow:hidden}
#view-spreadsheets .data-toolbar{max-width:620px}
#view-spreadsheets .data-management-table{min-width:790px;table-layout:fixed}
#view-spreadsheets .data-management-table th:nth-child(1){width:21%}
#view-spreadsheets .data-management-table th:nth-child(2){width:31%}
#view-spreadsheets .data-management-table th:nth-child(3){width:14%}
#view-spreadsheets .data-management-table th:nth-child(4){width:11%}
#view-spreadsheets .data-management-table th:nth-child(5){width:13%}
#view-spreadsheets .data-management-table th:nth-child(6){width:10%}
.spreadsheet-purpose{white-space:normal;overflow-wrap:anywhere;color:#51627a!important}
.spreadsheet-note{max-width:100%!important;margin-top:5px!important;color:#8491a3!important;font-size:9px!important}
.modal-backdrop{background:rgba(4,18,42,.62)!important;backdrop-filter:blur(4px)}
.modal.modal-spreadsheet{width:min(660px,96vw)!important;padding:0!important;overflow:hidden!important;border-radius:17px!important;border-color:#d8e2ef!important}
.spreadsheet-modal-title{display:flex;gap:12px;align-items:center;padding:18px 20px;border-bottom:1px solid #e2e8f1;background:linear-gradient(135deg,#f7faff,#eef4ff)}
.spreadsheet-modal-title>span{width:38px;height:38px;min-width:38px;display:grid;place-items:center;border-radius:11px;background:linear-gradient(135deg,#2f75e4,#244cb7);color:#fff;font-size:20px;box-shadow:0 7px 16px rgba(34,84,181,.22)}
.spreadsheet-modal-title h2{font-size:17px!important;color:#1f2d42}.spreadsheet-modal-title p{margin:4px 0 0!important;font-size:11px!important}
.spreadsheet-record-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px!important;padding:18px 20px 20px;background:#fff}
.spreadsheet-record-form .form-field{display:grid;align-content:start;gap:6px;min-width:0}
.spreadsheet-record-form .form-field-wide{grid-column:1/-1}
.spreadsheet-record-form label{margin:0!important;color:#53647b!important;font-size:9px!important}
.spreadsheet-record-form label small{margin-left:5px;font-size:8px;font-weight:600;text-transform:none;letter-spacing:0;color:#9aa5b4}
.spreadsheet-record-form .input{width:100%;min-height:42px}.spreadsheet-record-form .textarea{min-height:76px}
.spreadsheet-record-form .modal-actions{padding-top:14px;margin-top:0!important;border-top:1px solid #e8edf4}

@media(max-width:1000px){
  :root{--sidebar-width-custom:238px}
  .nav{padding-left:11px!important;padding-right:11px!important}.main{padding-left:12px!important;padding-right:12px!important}
}
@media(max-width:850px){
  .main{padding:0 10px 16px!important}.topbar{margin:0 -10px 12px!important}
  .toolbar.data-toolbar{flex-wrap:wrap}.data-toolbar .input:first-child,.data-toolbar .select{width:100%;min-width:100%!important}
}
@media(max-width:640px){
  .panel{padding:14px!important}.spreadsheet-record-form{grid-template-columns:1fr;padding:15px!important}.spreadsheet-record-form .form-field-wide{grid-column:auto}
  .spreadsheet-modal-title{padding:15px}.spreadsheet-modal-title>span{display:none}.spreadsheet-record-form .modal-actions{flex-direction:column-reverse}.spreadsheet-record-form .modal-actions .btn{width:100%}
}

/* ==========================================================
   v10.19 — Dense reference-matched dashboard
   ========================================================== */
.premium-kpi{isolation:isolate;min-height:108px!important;padding:15px 16px!important;box-shadow:0 9px 22px rgba(35,68,151,.17)!important}
.premium-kpi:before{content:"";position:absolute;z-index:-1;right:12px;bottom:13px;width:58px;height:25px;background:rgba(255,255,255,.24);clip-path:polygon(0 82%,13% 70%,25% 74%,38% 45%,50% 58%,62% 22%,75% 54%,87% 42%,100% 3%,100% 12%,88% 51%,75% 63%,62% 31%,50% 68%,38% 55%,25% 83%,13% 79%,0 91%)}
.premium-kpi:after{width:150px!important;height:86px!important;right:-36px!important;bottom:-53px!important;opacity:.55}
.premium-kpi-icon{background:rgba(255,255,255,.16)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 7px 15px rgba(0,0,0,.12)!important}
.premium-kpi>div{position:relative;z-index:2;gap:2px!important}.premium-kpi .kpi-trend{font-weight:700!important;color:#fff!important;white-space:nowrap}
.kpi-blue{background:linear-gradient(135deg,#1688ff 0%,#123bd8 100%)!important}.kpi-green{background:linear-gradient(135deg,#19bf68 0%,#047b63 100%)!important}.kpi-purple{background:linear-gradient(135deg,#9b4ff5 0%,#5518cc 100%)!important}.kpi-orange{background:linear-gradient(135deg,#ffae31 0%,#fb5f27 100%)!important}.kpi-teal{background:linear-gradient(135deg,#2fd8c9 0%,#0792ac 100%)!important}
.system-overview-panel,.quick-actions-panel,.attention-panel,.team-summary-panel,.config-health-panel,.recent-panel{min-height:0!important}
.system-overview-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important;padding:11px 13px 15px!important}
.system-mini-card{position:relative;min-height:154px!important;padding:12px!important;background:#fff!important;border-color:#e0e7f0!important;box-shadow:0 5px 14px rgba(30,53,91,.055)!important}
.system-mini-card:before{content:"";position:absolute;inset:0 0 auto;height:3px;border-radius:11px 11px 0 0;background:linear-gradient(90deg,#2d8cff,#1bb58a)}
.system-mini-card:nth-child(2):before{background:linear-gradient(90deg,#20b15a,#68c64d)}.system-mini-card:nth-child(3):before{background:linear-gradient(90deg,#ef4444,#ff8b37)}
.system-flag{width:28px!important;height:24px!important;border:1px solid #e5eaf1}.system-mini-head strong{font-weight:900!important}.system-mini-meta{justify-content:flex-start;gap:13px!important;color:#35445a!important}.system-mini-track{height:7px!important}.system-mini-foot{display:flex;gap:4px;color:#17924f!important}.system-mini-foot::first-letter{font-weight:900}
.team-summary-list{padding:4px 14px 9px!important}.team-summary-row{grid-template-columns:minmax(128px,.95fr) 58px minmax(145px,1.35fr) 30px!important;padding:8px 0!important}.team-summary-avatar{background:#efe9ff!important;color:#6038df!important}.team-summary-row:nth-child(2) .team-summary-avatar{background:#e7f4ff!important;color:#1d6fd4!important}.team-summary-row:nth-child(3) .team-summary-avatar{background:#fff0e4!important;color:#ec6c1e!important}.team-summary-row:nth-child(4) .team-summary-avatar{background:#e7f8ef!important;color:#159559!important}.team-summary-identity strong{font-size:9px!important;font-weight:900!important}.team-summary-score{font-size:10px!important}.team-summary-mini-fill{background:linear-gradient(90deg,#783fe8,#4937df)!important}
.config-health-icon{width:25px!important;height:25px!important;background:#e8f3ff!important;box-shadow:inset 0 0 0 1px rgba(38,117,218,.08)}.config-health-track{height:8px!important}.config-health-row{padding:7px 0!important}
.premium-activity-avatar{width:29px!important;height:29px!important;background:#e3edff!important;color:#2659d3!important}.premium-activity-item:nth-child(2) .premium-activity-avatar{background:#e1f6ed!important;color:#137d62!important}.premium-activity-item:nth-child(3) .premium-activity-avatar{background:#fff1d9!important;color:#b56808!important}.premium-activity-item:nth-child(4) .premium-activity-avatar{background:#ffe6ed!important;color:#d92e59!important}.premium-activity-main strong{font-weight:900!important}.premium-activity-item{padding:8px 0!important}
.premium-panel-head{background:linear-gradient(180deg,#fff,#fbfcff)}

@media(max-width:1320px){.premium-kpi{min-height:98px!important;padding:13px!important}.premium-kpi-icon{width:44px!important;height:44px!important}.premium-kpi strong{font-size:23px!important}}

/* ==========================================================
   v10.20 — Simplified dashboard without attention/health cards
   ========================================================== */
.premium-kpi-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.premium-grid-top{grid-template-columns:minmax(0,2.15fr) minmax(285px,.85fr)!important}
.premium-grid-middle{grid-template-columns:minmax(0,1.05fr) minmax(0,1.15fr)!important}
.system-overview-panel,.quick-actions-panel,.team-summary-panel,.recent-panel{grid-column:auto!important}

@media(max-width:1180px){
  .premium-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .premium-grid-top,.premium-grid-middle{grid-template-columns:1fr!important}
}
@media(max-width:620px){.premium-kpi-grid{grid-template-columns:1fr!important}}

/* ==========================================================
   v10.21 — Original anime character hero
   ========================================================== */
.anime-hero{
  --hero-accent:#46a7ff;--hero-glow:rgba(49,132,255,.48);
  min-height:138px!important;padding:15px 18px!important;gap:16px!important;
  background-image:linear-gradient(90deg,rgba(1,15,43,.96) 0%,rgba(4,29,78,.8) 43%,rgba(15,28,75,.34) 70%,rgba(3,15,42,.58) 100%),url("./assets/cosmic-hero-v10-16.png")!important;
  background-position:center 54%!important;border:1px solid color-mix(in srgb,var(--hero-accent) 48%,rgba(255,255,255,.24))!important;
  box-shadow:0 10px 28px rgba(7,35,93,.28),inset 0 1px 0 rgba(255,255,255,.12),inset 0 0 38px var(--hero-glow)!important;
  transition:border-color .25s ease,box-shadow .25s ease
}
.anime-hero:after{content:"";position:absolute;inset:auto 150px -75px auto;width:300px;height:180px;border-radius:50%;background:radial-gradient(circle,var(--hero-glow),transparent 66%);filter:blur(12px);pointer-events:none}
.anime-avatar{width:82px!important;height:82px!important;min-width:82px!important;padding:3px!important;border:2px solid var(--hero-accent)!important;background:rgba(2,16,43,.82)!important;box-shadow:0 0 0 2px rgba(255,255,255,.7),0 0 24px var(--hero-glow)!important;overflow:hidden}
.anime-avatar>span{display:block;width:100%;height:100%;border-radius:50%;background-size:cover;background-position:center 16%;background-repeat:no-repeat;transition:background-image .2s ease}
.anime-hero .hero-copy{max-width:540px}.anime-hero .hero-copy h2{text-shadow:0 2px 12px rgba(0,0,0,.3)}.anime-hero .hero-copy p{color:#dceaff!important}
.hero-anime-art{position:relative;z-index:3;margin-left:auto;width:116px;height:116px;min-width:116px;border-radius:22px;background-size:cover;background-position:center 16%;background-repeat:no-repeat;border:1px solid color-mix(in srgb,var(--hero-accent) 62%,#fff);box-shadow:0 10px 28px rgba(0,0,0,.28),0 0 25px var(--hero-glow),inset 0 1px 0 rgba(255,255,255,.24);transition:background-image .2s ease,border-color .25s ease,box-shadow .25s ease}
.anime-hero .hero-character-picker{margin-left:0!important;width:236px!important;padding:10px 11px!important;background:linear-gradient(145deg,rgba(13,35,83,.92),rgba(6,22,58,.93))!important;border-color:color-mix(in srgb,var(--hero-accent) 40%,rgba(255,255,255,.18))!important;box-shadow:0 8px 22px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.1)!important}
.anime-hero .hero-character-picker label{margin-bottom:7px!important;color:#eaf3ff!important;letter-spacing:.05em;text-transform:uppercase}
.anime-hero .hero-character-control{min-height:43px;padding:5px 7px!important;background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.08)}
.anime-picker-avatar{width:33px!important;height:33px!important;min-width:33px;background-size:cover!important;background-position:center 16%!important;background-repeat:no-repeat!important;background-color:#071b42!important;border:1px solid var(--hero-accent);box-shadow:0 0 12px var(--hero-glow)}
.anime-hero .hero-character-control select{font-size:10px!important;color:#fff!important;cursor:pointer}.anime-hero .hero-character-control select option{color:#17243b!important;background:#fff}

@media(max-width:1280px){.hero-anime-art{width:96px;height:96px;min-width:96px}.anime-hero .hero-character-picker{width:210px!important}.anime-hero .hero-copy h2{font-size:19px!important}}
@media(max-width:1080px){.hero-anime-art{display:none}.anime-hero .hero-character-picker{margin-left:auto!important}}
@media(max-width:900px){.anime-hero{min-height:112px!important}.anime-avatar{width:68px!important;height:68px!important;min-width:68px!important}.anime-hero .hero-character-picker{display:none!important}}
@media(max-width:560px){.anime-hero{padding:13px!important}.anime-avatar{width:56px!important;height:56px!important;min-width:56px!important}.anime-hero .hero-copy h2{font-size:15px!important}}

/* ==========================================================
   v10.33 — Team Staff management + updated live page preview
   ========================================================== */
.staff-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:14px 16px 4px}.staff-summary-card{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border:1px solid #d7e4f5;border-radius:12px;background:linear-gradient(135deg,#edf6ff,#fff);color:#244062}.staff-summary-card strong{font-size:25px;color:#1465dc}.staff-summary-card.resigned{background:linear-gradient(135deg,#fff1f1,#fff);border-color:#f3d3d3}.staff-summary-card.resigned strong{color:#d94848}.staff-summary-card.teams{background:linear-gradient(135deg,#f0ecff,#fff);border-color:#ded4fa}.staff-summary-card.teams strong{color:#6c3dd4}.staff-summary-card span{font-size:11px;font-weight:800}.staff-tabs{display:flex;gap:7px;padding:14px 16px 0;border-bottom:1px solid #e1e8f2}.staff-tab{border:0;border-bottom:3px solid transparent;background:transparent;color:#73819a;padding:9px 13px;font-size:11px;font-weight:850;cursor:pointer}.staff-tab.active{color:#165bd6;border-color:#165bd6}.staff-toolbar{grid-template-columns:minmax(240px,1fr) 220px 220px}.staff-table{min-width:1500px}.staff-table td{vertical-align:middle}.staff-reason-cell{max-width:220px;white-space:normal;line-height:1.35}.pill.staff-active{background:#e5f8ec;color:#128249}.pill.staff-resigned{background:#ffe8e8;color:#b82e2e}.nowrap{white-space:nowrap}.staff-modal-title{display:flex;align-items:center;gap:12px;margin-bottom:15px}.staff-modal-title>span{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#e8f2ff;color:#1f64d8;font-size:20px}.staff-modal-title.danger>span{background:#ffe9e9;color:#d83d3d}.staff-modal-title h2{margin:0}.staff-modal-title p{margin:3px 0 0;color:#718096;font-size:11px}.staff-form{grid-template-columns:repeat(2,minmax(0,1fr))}

.multi-preview-shell{padding:10px;background:#edf3fa}.preview-window{border-color:#cdd9e8;box-shadow:0 12px 32px rgba(11,38,80,.12)}.preview-app-grid{grid-template-columns:138px minmax(0,1fr);min-height:430px}.preview-main{min-width:0;background:#eef3f9}.preview-side{padding:9px 7px;background:#071a38;color:#b9c8de}.preview-side-brand{display:flex;align-items:center;gap:7px;margin:0 2px 9px;padding:5px 4px 10px;border-bottom:1px solid rgba(255,255,255,.1)}.preview-side-brand>b{display:grid;place-items:center;width:26px;height:26px;min-width:26px;border-radius:9px;background:linear-gradient(145deg,#6652ff,#1d66ef);color:#fff;font-size:9px;box-shadow:0 5px 14px rgba(41,91,235,.35)}.preview-side-brand div{min-width:0}.preview-side-brand strong,.preview-side-brand span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-side-brand strong{font-size:8px;color:#fff}.preview-side-brand span{font-size:5.5px;color:#a9bdd9;margin-top:2px}.preview-side-section{display:flex;justify-content:space-between;align-items:center;margin:8px 4px 3px;color:#7890b0;font-size:5.5px;font-weight:900;letter-spacing:.08em}.preview-side-item{display:flex;align-items:center;gap:6px;padding:6px 7px;margin:2px 0;border-radius:6px;font-size:6.5px;color:#bdcbe0}.preview-side-item i{width:12px;text-align:center;color:#d8e5f7;font-style:normal}.preview-side-item span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-side-item.active{background:linear-gradient(135deg,#2876e8,#2152ca);color:#fff;box-shadow:0 4px 10px rgba(27,84,198,.3)}.preview-topbar{height:56px;padding:0 11px;background:#071a38;border:0;color:#fff}.preview-page-title{min-width:90px}.preview-page-title strong{font-size:10px}.preview-page-title span{font-size:5.5px;color:#a9bdd9;max-width:165px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-top-actions{display:flex;align-items:center;gap:5px}.preview-search,.preview-clock{padding:6px 7px;border:1px solid rgba(126,166,226,.26);border-radius:7px;background:#102d5b;color:#dce9fb;font-size:5.5px;white-space:nowrap}.preview-search{width:112px}.preview-mini-btn{font-size:6px;background:#183b73;border:1px solid rgba(129,171,235,.24)}.preview-avatar{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:linear-gradient(145deg,#ffbf3f,#ff7b22);font-size:8px;font-weight:900}.preview-body{padding:9px;background:#eef3f9}.preview-demo-banner{padding:6px 9px;margin-bottom:8px;border:1px solid #efd292;border-radius:7px;background:#fff8e7;color:#8b631c;font-size:6px}.preview-hero{display:flex;align-items:center;gap:9px;min-height:62px;padding:9px 12px;border-radius:10px;color:#fff;background:radial-gradient(circle at 82% 45%,rgba(255,102,38,.8),transparent 18%),radial-gradient(circle at 72% 52%,rgba(119,64,255,.62),transparent 36%),linear-gradient(120deg,#06163b,#0a2b6c 55%,#421f73);box-shadow:inset 0 1px 0 rgba(255,255,255,.18)}.preview-hero-orb{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffd762,#ff801d 58%,#b72a0a);box-shadow:0 0 0 2px rgba(255,255,255,.55),0 0 16px rgba(255,116,34,.7)}.preview-hero strong,.preview-hero span{display:block}.preview-hero strong{font-size:11px}.preview-hero span{font-size:6px;color:#dfe9ff;margin-top:3px}.preview-dragon-balls{display:flex;align-items:center;gap:4px;margin-left:auto}.preview-dragon-balls i{display:grid;place-items:center;width:17px;height:17px;border-radius:50%;background:#ff9b1b;color:#a33b0c;font-size:5px;font-style:normal;box-shadow:0 0 8px rgba(255,142,31,.6)}.preview-stat-row{margin-top:8px}.preview-stat{border:0;color:#fff;box-shadow:0 5px 12px rgba(31,70,139,.15)}.preview-stat label{color:#fff;font-size:5.5px}.preview-stat b{font-size:15px}.preview-stat small{display:block;font-size:5px;margin-top:2px}.preview-stat.stat-blue{background:linear-gradient(135deg,#218afa,#1743d8)}.preview-stat.stat-green{background:linear-gradient(135deg,#1dbc70,#08795c)}.preview-stat.stat-purple{background:linear-gradient(135deg,#9851f0,#5519cf)}.preview-stat.stat-teal{background:linear-gradient(135deg,#2ccfc2,#058ca8)}.preview-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(120px,.8fr);gap:8px}.preview-card{background:#fff;border-color:#dce5f1;box-shadow:0 4px 12px rgba(35,58,92,.04)}.preview-card h4{font-size:8px}.preview-card h4 em{float:right;color:#1c5fe0;font-size:6px;font-style:normal}.preview-actions>div{display:grid;grid-template-columns:1fr 1fr;gap:5px}.preview-actions button{border:0;border-radius:6px;padding:8px 4px;background:#eee6ff;color:#5f2dcf;font-size:5.5px;font-weight:800}.preview-actions button:nth-child(2){background:#e1f6ed;color:#087758}.preview-actions button:nth-child(3){background:#e2f0ff;color:#1760c8}.preview-actions button:nth-child(4){background:#fff0df;color:#d85316}.preview-table th{background:#142e5c}.preview-login-wrap{min-height:430px;background:radial-gradient(circle at 18% 25%,rgba(75,77,255,.65),transparent 28%),radial-gradient(circle at 82% 70%,rgba(255,83,58,.5),transparent 32%),linear-gradient(145deg,#041430,#0a285e)}.preview-login-card{border-color:rgba(255,255,255,.35);box-shadow:0 22px 55px rgba(0,0,0,.3)}.preview-login-brand{display:flex;align-items:center;gap:10px}.preview-login-brand .login-logo{margin:0}.preview-login-brand b,.preview-login-brand span{display:block}.preview-login-brand b{font-size:11px}.preview-login-brand span{font-size:7px;color:#718096}.preview-login-btn{background:linear-gradient(135deg,#286ee8,#693cdd)}
@media(max-width:800px){.staff-summary-grid{grid-template-columns:1fr}.staff-toolbar{grid-template-columns:1fr}.staff-form{grid-template-columns:1fr}.preview-app-grid{grid-template-columns:105px minmax(0,1fr)}.preview-search{display:none}.preview-clock{font-size:5px}.preview-dashboard-grid{grid-template-columns:1fr}}
.staff-toolbar{grid-template-columns:minmax(280px,1fr) minmax(210px,280px)}
@media(max-width:800px){.staff-toolbar{grid-template-columns:1fr}}
.staff-table{min-width:1780px}
.platform-chip{background:#e5f0ff;color:#205fae}
.pill.staff-position{background:#f0ebff;color:#6239b9;white-space:nowrap}
.readonly-field{background:#f2f6fb!important;color:#50647d!important;cursor:not-allowed}

/* v10.35 — compact dashboard staff-by-team cards */
.dashboard-staff-teams{margin-top:12px;overflow:hidden}
.dashboard-staff-team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px;padding:12px 14px 14px}
.dashboard-staff-team-card{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:82px;padding:11px 12px;border:1px solid #dae5f2;border-radius:12px;background:linear-gradient(145deg,#f7fbff,#fff);color:#1e2f49;text-align:left;cursor:pointer;box-shadow:0 5px 14px rgba(30,61,105,.055);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}
.dashboard-staff-team-card:hover{transform:translateY(-2px);border-color:#7aa9eb;box-shadow:0 9px 20px rgba(33,89,164,.13)}
.dashboard-team-avatar{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(145deg,#dcecff,#bcd9ff);color:#1c62c4;font-size:12px;font-weight:900;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}
.dashboard-team-copy{min-width:0}.dashboard-team-copy strong,.dashboard-team-copy small,.dashboard-team-copy em{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dashboard-team-copy strong{font-size:11px;font-weight:900}.dashboard-team-copy small{margin-top:3px;color:#687991;font-size:7.5px}.dashboard-team-copy em{margin-top:5px;color:#4d62a2;font-size:7px;font-style:normal;font-weight:750}
.dashboard-team-count{min-width:54px;text-align:right}.dashboard-team-count b,.dashboard-team-count small{display:block}.dashboard-team-count b{color:#1764d9;font-size:24px;line-height:1}.dashboard-team-count small{margin-top:4px;color:#728198;font-size:6.5px;font-weight:800;text-transform:uppercase}
.dashboard-staff-team-card.team-tone-1 .dashboard-team-avatar{background:linear-gradient(145deg,#dcf7e9,#bcebcf);color:#138154}.dashboard-staff-team-card.team-tone-1 .dashboard-team-count b{color:#138154}
.dashboard-staff-team-card.team-tone-2 .dashboard-team-avatar{background:linear-gradient(145deg,#eee5ff,#d8c4ff);color:#6a39c9}.dashboard-staff-team-card.team-tone-2 .dashboard-team-count b{color:#6a39c9}
.dashboard-staff-team-card.team-tone-3 .dashboard-team-avatar{background:linear-gradient(145deg,#fff0dd,#ffdab0);color:#c96816}.dashboard-staff-team-card.team-tone-3 .dashboard-team-count b{color:#c96816}
@media(max-width:720px){.dashboard-staff-team-grid{grid-template-columns:1fr}.dashboard-staff-team-card{min-height:76px}}

/* v10.36 — biweekly team shifting */
.staff-summary-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.staff-summary-card.shifts{background:linear-gradient(135deg,#fff5df,#fff);border-color:#f0dfb8}.staff-summary-card.shifts strong{color:#d97a13}
.staff-table{min-width:2020px}
.pill.staff-shift{white-space:nowrap;font-weight:850}.pill.staff-shift.shift-day{background:#e5f2ff;color:#1764c7}.pill.staff-shift.shift-mid{background:#fff0d8;color:#b96508}.pill.staff-shift.shift-night{background:#eee7ff;color:#6035b6}
.shift-next{white-space:nowrap;color:#53657d;font-size:9px}.shift-next.due{display:inline-block;padding:4px 7px;border-radius:7px;background:#ffe8e8;color:#b83232;font-weight:850}
.staff-modal-title.shift>span{background:#fff0d8;color:#cf710e}
.batch-shift-form{grid-template-columns:repeat(2,minmax(0,1fr))}.shift-cycle-note{padding:10px 12px;border:1px solid #d9e6f5;border-radius:9px;background:#f3f8ff;color:#536b87;font-size:10px;line-height:1.45}.batch-shift-preview{min-height:86px;border:1px solid #dce5f1;border-radius:10px;background:#fbfcff;padding:12px}.batch-shift-summary{display:flex;align-items:center;justify-content:space-between;gap:10px}.batch-shift-summary strong{font-size:12px}.batch-shift-summary span{font-size:9px;color:#6d7c91}.batch-shift-changes{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}.batch-shift-changes span{padding:6px 8px;border-radius:8px;background:#edf3ff;color:#375b93;font-size:9px}.batch-shift-changes b{margin-left:4px;color:#174da7}
@media(max-width:900px){.staff-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.staff-summary-grid,.batch-shift-form{grid-template-columns:1fr}.batch-shift-summary{align-items:flex-start;flex-direction:column}}

/* v10.37 — spreadsheet-inspired team shift roster */
.staff-shift-roster{padding:14px 16px 18px;background:#f4f7fb}.roster-intro{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:13px;padding:15px 17px;border:1px solid #cad8eb;border-radius:12px;background:linear-gradient(135deg,#fff,#eef4fd)}.roster-intro h3{margin:3px 0 2px;color:#17283f;font-size:17px}.roster-intro p{margin:0;color:#65758c;font-size:10px}.roster-kicker{font-size:8px;font-weight:900;letter-spacing:.16em;color:#ff5b20}.roster-cycle{display:flex;flex-direction:column;align-items:flex-end;gap:4px;padding:10px 13px;border-radius:9px;background:#132c57;color:#fff}.roster-cycle span{font-size:8px;letter-spacing:.1em;color:#b9cef2}.roster-cycle strong{font-size:10px}.roster-team{overflow:hidden;margin-top:13px;border:1px solid #aebfd8;border-radius:10px;background:#fff;box-shadow:0 5px 16px rgba(22,48,86,.07)}.roster-team-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:9px 13px;background:linear-gradient(90deg,#405f93,#6684af);color:#fff}.roster-team-head>div:last-child{display:flex;align-items:flex-end;flex-direction:column;gap:2px}.roster-team-head span{font-size:7px;font-weight:750;letter-spacing:.08em;color:#dce8fb}.roster-team-head h3{margin:2px 0 0;font-size:12px}.roster-team-head strong{font-size:9px}.roster-shift-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:#9db0c9}.roster-lane{min-width:0;background:#f9fbfe}.roster-lane-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border-bottom:1px solid rgba(0,0,0,.12)}.roster-lane-head>div{display:flex;align-items:center;gap:6px}.roster-lane-head strong{font-size:10px}.roster-lane-head b{font-size:8px;padding:3px 6px;border-radius:999px;background:rgba(255,255,255,.72)}.roster-lane.shift-day .roster-lane-head{background:#ffd955;color:#5d4700}.roster-lane.shift-mid .roster-lane-head{background:#9fe1c2;color:#14543a}.roster-lane.shift-night .roster-lane-head{background:#b9b2e7;color:#30256d}.roster-column-head{display:grid;grid-template-columns:1.05fr .95fr;padding:5px 9px;background:#f26425;color:#fff;font-size:7px;font-weight:850;letter-spacing:.04em}.roster-people{display:grid;gap:1px;background:#d5dfeb}.roster-person{padding:8px 9px;background:#fff}.roster-person-main,.roster-person-meta,.roster-person-foot{display:flex;align-items:center;justify-content:space-between;gap:8px}.roster-person-main strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:9px;color:#1d2e46}.roster-person-main span,.roster-person-meta span,.roster-person-foot span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:7px;color:#65748a}.roster-person-meta{margin-top:5px;padding-top:5px;border-top:1px dashed #dce4ee}.roster-person-foot{margin-top:5px}.roster-person-foot span:nth-child(2){color:#395b91}.roster-edit{margin-left:auto;border:1px solid #bfd1eb;border-radius:5px;background:#edf5ff;color:#175cc4;font-size:7px;font-weight:850;padding:3px 6px;cursor:pointer}.roster-empty{min-height:77px;display:grid;place-items:center;padding:12px;background:#f9fbfd;color:#8a98aa;font-size:8px;text-align:center}.roster-no-results{margin-top:12px;background:#fff;border:1px solid #d9e2ef;border-radius:10px}
@media(max-width:1050px){.roster-shift-grid{grid-template-columns:1fr}.roster-lane+.roster-lane{border-top:1px solid #9db0c9}}@media(max-width:650px){.staff-shift-roster{padding:10px}.roster-intro,.roster-team-head{align-items:flex-start;flex-direction:column}.roster-cycle,.roster-team-head>div:last-child{align-items:flex-start}.roster-intro{padding:13px}.roster-team-head{gap:7px}}

/* v10.38 — refined staff editor and selective shift assignment */
.modal.modal-staff{width:min(720px,100%);padding:22px 24px}.modal-staff .staff-modal-title{padding-bottom:14px;margin-bottom:16px;border-bottom:1px solid #e3eaf4}.modal-staff .staff-modal-title>span{width:46px;height:46px;border-radius:14px}.staff-form-refined{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}.staff-form-refined .form-field{display:flex;min-width:0;flex-direction:column;gap:6px}.staff-form-refined .input,.staff-form-refined .select,.staff-form-refined .searchable-select-query{height:40px}.staff-form-refined .modal-actions{padding-top:15px;margin-top:2px;border-top:1px solid #e4eaf3}.field-hint{float:right;color:#9aa7b8;font-size:8px;font-weight:650;text-transform:none;letter-spacing:0}.staff-searchable .searchable-select-arrow{font-size:0;color:#315b93}.staff-searchable .searchable-select-arrow:after{content:"⌕";font-size:16px;font-weight:900}.staff-searchable .searchable-select-menu{max-height:210px}.staff-searchable .searchable-select-option{padding:10px 11px}.staff-searchable .searchable-select-option strong{font-size:10px}.staff-searchable .searchable-select-option small{display:block}
.modal.modal-batch-shift{width:min(900px,100%);padding:22px 24px}.modal-batch-shift .staff-modal-title{padding-bottom:14px;margin-bottom:15px;border-bottom:1px solid #e2e9f3}.batch-shift-form-refined{display:block}.batch-shift-controls{display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:12px;margin-bottom:12px}.batch-shift-controls .form-field{display:flex;flex-direction:column;gap:6px}.batch-shift-controls .input,.batch-shift-controls .select{height:40px}.batch-shift-form-refined .shift-cycle-note{margin-bottom:12px}.batch-shift-form-refined .batch-shift-preview{padding:0;overflow:hidden;background:#f4f7fb}.batch-shift-form-refined .modal-actions{padding-top:15px;margin-top:14px;border-top:1px solid #e2e9f3}.batch-shift-summary{padding:12px 14px;background:#fff;border-bottom:1px solid #dce5f1}.batch-shift-summary>div{display:flex;flex-direction:column;gap:3px}.batch-select-all{display:flex!important;align-items:center;gap:7px;padding:7px 10px;border:1px solid #cbd9ea;border-radius:8px;background:#f5f8fd;color:#315171!important;font-size:9px!important;text-transform:none!important;letter-spacing:0!important;cursor:pointer}.batch-select-all input{width:15px;height:15px;accent-color:#2564df}.batch-shift-form-refined .batch-shift-changes{margin:0;padding:8px 14px;border-bottom:1px solid #dce5f1;background:#f8faff}.batch-staff-list{display:grid;gap:8px;max-height:350px;overflow:auto;padding:12px}.batch-staff-row{display:grid;grid-template-columns:30px minmax(180px,1fr) minmax(290px,1.35fr);align-items:center;gap:11px;padding:11px;border:1px solid #d8e1ee;border-radius:11px;background:#fff;opacity:.6;transition:border-color .16s,box-shadow .16s,opacity .16s}.batch-staff-row.selected{border-color:#9ebbea;box-shadow:0 4px 12px rgba(36,89,170,.08);opacity:1}.batch-staff-check-wrap{display:grid!important;place-items:center}.batch-staff-check{width:18px;height:18px;accent-color:#2864dc}.batch-staff-identity{min-width:0}.batch-staff-identity strong,.batch-staff-identity span,.batch-staff-identity small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.batch-staff-identity strong{color:#20334e;font-size:11px}.batch-staff-identity span{margin-top:3px;color:#687b94;font-size:8px}.batch-staff-identity small{margin-top:5px;color:#3f5f8a;font-size:8px;font-weight:750}.batch-shift-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.batch-shift-choice{min-height:36px;border:1px solid #d3deeb;border-radius:8px;background:#f7f9fc;color:#64738a;font-size:8px;font-weight:850;cursor:pointer}.batch-shift-choice.shift-day.active{border-color:#e2b729;background:#ffe46d;color:#574300;box-shadow:0 0 0 2px rgba(255,217,85,.28)}.batch-shift-choice.shift-mid.active{border-color:#51b788;background:#a7e6c7;color:#12533a;box-shadow:0 0 0 2px rgba(100,203,153,.2)}.batch-shift-choice.shift-night.active{border-color:#7d6cc4;background:#c1b8ee;color:#31256c;box-shadow:0 0 0 2px rgba(125,108,196,.2)}
@media(max-width:760px){.modal.modal-staff,.modal.modal-batch-shift{padding:18px;width:100%}.staff-form-refined,.batch-shift-controls{grid-template-columns:1fr}.batch-staff-row{grid-template-columns:28px minmax(0,1fr)}.batch-shift-buttons{grid-column:1/-1}.field-hint{display:none}}@media(max-width:460px){.batch-shift-buttons{grid-template-columns:1fr}.modal-staff .staff-modal-title,.modal-batch-shift .staff-modal-title{align-items:flex-start}.staff-form-refined .modal-actions,.batch-shift-form-refined .modal-actions{position:sticky;bottom:-18px;padding:12px 0;background:#fff}}

/* v10.39 — collapsible roster cards, shift totals and dashboard grid */
.roster-calendar{display:flex;align-items:center;gap:10px;min-width:220px;padding:8px 11px;border:1px solid #c8d7eb;border-radius:10px;background:#fff;box-shadow:0 4px 12px rgba(29,63,112,.07)}.roster-calendar-page{overflow:hidden;display:grid;place-items:center;width:45px;min-width:45px;border:1px solid #d0dcec;border-radius:8px;background:#f7faff}.roster-calendar-page small{width:100%;padding:3px;background:#2b60ab;color:#fff;text-align:center;font-size:7px;font-weight:900}.roster-calendar-page strong{padding:5px;color:#1a3762;font-size:17px;line-height:1}.roster-calendar-copy small,.roster-calendar-copy strong,.roster-calendar-copy em{display:block}.roster-calendar-copy small{color:#7587a0;font-size:7px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.roster-calendar-copy strong{margin-top:2px;color:#203a61;font-size:11px}.roster-calendar-copy em{margin-top:2px;color:#d35b26;font-size:7px;font-style:normal;font-weight:750}.roster-team-head{display:grid;grid-template-columns:minmax(130px,1fr) auto auto 30px;align-items:center}.roster-team-head>div:last-child{align-items:initial}.roster-team-title{min-width:0}.roster-team-shift-summary{display:flex;align-items:center;gap:5px}.roster-team-shift-summary span{display:flex;align-items:center;gap:5px;padding:5px 7px;border-radius:7px;color:#173052;font-size:7px;letter-spacing:0}.roster-team-shift-summary b{font-size:9px}.roster-team-shift-summary .day{background:#ffe275}.roster-team-shift-summary .mid{background:#a8e4c7}.roster-team-shift-summary .night{background:#c1b9eb}.roster-team-meta{display:flex;align-items:flex-end!important;flex-direction:column;gap:2px;min-width:92px}.roster-team-toggle{display:grid;place-items:center;width:28px;height:28px;border:1px solid rgba(255,255,255,.35);border-radius:7px;background:rgba(8,35,78,.22);color:#fff;cursor:pointer}.roster-team-toggle span{font-size:12px;transition:transform .18s}.roster-team.collapsed .roster-team-toggle span{transform:rotate(-90deg)}.roster-team.collapsed .roster-team-head{border-radius:9px}.roster-lane-head{width:100%;border:0;cursor:pointer;text-align:left}.roster-lane-head>div:last-child{display:flex;align-items:center;gap:7px}.roster-chevron{font-size:11px;transition:transform .18s}.roster-lane.collapsed .roster-chevron{transform:rotate(-90deg)}.roster-show-more{width:100%;padding:8px;border:0;border-top:1px solid #dbe4ef;background:#edf4ff;color:#245cae;font-size:8px;font-weight:850;cursor:pointer}.roster-show-more:hover{background:#e2edff}
.dashboard-staff-team-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.dashboard-staff-team-card{display:block;min-height:142px;padding:12px}.dashboard-team-card-head{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:9px}.dashboard-team-shifts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;margin-top:11px;padding-top:10px;border-top:1px solid #e1e9f3}.dashboard-team-shifts>span{display:flex;min-width:0;align-items:center;justify-content:space-between;gap:4px;padding:6px;border-radius:7px;font-size:7px;font-weight:800}.dashboard-team-shifts i{font-style:normal}.dashboard-team-shifts b{font-size:10px}.dashboard-team-shifts .day{background:#fff1ae;color:#665000}.dashboard-team-shifts .mid{background:#d8f4e6;color:#176244}.dashboard-team-shifts .night{background:#e5e0fb;color:#493a88}
@media(max-width:1350px){.dashboard-staff-team-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:900px){.roster-team-head{grid-template-columns:minmax(130px,1fr) auto 30px}.roster-team-shift-summary{grid-column:1/-1;grid-row:2;margin-top:6px}.roster-team-meta{grid-column:2;grid-row:1}.roster-team-toggle{grid-column:3;grid-row:1}}@media(max-width:720px){.dashboard-staff-team-grid{grid-template-columns:1fr}.roster-calendar{width:100%;min-width:0}.roster-team-head{grid-template-columns:minmax(0,1fr) 30px}.roster-team-meta{grid-column:1;grid-row:2;align-items:flex-start!important;margin-top:4px}.roster-team-shift-summary{grid-row:3;overflow-x:auto}.roster-team-toggle{grid-column:2;grid-row:1}.dashboard-team-shifts{grid-template-columns:1fr}}

/* v10.40 — tidy roster header and timezone-aware daily calendar */
.team-heading-icon{display:inline-grid;place-items:center;width:22px;height:22px;margin-right:5px;border-radius:7px;background:#e7f0ff;color:#1b62ce;font-size:13px;vertical-align:middle}
.roster-team-head{grid-template-columns:minmax(0,1fr) auto 30px;grid-template-rows:auto auto;gap:7px 11px;padding:11px 13px}
.roster-team-title{grid-column:1;grid-row:1}.roster-team-meta{grid-column:2;grid-row:1}.roster-team-toggle{grid-column:3;grid-row:1}.roster-team-shift-summary{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:1px}.roster-team-shift-summary span{justify-content:space-between;min-width:0;padding:6px 8px}
.roster-shift-grid{align-items:start;gap:0;background:#fff}.roster-lane{align-self:start;height:auto;border-right:1px solid #9db0c9}.roster-lane:last-child{border-right:0}.roster-lane-head{box-sizing:border-box;min-height:40px}.roster-lane-head>div:last-child{margin-left:auto}.roster-lane-body{height:auto}
@media(max-width:1050px){.roster-shift-grid{grid-template-columns:1fr}.roster-lane{border-right:0}.roster-lane+.roster-lane{border-top:1px solid #9db0c9}}
@media(max-width:720px){.roster-team-head{grid-template-columns:minmax(0,1fr) 30px}.roster-team-title{grid-column:1;grid-row:1}.roster-team-meta{grid-column:1;grid-row:2;margin-top:0}.roster-team-toggle{grid-column:2;grid-row:1}.roster-team-shift-summary{grid-column:1/-1;grid-row:3;overflow:visible}}
@media(max-width:520px){.roster-team-shift-summary{grid-template-columns:1fr}.roster-intro{align-items:stretch}.roster-calendar{min-width:0}}

/* v10.41 — simple everyday calendar */
.roster-calendar{min-width:178px;padding:9px 11px;gap:11px}
.roster-calendar-copy small{color:#7587a0}.roster-calendar-copy strong{font-size:12px;text-transform:none}.roster-calendar-copy em{color:#596c85;font-size:8px;font-weight:700}

/* v10.42 — batch third party creation by team and platform */
.create-action-buttons{display:flex;gap:7px;flex-wrap:wrap}.modal.modal-batch-third-party{width:min(1040px,100%);padding:22px 24px}.batch-third-party-title{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:14px;border-bottom:1px solid #e1e8f2}.batch-third-party-title p{margin-bottom:0}.batch-third-party-count{display:flex;align-items:baseline;gap:5px;white-space:nowrap;padding:8px 11px;border-radius:9px;background:#eaf2ff;color:#2a568f;font-size:9px;font-weight:800}.batch-third-party-count b{font-size:18px;color:#1d61cf}.batch-third-party-form{display:grid;gap:14px;margin-top:15px}.batch-third-party-common{display:grid;grid-template-columns:.7fr 1fr 1.2fr 1.25fr;gap:12px}.batch-third-party-common .form-field{display:flex;min-width:0;flex-direction:column;gap:6px}.batch-third-party-common label{font-size:9px;font-weight:850;text-transform:uppercase;color:#5d6f88}.batch-third-party-notes{grid-column:1/-1}.batch-third-party-targets{overflow:hidden;border:1px solid #d6e1ef;border-radius:12px;background:#f5f8fc}.batch-third-party-toolbar{display:grid;grid-template-columns:minmax(180px,1fr) minmax(230px,.8fr) auto;align-items:center;gap:12px;padding:12px 14px;border-bottom:1px solid #d7e1ed;background:#fff}.batch-third-party-toolbar strong,.batch-third-party-toolbar small{display:block}.batch-third-party-toolbar strong{font-size:11px;color:#20324b}.batch-third-party-toolbar small{margin-top:3px;color:#75849a;font-size:8px}.batch-third-party-toolbar .input{height:36px}.batch-third-party-select-all{display:flex;align-items:center;gap:7px;padding:9px 11px;border:1px solid #cad7e8;border-radius:8px;background:#f7faff;color:#31547f;font-size:9px;font-weight:850}.batch-third-party-select-all input,.batch-third-party-team-check,.batch-third-party-platform-check{width:16px;height:16px;accent-color:#2764da}.batch-third-party-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;max-height:430px;overflow:auto;padding:12px}.batch-third-party-team{overflow:hidden;border:1px solid #d7e1ed;border-radius:10px;background:#fff}.batch-third-party-team>header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 11px;background:linear-gradient(135deg,#eaf2ff,#f7faff);border-bottom:1px solid #dbe5f1}.batch-third-party-team>header label{display:flex;align-items:center;gap:7px;min-width:0}.batch-third-party-team>header strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#25466f;font-size:10px}.batch-third-party-team>header small{white-space:nowrap;color:#70829a;font-size:8px}.batch-third-party-platforms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#e0e7f0}.batch-third-party-platform{display:flex;min-width:0;align-items:center;gap:8px;padding:9px 10px;background:#fff;cursor:pointer}.batch-third-party-platform:last-child:nth-child(odd){grid-column:1/-1}.batch-third-party-platform:hover{background:#f2f7ff}.batch-third-party-platform span,.batch-third-party-platform strong,.batch-third-party-platform small{display:block;min-width:0}.batch-third-party-platform strong,.batch-third-party-platform small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.batch-third-party-platform strong{font-size:9px;color:#21334d}.batch-third-party-platform small{margin-top:3px;color:#77869a;font-size:7px}
@media(max-width:850px){.batch-third-party-common{grid-template-columns:1fr 1fr}.batch-third-party-toolbar{grid-template-columns:1fr}.batch-third-party-groups{grid-template-columns:1fr}}@media(max-width:560px){.modal.modal-batch-third-party{padding:17px}.batch-third-party-title{flex-direction:column}.batch-third-party-common,.batch-third-party-platforms{grid-template-columns:1fr}.create-action-buttons{flex-direction:column}}

/* v10.43 — multiple Third Party entries in one platform batch */
.batch-third-party-count b+span{margin-left:2px}.batch-third-party-entry-panel{overflow:hidden;border:1px solid #d4dfec;border-radius:12px;background:#f4f7fb}.batch-third-party-entry-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 13px;border-bottom:1px solid #d8e2ed;background:#fff}.batch-third-party-entry-toolbar strong,.batch-third-party-entry-toolbar small{display:block}.batch-third-party-entry-toolbar strong{font-size:11px;color:#20334e}.batch-third-party-entry-toolbar small{margin-top:3px;color:#728197;font-size:8px}.batch-third-party-entry-list{display:grid;gap:10px;max-height:330px;overflow:auto;padding:11px}.batch-third-party-entry{overflow:hidden;border:1px solid #d7e1ed;border-radius:10px;background:#fff}.batch-third-party-entry>header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border-bottom:1px solid #e0e7f0;background:linear-gradient(135deg,#edf4ff,#fff)}.batch-third-party-entry>header strong{color:#31547f;font-size:9px;text-transform:uppercase;letter-spacing:.05em}.batch-third-party-entry-fields{display:grid;grid-template-columns:.65fr 1fr 1.2fr 1.25fr;gap:10px;padding:10px}.batch-third-party-entry-fields .form-field{display:flex;min-width:0;flex-direction:column;gap:5px}.batch-third-party-entry-fields label{font-size:8px;font-weight:850;text-transform:uppercase;color:#62738a}.batch-third-party-entry-fields .input{height:36px}.batch-third-party-entry-notes{grid-column:1/-1}.batch-third-party-remove-entry.hidden{display:none!important}
@media(max-width:850px){.batch-third-party-entry-fields{grid-template-columns:1fr 1fr}}@media(max-width:560px){.batch-third-party-entry-toolbar{align-items:stretch;flex-direction:column}.batch-third-party-entry-fields{grid-template-columns:1fr}.batch-third-party-entry-notes{grid-column:auto}}

/* v10.44 — visible plus control on every batch entry */
.batch-third-party-entry-actions{display:flex;align-items:center;gap:7px}.batch-third-party-add-entry{display:grid;place-items:center;width:28px;height:28px;border:1px solid #7da6e6;border-radius:8px;background:#eaf2ff;color:#1b61d1;font-size:19px;font-weight:900;line-height:1;cursor:pointer;box-shadow:0 3px 8px rgba(31,91,179,.1)}.batch-third-party-add-entry:hover{border-color:#2866d5;background:#2866d5;color:#fff;transform:translateY(-1px)}

/* v10.45 — orderly single-line desktop top bar */
.topbar{display:flex!important;align-items:center!important;gap:18px!important;min-height:68px!important}
.topbar-title{flex:0 1 215px;min-width:150px;max-width:215px}.topbar-title h1,.topbar-title p{overflow:hidden;text-overflow:ellipsis}.topbar-title p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:1.2}
.top-actions{display:flex!important;flex:1 1 auto;min-width:0;align-items:center!important;justify-content:flex-end!important;flex-wrap:nowrap!important;gap:8px!important}.top-actions>*{flex-shrink:0}
.global-search-wrap{flex:1 1 220px!important;width:auto!important;min-width:180px;max-width:320px}.top-timezone-chip{min-height:38px!important}.top-refresh,.top-icon-btn{height:38px!important}.top-icon-btn{width:38px}.top-user-chip{min-width:0}.top-signout{white-space:nowrap}
@media(max-width:1380px){.global-search-wrap{display:none!important}.topbar-title{flex-basis:205px}.top-actions{gap:7px!important}}
@media(max-width:1180px){.top-user-copy{display:none}.top-user-chip{padding-right:3px}.topbar-title{flex-basis:185px;max-width:185px}.top-timezone-chip select{max-width:100px}}
@media(max-width:960px) and (min-width:851px){.topbar-title{flex-basis:165px;max-width:165px}.topbar-title p{font-size:8px!important}.top-time-copy{display:none!important}.top-timezone-chip select{max-width:92px}.top-refresh{padding-left:10px!important;padding-right:10px!important}}
@media(max-width:850px){.topbar{align-items:flex-start!important;flex-direction:column!important;gap:9px!important;padding-top:11px!important;padding-bottom:11px!important}.topbar-title{width:100%;max-width:none;flex:none}.topbar-title p{display:block}.top-actions{width:100%;justify-content:flex-start!important;flex-wrap:wrap!important}.top-time-copy{display:flex!important}.top-user-copy{display:grid}.top-user-chip{margin-left:auto}}
@media(max-width:560px){.top-refresh span:last-child,.top-user-copy{display:none}.top-user-chip{margin-left:0}.top-signout{margin-left:auto}}

/* v10.46 — Spreadsheet Records Team Leader filter */
#view-spreadsheets .data-toolbar{max-width:850px;display:grid;grid-template-columns:minmax(280px,1.65fr) minmax(190px,.75fr);gap:10px;align-items:center}
#spreadsheetLeaderFilter{width:100%;min-width:0}
@media(max-width:760px){#view-spreadsheets .data-toolbar{grid-template-columns:1fr;max-width:none}}

/* v10.47 — in-app refresh feedback without a login-screen flash */
#refreshBtn[aria-busy="true"]{cursor:wait;opacity:.82}

/* v10.48 — Data Quality Center */
.quality-panel{display:grid;gap:16px}.quality-panel-head{margin-bottom:0!important}.quality-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.quality-summary-card{position:relative;overflow:hidden;display:grid;gap:4px;min-height:104px;padding:16px;border:1px solid #dbe5f1;border-radius:14px;background:linear-gradient(145deg,#fff,#f5f8fd)}.quality-summary-card:after{content:"";position:absolute;right:-25px;bottom:-35px;width:90px;height:90px;border-radius:50%;background:currentColor;opacity:.08}.quality-summary-card span{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:#64748b}.quality-summary-card strong{font-size:28px;line-height:1;color:#17233b}.quality-summary-card small{font-size:9px;color:#7c8aa0}.quality-summary-card.total{color:#2768df}.quality-summary-card.duplicate{color:#7c3aed}.quality-summary-card.platform{color:#e87918}.quality-summary-card.staff{color:#dc3f63}.quality-status-banner{display:flex;align-items:center;gap:12px;padding:13px 15px;border:1px solid;border-radius:12px}.quality-status-banner>span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font-size:17px;font-weight:900}.quality-status-banner div{display:grid;gap:2px}.quality-status-banner strong{font-size:12px}.quality-status-banner small{font-size:9px}.quality-status-banner.healthy{border-color:#bce8d0;background:#f0fbf5;color:#167849}.quality-status-banner.healthy>span{background:#d6f4e2}.quality-status-banner.attention{border-color:#f8d4a3;background:#fff9ee;color:#a95710}.quality-status-banner.attention>span{background:#ffe8c4}.quality-toolbar{display:grid!important;grid-template-columns:minmax(280px,1.5fr) minmax(190px,.6fr);gap:10px;max-width:820px}.quality-table-wrap{border:1px solid #dbe5f1;border-radius:12px}.quality-table{min-width:900px}.quality-table th:nth-child(1){width:17%}.quality-table th:nth-child(2){width:18%}.quality-table th:nth-child(3){width:28%}.quality-table th:nth-child(4){width:27%}.quality-table th:nth-child(5){width:10%}.quality-type{display:inline-flex;align-items:center;gap:6px;font-weight:800}.quality-type i{display:grid;place-items:center;width:25px;height:25px;border-radius:8px;font-style:normal}.quality-type.duplicate i{background:#efe7ff;color:#6d28d9}.quality-type.platform i{background:#fff0dc;color:#c65f05}.quality-type.staff i{background:#ffe5ec;color:#be2850}.quality-severity{display:inline-flex;margin-bottom:5px;padding:3px 7px;border-radius:999px;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.quality-severity.critical{background:#ffe0e4;color:#b91c35}.quality-severity.warning{background:#fff0cf;color:#9a5a08}.quality-message{font-weight:650;color:#27364f;white-space:normal}.quality-table td:nth-child(4){white-space:normal;color:#65748b}
@media(max-width:1050px){.quality-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.quality-summary-grid,.quality-toolbar{grid-template-columns:1fr}.quality-summary-card{min-height:88px}}

/* v10.49 — multi-platform staff assignment */
.staff-platform-multiselect{display:grid;gap:7px}.staff-platform-selection{display:flex;min-height:30px;align-items:center;gap:6px;flex-wrap:wrap;padding:6px 7px;border:1px solid #d8e2ef;border-radius:9px;background:#f8fbff}.staff-platform-empty-state{color:#98a5b6;font-size:8px;font-weight:650}.staff-platform-token{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:5px 6px 5px 8px;border:1px solid #bdd3f0;border-radius:999px;background:#eaf3ff;color:#235d9f;font-size:8px;font-weight:800}.staff-platform-token>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.staff-platform-token button{display:grid;place-items:center;width:16px;height:16px;padding:0;border:0;border-radius:50%;background:#cfe2fb;color:#194f8e;font-size:12px;line-height:1;cursor:pointer}.staff-platform-search-row{position:relative}.staff-platform-option-check{display:none;float:right;color:#1d7a4f;font-size:10px;font-weight:900}.staff-platform-multiselect .searchable-select-option.active .staff-platform-option-check{display:inline}.staff-platform-multiselect .searchable-select-option.active{background:#edf8f2}.staff-platform-chips{display:flex;gap:4px;flex-wrap:wrap}.staff-platform-chips .platform-chip{white-space:nowrap}
.staff-detected-leader{display:grid;gap:4px}.staff-detected-leader small{color:#6f8299;font-size:8px;font-weight:700}.staff-detected-leader .readonly-field{background:#f3f7fc;color:#314d73;font-weight:800}


/* v10.51 — Staff Directory: dynamic Staff by Team card grid */
.staff-team-summary-section{margin:12px 16px 2px;padding:13px;border:1px solid #dce6f2;border-radius:13px;background:linear-gradient(145deg,#fbfdff,#f6f9fd)}
.staff-team-summary-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.staff-team-summary-head h3{margin:0;color:#1e2d45;font-size:12px;font-weight:900}.staff-team-summary-head p{margin:3px 0 0;color:#728198;font-size:8px;font-weight:650}
.staff-team-summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(255px,1fr));gap:10px}.staff-team-summary-card{display:grid;gap:9px;width:100%;padding:12px;border:1px solid #dbe5f1;border-radius:12px;background:#fff;color:#20324d;text-align:left;cursor:pointer;box-shadow:0 3px 10px rgba(29,53,87,.04);transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.staff-team-summary-card:hover{transform:translateY(-1px);border-color:#adc4e6;box-shadow:0 7px 17px rgba(29,53,87,.08)}.staff-team-summary-card.selected{border-color:#3a74df;box-shadow:0 0 0 2px rgba(58,116,223,.12),0 7px 17px rgba(29,53,87,.08)}
.staff-team-summary-top{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:9px}.staff-team-summary-copy{min-width:0}.staff-team-summary-copy strong,.staff-team-summary-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.staff-team-summary-copy strong{font-size:11px;font-weight:900;color:#1d2e49}.staff-team-summary-copy small{margin-top:3px;color:#7e8da2;font-size:7px;font-weight:700}.staff-team-summary-total{min-width:50px;text-align:right}.staff-team-summary-total b,.staff-team-summary-total small{display:block}.staff-team-summary-total b{color:#1764d9;font-size:24px;line-height:1}.staff-team-summary-total small{margin-top:3px;color:#75849a;font-size:7px;font-weight:850;text-transform:uppercase}
.staff-team-summary-card.team-tone-1 .dashboard-team-avatar{background:linear-gradient(145deg,#dcf7e9,#bcebcf);color:#138154}.staff-team-summary-card.team-tone-1 .staff-team-summary-total b{color:#138154}.staff-team-summary-card.team-tone-2 .dashboard-team-avatar{background:linear-gradient(145deg,#eee5ff,#d8c4ff);color:#6a39c9}.staff-team-summary-card.team-tone-2 .staff-team-summary-total b{color:#6a39c9}.staff-team-summary-card.team-tone-3 .dashboard-team-avatar{background:linear-gradient(145deg,#fff0dd,#ffdab0);color:#c96816}.staff-team-summary-card.team-tone-3 .staff-team-summary-total b{color:#c96816}
.staff-team-status-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding-top:8px;border-top:1px solid #e7edf5}.staff-team-status-row>span{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:6px 8px;border-radius:8px;background:#f6f9fc}.staff-team-status-row small{color:#77869b;font-size:7px;font-weight:800}.staff-team-status-row b{font-size:10px;color:#253954}.staff-team-status-row>span:first-child{background:#ecf9f1}.staff-team-status-row>span:first-child b{color:#178253}.staff-team-status-row>span:last-child{background:#fff1f1}.staff-team-status-row>span:last-child b{color:#ca4646}
.staff-team-shifts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.staff-team-shifts>span{display:flex;min-width:0;align-items:center;justify-content:space-between;gap:4px;padding:6px;border-radius:7px;font-size:7px;font-weight:800}.staff-team-shifts i{font-style:normal}.staff-team-shifts b{font-size:10px}.staff-team-shifts .day{background:#fff1ae;color:#665000}.staff-team-shifts .mid{background:#d8f4e6;color:#176244}.staff-team-shifts .night{background:#e5e0fb;color:#493a88}.staff-team-summary-empty{grid-column:1/-1;padding:18px;background:#fff;border:1px dashed #d6e0ec;border-radius:10px}
@media(max-width:720px){.staff-team-summary-section{margin:10px 10px 2px;padding:10px}.staff-team-summary-grid{grid-template-columns:1fr}.staff-team-shifts{grid-template-columns:1fr}.staff-team-summary-head p{line-height:1.45}}


/* v10.52 — shared Third Party across multiple platforms */
.third-party-platform-list,.third-party-system-list{display:flex;align-items:center;gap:5px;flex-wrap:wrap}.third-party-platform-list .platform-chip{white-space:nowrap}.third-party-platform-multiselect{margin-top:2px}.third-party-platform-multiselect .staff-platform-selection{min-height:34px}.third-party-platform-multiselect .searchable-select-menu{max-height:240px;overflow:auto}

/* ==========================================================
   v10.54 — Premium Light 3D Theme (VISUAL ONLY)
   Scope: all menus / pages. No application logic is changed.
   ========================================================== */
:root{
  --pd3-bg:#eef3fa;
  --pd3-bg-2:#f7f9fd;
  --pd3-surface:#ffffff;
  --pd3-surface-soft:#f7faff;
  --pd3-text:#14233c;
  --pd3-muted:#71819a;
  --pd3-border:#dbe5f2;
  --pd3-border-strong:#c9d7e9;
  --pd3-blue:#1769e9;
  --pd3-blue-2:#2b8cff;
  --pd3-navy:#061a3d;
  --pd3-navy-2:#03132f;
  --pd3-green:#16a666;
  --pd3-purple:#7a43e8;
  --pd3-orange:#f07a19;
  --pd3-red:#df4b59;
  --pd3-cyan:#0da4ba;
  --pd3-shadow:0 16px 34px rgba(40,67,111,.10),0 4px 12px rgba(40,67,111,.06),inset 0 1px 0 rgba(255,255,255,.96);
  --pd3-shadow-soft:0 9px 22px rgba(42,67,108,.08),inset 0 1px 0 rgba(255,255,255,.95);
  --pd3-shadow-button:0 7px 14px rgba(39,72,129,.13),inset 0 1px 0 rgba(255,255,255,.92),inset 0 -1px 0 rgba(61,90,137,.08);
  --pd3-inset:inset 2px 2px 5px rgba(46,71,111,.08),inset -2px -2px 5px rgba(255,255,255,.95);
}

html,body{background:var(--pd3-bg)!important;color:var(--pd3-text)!important}
.app-shell{background:var(--pd3-bg)!important}
.main{
  background:
    radial-gradient(circle at 88% 2%,rgba(54,136,255,.07),transparent 25%),
    radial-gradient(circle at 12% 25%,rgba(116,73,232,.045),transparent 22%),
    linear-gradient(145deg,#f7f9fd 0%,#edf3fa 100%)!important;
}

/* Dark 3D sidebar — keep the user's preferred navy identity. */
.sidebar{
  background:
    radial-gradient(circle at 30% 5%,rgba(35,108,255,.22),transparent 23%),
    linear-gradient(180deg,#071d47 0%,#041535 55%,#03112c 100%)!important;
  border-right:1px solid rgba(103,153,255,.18)!important;
  box-shadow:10px 0 28px rgba(3,18,47,.18),inset -1px 0 0 rgba(255,255,255,.025)!important;
}
.brand{padding-top:15px!important;padding-bottom:15px!important}
.brand-mark{
  width:44px!important;height:44px!important;border-radius:50%!important;
  background:radial-gradient(circle at 30% 24%,#77b6ff 0%,#2476ff 34%,#164fd2 64%,#09246d 100%)!important;
  border:1px solid rgba(132,190,255,.65)!important;
  box-shadow:0 8px 17px rgba(0,80,255,.32),0 0 0 4px rgba(52,117,255,.10),inset 0 2px 3px rgba(255,255,255,.55),inset 0 -4px 8px rgba(0,24,98,.40)!important;
  color:#fff!important;text-shadow:0 2px 5px rgba(0,25,90,.45)
}
.brand-name{font-size:15px!important;text-shadow:0 2px 8px rgba(0,0,0,.18)}
.brand-sub{color:#c6d5ef!important}
.nav-item{
  border-radius:10px!important;
  transition:transform .16s ease,background .16s ease,border-color .16s ease,box-shadow .16s ease!important;
}
.nav-item:hover{
  transform:translateX(2px);
  background:linear-gradient(145deg,rgba(24,65,139,.72),rgba(7,35,86,.78))!important;
  border-color:rgba(104,158,255,.25)!important;
  box-shadow:0 6px 14px rgba(0,13,40,.22),inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.nav-item.active{
  background:linear-gradient(145deg,#2b7cff,#174fd5)!important;
  border-color:rgba(143,193,255,.62)!important;
  box-shadow:0 8px 18px rgba(13,74,200,.40),0 0 18px rgba(33,104,255,.18),inset 0 1px 0 rgba(255,255,255,.34),inset 0 -2px 5px rgba(0,44,151,.38)!important;
}
.nav-item.active span{filter:drop-shadow(0 2px 4px rgba(0,34,111,.45))}
.nav-section-label{color:#95aad0!important}
.sidebar-foot{
  background:linear-gradient(145deg,rgba(10,39,89,.94),rgba(4,23,58,.96))!important;
  border-color:rgba(86,139,238,.30)!important;
  box-shadow:0 10px 24px rgba(0,10,32,.28),inset 0 1px 0 rgba(255,255,255,.07)!important;
}
.user-mini .avatar,.top-user-avatar{
  background:radial-gradient(circle at 30% 25%,#64c2ff 0%,#1476ff 40%,#123dcc 72%,#081e67 100%)!important;
  color:#fff!important;border:1px solid rgba(150,206,255,.62)!important;
  box-shadow:0 6px 15px rgba(0,80,215,.30),inset 0 2px 3px rgba(255,255,255,.45),inset 0 -3px 6px rgba(0,25,105,.38)!important;
}

/* Light raised top bar on every menu. */
.topbar{
  background:rgba(247,250,255,.92)!important;
  border-bottom:1px solid rgba(202,216,235,.86)!important;
  box-shadow:0 7px 18px rgba(44,69,111,.07)!important;
  backdrop-filter:blur(14px)!important;
}
.topbar-title h1{color:#14233d!important;text-shadow:none!important}
.topbar-title p{color:#71819a!important}
.global-search-input,.top-refresh,.top-icon-btn,.top-user-chip,.top-timezone-chip{
  background:linear-gradient(145deg,#fff,#f2f6fc)!important;
  color:#1e3150!important;
  border:1px solid #dbe5f1!important;
  box-shadow:var(--pd3-shadow-button)!important;
}
.global-search-input{color:#1e3150!important}.global-search-input::placeholder{color:#8b9ab0!important}.global-search-icon{color:#57708f!important}
.top-signout{color:#566985!important;border:1px solid #dce5f0!important;background:linear-gradient(145deg,#fff,#f5f8fc)!important;box-shadow:var(--pd3-shadow-button)!important}
.top-time-copy strong,.top-time-copy span,.top-user-copy strong,.top-user-copy span{color:#20334f!important}
.top-timezone-chip select{color:#49607e!important}

/* Universal raised 3D containers on every menu. */
.panel,.premium-panel,.stat-card,.system-card,.health-card,.team-summary-card,.quality-summary-card,
.staff-summary-card,.editor-section,.login-card,.modal,.completion-hero,.assignment-option,.batch-shift-choice,
.batch-staff-row,.batch-third-party-entry-panel,.preview-panel,.pending-role-panel{
  background:linear-gradient(145deg,#ffffff 0%,#f7faff 100%)!important;
  border:1px solid var(--pd3-border)!important;
  box-shadow:var(--pd3-shadow)!important;
}
.panel,.premium-panel,.system-card,.quality-summary-card,.staff-summary-card,.editor-section{border-radius:15px!important}
.panel-head,.premium-panel-head,.panel-subhead{background:transparent!important;border-color:#e7edf5!important}
.panel-head h2,.premium-panel-head h3,.panel-subhead h3{color:#17263f!important}
.panel-head p,.premium-panel-head p,.panel-subhead p{color:#71819a!important}

/* Buttons: raised, tactile and still readable. */
.btn,.premium-link,.text-btn,.open-link-btn,.quick-action,.staff-tab,.third-party-tabs .btn{
  transition:transform .15s ease,box-shadow .15s ease,filter .15s ease!important;
}
.btn,.premium-link,.open-link-btn{
  background:linear-gradient(145deg,#fff,#f2f6fc)!important;
  border:1px solid #d5e0ed!important;
  color:#213551!important;
  box-shadow:var(--pd3-shadow-button)!important;
}
.btn:hover,.premium-link:hover,.open-link-btn:hover{transform:translateY(-1px)!important;box-shadow:0 10px 19px rgba(39,72,129,.16),inset 0 1px 0 #fff!important}
.btn-primary{
  color:#fff!important;
  background:linear-gradient(145deg,#2e82ff,#1958d9)!important;
  border-color:#2369e4!important;
  box-shadow:0 8px 17px rgba(27,97,224,.28),inset 0 1px 0 rgba(255,255,255,.42),inset 0 -3px 6px rgba(0,45,151,.25)!important;
}
.btn-danger{
  color:#b53a46!important;background:linear-gradient(145deg,#fff7f7,#ffeaea)!important;border-color:#f4c7cc!important;
  box-shadow:0 6px 13px rgba(196,63,74,.10),inset 0 1px 0 #fff!important
}
.btn-secondary{background:linear-gradient(145deg,#fff,#f1f5fb)!important}

/* Inputs, dropdowns and searchable controls use a soft inset depth. */
.input,.select,.textarea,.global-search-input,.preview-input,.filter-search-select,.searchable-select-trigger,
.staff-platform-selection,.filter-search-input,.matrix-count{
  background:#f9fbfe!important;
  border:1px solid #d4dfed!important;
  box-shadow:var(--pd3-inset)!important;
  color:#253853!important;
}
.input:focus,.select:focus,.textarea:focus,.filter-search-input:focus,.global-search-input:focus{
  border-color:#75a8ef!important;box-shadow:var(--pd3-inset),0 0 0 3px rgba(38,115,225,.09)!important
}
.searchable-select-menu,.filter-search-menu,.global-search-results{
  background:linear-gradient(145deg,#fff,#f5f8fc)!important;
  border:1px solid #d7e2ef!important;
  box-shadow:0 16px 35px rgba(31,57,98,.16),inset 0 1px 0 #fff!important;
  border-radius:12px!important;
}

/* Dashboard hero becomes white premium 3D, matching the selected reference. */
.premium-hero{
  background:
    radial-gradient(circle at 82% 20%,rgba(55,125,255,.13),transparent 27%),
    radial-gradient(circle at 64% 72%,rgba(123,74,232,.08),transparent 24%),
    linear-gradient(145deg,#fff,#f5f8fd)!important;
  border:1px solid #dbe5f2!important;
  box-shadow:var(--pd3-shadow)!important;
}
.premium-hero:before{opacity:.12!important}
.hero-copy h2{color:#172640!important;text-shadow:none!important}.hero-copy p{color:#687b96!important}
.hero-badge-orb{
  background:radial-gradient(circle at 32% 26%,#78bdff,#2579ff 40%,#194bd4 68%,#0b236f)!important;
  color:#fff!important;border:1px solid #75b5ff!important;text-shadow:none!important;
  box-shadow:0 9px 20px rgba(25,92,217,.26),inset 0 2px 3px rgba(255,255,255,.55),inset 0 -4px 8px rgba(0,35,128,.34)!important
}
.dragon-energy-orbs{opacity:.55!important}.dragon-energy-orb{filter:saturate(.85)!important}

/* White 3D KPI cards with colorful glossy icon blocks. */
.premium-kpi{
  color:#172640!important;
  background:linear-gradient(145deg,#fff,#f4f8fd)!important;
  border:1px solid #dbe5f2!important;
  box-shadow:var(--pd3-shadow)!important;
  overflow:visible!important;
}
.premium-kpi:after{opacity:.07!important;border-color:currentColor!important}
.premium-kpi:before{opacity:.25!important}
.premium-kpi small{color:#3c4e68!important}.premium-kpi strong{color:#102f71!important}.premium-kpi .kpi-trend{color:#60748f!important}
.premium-kpi-icon{
  border:1px solid rgba(255,255,255,.72)!important;color:#fff!important;
  box-shadow:0 8px 16px rgba(26,75,158,.22),inset 0 2px 3px rgba(255,255,255,.55),inset 0 -4px 7px rgba(0,24,90,.25)!important;
}
.kpi-blue .premium-kpi-icon{background:linear-gradient(145deg,#3f9cff,#1455e1)!important}.kpi-blue strong{color:#165fdf!important}
.kpi-green .premium-kpi-icon{background:linear-gradient(145deg,#4dd58c,#139357)!important}.kpi-green strong{color:#148a55!important}
.kpi-purple .premium-kpi-icon{background:linear-gradient(145deg,#a96cff,#6835dc)!important}.kpi-purple strong{color:#6835d7!important}
.kpi-teal .premium-kpi-icon{background:linear-gradient(145deg,#46d7e2,#0798ae)!important}.kpi-teal strong{color:#078fa5!important}

/* Dashboard staff cards — explicitly raised 3D. */
.dashboard-staff-teams{overflow:hidden}
.dashboard-staff-team-card,.staff-team-summary-card{
  position:relative!important;
  background:linear-gradient(145deg,#ffffff,#f5f8fd)!important;
  border:1px solid #dce6f2!important;
  box-shadow:0 10px 23px rgba(38,65,105,.09),inset 0 1px 0 #fff!important;
  border-radius:14px!important;
}
.dashboard-staff-team-card:after,.staff-team-summary-card:after{
  content:"";position:absolute;left:9px;right:9px;bottom:-1px;height:3px;border-radius:99px;background:linear-gradient(90deg,#2a79ff,#5ca8ff);opacity:.9
}
.dashboard-staff-team-card:nth-child(4n+2):after,.staff-team-summary-card.team-tone-1:after{background:linear-gradient(90deg,#20ad68,#63db9b)}
.dashboard-staff-team-card:nth-child(4n+3):after,.staff-team-summary-card.team-tone-2:after{background:linear-gradient(90deg,#f38b1d,#ffbd59)}
.dashboard-staff-team-card:nth-child(4n+4):after,.staff-team-summary-card.team-tone-3:after{background:linear-gradient(90deg,#7b58e8,#b094ff)}
.dashboard-team-avatar{
  border:1px solid rgba(255,255,255,.80)!important;
  box-shadow:0 7px 14px rgba(26,70,143,.16),inset 0 2px 3px rgba(255,255,255,.65),inset 0 -3px 6px rgba(46,83,143,.13)!important
}
.dashboard-team-count,.staff-team-summary-total{
  filter:drop-shadow(0 3px 5px rgba(20,75,160,.12));
}
.dashboard-team-shifts>span,.staff-team-status-row>span,.staff-team-shifts>span{
  border:1px solid rgba(217,228,241,.72)!important;
  box-shadow:0 4px 9px rgba(42,67,105,.06),inset 0 1px 0 rgba(255,255,255,.92)!important;
}

/* System / Team / Health / Quality cards share the same tactile design. */
.system-card,.system-mini-card,.team-summary-card,.quality-summary-card,.health-card,.coverage-metric,.top-system-row,.config-health-row{
  background:linear-gradient(145deg,#fff,#f5f8fd)!important;
  border-color:#dce6f2!important;
  box-shadow:var(--pd3-shadow-soft)!important;
}
.system-card:hover,.team-summary-card:hover,.quality-summary-card:hover{transform:translateY(-2px);box-shadow:0 15px 28px rgba(38,65,105,.12),inset 0 1px 0 #fff!important}
.system-mini-card{border-radius:13px!important}.system-mini-card:before{height:4px!important;box-shadow:0 2px 5px rgba(24,103,203,.12)}
.system-mini-track,.coverage-track,.config-health-track,.health-progress-track,.team-summary-mini-track{
  background:#e4ebf4!important;box-shadow:inset 2px 2px 5px rgba(51,75,111,.11),inset -1px -1px 2px rgba(255,255,255,.92)!important
}
.system-mini-fill,.coverage-fill,.config-health-fill,.health-progress-fill,.team-summary-mini-fill{box-shadow:0 2px 6px rgba(29,98,201,.18)}

/* Quick Actions: glossy 3D shortcut buttons. */
.quick-action{
  border:1px solid rgba(216,225,239,.88)!important;
  box-shadow:0 8px 15px rgba(44,68,108,.10),inset 0 1px 0 rgba(255,255,255,.95),inset 0 -2px 4px rgba(67,91,128,.07)!important;
}
.quick-action:hover{transform:translateY(-2px)!important;box-shadow:0 12px 20px rgba(44,68,108,.14),inset 0 1px 0 #fff!important}
.quick-action b{display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:rgba(255,255,255,.72);box-shadow:0 4px 8px rgba(46,70,109,.08),inset 0 1px 0 #fff}

/* Tables: raised frame, calm rows, 3D action controls. */
.toolbar,.toolbar.data-toolbar,.staff-toolbar,.quality-toolbar{
  background:linear-gradient(145deg,#fff,#f3f7fc)!important;
  border:1px solid #dce6f2!important;
  box-shadow:var(--pd3-shadow-soft)!important;
  border-radius:14px!important;
  padding:11px!important;
}
.table-scroll,.permission-scroll,.matrix-wrap,.import-preview-scroll{
  background:linear-gradient(145deg,#fff,#f8faff)!important;
  border:1px solid #d8e3f0!important;
  border-radius:14px!important;
  box-shadow:var(--pd3-shadow-soft)!important;
}
.management-table th,.data-management-table th,.permission-table th,.settings-table th{
  background:linear-gradient(180deg,#f8faff,#edf3f9)!important;
  color:#5e708a!important;
  box-shadow:inset 0 -1px 0 #d7e1ee!important;
}
.management-table td,.data-management-table td,.permission-table td,.settings-table td{background:rgba(255,255,255,.86)!important}
.management-table tbody tr:nth-child(even) td,.data-management-table tbody tr:nth-child(even) td{background:#f9fbfe!important}
.management-table tbody tr:hover td,.data-management-table tbody tr:hover td{background:#f1f7ff!important}
.row-actions .btn{min-height:34px!important}

/* Preserve Matrix category colors while giving the matrix a 3D shell. */
.matrix-panel{background:linear-gradient(145deg,#fff,#f5f8fc)!important}
.settings-table th.platform{background:linear-gradient(180deg,#18365f,#0d274a)!important;color:#fff!important}
.settings-table th.system{background:linear-gradient(180deg,#3e628d,#294c75)!important;color:#fff!important}
.settings-table th.deposit{background:linear-gradient(180deg,#5b8ccb,#3f70ae)!important;color:#fff!important}
.settings-table th.bonus{background:linear-gradient(180deg,#8177d9,#655ac1)!important;color:#fff!important}
.settings-table th.game{background:linear-gradient(180deg,#59a0af,#3e8494)!important;color:#fff!important}
.settings-table td.platform,.settings-table td.system{box-shadow:3px 0 8px rgba(43,63,96,.06)!important}

/* Page-specific modules. */
.third-party-tabs{padding:5px;background:linear-gradient(145deg,#fff,#f1f5fa);border:1px solid #dbe5f2;border-radius:12px;box-shadow:var(--pd3-shadow-button)}
.third-party-tabs .btn.active{color:#fff!important;background:linear-gradient(145deg,#2c82ff,#1957d9)!important;border-color:#286ee1!important;box-shadow:0 7px 14px rgba(28,96,218,.24),inset 0 1px 0 rgba(255,255,255,.38)!important}
.csv-tools-panel,.create-action-panel,.data-header-actions{
  background:linear-gradient(145deg,#fff,#f4f8fd)!important;border:1px solid #dce6f1!important;border-radius:13px!important;box-shadow:var(--pd3-shadow-button)!important
}
.action-group-label{color:#6d7d94!important}

.staff-summary-card{
  position:relative;overflow:hidden;min-height:86px!important;
  box-shadow:var(--pd3-shadow-soft)!important
}
.staff-summary-card:after{content:"";position:absolute;right:-25px;bottom:-35px;width:95px;height:95px;border-radius:50%;background:currentColor;opacity:.05}
.staff-summary-card strong{filter:drop-shadow(0 2px 3px rgba(22,86,181,.10))}
.staff-tabs{gap:8px!important;border-bottom:0!important;padding-bottom:8px!important}
.staff-tab{
  border:1px solid #dbe5f1!important;border-radius:10px!important;background:linear-gradient(145deg,#fff,#f2f6fb)!important;
  box-shadow:var(--pd3-shadow-button)!important;color:#667991!important;padding:8px 13px!important
}
.staff-tab.active{color:#fff!important;background:linear-gradient(145deg,#2c81ff,#1758dd)!important;border-color:#2c71e6!important;box-shadow:0 7px 15px rgba(30,97,220,.24),inset 0 1px 0 rgba(255,255,255,.4)!important}
.staff-team-summary-section{
  background:linear-gradient(145deg,#f9fbff,#eef4fb)!important;border-color:#d7e3f0!important;box-shadow:inset 2px 2px 5px rgba(48,72,109,.035),inset -2px -2px 5px rgba(255,255,255,.8)!important
}
.quality-status-banner{box-shadow:var(--pd3-shadow-button)!important}
.quality-summary-card strong{filter:drop-shadow(0 2px 3px rgba(25,78,157,.10))}

.users-layout>.panel,.permission-panel{box-shadow:var(--pd3-shadow)!important}
.permission-check{box-shadow:0 4px 8px rgba(41,67,108,.06),inset 0 1px 0 #fff!important}
.access-chip,.leader-chip,.pill,.badge,.platform-chip,.team-system-chip{
  border:1px solid rgba(211,222,236,.75)!important;box-shadow:0 3px 7px rgba(42,68,107,.05),inset 0 1px 0 rgba(255,255,255,.9)!important
}

.editor-section summary{
  background:linear-gradient(145deg,#fbfdff,#f0f5fb)!important;
  box-shadow:inset 0 -1px 0 #e0e8f2!important;
}
.branding-actions{background:rgba(250,252,255,.94)!important;backdrop-filter:blur(10px)}
.login-preview-shell,.multi-preview-shell{background:linear-gradient(145deg,#eef4fb,#f9fbfe)!important;box-shadow:var(--pd3-inset)!important}
.login-preview-card{box-shadow:var(--pd3-shadow)!important}

/* Activity / pending / completion sections. */
.activity-item,.premium-activity-item{border-color:#e4ebf4!important}
.activity-icon,.premium-activity-avatar{box-shadow:0 5px 10px rgba(43,72,119,.08),inset 0 1px 0 #fff!important}
.pending-role-icon,.completion-ring{filter:drop-shadow(0 8px 12px rgba(32,94,194,.15))}

/* Modals / forms — clear 3D depth without touching form logic. */
.modal{
  background:linear-gradient(145deg,#fff,#f5f8fc)!important;
  border:1px solid #d8e3ef!important;
  box-shadow:0 28px 70px rgba(7,29,64,.28),0 8px 22px rgba(31,57,98,.14),inset 0 1px 0 #fff!important;
}
.modal-backdrop{background:rgba(3,17,42,.52)!important;backdrop-filter:blur(6px)!important}
.modal-form,.staff-form,.batch-shift-form,.batch-third-party-form{background:transparent!important}
.form-section-title{color:#586c88!important}

/* Hover depth is consistent across clickable cards everywhere. */
.clickable-card,.system-card,.team-summary-card,.dashboard-staff-team-card,.staff-team-summary-card,.quality-summary-card{
  transition:transform .17s ease,box-shadow .17s ease,border-color .17s ease!important
}
.clickable-card:hover,.system-card:hover,.team-summary-card:hover,.dashboard-staff-team-card:hover,.staff-team-summary-card:hover,.quality-summary-card:hover{
  transform:translateY(-2px)!important;border-color:#bdd1eb!important;box-shadow:0 18px 30px rgba(36,63,105,.13),inset 0 1px 0 #fff!important
}

/* Small screen: keep the 3D feel but reduce shadow weight. */
@media(max-width:850px){
  .sidebar{box-shadow:0 7px 20px rgba(3,18,47,.18)!important}
  .panel,.premium-panel,.premium-kpi,.system-card,.quality-summary-card,.staff-summary-card{box-shadow:0 9px 18px rgba(40,67,111,.08),inset 0 1px 0 #fff!important}
  .topbar{box-shadow:0 5px 12px rgba(44,69,111,.06)!important}
}

/* ============================================================
   v10.55 — Dashboard Hero: raised subtitle + true 3D energy orbs
   Keeps existing layout/logic; visual depth only.
   ============================================================ */
.premium-hero .hero-copy p{
  display:inline-flex!important;
  align-items:center;
  width:max-content;
  max-width:100%;
  margin:8px 0 0!important;
  padding:6px 11px!important;
  border:1px solid rgba(207,220,237,.96)!important;
  border-radius:999px!important;
  color:#607492!important;
  font-weight:750!important;
  letter-spacing:.01em;
  background:linear-gradient(145deg,#ffffff 0%,#f0f5fb 100%)!important;
  box-shadow:
    0 7px 14px rgba(45,70,109,.11),
    0 2px 4px rgba(45,70,109,.07),
    inset 0 2px 1px rgba(255,255,255,.98),
    inset 0 -2px 4px rgba(79,104,143,.07)!important;
  text-shadow:0 1px 0 #fff!important;
}
.dragon-energy-orbs{
  opacity:1!important;
  perspective:700px;
  filter:drop-shadow(0 13px 14px rgba(109,69,18,.14));
}
.dragon-energy-orb{
  overflow:hidden;
  filter:none!important;
  color:#c84e16!important;
  border:1px solid rgba(255,196,86,.95)!important;
  background:
    radial-gradient(circle at 32% 24%,rgba(255,255,255,.96) 0 6%,rgba(255,244,181,.96) 7% 15%,transparent 16%),
    radial-gradient(circle at 35% 30%,#fff4b3 0%,#ffd56a 19%,#f5a63e 47%,#dc7632 72%,#a44822 100%)!important;
  box-shadow:
    0 12px 18px rgba(133,72,19,.20),
    0 4px 7px rgba(147,79,18,.15),
    inset 5px 6px 10px rgba(255,255,255,.62),
    inset -7px -9px 13px rgba(111,43,7,.24),
    inset 0 0 0 2px rgba(255,239,170,.34)!important;
  text-shadow:0 1px 0 rgba(255,247,201,.9),0 2px 3px rgba(115,40,5,.18)!important;
  transform:translateZ(0);
}
.dragon-energy-orb:before{
  content:"";
  position:absolute;
  width:42%;
  height:25%;
  left:17%;
  top:10%;
  border-radius:50%;
  background:linear-gradient(180deg,rgba(255,255,255,.72),rgba(255,255,255,0));
  transform:rotate(-22deg);
  pointer-events:none;
}
.dragon-energy-orb.orb-one{transform:rotate(-5deg) translateZ(8px)!important}
.dragon-energy-orb.orb-two{transform:translateY(-2px) translateZ(18px)!important;box-shadow:0 16px 24px rgba(133,72,19,.23),0 5px 9px rgba(147,79,18,.16),inset 6px 7px 11px rgba(255,255,255,.66),inset -8px -10px 14px rgba(111,43,7,.25),inset 0 0 0 2px rgba(255,239,170,.38)!important}
.dragon-energy-orb.orb-three{transform:rotate(6deg) translateZ(11px)!important}

@media(max-width:560px){
  .premium-hero .hero-copy p{padding:5px 8px!important;border-radius:10px!important;width:auto}
}


/* ============================================================
   v10.56 — Phone / Tablet responsive navigation & layout
   Visual / navigation-only. Business logic and data logic unchanged.
   ============================================================ */
.mobile-menu-toggle,
.mobile-nav-backdrop{display:none}

@media(max-width:1100px){
  html,body{width:100%;max-width:100%;overflow-x:hidden!important}
  body.mobile-nav-open{overflow:hidden!important}

  .app-shell{display:block!important;width:100%!important;min-width:0!important}

  .sidebar{
    position:fixed!important;inset:0 auto 0 0!important;
    width:min(84vw,320px)!important;max-width:320px!important;height:100dvh!important;
    z-index:320!important;overflow-y:auto!important;overflow-x:hidden!important;padding:0!important;
    transform:translateX(-104%);transition:transform .22s ease!important;
    box-shadow:18px 0 44px rgba(1,14,38,.34)!important;
  }
  body.mobile-nav-open .sidebar{transform:translateX(0)}

  .brand{
    min-height:72px!important;padding:14px 16px!important;position:sticky!important;top:0!important;z-index:3!important;
    background:linear-gradient(180deg,rgba(7,29,71,.98),rgba(6,25,61,.95))!important;backdrop-filter:blur(12px)!important;
  }
  .brand-mark{width:44px!important;height:44px!important;min-width:44px!important}
  .brand-name{font-size:14px!important}.brand-sub{font-size:9px!important}

  .nav{display:grid!important;grid-template-columns:1fr!important;gap:5px!important;width:100%!important;padding:10px 12px 18px!important;overflow:visible!important}
  .nav-section-label{display:block!important;width:100%!important;padding:14px 9px 5px!important;font-size:9px!important;letter-spacing:.12em!important}
  .nav-section-label.hidden{display:none!important}
  .nav-item{width:100%!important;min-width:0!important;min-height:43px!important;padding:10px 12px!important;gap:11px!important;white-space:normal!important}
  .nav-item b{min-width:0!important;overflow-wrap:anywhere!important;line-height:1.25!important}
  .nav-item:hover{transform:none!important}

  .sidebar-foot{display:block!important;position:static!important;margin:8px 12px 16px!important;padding:11px!important}

  .mobile-nav-backdrop{
    display:block!important;position:fixed!important;inset:0!important;z-index:310!important;border:0!important;padding:0!important;
    background:rgba(3,15,37,.46)!important;backdrop-filter:blur(2px)!important;opacity:0!important;pointer-events:none!important;transition:opacity .2s ease!important;
  }
  body.mobile-nav-open .mobile-nav-backdrop{opacity:1!important;pointer-events:auto!important}

  .main{width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important;padding:0 12px 20px!important;overflow:visible!important}

  .topbar{
    position:sticky!important;top:0!important;z-index:190!important;display:flex!important;flex-direction:row!important;align-items:center!important;gap:10px!important;
    width:auto!important;min-height:62px!important;margin:0 -12px 12px!important;padding:9px 12px!important;
    background:rgba(247,250,255,.96)!important;backdrop-filter:blur(16px)!important;
  }

  .mobile-menu-toggle{
    display:grid!important;flex:0 0 42px!important;width:42px!important;height:42px!important;place-content:center!important;gap:4px!important;padding:0!important;
    border:1px solid #d5e2f1!important;border-radius:12px!important;color:#1f5fc9!important;background:linear-gradient(145deg,#fff,#edf4fc)!important;box-shadow:var(--pd3-shadow-button)!important;
  }
  .mobile-menu-toggle span{display:block!important;width:17px!important;height:2px!important;border-radius:2px!important;background:#245fc1!important;transition:transform .2s ease,opacity .2s ease!important}
  body.mobile-nav-open .mobile-menu-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  body.mobile-nav-open .mobile-menu-toggle span:nth-child(2){opacity:0}
  body.mobile-nav-open .mobile-menu-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

  .topbar-title{display:block!important;flex:1 1 auto!important;width:auto!important;min-width:0!important;max-width:none!important}
  .dashboard-mode .topbar-title{display:block!important}
  .topbar-title h1{font-size:15px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
  .topbar-title p{display:block!important;margin-top:2px!important;font-size:8px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}

  .top-actions{
    flex:0 0 auto!important;width:auto!important;max-width:calc(100vw - 190px)!important;min-width:0!important;justify-content:flex-end!important;
    flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:none!important;-webkit-overflow-scrolling:touch;gap:6px!important;padding:2px 1px!important;
  }
  .top-actions::-webkit-scrollbar{display:none}.top-actions>*{flex:0 0 auto!important}
  .global-search-wrap{display:none!important}
  .top-timezone-chip{min-width:44px!important;padding:7px 8px!important}.top-time-copy{display:none!important}.top-timezone-chip select{display:none!important}
  .top-refresh{width:40px!important;height:40px!important;padding:0!important;display:grid!important;place-items:center!important}.top-refresh span:last-child{display:none!important}
  .top-icon-btn{width:40px!important;height:40px!important;min-width:40px!important}
  .top-user-chip{padding:3px!important}.top-user-copy{display:none!important}.top-user-avatar{width:34px!important;height:34px!important}
  .top-signout{min-height:40px!important;padding:8px 10px!important}

  .view,.panel,.premium-panel,.editor-section,.branding-grid,.branding-form,.users-layout,.dashboard-grid,.premium-grid-top,.premium-grid-middle,.premium-grid-bottom,.staff-team-summary-section,.staff-shift-roster{min-width:0!important;max-width:100%!important}
  .branding-grid,.users-layout,.dashboard-grid,.premium-grid-top,.premium-grid-middle,.premium-grid-bottom{grid-template-columns:1fr!important}
  .branding-grid{gap:10px!important}.preview-panel{position:static!important;top:auto!important}

  .toolbar,.data-toolbar,.staff-toolbar,.quality-toolbar{width:100%!important;max-width:100%!important;display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .toolbar .input,.toolbar .select,.data-toolbar .input,.data-toolbar .select,.staff-toolbar .input,.staff-toolbar .select,.quality-toolbar .input,.quality-toolbar .select{width:100%!important;min-width:0!important;max-width:100%!important}

  .panel-head,.premium-panel-head,.panel-subhead{min-width:0!important}
  .matrix-actions,.panel-head .row-actions,.data-header-actions{flex-wrap:wrap!important}
  .table-scroll,.permission-scroll,.matrix-wrap,.import-preview-scroll{width:100%!important;max-width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}

  .modal-backdrop{padding:10px!important}.modal{width:min(100%,680px)!important;max-width:100%!important;max-height:92dvh!important;padding:16px!important}
}

@media(max-width:700px){
  .main{padding:0 9px 16px!important}.topbar{margin:0 -9px 10px!important;padding:8px 9px!important;gap:8px!important}
  .mobile-menu-toggle{flex-basis:40px!important;width:40px!important;height:40px!important}
  .topbar-title h1{font-size:14px!important}.topbar-title p{font-size:7.5px!important}
  .top-actions{max-width:calc(100vw - 175px)!important}.top-signout{font-size:9px!important;padding:7px 8px!important}.top-timezone-chip{display:none!important}

  .panel,.premium-panel,.editor-section{border-radius:12px!important}.panel{padding:12px!important}
  .panel-head,.premium-panel-head{flex-direction:column!important;align-items:stretch!important;gap:8px!important}.panel-head>*,.premium-panel-head>*{max-width:100%!important}

  .stats-grid,.premium-kpi-grid,.system-cards,.system-overview-cards,.coverage-overview,.team-summary-grid,.dashboard-staff-team-grid,.staff-summary-grid,.quality-summary-grid{grid-template-columns:1fr!important}
  .form-grid.two,.staff-form,.staff-form-refined,.batch-shift-controls,.batch-third-party-common,.batch-third-party-entry-fields{grid-template-columns:1fr!important}

  .row-actions,.modal-actions,.branding-actions{flex-wrap:wrap!important;gap:7px!important}.modal-actions .btn{flex:1 1 120px}
  .premium-hero{min-height:0!important;padding:13px!important}.dragon-energy-orbs{display:none!important}.hero-copy h2{font-size:15px!important}
  .premium-hero .hero-copy p{display:block!important;width:100%!important;max-width:100%!important;white-space:normal!important;line-height:1.35!important}
}

@media(max-width:430px){
  .topbar-title p{display:none!important}.top-actions{max-width:calc(100vw - 150px)!important}.top-user-chip{display:none!important}.top-signout{margin-left:0!important}.mobile-menu-toggle{border-radius:11px!important}
  .btn{min-height:38px}.panel{padding:10px!important}.modal{padding:13px!important}
  .staff-tab{flex:1 1 auto!important;min-width:0!important;padding:8px 9px!important;font-size:9px!important}
  .staff-tabs{width:100%!important;overflow-x:auto!important;flex-wrap:nowrap!important;scrollbar-width:none!important}.staff-tabs::-webkit-scrollbar{display:none}
}

/* v10.58 — Granular permission groups */
.permission-table .permission-module-row td{background:linear-gradient(135deg,#eef5ff,#f8fbff)!important;border-top:10px solid #fff!important;border-bottom:1px solid #cbdcf4!important;padding-top:12px!important;padding-bottom:12px!important}
.permission-module-row td:first-child{display:grid!important;grid-template-columns:28px minmax(0,1fr);grid-template-rows:auto auto;align-items:center;column-gap:9px}
.permission-module-row td:first-child strong{grid-column:2;color:#183359;font-size:11px;letter-spacing:.02em}.permission-module-row td:first-child small{grid-column:2;color:#6e819c;font-size:8px;margin-top:2px}
.permission-module-icon{grid-row:1/3;width:26px;height:26px;display:grid;place-items:center;border-radius:8px;background:linear-gradient(145deg,#fff,#dfeaff);box-shadow:0 5px 12px rgba(45,91,164,.16),inset 0 1px 0 #fff;color:#2767d7;font-weight:900}
.permission-group-count{text-align:center!important}.permission-group-count span{display:inline-flex;min-width:36px;justify-content:center;padding:4px 7px;border-radius:999px;background:#e6effc;color:#47617f;font-size:8px;font-weight:800}
.permission-action-row td{background:#fff!important}.permission-action-row td:first-child{padding-left:34px!important}.permission-action-row td:first-child strong{display:inline;color:#263b59;font-size:10px}.permission-action-row td:first-child small{display:block;color:#91a0b4;font-size:7px;font-weight:550;margin-top:2px}.permission-action-indent{color:#9bb2d1;margin-right:7px;font-weight:900}
@media(max-width:640px){.permission-action-row td:first-child{padding-left:18px!important}.permission-module-row td:first-child{min-width:190px}.permission-table{min-width:640px!important}}


.smartly-main-toggle{display:flex;align-items:flex-start;gap:12px;padding:11px 13px;border:1px solid #d8e3f1;border-radius:12px;background:#f8fbff}.smartly-main-toggle input{margin-top:3px;width:18px;height:18px;accent-color:#2563eb}.smartly-main-toggle span{display:flex;flex-direction:column;gap:2px}.smartly-main-toggle strong{font-size:12px;color:#223b5d}.smartly-main-toggle small{font-size:10px;color:#70829a;font-weight:600;line-height:1.35}.smartly-label-cell{display:flex;flex-direction:column;gap:5px}.smartly-label-cell small{color:#7a8ca5;font-size:10px;font-weight:700}.smartly-main-pill{width:max-content;background:#e8f1ff;color:#1f5dc4;border:1px solid #c6dafc;font-weight:800}

/* v10.61 Users & Permissions — password reset action */
.user-management-actions{justify-content:flex-end;flex-wrap:wrap}.user-reset-password-btn{border-color:#c8d9f2;background:linear-gradient(180deg,#fff,#edf5ff);color:#245da8}.user-reset-password-btn:hover{box-shadow:0 8px 18px rgba(37,99,235,.14);transform:translateY(-1px)}.password-reset-admin-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}.password-reset-admin-head>span{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border-radius:13px;background:linear-gradient(145deg,#edf6ff,#dbeafe);color:#2563eb;font-size:20px;font-weight:900;box-shadow:inset 1px 1px 0 #fff,0 7px 16px rgba(37,99,235,.14)}.password-reset-admin-head h2{margin:0}.password-reset-admin-head p{margin:4px 0 0}.password-reset-user{margin-bottom:12px}@media(max-width:720px){.user-management-actions{justify-content:flex-start}.user-reset-password-btn{white-space:nowrap}}


/* v10.62 self-service password reset */
.login-forgot-row{display:flex;justify-content:flex-end;margin:-2px 0 8px}.auth-link-btn.auth-link-inline{width:auto;padding:4px 0;font-size:10px}.auth-secondary-actions.single-action{display:flex;justify-content:center}.auth-secondary-actions.single-action .auth-link-btn{width:auto;padding-inline:12px}.forgot-password-head{display:flex;align-items:flex-start;gap:12px;margin-bottom:14px}.forgot-password-head h2{margin:0 0 4px}.forgot-password-head p{margin:0;color:var(--muted);font-size:11px;line-height:1.5}.forgot-password-icon{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border-radius:13px;background:linear-gradient(145deg,#eff6ff,#dbeafe);border:1px solid #cbdcf7;color:#2663c7;font-size:20px;font-weight:900;box-shadow:0 7px 16px rgba(37,99,235,.12)}.forgot-password-form{gap:9px}.reset-flow-note{display:flex;align-items:flex-start;gap:9px;padding:10px 11px;border:1px solid #dce8f7;border-radius:10px;background:#f7fbff;color:#28486f}.reset-flow-note>span{font-size:16px;line-height:1.2}.reset-flow-note>div{display:flex;flex-direction:column;gap:2px}.reset-flow-note strong{font-size:10px}.reset-flow-note small{font-size:9px;line-height:1.45;color:#6a7f99}.forgot-password-form .btn:disabled{opacity:.65;cursor:wait}


/* v10.63 — Premium colored sidebar icons */
.nav-item .nav-icon-wrap{width:24px!important;min-width:24px!important;height:24px!important;display:grid!important;place-items:center!important;color:inherit!important}
.nav-item .nav-icon-wrap .nav-icon-badge,.preview-side-icon .nav-icon-badge{width:22px;height:22px;display:grid;place-items:center;border-radius:8px;color:#fff;box-shadow:0 6px 12px rgba(0,16,48,.24),inset 0 1px 0 rgba(255,255,255,.35),inset 0 -2px 4px rgba(0,0,0,.15);border:1px solid rgba(255,255,255,.18);background:linear-gradient(145deg,#4193ff,#2254d8)}
.nav-item.active .nav-icon-wrap .nav-icon-badge{box-shadow:0 8px 18px rgba(0,16,48,.34),0 0 0 3px rgba(255,255,255,.08),inset 0 1px 0 rgba(255,255,255,.4),inset 0 -3px 5px rgba(0,0,0,.16)}
.nav-item .nav-icon-wrap .nav-icon-badge svg,.preview-side-icon .nav-icon-badge svg{width:14px;height:14px;display:block}
.nav-item .nav-icon-wrap .tone-blue,.preview-side-icon .tone-blue{background:linear-gradient(145deg,#3ea0ff,#1e5de0)}
.nav-item .nav-icon-wrap .tone-cyan,.preview-side-icon .tone-cyan{background:linear-gradient(145deg,#34d6ff,#0f87d8)}
.nav-item .nav-icon-wrap .tone-purple,.preview-side-icon .tone-purple{background:linear-gradient(145deg,#ab72ff,#6a37e4)}
.nav-item .nav-icon-wrap .tone-green,.preview-side-icon .tone-green{background:linear-gradient(145deg,#44d787,#179a55)}
.nav-item .nav-icon-wrap .tone-gold,.preview-side-icon .tone-gold{background:linear-gradient(145deg,#ffc55d,#ea8f1a)}
.nav-item .nav-icon-wrap .tone-emerald,.preview-side-icon .tone-emerald{background:linear-gradient(145deg,#4fdfa5,#12956f)}
.nav-item .nav-icon-wrap .tone-coral,.preview-side-icon .tone-coral{background:linear-gradient(145deg,#ff8a7a,#d94f63)}
.nav-item .nav-icon-wrap .tone-teal,.preview-side-icon .tone-teal{background:linear-gradient(145deg,#55e0dd,#1290c3)}
.nav-item .nav-icon-wrap .tone-violet,.preview-side-icon .tone-violet{background:linear-gradient(145deg,#bd89ff,#7d4bf4)}
.nav-item .nav-icon-wrap .tone-sky,.preview-side-icon .tone-sky{background:linear-gradient(145deg,#6fc9ff,#3a74f0)}
.nav-item .nav-icon-wrap .tone-lime,.preview-side-icon .tone-lime{background:linear-gradient(145deg,#95e66b,#3ea44d)}
.nav-item .nav-icon-wrap .tone-orange,.preview-side-icon .tone-orange{background:linear-gradient(145deg,#ffb46a,#eb6d24)}
.nav-item .nav-icon-wrap .tone-pink,.preview-side-icon .tone-pink{background:linear-gradient(145deg,#f799d4,#ce4ba9)}
.nav-item .nav-icon-wrap .tone-rose,.preview-side-icon .tone-rose{background:linear-gradient(145deg,#ff9caf,#e15472)}
.preview-side-item i.preview-side-icon{width:24px;height:24px;display:grid;place-items:center;font-style:normal}


/* v10.64 — Security UX: mandatory Super Admin TOTP + clean auth UI */
.mfa-card{width:min(430px,calc(100vw - 28px))!important}.mfa-logo{font-size:12px!important;letter-spacing:.04em}.mfa-enroll-block{display:grid;gap:12px;margin:14px 0}.mfa-qr-shell{display:grid;place-items:center;padding:14px;border:1px solid #dbe5f2;border-radius:14px;background:#fff;box-shadow:0 9px 24px rgba(36,68,113,.08)}.mfa-qr-shell img{display:block;width:190px;height:190px;max-width:100%;object-fit:contain}.mfa-secret-box{display:grid;gap:5px;padding:11px 12px;border:1px solid #dce6f2;border-radius:11px;background:#f7faff;color:#52657f}.mfa-secret-box span{font-size:10px;font-weight:850;color:#263c5c}.mfa-secret-box small{font-size:9px;line-height:1.45}.mfa-secret-box code{margin-top:3px;padding:8px;border-radius:8px;background:#edf3fb;color:#1e4f92;font-size:10px;font-weight:800;overflow-wrap:anywhere;user-select:all}.mfa-code-input{text-align:center!important;font-size:20px!important;font-weight:850!important;letter-spacing:.24em!important}.mfa-security-note{margin-top:12px;padding-top:11px;border-top:1px solid #e1e8f1;color:#7a899e;font-size:9px;line-height:1.5}.login-notice:empty{display:none!important}


/* v10.68 — Frontend declutter: compact credentials + table actions */
.table-icon-btn{width:30px;height:30px;min-width:30px;display:inline-grid;place-items:center;padding:0;border:1px solid #d5e0ee;border-radius:9px;background:linear-gradient(180deg,#fff,#f5f8fc);color:#426086;cursor:pointer;box-shadow:0 3px 8px rgba(30,55,91,.06),inset 0 1px 0 #fff;transition:transform .14s ease,border-color .14s ease,box-shadow .14s ease,background .14s ease}
.table-icon-btn svg{width:15px;height:15px;display:block}.table-icon-btn:hover{transform:translateY(-1px);border-color:#a9c2e5;background:#f2f7ff;box-shadow:0 6px 12px rgba(32,73,135,.12)}.table-icon-btn.danger{color:#c64755;border-color:#f0cbd0;background:linear-gradient(180deg,#fff,#fff5f6)}.table-icon-btn.danger:hover{border-color:#eaa8b1;background:#fff0f2}.row-actions:has(.table-icon-btn),.compact-row-actions{gap:5px!important}.data-management-table td.right .row-actions{justify-content:flex-end}
.credential-compact-pair{display:grid;gap:6px;min-width:230px}.credential-compact-row{display:grid;grid-template-columns:54px minmax(92px,1fr) auto;align-items:center;gap:6px;min-width:0}.credential-compact-label{color:#64758c;font-size:8px;font-weight:800}.credential-compact-value{min-width:0!important;width:100%;height:30px;padding:0 8px!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.credential-compact-tools{display:flex;align-items:center;gap:4px}.credential-icon-btn{width:28px;height:28px;min-width:28px;border-radius:8px}.credential-icon-btn svg{width:14px;height:14px}.credential-icon-btn.inline{display:inline-grid;vertical-align:middle;margin-left:4px;width:25px;height:25px;min-width:25px}.credential-pin-note{display:flex;align-items:center;gap:4px;color:#8997aa;font-size:7px;font-weight:700}.credential-pin-note svg{width:10px;height:10px}.account-secret-cell{min-width:250px}.credential-pair{min-width:0}.credential-expiry{display:none!important}
#view-smartly .credential-compact-row{grid-template-columns:minmax(88px,1fr) auto;min-width:145px}#view-smartly .credential-compact-tools{gap:3px}#view-smartly .credential-compact-value{height:29px}.smartly-label-cell{gap:3px!important}
.data-management-table .row-actions .btn.btn-small{white-space:nowrap}.data-management-table td{padding-top:10px!important;padding-bottom:10px!important}.data-management-table td.account-secret-cell{padding-top:9px!important;padding-bottom:9px!important}
@media(max-width:720px){.table-icon-btn{width:32px;height:32px;min-width:32px}.credential-compact-pair{min-width:220px}.account-secret-cell{min-width:240px}}


/* v10.71 — Third Party Notes visible without making the table noisy */
.third-party-notes-cell{max-width:260px;min-width:120px;color:#53647b;font-size:10px;line-height:1.45;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.muted-cell{color:#9aa8b9}.third-party-notes-cell:hover{color:#263a56}
@media(max-width:900px){.third-party-notes-cell{max-width:190px}}


/* v10.72 — Settings Matrix multi-team filter + true distribution percentages */
.matrix-team-multi{position:relative;min-width:190px;max-width:250px}.matrix-team-multi>.native-filter-select-hidden{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}.matrix-team-trigger{width:100%;min-height:38px;padding:8px 10px;border:1px solid #d5dfec;border-radius:9px;background:#fff;color:#24334a;display:flex;align-items:center;justify-content:space-between;gap:8px;font:inherit;font-size:var(--type-input-size);cursor:pointer;box-shadow:0 2px 6px rgba(28,54,91,.035)}.matrix-team-trigger:hover,.matrix-team-multi.has-selection .matrix-team-trigger{border-color:#84a9eb}.matrix-team-trigger-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-weight:650}.matrix-team-trigger-arrow{color:#6f8098}.matrix-team-panel{position:absolute;z-index:80;top:calc(100% + 6px);right:0;width:min(330px,80vw);padding:8px;border:1px solid #d7e2f0;border-radius:12px;background:#fff;box-shadow:0 16px 34px rgba(21,48,91,.18)}.matrix-team-panel.hidden{display:none!important}.matrix-team-search{width:100%;min-height:36px;padding:8px 10px;border:1px solid #d6e1ef;border-radius:8px;outline:none;font:inherit;font-size:11px}.matrix-team-search:focus{border-color:#6092e9;box-shadow:0 0 0 3px rgba(45,105,218,.10)}.matrix-team-options{display:grid;gap:3px;max-height:260px;overflow:auto;margin:7px 0}.matrix-team-option{width:100%;display:grid;grid-template-columns:22px minmax(0,1fr);align-items:center;gap:7px;padding:8px;border:0;border-radius:8px;background:transparent;color:#2d405e;text-align:left;font-size:10px;font-weight:750;cursor:pointer}.matrix-team-option:hover{background:#f0f5fd}.matrix-team-option.selected{background:#eaf2ff;color:#1e5cb9}.matrix-team-check{width:18px;height:18px;border:1px solid #c9d7ea;border-radius:5px;display:grid;place-items:center;background:#fff;color:#1769e9;font-weight:900}.matrix-team-option.selected .matrix-team-check{border-color:#6c9bea;background:#dceaff}.matrix-team-footer{display:flex;justify-content:flex-end;gap:6px;padding-top:7px;border-top:1px solid #e7edf5}.matrix-team-clear,.matrix-team-done{min-height:30px;padding:6px 10px;border-radius:7px;font-size:9px;font-weight:800;cursor:pointer}.matrix-team-clear{border:1px solid #d6e0ec;background:#fff;color:#64758b}.matrix-team-done{border:1px solid #2466df;background:#2466df;color:#fff}.matrix-team-empty{padding:12px;color:#8795a7;text-align:center;font-size:10px}
.team-summary-breakdown-head{display:flex;align-items:center;gap:8px;justify-content:space-between}.team-summary-breakdown-head .team-summary-systems{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.team-summary-percent{flex:0 0 auto;color:#6553d9;font-size:8px;font-weight:900}.team-summary-score{display:flex!important;align-items:flex-end!important;justify-content:flex-end!important;gap:5px!important}.team-summary-score strong{font:inherit;font-weight:900}.team-summary-score small{font-size:7px;color:#7d8ba0;font-weight:850;margin-bottom:1px}.top-system-row>b,.chart-value{display:flex;align-items:baseline;gap:4px}.top-system-row>b small,.chart-value small{font-size:7px;color:#8190a5;font-weight:800}
@media(max-width:850px){.matrix-team-multi{width:100%;max-width:none}.matrix-team-panel{left:0;right:auto;width:min(340px,calc(100vw - 30px))}}


/* v10.74 — compact searchable multi-select filters across all management pages */
.compact-multi-filter{position:relative;min-width:168px;max-width:225px;flex:0 1 205px}
.compact-multi-filter>.native-filter-select-hidden,.compact-multi-filter>select{position:absolute!important;width:1px!important;height:1px!important;min-height:1px!important;opacity:0!important;pointer-events:none!important;overflow:hidden!important;clip:rect(0 0 0 0)!important}
.compact-multi-trigger{width:100%;height:40px;min-height:40px;padding:0 10px 0 12px;border:1px solid #d4dfed;border-radius:10px;background:linear-gradient(180deg,#fff,#f8fbff);color:#273b58;display:grid;grid-template-columns:minmax(0,1fr) auto 18px;align-items:center;gap:6px;cursor:pointer;box-shadow:inset 0 1px 2px rgba(25,55,92,.035),0 2px 7px rgba(24,52,88,.04);font:inherit}
.compact-multi-trigger:hover,.compact-multi-filter.has-selection .compact-multi-trigger{border-color:#91b4ea;background:#fbfdff}
.compact-multi-trigger[aria-expanded="true"]{border-color:#5594ed;box-shadow:0 0 0 3px rgba(42,112,222,.10),inset 0 1px 2px rgba(25,55,92,.03)}
.compact-multi-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;font-size:10px;font-weight:750;color:#314762}
.compact-multi-count{display:grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:#e7f0ff;color:#1f62c7;font-size:8px;font-weight:900}.compact-multi-count.hidden{display:none!important}
.compact-multi-arrow{width:18px;height:18px;display:grid;place-items:center;color:#6e819a}.compact-multi-arrow svg{width:14px;height:14px;transition:transform .15s ease}.compact-multi-trigger[aria-expanded="true"] .compact-multi-arrow svg{transform:rotate(180deg)}
.compact-multi-panel{position:absolute;z-index:120;top:calc(100% + 6px);right:0;width:278px;padding:8px;border:1px solid #d7e2f0;border-radius:12px;background:#fff;box-shadow:0 16px 34px rgba(21,48,91,.18),0 3px 8px rgba(21,48,91,.06)}.compact-multi-panel.hidden{display:none!important}
.compact-multi-head{padding-bottom:7px}.compact-multi-search-wrap{height:36px;display:grid;grid-template-columns:18px minmax(0,1fr);align-items:center;gap:5px;padding:0 9px;border:1px solid #d9e3ef;border-radius:9px;background:#f9fbfe}.compact-multi-search-icon{display:grid;place-items:center;color:#8090a6}.compact-multi-search-icon svg{width:14px;height:14px}.compact-multi-search{min-width:0;width:100%;height:32px;padding:0;border:0!important;outline:0!important;background:transparent!important;box-shadow:none!important;color:#293d58;font:inherit;font-size:10px;font-weight:650}
.compact-multi-options{display:flex;flex-direction:column;gap:2px;max-height:220px;overflow:auto;padding:1px 2px 2px;margin:0 -2px;overscroll-behavior:contain}.compact-multi-option{width:100%;min-height:34px;display:grid;grid-template-columns:20px minmax(0,1fr);align-items:center;gap:8px;padding:6px 8px;border:0;border-radius:8px;background:transparent;color:#334a68;text-align:left;cursor:pointer;font:inherit}.compact-multi-option:hover{background:#f2f6fc}.compact-multi-option.selected{background:#eaf2ff;color:#1e5fbf}.compact-multi-check{width:18px;height:18px;border:1px solid #cbd8e8;border-radius:5px;background:#fff;display:grid;place-items:center;color:#fff}.compact-multi-check svg{width:12px;height:12px}.compact-multi-option.selected .compact-multi-check{border-color:#4385e5;background:#3478dd}.compact-multi-option-label{min-width:0;line-height:1.3;font-size:9px;font-weight:780;overflow-wrap:anywhere}
.compact-multi-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:7px;margin-top:6px;border-top:1px solid #e8eef6}.compact-multi-all,.compact-multi-done{height:30px;padding:0 11px;border-radius:8px;font-size:9px;font-weight:850;cursor:pointer}.compact-multi-all{border:1px solid #d7e1ed;background:#fff;color:#566a84}.compact-multi-all:hover{background:#f6f9fd}.compact-multi-done{border:1px solid #2468df;background:#2468df;color:#fff;box-shadow:0 4px 9px rgba(36,104,223,.18)}.compact-multi-empty{padding:16px 8px;text-align:center;color:#8796a9;font-size:9px;font-weight:650}
/* retire the older Settings Matrix-only multiselect chrome */
.matrix-team-multi{display:contents!important}.matrix-team-trigger,.matrix-team-panel{display:none!important}
.matrix-tools .compact-multi-filter{min-width:170px;max-width:205px;flex-basis:190px}.matrix-tools .compact-multi-panel{right:0}
.toolbar .compact-multi-filter,.data-toolbar .compact-multi-filter,.quality-toolbar .compact-multi-filter,.staff-toolbar .compact-multi-filter{min-width:160px}
@media(max-width:900px){.compact-multi-filter{width:100%;max-width:none;flex:1 1 180px}.compact-multi-panel{left:0;right:auto;width:min(286px,calc(100vw - 28px))}.matrix-tools .compact-multi-filter{max-width:none;flex:1 1 180px}}


/* ==========================================================
   v10.75 — Team Platform Summary layout fix
   Keep count and percentage readable; prevent score overlap.
   ========================================================== */
.team-summary-list{
  overflow:hidden!important;
}
.team-summary-row{
  grid-template-columns:minmax(145px,.92fr) 62px minmax(185px,1.48fr) 58px!important;
  gap:10px!important;
  min-width:0!important;
}
.team-summary-row>*{
  min-width:0!important;
}
.team-summary-breakdown{
  min-width:0!important;
  display:grid!important;
  gap:5px!important;
}
.team-summary-breakdown-head{
  display:block!important;
  min-width:0!important;
}
.team-summary-breakdown-text{
  width:100%!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  line-height:1.25!important;
}
.team-summary-mini-track{
  width:100%!important;
  min-width:0!important;
}
.team-summary-score{
  width:58px!important;
  min-width:58px!important;
  display:grid!important;
  grid-template-columns:1fr!important;
  justify-items:end!important;
  align-items:center!important;
  align-content:center!important;
  gap:2px!important;
  text-align:right!important;
  line-height:1!important;
  overflow:visible!important;
}
.team-summary-score strong{
  display:block!important;
  font-size:11px!important;
  line-height:1!important;
  font-weight:900!important;
  color:#23344e!important;
  white-space:nowrap!important;
}
.team-summary-score small{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  margin:0!important;
  padding:2px 5px!important;
  border-radius:999px!important;
  background:#f1efff!important;
  color:#6553d9!important;
  font-size:7px!important;
  line-height:1.15!important;
  font-weight:900!important;
  white-space:nowrap!important;
}
.team-summary-percent{display:none!important;}
@media(max-width:900px){
  .team-summary-row{
    grid-template-columns:minmax(125px,.95fr) 54px minmax(125px,1.25fr) 52px!important;
    gap:7px!important;
  }
  .team-summary-score{width:52px!important;min-width:52px!important;}
}
@media(max-width:620px){
  .team-summary-row{
    grid-template-columns:minmax(120px,1fr) 50px 50px!important;
  }
  .team-summary-breakdown{grid-column:1/-1!important;padding-left:34px!important;}
  .team-summary-score{grid-column:3!important;grid-row:1!important;}
}


/* ============================================================
   v10.82 — OTP ACCESS
   ============================================================ */
.otp-access-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 26px;margin-bottom:18px;border:1px solid #dbe7f5;border-radius:20px;background:radial-gradient(circle at 88% 10%,rgba(59,130,246,.16),transparent 34%),linear-gradient(135deg,#071b3a 0%,#0c2a57 58%,#0a3d6b 100%);color:#fff;box-shadow:0 18px 40px rgba(15,45,85,.16)}
.otp-access-hero h2{font-size:26px;margin:4px 0 4px}.otp-access-hero p{margin:0;color:#c9d9ee;font-size:13px}.otp-access-kicker{font-size:10px;font-weight:800;letter-spacing:.18em;color:#70d8ff}.otp-access-hero .btn-primary{box-shadow:0 10px 22px rgba(0,0,0,.18)}
.otp-summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.otp-summary-card{display:flex;align-items:center;gap:13px;padding:17px 18px;border:1px solid #e1e8f3;border-radius:16px;background:#fff;box-shadow:0 8px 22px rgba(28,55,90,.07)}.otp-summary-card small{display:block;color:#6b7b91;font-weight:700;font-size:11px}.otp-summary-card strong{display:block;font-size:25px;line-height:1.1;color:#14243c;margin-top:3px}.otp-summary-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#e8f1ff;color:#2f6ee5;font-weight:800;font-size:19px}.otp-summary-icon.active{background:#eafbf2;color:#1f9d62}.otp-summary-icon.linked{background:#f1ebff;color:#7c4ce0}.otp-summary-icon.request{background:#fff5e7;color:#d8881b}
.otp-access-panel{overflow:visible}.otp-access-tools{display:flex;gap:10px;align-items:center;flex-wrap:wrap;padding-bottom:16px}.otp-access-tools>.input{min-width:260px;flex:1}.otp-access-tools>.compact-multi-filter{min-width:170px}.otp-access-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:14px}.otp-access-card{position:relative;padding:17px;border:1px solid #dde7f4;border-radius:17px;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%);box-shadow:0 8px 24px rgba(24,58,99,.07);transition:.18s ease}.otp-access-card:hover{transform:translateY(-2px);border-color:#b9cef0;box-shadow:0 14px 28px rgba(24,58,99,.12)}.otp-access-card.disabled{opacity:.62;background:#f7f9fc}.otp-card-top{display:flex;align-items:center;gap:10px}.otp-brand-orb{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:linear-gradient(145deg,#2266de,#65b9ff);color:#fff;font-weight:800;box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 8px 16px rgba(41,101,190,.24)}.otp-card-title{min-width:0;flex:1}.otp-card-title strong,.otp-card-title span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.otp-card-title strong{font-size:14px;color:#172840}.otp-card-title span{font-size:11px;color:#75849a;margin-top:2px}.otp-status-pill{font-size:9px;font-weight:800;letter-spacing:.08em;border-radius:999px;padding:5px 7px}.otp-status-pill.active{background:#e7f9ef;color:#158958}.otp-status-pill.disabled{background:#edf0f5;color:#738096}.otp-card-meta{display:flex;gap:6px;color:#77869c;font-size:10.5px;margin:13px 2px 9px}.otp-code-shell{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:14px 15px;border:1px solid #e2eaf5;border-radius:14px;background:#f5f8fc}.otp-code-shell.revealed{background:linear-gradient(135deg,#071d3a,#0b315a);border-color:#1f5486}.otp-code-shell small{display:block;font-size:9px;letter-spacing:.12em;font-weight:800;color:#7d8ba0}.otp-code-shell.revealed small{color:#85a6c7}.otp-live-code{display:block;margin-top:2px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:25px;letter-spacing:.11em;color:#6f7b8d}.otp-code-shell.revealed .otp-live-code{color:#72e3ff;text-shadow:0 0 18px rgba(64,206,255,.25)}.otp-locked-icon{font-size:25px;color:#9aa8bb}.otp-countdown{position:relative;width:43px;height:43px;display:grid;place-items:center;flex:0 0 43px}.otp-countdown svg{position:absolute;inset:0;transform:rotate(-90deg)}.otp-countdown circle{fill:none;stroke-width:3}.otp-countdown .track{stroke:#24496d}.otp-countdown .bar{stroke:#70dcff;stroke-linecap:round}.otp-countdown b{font-size:10px;color:#d9f7ff}.otp-account-link{margin:10px 2px 0;color:#76869d;font-size:10.5px}.otp-card-actions{display:flex;align-items:center;gap:7px;margin-top:12px}.otp-card-actions .btn-sm{padding:7px 11px}.otp-action-spacer{flex:1}.otp-empty{grid-column:1/-1;border:1px dashed #d9e2ef;border-radius:14px;background:#fbfcfe}.otp-modal-form{grid-template-columns:1fr 1fr}.otp-uri-import{border:1px solid #dce7f4;background:#f7faff;padding:12px;border-radius:12px}.otp-uri-import label span{color:#8a97a9;font-weight:500}.otp-uri-row{display:flex;gap:8px}.otp-uri-row .input{flex:1}.otp-active-toggle{display:flex;align-items:center;gap:9px;padding:10px 12px;border:1px solid #e2e9f3;border-radius:11px;background:#fbfcfe;font-size:12px;font-weight:700}.otp-active-toggle input{width:16px;height:16px;accent-color:#2d6de4}
@media(max-width:1050px){.otp-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.otp-access-hero{align-items:flex-start;flex-direction:column}.otp-summary-grid{grid-template-columns:1fr}.otp-access-grid{grid-template-columns:1fr}.otp-modal-form{grid-template-columns:1fr}.otp-uri-row{flex-direction:column}.otp-access-tools>*{width:100%;min-width:0!important}}

/* v10.89 — monthly staff mistake register */
.mistake-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:14px 16px 4px}.mistake-toolbar{grid-template-columns:180px minmax(240px,1fr) 240px}.mistake-table{min-width:1320px;border-collapse:separate;border-spacing:0}.mistake-table th,.mistake-table td{text-align:center;min-width:42px;padding:8px 6px}.mistake-table .mistake-sticky{position:sticky;left:0;z-index:2;text-align:left;min-width:230px;background:#fff;box-shadow:2px 0 0 #e4eaf2}.mistake-table thead .mistake-sticky{z-index:4;background:#f5f8fc}.mistake-table .mistake-total{position:sticky;right:116px;z-index:2;min-width:82px;font-weight:900;background:#f5f8ff;color:#184fa8;box-shadow:-2px 0 0 #dce5f1}.mistake-table thead .mistake-total{z-index:4}.mistake-table .mistake-actions{position:sticky;right:0;z-index:3;min-width:116px;background:#fff;box-shadow:-2px 0 0 #dce5f1}.mistake-table thead .mistake-actions{z-index:5;background:#f5f8fc}.mistake-row-actions{display:flex;align-items:center;justify-content:center;gap:5px}.mistake-row-actions .btn{padding:5px 8px;font-size:7px}.mistake-day-value{border:0;border-radius:7px;background:#fff0e8;color:#c24d12;font-weight:900;min-width:28px;padding:5px;cursor:pointer}.mistake-day-value:hover{background:#ffd9c5}.mistake-zero{color:#a9b3c1}.mistake-staff-cell{display:grid;gap:2px}.mistake-staff-cell strong{font-size:10px}.mistake-staff-cell span{font-size:8px;color:#78869a}.mistake-help{padding:0 16px 14px;color:#718096;font-size:9px}.mistake-record-list{display:grid;gap:8px;margin:12px 0}.mistake-record-row{display:grid;grid-template-columns:52px 1fr auto;gap:10px;align-items:center;padding:10px;border:1px solid #e2e8f1;border-radius:9px;background:#fafcff}.mistake-record-row b{font-size:18px;color:#d35420}.mistake-record-row p{margin:2px 0 0;color:#6e7c8e;font-size:9px}.mistake-record-actions{display:flex;gap:5px}@media(max-width:800px){.mistake-summary-grid,.mistake-toolbar{grid-template-columns:1fr}.mistake-table .mistake-sticky{min-width:175px}}
.mistake-high-alert{margin:12px 16px 4px;padding:13px 14px;border:1px solid #ffc8b8;border-left:5px solid #ef5d32;border-radius:11px;background:linear-gradient(135deg,#fff5f1,#fffafb);box-shadow:0 7px 18px rgba(190,70,36,.08)}.mistake-alert-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.mistake-alert-title{display:flex;align-items:center;gap:9px}.mistake-alert-icon{display:grid;place-items:center;width:31px;height:31px;border-radius:9px;background:#ef5d32;color:#fff;font-size:16px;font-weight:900}.mistake-alert-title strong{display:block;color:#9b351b;font-size:11px}.mistake-alert-title span{display:block;margin-top:2px;color:#946657;font-size:8px}.mistake-alert-threshold{padding:5px 8px;border-radius:999px;background:#ffe2d8;color:#a83d21;font-size:8px;font-weight:900}.mistake-alert-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));gap:7px}.mistake-alert-person{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 10px;border:1px solid #f3d5cb;border-radius:9px;background:#fff}.mistake-alert-person strong{display:block;color:#27384f;font-size:10px}.mistake-alert-person span{display:block;margin-top:2px;color:#7d6a64;font-size:8px}.mistake-alert-person b{display:grid;place-items:center;min-width:34px;height:34px;padding:0 6px;border-radius:9px;background:#fff0e9;color:#d64720;font-size:16px}.mistake-alert-person small{display:block;text-align:center;color:#ad624d;font-size:6px;font-weight:800;text-transform:uppercase}@media(max-width:600px){.mistake-high-alert{margin:10px}.mistake-alert-head{align-items:flex-start;flex-direction:column}.mistake-alert-list{grid-template-columns:1fr}}
.mistake-alert-person .mistake-alert-cause{margin-top:5px;padding-top:5px;border-top:1px dashed #efd9d1;color:#9d4e37;font-size:8px;line-height:1.35}.mistake-alert-person .mistake-alert-cause b{display:inline;min-width:0;height:auto;padding:0;border-radius:0;background:none;color:#9d4e37;font-size:8px}
.mistake-note-list{display:grid;gap:8px}.mistake-note-entry{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:start;gap:8px}.mistake-note-number{display:grid;place-items:center;width:30px;height:30px;margin-top:2px;border-radius:8px;background:#fff0e9;color:#d64720;font-size:10px;font-weight:900}.mistake-note-entry textarea{min-height:58px;resize:vertical}.mistake-record-index{display:grid;place-items:center;min-width:42px;height:34px;border-radius:9px;background:#fff0e9;color:#d64720;font-size:11px;font-weight:900}


/* v10.83 — OTP QR-only onboarding */
.otp-qr-only-form{grid-template-columns:1fr 1fr}.otp-qr-import-panel{border:1px solid #d9e5f4;background:linear-gradient(180deg,#f9fcff 0%,#f4f8fd 100%);padding:16px;border-radius:16px}.otp-qr-import-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:13px}.otp-qr-import-head strong,.otp-qr-import-head span{display:block}.otp-qr-import-head strong{font-size:13px;color:#172942}.otp-qr-import-head span{font-size:10.5px;color:#718198;max-width:560px;margin-top:3px}.otp-qr-only-badge{flex:0 0 auto!important;margin:0!important;padding:5px 8px;border-radius:999px;background:#e6f2ff;color:#2670d9!important;font-size:9px!important;font-weight:900;letter-spacing:.12em}.otp-qr-actions{display:flex;gap:8px;flex-wrap:wrap}.otp-qr-actions .btn{min-width:145px}.otp-qr-camera-shell{position:relative;margin-top:13px;overflow:hidden;border-radius:15px;background:#06182e;border:1px solid #173d65;min-height:240px}.otp-qr-camera-shell video{display:block;width:100%;height:300px;object-fit:cover}.otp-qr-camera-shell>small{position:absolute;left:0;right:0;bottom:10px;text-align:center;color:#d9edff;font-size:10px;text-shadow:0 1px 4px #000}.otp-qr-scan-frame{position:absolute;inset:50% auto auto 50%;width:min(220px,62%);aspect-ratio:1;transform:translate(-50%,-50%);border:2px solid rgba(104,221,255,.95);border-radius:18px;box-shadow:0 0 0 999px rgba(2,10,22,.38),0 0 26px rgba(70,202,255,.3)}.otp-qr-scan-frame span:before,.otp-qr-scan-frame span:after{content:"";position:absolute;left:12%;right:12%;height:1px;background:linear-gradient(90deg,transparent,#77e7ff,transparent);box-shadow:0 0 10px #66dcff}.otp-qr-scan-frame span:before{top:34%;animation:otpQrSweep 2.1s ease-in-out infinite}.otp-qr-scan-frame span:after{top:66%;opacity:.45}@keyframes otpQrSweep{0%,100%{transform:translateY(-22px);opacity:.35}50%{transform:translateY(58px);opacity:1}}.otp-qr-status{display:flex;flex-direction:column;gap:2px;margin-top:12px;padding:11px 13px;border-radius:12px;border:1px solid #dce5f0;background:#fff}.otp-qr-status strong{font-size:11.5px;color:#26384f}.otp-qr-status span{font-size:10px;color:#7b899d}.otp-qr-status.waiting{border-style:dashed}.otp-qr-status.existing{background:#f7f5ff;border-color:#ddd5ff}.otp-qr-status.existing strong{color:#6246c7}.otp-qr-status.scanning{background:#eef8ff;border-color:#bfe4ff}.otp-qr-status.scanning strong{color:#1f6fab}.otp-qr-status.success{background:#edf9f3;border-color:#bcebd1}.otp-qr-status.success strong{color:#198358}.otp-qr-detected{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}.otp-qr-detected>div{padding:9px 10px;border:1px solid #e0e8f2;border-radius:10px;background:#fff;min-width:0}.otp-qr-detected>div.wide{grid-column:1/-1}.otp-qr-detected span,.otp-qr-detected strong,.otp-qr-detected small{display:block}.otp-qr-detected span{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#8b98aa;font-weight:800}.otp-qr-detected strong{font-size:11.5px;color:#20344e;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.otp-qr-detected small{font-size:9px;color:#98a4b4;margin-top:2px}.otp-qr-only-form button:disabled{opacity:.55;cursor:not-allowed}
@media(max-width:720px){.otp-qr-only-form{grid-template-columns:1fr}.otp-qr-detected{grid-template-columns:1fr 1fr}.otp-qr-camera-shell video{height:250px}}

/* v10.92 — structured responsive OTP setup modal */
.modal.modal-otp-access{position:relative;width:min(920px,calc(100vw - 32px));max-width:920px;max-height:calc(100vh - 32px);overflow:auto;padding:22px 24px}.modal-otp-access .modal-head{align-items:flex-start;margin-bottom:16px;padding:0 48px 14px 0;border-bottom:1px solid #e6ecf4}.modal-otp-access .modal-head h3{margin:0;color:#172942;font-size:20px}.modal-otp-access .modal-head p{max-width:680px;margin:5px 0 0;color:#718198;font-size:11px;line-height:1.45}.modal-otp-access .modal-x{position:absolute;top:18px;right:20px;display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;margin:0;border-radius:9px}.modal-otp-access .otp-qr-only-form{display:grid!important;grid-template-columns:minmax(300px,1fr) minmax(330px,1.05fr)!important;align-items:start;gap:18px!important;padding:0!important}.modal-otp-access .otp-qr-import-panel{min-width:0;padding:16px;border-radius:14px}.modal-otp-access .otp-qr-import-head{gap:10px}.modal-otp-access .otp-qr-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.modal-otp-access .otp-qr-actions .btn{width:100%;min-width:0}.otp-setup-fields{display:flex;min-width:0;flex-direction:column;gap:12px;padding:16px;border:1px solid #dfe7f2;border-radius:14px;background:#fff}.otp-field-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.otp-field-grid .form-field{min-width:0}.otp-field-grid .input,.otp-field-grid .select{width:100%;min-width:0}.modal-otp-access .otp-active-toggle{margin:0;width:100%;box-sizing:border-box}.modal-otp-access .credential-security-note{margin:0;line-height:1.5}.modal-otp-access .modal-actions{display:flex;justify-content:flex-end;gap:8px;margin:0;padding-top:12px;border-top:1px solid #e7edf5}.modal-otp-access .modal-actions .btn{min-width:120px}.modal-otp-access .otp-qr-status{min-height:58px;box-sizing:border-box}.modal-otp-access .otp-qr-camera-shell{min-height:210px}.modal-otp-access .otp-qr-camera-shell video{height:250px}@media(max-width:860px){.modal.modal-otp-access{width:min(620px,calc(100vw - 24px));padding:18px}.modal-otp-access .otp-qr-only-form{grid-template-columns:1fr!important}.modal-otp-access .otp-qr-import-panel,.modal-otp-access .otp-setup-fields{padding:14px}}@media(max-width:560px){.modal.modal-otp-access{width:calc(100vw - 16px);max-height:calc(100vh - 16px);padding:14px}.modal-otp-access .modal-head h3{font-size:17px}.modal-otp-access .modal-x{top:12px;right:12px}.modal-otp-access .otp-qr-actions,.otp-field-grid{grid-template-columns:1fr}.modal-otp-access .modal-actions{display:grid;grid-template-columns:1fr 1fr}.modal-otp-access .modal-actions .btn{min-width:0}.modal-otp-access .otp-qr-detected{grid-template-columns:1fr 1fr}}

/* v10.86 OTP audit hardening */
.otp-export-warning{padding:11px 13px;border:1px solid #f0c56a;background:#fff7df;color:#72510d;border-radius:10px;font-size:12px;font-weight:700}.otp-export-qr{display:flex;justify-content:center;align-items:center;padding:18px;background:#f6f9fd;border:1px solid #dce6f2;border-radius:14px}.otp-export-qr img{width:min(360px,80vw);height:auto;background:#fff;padding:10px;border-radius:10px;box-shadow:0 8px 24px rgba(28,52,85,.12)}.modal-actions .btn svg{width:16px;height:16px;vertical-align:middle;margin-right:6px}

/* v10.93 — protected QR preview with a live TOTP code */
.modal.modal-otp-qr-view{position:relative;width:min(780px,calc(100vw - 32px));max-width:780px;max-height:calc(100vh - 32px);overflow:auto;padding:22px 24px}.modal-otp-qr-view .modal-head{align-items:flex-start;margin-bottom:16px;padding:0 48px 14px 0;border-bottom:1px solid #e6ecf4}.modal-otp-qr-view .modal-head h3{margin:0;color:#172942;font-size:20px}.modal-otp-qr-view .modal-head p{margin:5px 0 0;color:#718198;font-size:11px;line-height:1.45}.modal-otp-qr-view .modal-x{position:absolute;top:18px;right:20px;display:grid;place-items:center;width:34px;height:34px;margin:0;border-radius:9px}.otp-qr-view-body{display:flex;flex-direction:column;gap:16px}.modal-otp-qr-view .otp-export-warning{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:center;padding:11px 14px}.modal-otp-qr-view .otp-export-warning strong{color:#8b5700}.modal-otp-qr-view .otp-export-warning span{font-weight:500}.otp-export-layout{display:grid;grid-template-columns:minmax(320px,1.08fr) minmax(260px,.92fr);gap:16px}.otp-export-qr-card,.otp-export-code-panel{min-width:0;padding:16px;border:1px solid #dfe7f2;border-radius:14px;background:#f8fafd}.otp-export-section-label{color:#667791;font-size:10px;font-weight:800;letter-spacing:.1em}.modal-otp-qr-view .otp-export-qr{margin-top:10px;padding:12px;background:#fff}.modal-otp-qr-view .otp-export-qr img{display:block;width:min(300px,100%);padding:4px;border-radius:8px;box-shadow:none}.otp-export-qr-card p,.otp-export-code-panel p{margin:10px 0 0;color:#75859a;font-size:11px;line-height:1.45}.otp-export-code-panel{display:flex;flex-direction:column;justify-content:center;background:linear-gradient(145deg,#f8fbff,#eef4fc)}.otp-export-live-code{margin:18px 0 10px;color:#1260d6;font:800 clamp(30px,4vw,42px)/1 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.14em;white-space:nowrap}.otp-export-countdown-row{display:flex;justify-content:space-between;gap:12px;color:#687991;font-size:11px}.otp-export-countdown-row b{color:#213b61}.otp-export-progress{height:5px;margin:9px 0 16px;overflow:hidden;border-radius:999px;background:#dbe5f2}.otp-export-progress span{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1769e8,#59a2ff);transition:width .3s linear}.otp-export-copy{width:100%}.otp-export-meta{display:grid;gap:8px;margin:16px 0 0;padding-top:14px;border-top:1px solid #dbe4ef}.otp-export-meta div{display:grid;grid-template-columns:60px 1fr;gap:8px}.otp-export-meta dt{color:#7a8ba2;font-size:10px;text-transform:uppercase}.otp-export-meta dd{overflow:hidden;margin:0;color:#263c5b;font-size:11px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}.modal-otp-qr-view .modal-actions{display:flex;justify-content:flex-end;gap:8px;margin:0;padding-top:14px;border-top:1px solid #e6ecf4}@media(max-width:720px){.modal.modal-otp-qr-view{width:calc(100vw - 20px);padding:18px}.otp-export-layout{grid-template-columns:1fr}.modal-otp-qr-view .otp-export-warning{grid-template-columns:1fr}.modal-otp-qr-view .otp-export-qr img{width:min(280px,100%)}.otp-export-code-panel{min-height:240px}}@media(max-width:460px){.modal-otp-qr-view .modal-head h3{font-size:17px}.modal-otp-qr-view .modal-x{top:12px;right:12px}.otp-export-live-code{font-size:30px}.modal-otp-qr-view .modal-actions{display:grid;grid-template-columns:1fr}.modal-otp-qr-view .modal-actions .btn{width:100%}}
.modal-otp-qr-view .otp-export-qr img{width:min(250px,100%)}
.modal-otp-qr-view .otp-export-copy svg{width:16px;height:16px;vertical-align:middle;margin-right:6px}
.mistake-alert-icon svg{width:17px;height:17px;display:block}
.mistake-alert-icon{position:relative;width:27px;height:27px;border-radius:0;background:transparent;color:#ee552f;font-size:0;filter:drop-shadow(0 2px 3px rgba(205,65,31,.18))}
.mistake-alert-icon svg{width:23px;height:23px;stroke-width:1.9}
.mistake-alert-icon::after{content:"";position:absolute;top:1px;right:0;width:7px;height:7px;border:2px solid #fff5f1;border-radius:50%;background:#e33f2f;box-sizing:border-box}
.mistake-table-wrap{margin-top:12px;padding:7px;border:1px solid #dbe5f2;border-radius:14px;background:#edf3fb;box-shadow:0 8px 22px rgba(32,65,110,.08)}
.mistake-table{border-spacing:0 6px}
.mistake-table thead th{padding-top:10px;padding-bottom:10px;border-top:1px solid #cfe0f6;border-bottom:1px solid #cfe0f6;background:linear-gradient(180deg,#edf5ff,#e4effd);color:#47678e;font-size:8px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.mistake-table thead th:first-child{border-left:1px solid #cfe0f6;border-radius:9px 0 0 9px}
.mistake-table thead th:last-child{border-right:1px solid #cfe0f6;border-radius:0 9px 9px 0}
.mistake-table thead .mistake-sticky,.mistake-table thead .mistake-actions{background:linear-gradient(180deg,#edf5ff,#e4effd)}
.mistake-table thead .mistake-total{background:linear-gradient(180deg,#e7efff,#dce8ff);color:#315cb0}
.mistake-table tbody td{height:50px;border-top:1px solid #e1e8f2;border-bottom:1px solid #e1e8f2;background:#fff;transition:background .18s ease,border-color .18s ease}
.mistake-table tbody tr:nth-child(even) td{background:#f8fbff}
.mistake-table tbody tr:hover td{border-color:#c6d9f2;background:#f0f6ff}
.mistake-table tbody .mistake-sticky{border-left:1px solid #e1e8f2;border-radius:10px 0 0 10px;background:#fff}
.mistake-table tbody tr:nth-child(even) .mistake-sticky,.mistake-table tbody tr:nth-child(even) .mistake-actions{background:#f8fbff}
.mistake-table tbody .mistake-actions{border-right:1px solid #e1e8f2;border-radius:0 10px 10px 0;background:#fff}
.mistake-table tbody tr:hover .mistake-sticky,.mistake-table tbody tr:hover .mistake-actions{background:#f0f6ff}
.mistake-table tbody .mistake-total{background:#f4f7ff}
.mistake-table tbody tr.mistake-row-high td{border-top-color:#ffd1c3;border-bottom-color:#ffd1c3;background:#fffaf8}
.mistake-table tbody tr.mistake-row-high .mistake-sticky,.mistake-table tbody tr.mistake-row-high .mistake-actions{background:#fff7f3}
.mistake-table tbody tr.mistake-row-active .mistake-sticky{box-shadow:inset 3px 0 #67a3f5,2px 0 0 #e4eaf2}
.mistake-table tbody tr.mistake-row-high .mistake-sticky{box-shadow:inset 3px 0 #f05b35,2px 0 0 #f3ded6}
.mistake-staff-cell{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:9px}
.mistake-staff-avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:linear-gradient(145deg,#e2eeff,#cfe0fa);color:#2862b2;font-size:11px;font-weight:900;box-shadow:inset 0 0 0 1px rgba(58,104,169,.12)}
.mistake-row-high .mistake-staff-avatar{background:linear-gradient(145deg,#ffe6dc,#ffd2c2);color:#d94a24}
.mistake-staff-info{display:grid;min-width:0;gap:3px;text-align:left}.mistake-staff-info strong{overflow:hidden;color:#253954;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.mistake-staff-info small{overflow:hidden;color:#7b8ca2;font-size:7px;text-overflow:ellipsis;white-space:nowrap}
.mistake-table .mistake-total span{display:grid;place-items:center;width:30px;height:30px;margin:auto;border-radius:10px;background:#e8f0fc;color:#3265ad;font-size:11px;font-weight:900}
.mistake-table .mistake-total.is-zero span{background:#eef2f7;color:#8b9aab}.mistake-table .mistake-total.has-mistake span{background:#fff0dd;color:#c46b13}.mistake-table .mistake-total.is-high span{background:linear-gradient(145deg,#ff6844,#e84427);color:#fff;box-shadow:0 5px 12px rgba(226,70,36,.25)}
.mistake-row-actions .btn{border-radius:8px;font-weight:800}.mistake-table tbody .mistake-day-value{box-shadow:0 3px 8px rgba(194,77,18,.12)}
.mistake-staff-cell .mistake-staff-avatar{display:grid;margin-top:0;color:#2862b2;font-size:11px}
.mistake-row-high .mistake-staff-cell .mistake-staff-avatar{color:#d94a24}
.mistake-staff-cell .mistake-staff-info{display:grid;margin-top:0;color:inherit;font-size:inherit}
.app-shell.hidden{display:none!important}