:root{
  --bg:#f5f7fb;--panel:#ffffff;--border:#dfe3ee;
  --text:#111218;--muted:#5f6472;--soft:#8b90a1;
  --blue:#4a80ff;--purple:#8b4dff;--green:#39b980;--orange:#ff9f43;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
}
.app{display:grid;grid-template-columns:250px 1fr;min-height:100vh}
.sidebar{border-right:1px solid rgba(255,255,255,.08);padding:24px 18px;background:linear-gradient(180deg,#0f1220 0%,#161b30 100%);position:sticky;top:0;height:100vh;overflow-y:auto;}
.brand{display:flex;gap:12px;align-items:center;margin-bottom:10px}
.mark{font-size:30px;font-weight:900;font-style:italic;letter-spacing:-4px}
.mark span:last-child{color:var(--blue)}
.brand-text{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);line-height:1.25}
.nav{display:flex;flex-direction:column;gap:8px}
.nav button{
  width:100%;text-align:left;border:1px solid transparent;background:transparent;color:var(--muted);
  padding:12px 13px;border-radius:12px;font-weight:700;cursor:pointer
}
.nav button.active,.nav button:hover{
  background:linear-gradient(90deg,rgba(74,128,255,.18),rgba(139,77,255,.08));color:white;border-color:var(--border)
}
.main{padding:42px 34px}
.topbar{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:28px}
h1{font-size:56px;margin:0;letter-spacing:-.06em;line-height:1}
h1 span{background:linear-gradient(135deg,var(--blue),var(--purple));-webkit-background-clip:text;background-clip:text;color:transparent}
.subtitle{color:var(--muted);font-size:18px;margin-top:14px}
.actions{display:flex;gap:12px}
.btn{border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:13px;padding:12px 16px;font-weight:800;cursor:pointer}
.btn.primary{border:0;background:linear-gradient(135deg,var(--blue),var(--purple))}
.grid{display:grid;gap:16px}
.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
.two{grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);margin-top:16px}
.card{
  background:var(--panel);
  border:1px solid var(--border);
  border-radius:18px;
  padding:18px;
  box-shadow:0 4px 16px rgba(15,23,42,.06);
}

.card h2{font-size:20px;margin:0 0 14px;letter-spacing:-.03em}
.kpi-label{color:var(--muted);font-size:13px}
.kpi-value{font-size:36px;font-weight:900;letter-spacing:-.05em;margin-top:8px}
.kpi-foot{color:var(--soft);font-size:12px;margin-top:6px}
.profile-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}
.profile-kpi{background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:16px;padding:14px}
.profile-kpi .label{color:var(--muted);font-size:12px}
.profile-kpi .value{font-size:24px;font-weight:900;letter-spacing:-.04em;margin-top:6px}
.profile-kpi .foot{color:var(--soft);font-size:11px;margin-top:4px}
.badge-good{color:var(--green)}
.badge-warn{color:var(--orange)}
.badge-bad{color:#ff6262}
@media(max-width:900px){.profile-kpis{grid-template-columns:1fr 1fr}}
table{width:100%;border-collapse:collapse;font-size:13px}.history-table td{vertical-align:top;line-height:1.35}.history-summary{max-width:720px;white-space:normal}
th,td{padding:12px 10px;border-bottom:1px solid rgba(255,255,255,.07);text-align:left}
th{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.pill{display:inline-flex;border:1px solid var(--border);background:rgba(255,255,255,.055);padding:4px 8px;border-radius:99px;color:var(--muted);font-size:12px;margin:1px}
.bar-bg{height:8px;background:rgba(255,255,255,.08);border-radius:99px;margin-top:7px;overflow:hidden}
.bar-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--purple));border-radius:99px}
.notice{color:var(--muted);line-height:1.6}
.filter-grid{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr 1fr;gap:10px;margin-bottom:16px;align-items:end}
.filter-grid input,.filter-grid select{width:100%;min-height:41px;padding:9px 12px}
.multi-filter{position:relative}
.multi-filter-button{width:100%;display:flex;justify-content:space-between;align-items:center;border:1px solid var(--border);background:rgba(255,255,255,.055);color:#fff;border-radius:12px;padding:9px 12px;cursor:pointer;min-height:41px}
.multi-filter-button span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.multi-filter-menu{display:none;position:absolute;z-index:40;top:46px;left:0;right:0;background:#111216;border:1px solid var(--border);border-radius:14px;box-shadow:0 4px 16px rgba(15,23,42,.06);padding:8px;max-height:380px;overflow:auto}
.multi-filter.open .multi-filter-menu{display:block}
.multi-option{display:flex;align-items:center;gap:10px;padding:9px 8px;border-radius:10px;color:var(--muted);cursor:pointer}
.multi-option:hover{background:rgba(255,255,255,.06);color:#fff}
.multi-option input{width:auto}
.filter-label{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:5px}
th.sortable{cursor:pointer;user-select:none}
th.sortable:hover{color:white}
.result-count{color:var(--muted);font-size:13px;margin-bottom:10px}
.icon-actions{display:flex;gap:8px;align-items:center}
.icon-btn{width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--border);background:rgba(255,255,255,.035);color:#fff;border-radius:10px;font-size:15px;line-height:1;cursor:pointer}
.icon-btn:hover{background:rgba(255,255,255,.08)}
.icon-btn.danger:hover{background:rgba(255,98,98,.12);border-color:rgba(255,98,98,.35)}
.settings-table{table-layout:auto}
.settings-table td{padding:8px 8px;vertical-align:middle}
.settings-table th:last-child,.settings-table td:last-child{width:82px;text-align:right}
.settings-table .pill{font-size:12px;padding:4px 8px}
.reference-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.reference-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.settings-compact-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
.nav-icon{display:inline-flex;width:18px;justify-content:center;opacity:.9}
@media(max-width:900px){.settings-compact-grid{grid-template-columns:1fr}}
.reference-card h2{margin-bottom:8px}
.reference-card .notice{font-size:14px}
.analytics-list{display:flex;flex-direction:column;gap:10px}
.analytics-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.analytics-row:last-child{border-bottom:0}
.analytics-main{min-width:0}
.analytics-main strong{display:block}
.analytics-main span{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.analytics-value{font-weight:900;white-space:nowrap}
.mini-bar-bg{height:8px;background:rgba(255,255,255,.08);border-radius:99px;overflow:hidden;margin-top:7px}
.mini-bar-fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--purple));border-radius:99px}
.dashboard-section{margin-top:16px}
.month-chart{display:flex;align-items:flex-end;gap:10px;height:220px;padding-top:12px}
.month-bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.month-bar{width:100%;max-width:38px;min-height:3px;border-radius:10px 10px 0 0;background:linear-gradient(180deg,var(--blue),var(--purple))}
.month-label{font-size:11px;color:var(--muted);margin-top:8px}
.month-value{font-size:12px;font-weight:800;margin-bottom:6px;color:#fff}
.settings-full{margin-bottom:16px}
.settings-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
@media(max-width:1100px){.settings-grid-3{grid-template-columns:1fr}.month-chart{gap:7px}}
.health-score{font-size:52px;font-weight:950;letter-spacing:-.06em;margin:8px 0}
.health-good{color:var(--green)}
.health-warn{color:var(--orange)}
.health-bad{color:#ff6262}
.issue-table td{vertical-align:top}
.issue-chip{display:inline-flex;border:1px solid var(--border);background:rgba(255,255,255,.045);padding:3px 7px;border-radius:999px;color:var(--muted);font-size:12px;margin:2px}
.import-flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
.import-type-card{border:1px solid var(--border);border-radius:18px;padding:16px;background:rgba(255,255,255,.035)}
.import-type-card h3{margin:0 0 8px;font-size:18px}
.import-arrow{color:var(--muted);font-size:13px;line-height:1.6}
.mapping-table td{vertical-align:top}
@media(max-width:1100px){.import-flow{grid-template-columns:1fr}}
@media(max-width:1200px){.reference-grid-3{grid-template-columns:1fr 1fr}}
@media(max-width:800px){.reference-grid-3,.reference-grid-2{grid-template-columns:1fr}}
@media(max-width:1100px){.filter-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.filter-grid{grid-template-columns:1fr}}
.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.72);display:none;align-items:center;justify-content:center;padding:24px;z-index:50}
.modal-backdrop.open{display:flex}
.modal{width:min(1200px,95vw);max-height:95vh;overflow-y:auto;background:#0c0d10;border:1px solid var(--border);border-radius:24px;padding:22px;box-shadow:0 30px 100px rgba(0,0,0,.7)}
.modal-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;margin-bottom:18px}
.modal-head h2{margin:0;font-size:28px;letter-spacing:-.04em}
.modal-head p{margin:6px 0 0;color:var(--muted)}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.field{display:flex;flex-direction:column;gap:7px}
.field.full{grid-column:1/-1}
.field label{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:900;color:var(--muted)}
input,select,textarea{
  background:#fff;
  color:var(--text);
}
select option{background:#111}
.mobile-header{display:none}
.mobile-menu-btn{border:1px solid var(--border);background:rgba(255,255,255,.055);color:#fff;border-radius:12px;padding:10px 12px;font-weight:900}
.sidebar-backdrop{display:none}

@media(max-width:900px){
  body{overflow-x:hidden}
  .app{display:block;min-height:100vh}
  .mobile-header{
    display:flex;
    position:sticky;
    top:0;
    z-index:45;
    align-items:center;
    justify-content:space-between;
    padding:12px 14px;
    border-bottom:1px solid var(--border);
    background:linear-gradient(135deg,#0f1220,#161b30) !important;
    backdrop-filter:blur(12px)
  }
  .mobile-header .brand{margin:0}
  .mobile-header .mark{font-size:26px}
  .mobile-header .brand-text{font-size:10px}
  .sidebar{
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    width:280px;
    height:100vh;
    z-index:60;
    transform:translateX(-105%);
    transition:transform .22s ease;
    border-right:1px solid var(--border);
    border-bottom:0;
    overflow:auto
  }
  body.nav-open .sidebar{transform:translateX(0)}
  .sidebar-backdrop{
    display:none;
    position:fixed;
    inset:0;
    z-index:55;
    background:rgba(0,0,0,.62)
  }
  body.nav-open .sidebar-backdrop{display:block}
  .sidebar .brand{margin-bottom:20px}
  .nav button{font-size:15px;padding:13px;color:rgba(255,255,255,.7) !important;}
  .nav button.active{color:#fff !important;}
  .nav-group-toggle{color:rgba(255,255,255,.5) !important;}
  .main{padding:18px 14px 32px}
  .topbar{flex-direction:column;gap:14px;margin-bottom:18px}
  .title h1,h1{font-size:36px;letter-spacing:-.05em}
  .subtitle{font-size:15px;margin-top:8px}
  .actions{width:100%;display:grid;grid-template-columns:1fr;gap:8px}
  .btn{padding:10px 12px}
  .kpis{grid-template-columns:1fr 1fr;gap:10px}
  .two{grid-template-columns:1fr;margin-top:12px}
  .grid{gap:12px}
  .card{padding:14px;border-radius:16px}
  .card h2{font-size:18px}
  .kpi-value{font-size:28px}
  .kpi-foot{font-size:11px}
  .profile-kpis{grid-template-columns:1fr 1fr;gap:10px}
  .profile-kpi .value{font-size:20px}
  .filter-grid{grid-template-columns:1fr;gap:8px}
  .multi-filter-menu{position:relative;top:auto;margin-top:6px}
  table{min-width:720px}
  .card:has(table), .modal .card:has(table){overflow:auto}
  .settings-compact-grid,.reference-grid-2,.reference-grid-3,.import-flow{grid-template-columns:1fr}
  .modal-backdrop{align-items:stretch;justify-content:stretch;padding:0}
  .modal{width:100%;max-height:100vh;height:100vh;border-radius:0;border-left:0;border-right:0;padding:16px}
  .modal-head{position:sticky;top:0;z-index:3;background:#0c0d10;padding-bottom:12px}
  .form-grid{grid-template-columns:1fr}
  .field.full{grid-column:auto}
  .health-score{font-size:42px}
  .analytics-row{align-items:flex-start}
}

@media(max-width:520px){
  .kpis{grid-template-columns:1fr}
  .profile-kpis{grid-template-columns:1fr}
  .title h1,h1{font-size:32px}
  .main{padding:16px 12px 28px}
  .card{padding:12px}
  .brand-text{display:block}
  .icon-btn{width:32px;height:32px}
}

body[data-theme="Neutral Silver"] .btn.primary {
  color:#111 !important;
  text-shadow:none;
}

.multi-filter-menu { padding:6px !important; }
.multi-option {
  padding:3px 8px !important;
  gap:6px !important;
  font-size:14px !important;
  line-height:1 !important;
  min-height:auto !important;
}
.multi-option input[type="checkbox"] {
  width:14px !important;
  height:14px !important;
}

.dashboard-main-grid{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(360px,1fr);
  gap:16px;
  margin-top:16px;
}
.dashboard-wide-card{min-height:330px}
.dashboard-side-card{max-height:360px;overflow:auto}
.dashboard-lower-grid{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(360px,1fr);
  gap:16px;
  margin-top:16px;
}
.demo-table-grid{
  display:grid;
  grid-template-columns:1fr 1.4fr 1fr;
  gap:18px;
}
.demo-mini-table h3{
  margin:0 0 10px;
  font-size:15px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.08em;
}
.demo-mini-table .line{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:8px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.risk-pill{
  display:inline-flex;
  padding:4px 10px;
  border-radius:999px;
  background:rgba(255,98,98,.16);
  color:#c0392b !important;
  font-weight:900;
  font-size:12px;
}
@media(max-width:1100px){
  .dashboard-main-grid,.dashboard-lower-grid{grid-template-columns:1fr}
  .dashboard-side-card{max-height:none}
  .demo-table-grid{grid-template-columns:1fr}
}


.access-banner{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--border);border-radius:16px;background:rgba(255,255,255,.035);margin-bottom:16px;flex-wrap:wrap}
.access-banner .who{display:flex;flex-direction:column;gap:3px}
.access-banner .who strong{font-size:15px}
.access-banner .who span{color:var(--muted);font-size:12px}
.account-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.045);color:var(--muted);font-size:12px;font-weight:800}
.permissions-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.permission-card{border:1px solid var(--border);background:rgba(255,255,255,.035);border-radius:14px;padding:12px}
.permission-card h3{margin:0 0 8px;font-size:16px}
.permission-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}
@media(max-width:900px){.permissions-grid{grid-template-columns:1fr}.access-banner{align-items:flex-start}
@media(max-width:900px){.dashboard-layout-clean,.dashboard-right-stack,.dashboard-left-stack{grid-template-columns:1fr !important;}h2{font-size:16px !important;white-space:normal !important;}
}}


.sync-status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:12px}
.sync-status-card{border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.035);padding:12px}
.sync-status-card strong{display:block;font-size:20px;margin-top:4px}
.sync-status-card span{color:var(--muted);font-size:12px}
.schema-code{white-space:pre-wrap;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,
  onsolas,monospace;font-size:12px;line-height:1.5;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:14px;padding:14px;overflow:auto;max-height:460px}
@media(max-width:900px){.sync-status-grid{grid-template-columns:1fr 1fr}}


.org-badge{display:inline-flex;align-items:center;gap:6px;padding:5px 9px;border-radius:999px;border:1px solid var(--border);background:rgba(255,255,255,.045);color:var(--muted);font-size:12px;font-weight:800}
.org-settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
@media(max-width:900px){.org-settings-grid{grid-template-columns:1fr}}


.dev-switcher{position:fixed;right:18px;bottom:18px;z-index:80;border:1px solid var(--border);background:rgba(10,11,14,.96);backdrop-filter:blur(14px);border-radius:16px;padding:12px;box-shadow:0 4px 16px rgba(15,23,42,.06);width:min(340px,calc(100vw - 36px))}
.dev-switcher h3{margin:0 0 8px;font-size:14px}
.dev-switcher .row{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.dev-switcher select{width:100%;min-width:0}
.dev-switcher small{display:block;color:var(--muted);margin-top:8px;line-height:1.4}
@media(max-width:700px){.dev-switcher{right:10px;bottom:10px;width:calc(100vw - 20px)}}


.connection-good{color:var(--green)}
.connection-warn{color:var(--orange)}
.connection-bad{color:#ff6262}
.connection-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.connection-card{border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.035);padding:12px}
.connection-card span{display:block;color:var(--muted);font-size:12px}
.connection-card strong{display:block;margin-top:4px;font-size:18px}
@media(max-width:900px){.connection-grid{grid-template-columns:1fr}}


.migration-log{white-space:pre-wrap;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:12px;line-height:1.5;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:14px;padding:12px;margin-top:12px;max-height:260px;overflow:auto}


.auth-card{max-width:520px;margin:40px auto}
.auth-status{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:8px}
.login-shell{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:22px;background:radial-gradient(circle at top left,rgba(74,128,255,.18),transparent 35%),#050505}
.login-card{width:min(520px,100%);border:1px solid var(--border);border-radius:24px;background:rgba(255,255,255,.045);padding:24px;box-shadow:0 28px 80px rgba(0,0,0,.55)}
.login-card h1{font-size:42px;margin-bottom:8px}
.login-card p{color:var(--muted);line-height:1.5}
.login-card .field { margin-top: 14px; }
.auth-debug{font-size:12px;color:var(--muted);margin-top:12px;line-height:1.4}


/* Layer 26a — UX Architecture */
.settings-shell{display:grid;grid-template-columns:260px minmax(0,1fr);gap:18px;align-items:start}
.settings-subnav{position:sticky;top:18px;border:1px solid var(--border);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));padding:10px}
.settings-subnav h3{margin:6px 8px 10px;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}
.settings-subnav button{width:100%;display:flex;gap:10px;border:1px solid transparent;background:transparent;color:var(--muted);text-align:left;padding:11px 12px;border-radius:12px;font-weight:800;cursor:pointer}
.settings-subnav button.active,.settings-subnav button:hover{color:#fff;border-color:var(--border);background:linear-gradient(90deg,rgba(74,128,255,.18),rgba(139,77,255,.08))}
.settings-section-title{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:16px}
.settings-section-title h2{font-size:28px;margin:0;letter-spacing:-.04em}.settings-section-title p{color:var(--muted);margin:6px 0 0;line-height:1.5}
.visibility-table-wrap{overflow:auto;border:1px solid var(--border);border-radius:16px}.visibility-table{min-width:860px;width:100%;border-collapse:collapse}
.visibility-table th,.visibility-table td{text-align:center;vertical-align:middle}.visibility-table th:first-child,.visibility-table td:first-child{text-align:left;position:sticky;left:0;background:#101116;z-index:1}
.visibility-table input[type="checkbox"]{width:18px;height:18px;accent-color:var(--blue)}
.module-meta strong{display:block}.module-meta span{display:block;color:var(--muted);font-size:12px;margin-top:3px;line-height:1.35}
.nav-group-label{margin:18px 13px 6px;color:var(--soft);font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:900}
.settings-mini-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:1000px){.settings-shell{grid-template-columns:1fr}.settings-subnav{position:relative;top:auto}.settings-mini-grid{grid-template-columns:1fr}}


/* Layer 26c — Collapsible navigation scaffold */
.nav-group-toggle{
  width:100%;
  border:0;
  background:transparent;
  color:var(--soft);
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin:18px 0 6px;
  padding:0 13px;
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-weight:950;
  cursor:pointer;
}
.nav-group-toggle:hover{color:#fff}
.nav-group-toggle .chev{font-size:12px;transition:transform .18s ease}
.nav-group.collapsed .chev{transform:rotate(-90deg)}
.nav-group.collapsed .nav-group-items{display:none}
.nav-nested{
  margin:4px 0 0 16px;
  padding-left:10px;
  border-left:1px solid rgba(255,255,255,.10);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.nav-nested button{
  font-size:13px!important;
  padding:9px 10px!important;
  border-radius:10px!important;
}
.nav-nested button.active{
  background:linear-gradient(90deg,rgba(74,128,255,.16),rgba(139,77,255,.06))!important;
}


/* Layer 26e — Reference data action restoration */
.reference-card .icon-actions{justify-content:flex-end}


/* Layer 27a — Referee Lifecycle Management */
.lifecycle-status-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:16px 0}
.lifecycle-status-card{border:1px solid var(--border);border-radius:16px;background:rgba(255,255,255,.035);padding:14px}
.lifecycle-status-card span{display:block;color:var(--muted);font-size:12px}
.lifecycle-status-card strong{display:block;font-size:26px;margin-top:6px}
.lifecycle-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.lifecycle-table-wrap{overflow:auto;border:1px solid var(--border);border-radius:16px;margin-top:14px}
.lifecycle-table{min-width:1100px;width:100%;border-collapse:collapse}
.lifecycle-table td,.lifecycle-table th{vertical-align:middle}
.lifecycle-chip{display:inline-flex;border:1px solid var(--border);background:rgba(255,255,255,.055);padding:4px 8px;border-radius:999px;font-size:12px;color:var(--muted);font-weight:800}
.lifecycle-chip.active{color:var(--green)}
.lifecycle-chip.warning{color:var(--orange)}
.lifecycle-chip.inactive{color:var(--soft)}
.lifecycle-chip.restricted{color:#ff8f8f}
.lifecycle-intake-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:16px}
@media(max-width:1100px){.lifecycle-status-grid,.lifecycle-intake-grid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.lifecycle-status-grid,.lifecycle-intake-grid{grid-template-columns:1fr}}


/* Layer 28a — Dashboard cleanup */
.dashboard-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:16px}
.dashboard-kpi-grid.second-row{grid-template-columns:repeat(3,minmax(0,1fr));max-width:calc(75% - 4px)}
.dashboard-layout-clean{display:grid;grid-template-columns:minmax(0,2fr) minmax(360px,1fr);gap:16px;margin-top:16px;align-items:start}
.dashboard-right-stack{display:grid;gap:16px}
.overlooked-scroll-card{height:420px;overflow:auto}
.overlooked-item{border-bottom:1px solid rgba(255,255,255,.08);padding:12px 0}
.overlooked-item:last-child{border-bottom:0}
.overlooked-item strong{display:block;font-size:16px}
.overlooked-item span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.grade-bar-chart{display:grid;gap:12px;margin-top:16px}
.grade-bar-row{display:grid;grid-template-columns:130px minmax(0,1fr) 72px;gap:12px;align-items:center}
.grade-bar-label{font-weight:800;color:#fff}
.grade-bars{display:grid;gap:5px}
.grade-track{height:12px;background:rgba(255,255,255,.08);border-radius:99px;overflow:hidden}
.grade-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--purple))}
.grade-fill.assessment{background:linear-gradient(90deg,rgba(255,255,255,.55),var(--blue))}
.grade-bar-value{color:var(--muted);font-size:12px;text-align:right}
.grade-chart-legend{display:flex;gap:16px;flex-wrap:wrap;color:var(--muted);font-size:12px;margin-top:10px}
.legend-dot{display:inline-block;width:20px;height:8px;border-radius:99px;margin-right:6px;background:linear-gradient(90deg,var(--blue),var(--purple))}
.legend-dot.assessment{background:linear-gradient(90deg,rgba(255,255,255,.55),var(--blue))}
.demo-table-grid.age-grid{grid-template-columns:1fr 1.25fr 1fr}
@media(max-width:1200px){.dashboard-kpi-grid,.dashboard-kpi-grid.second-row{grid-template-columns:1fr 1fr;max-width:none}.dashboard-layout-clean{grid-template-columns:1fr}}
@media(max-width:700px){.dashboard-kpi-grid,.dashboard-kpi-grid.second-row{grid-template-columns:1fr 1fr}.grade-bar-row{grid-template-columns:1fr}.grade-bar-value{text-align:left}}



/* Layer 28d — Dashboard Rebuild */
.dashboard-kpis-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:16px}
.dashboard-kpis-row.row-two{grid-template-columns:repeat(3,minmax(0,1fr));max-width:calc(75% - 4px)}
.dashboard-main-clean{display:grid;grid-template-columns:minmax(0,2fr) minmax(380px,1fr);gap:16px;align-items:start;margin-top:16px}
.dashboard-left-clean,.dashboard-right-clean{display:grid;gap:16px}
.overlooked-scroll-card{height:520px;overflow:auto}
.overlooked-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;border-bottom:1px solid rgba(255,255,255,.08);padding:12px 0}
.overlooked-row:last-child{border-bottom:0}
.overlooked-row strong{display:block;font-size:16px}
.overlooked-row span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.focus-grade-chart{display:grid;gap:13px;margin-top:16px}
.focus-grade-row{display:grid;grid-template-columns:130px minmax(0,1fr) 86px;gap:12px;align-items:center}
.focus-grade-label{font-weight:900}
.focus-grade-bars{display:grid;gap:5px}
.focus-grade-track{height:12px;background:rgba(255,255,255,.08);border-radius:99px;overflow:hidden}
.focus-grade-fill-program{height:100%;border-radius:99px;background:linear-gradient(90deg,var(--blue),var(--purple))}
.focus-grade-fill-assessments{height:100%;border-radius:99px;background:linear-gradient(90deg,rgba(255,255,255,.60),var(--blue))}
.focus-grade-value{font-size:12px;color:var(--muted);text-align:right}
.focus-grade-legend{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:12px;margin-top:8px}
.legend-program,.legend-assessments{display:inline-block;width:22px;height:8px;border-radius:99px;margin-right:6px;vertical-align:middle}
.legend-program{background:linear-gradient(90deg,var(--blue),var(--purple))}
.legend-assessments{background:linear-gradient(90deg,rgba(255,255,255,.60),var(--blue))}
.program-demo-grid{display:grid;grid-template-columns:1fr 1.35fr 1fr;gap:18px}
.program-demo-block h3{margin:0 0 10px;font-size:13px;color:var(--muted);text-transform:uppercase;letter-spacing:.12em}
.program-demo-line{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.program-demo-line span{color:#fff}
.program-demo-line strong{white-space:nowrap}
@media(max-width:1200px){.dashboard-kpis-row,.dashboard-kpis-row.row-two{grid-template-columns:1fr 1fr;max-width:none}.dashboard-main-clean{grid-template-columns:1fr}.program-demo-grid{grid-template-columns:1fr}}
@media(max-width:700px){.dashboard-kpis-row,.dashboard-kpis-row.row-two{grid-template-columns:1fr 1fr}.focus-grade-row{grid-template-columns:1fr}.focus-grade-value{text-align:left}}


/* Layer 28e — Dashboard tile order only */
.grid.kpis{grid-template-columns:repeat(4,minmax(0,1fr))}
.grid.kpis .card:nth-child(n+5){grid-column:auto}
@media(max-width:1200px){.grid.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.grid.kpis{grid-template-columns:1fr}}


/* Layer 28f — Overlooked referees scroll panel */
.overlooked-dashboard-panel{
  min-height:520px;
  max-height:620px;
  overflow:auto;
}
.overlooked-dashboard-list{
  display:flex;
  flex-direction:column;
  gap:0;
}
.overlooked-dashboard-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:13px 0;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.overlooked-dashboard-item:last-child{border-bottom:0}
.overlooked-dashboard-item strong{display:block;font-size:16px}
.overlooked-dashboard-item span{display:block;color:var(--muted);font-size:13px;margin-top:4px}
.overlooked-dashboard-panel::-webkit-scrollbar{width:8px}
.overlooked-dashboard-panel::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:99px}
.overlooked-dashboard-panel::-webkit-scrollbar-track{background:rgba(255,255,255,.04)}


/* Layer 28g — Apply overlooked scroll to actual Home renderer */
.dashboard-overlooked-scroll{
  min-height:520px;
  max-height:620px;
  overflow:auto;
}
.dashboard-overlooked-scroll::-webkit-scrollbar{width:8px}
.dashboard-overlooked-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:999px}
.dashboard-overlooked-scroll::-webkit-scrollbar-track{background:rgba(255,255,255,.04)}
.dashboard-main-grid.top-focus-removed{
  grid-template-columns:1fr;
}


/* Layer 28h — Dashboard alignment fix */
.dashboard-main-grid.dashboard-top-row{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(360px,1fr);
  gap:16px;
  align-items:stretch;
}
.dashboard-main-grid.dashboard-full-row{
  display:grid;
  grid-template-columns:1fr;
  gap:16px;
  margin-top:16px;
}
.dashboard-top-row .card{
  min-height:360px;
}
.dashboard-top-row .dashboard-overlooked-scroll{
  height:100%;
  min-height:360px;
  max-height:360px;
}
.dashboard-full-row .card{
  min-height:auto;
}
@media(max-width:1100px){
  .dashboard-main-grid.dashboard-top-row{grid-template-columns:1fr}
  .dashboard-top-row .dashboard-overlooked-scroll{max-height:420px}
}


/* Layer 28i — Dashboard 2/3 + 1/3 column layout */
.dashboard-column-layout{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(360px,1fr);
  gap:16px;
  align-items:stretch;
  margin-top:16px;
}
.dashboard-left-column{display:grid;grid-template-rows:auto auto;gap:16px}
.dashboard-right-column{display:grid}
.dashboard-right-column .dashboard-overlooked-scroll{
  height:100%;
  min-height:760px;
  max-height:760px;
  overflow:auto;
}
.dashboard-left-column .dashboard-wide-card{min-height:360px}
.dashboard-left-column .program-demographics-card{min-height:360px}
@media(max-width:1100px){
  .dashboard-column-layout{grid-template-columns:1fr}
  .dashboard-right-column .dashboard-overlooked-scroll{min-height:420px;max-height:520px}
}


/* Layer 28j — Dynamic Program Demographics height */
.dashboard-column-layout{
  align-items:stretch;
}
.dashboard-left-column{
  display:flex !important;
  flex-direction:column;
  gap:16px;
}
.dashboard-left-column .dashboard-wide-card{
  min-height:360px;
}
.dashboard-left-column .program-demographics-card{
  min-height:0 !important;
  height:auto !important;
}
.dashboard-right-column{
  display:flex;
}
.dashboard-right-column .dashboard-overlooked-scroll{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  flex:1;
  overflow:auto;
}
@media(max-width:1100px){
  .dashboard-right-column .dashboard-overlooked-scroll{
    min-height:360px !important;
    max-height:520px !important;
  }
}


/* Layer 28k — Coverage by Grade grouped bar chart */
.dashboard-lower-grid.equal-height{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(360px,1fr);
  gap:16px;
  align-items:stretch;
}
.dashboard-lower-grid.equal-height > .card{
  min-height:360px;
}
.coverage-grouped-chart{
  display:grid;
  grid-template-columns:70px minmax(0,1fr);
  gap:12px;
  align-items:end;
  min-height:260px;
  margin-top:16px;
}
.coverage-y-axis{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  height:240px;
  color:var(--muted);
  font-size:11px;
  text-align:right;
  padding-right:2px;
}
.coverage-bars-area{
  display:grid;
  grid-template-columns:repeat(8,minmax(42px,1fr));
  gap:12px;
  align-items:end;
  height:240px;
  border-left:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:0 8px;
  background:
    linear-gradient(to top, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size:100% 48px;
}
.coverage-grade-group{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end;
  height:100%;
  gap:7px;
}
.coverage-bar-pair{
  display:flex;
  align-items:flex-end;
  gap:5px;
  height:205px;
}
.coverage-bar{
  width:18px;
  min-height:2px;
  border-radius:5px 5px 0 0;
}
.coverage-bar.program{
  background:linear-gradient(180deg,var(--blue),rgba(255,255,255,.18));
}
.coverage-bar.assessment{
  background:linear-gradient(180deg,var(--purple),var(--blue));
}
.coverage-grade-label{
  color:var(--muted);
  font-size:11px;
  white-space:nowrap;
}
.coverage-legend{
  display:flex;
  justify-content:center;
  gap:18px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:12px;
  margin-top:8px;
}
.coverage-legend span::before{
  content:"";
  display:inline-block;
  width:22px;
  height:10px;
  border-radius:2px;
  margin-right:7px;
  vertical-align:middle;
}
.coverage-legend .program::before{background:linear-gradient(90deg,var(--blue),rgba(255,255,255,.18))}
.coverage-legend .assessment::before{background:linear-gradient(90deg,var(--purple),var(--blue))}
.coach-ranking-card{
  min-height:360px;
}
@media(max-width:1100px){
  .dashboard-lower-grid.equal-height{grid-template-columns:1fr}
  .coverage-bars-area{overflow-x:auto}
}


/* Layer 29a — Terms & Privacy modal */
.policy-modal-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(8px);
  z-index:9999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.policy-modal{
  width:min(760px,100%);
  max-height:85vh;
  overflow:auto;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(12,16,28,.98),rgba(18,22,38,.96));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 0 40px rgba(0,0,0,.45);
  padding:28px;
}
.policy-modal h2{
  margin:0 0 8px;
  font-size:34px;
}
.policy-modal .policy-sub{
  color:var(--muted);
  margin-bottom:24px;
}
.policy-modal h3{
  margin-top:26px;
  margin-bottom:10px;
  font-size:18px;
}
.policy-modal p,
.policy-modal li{
  color:#d7dbe7;
  line-height:1.7;
}
.policy-modal ul{
  padding-left:20px;
}
.policy-modal-close{
  margin-top:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:#fff;
  font-weight:700;
  cursor:pointer;
}
.policy-link{
  cursor:pointer;
}


/* Layer 29b — Login screen rebuild + policy modals */
.login-shell{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:38px 22px;
  background:
    radial-gradient(circle at 72% 18%, rgba(74,128,255,.24), transparent 32%),
    radial-gradient(circle at 18% 82%, rgba(74,128,255,.16), transparent 34%),
    radial-gradient(circle at 84% 82%, rgba(74,128,255,.18), transparent 34%),
    linear-gradient(135deg,#040713 0%,#061128 48%,#05040d 100%);
  overflow:hidden;
  position:relative;
}
.login-shell::before{
  content:"";
  position:absolute;
  left:-18%;
  right:-18%;
  bottom:22%;
  height:280px;
  background:
    repeating-radial-gradient(ellipse at left center, rgba(74,128,255,.24) 0 1px, transparent 2px 14px),
    repeating-radial-gradient(ellipse at right center, rgba(74,128,255,.22) 0 1px, transparent 2px 14px);
  opacity:.38;
  filter:blur(.2px);
  pointer-events:none;
}
.login-shell::after{
  content:"";
  position:absolute;
  left:12%;
  right:12%;
  bottom:18%;
  height:90px;
  background:radial-gradient(ellipse at center, rgba(74,128,255,.32), transparent 68%);
  filter:blur(26px);
  opacity:.7;
  pointer-events:none;
}
.login-stage{
  width:min(760px,100%);
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.login-brand{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  margin-bottom:10px;
}
.login-brand .login-mark{
  display:flex;
  align-items:center;
  font-size:76px;
  line-height:.82;
  font-weight:950;
  font-style:italic;
  letter-spacing:-.18em;
  color:#fff;
  text-shadow:0 12px 40px rgba(0,0,0,.55);
}
.login-brand .login-mark span:last-child{
  display:inline-block;
  color:var(--blue);
  background:linear-gradient(180deg,#4a80ff 0%,#1969ff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
  transform:translateX(2px);
}
.login-brand .login-wordmark{
  font-size:27px;
  line-height:1.36;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:#d7dbea;
  font-weight:700;
}
.login-tagline{
  margin:0 0 26px;
  color:#b8becc;
  font-size:18px;
  text-align:center;
}


.login-card{
  width: min(400px, 100%);
  border:1px solid rgba(122,164,255,.45);
  border-radius:30px;
  background:
    linear-gradient(180deg,rgba(255,255,255,.085),rgba(255,255,255,.025)),
    rgba(10,16,34,.58);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
  padding: 36px 32px 28px;
  box-shadow:
    0 24px 85px rgba(0,0,0,.62),
    0 0 0 1px rgba(255,255,255,.045) inset,
    0 0 42px rgba(74,128,255,.2);
  position:relative;
  overflow:hidden;
}
.login-card::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:32px;
  padding:2px;
  background:linear-gradient(135deg,rgba(74,128,255,.95),rgba(139,77,255,.42),rgba(74,128,255,.78));
 mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);

mask-composite: exclude;
-webkit-mask-composite: xor;
  mask-composite:exclude;
  opacity:.68;
  animation:accessGlow 4.6s ease-in-out infinite;
  pointer-events:none;
}
.login-card h1{
  font-size: 26px;
  letter-spacing: -.02em;
  text-align: center;
  margin: 0 0 20px;
}
.login-card p.login-intro{
  margin:8px 0 30px;
  color:#c0c6d5;
  text-align:center;
  font-size:16px;
}
.login-card .field{margin-top:18px;gap:8px}
.login-card .field label{
  color:#e9ecf6;
  font-size:16px;
  letter-spacing:0;
  text-transform:none;
  font-weight:800;
}
.login-card input{
  width:100%;
  min-height: 46px;
  border-radius:14px;
  border:1px solid rgba(207,219,255,.22);
  background:rgba(4,8,18,.42);
  color:#fff;
  font-size: 15px;
  padding: 12px 14px;
  box-shadow:0 0 0 1px rgba(255,255,255,.025) inset;
}
.login-card input:focus{
  border-color:rgba(74,128,255,.75);
  box-shadow:0 0 0 4px rgba(74,128,255,.13),0 0 26px rgba(74,128,255,.12);
}
.login-card input::placeholder{color:#737b91}
.login-primary{
  width:100%;
  margin-top: 20px;
  min-height: 46px;
  border-radius:14px;
  border:0;
  background:linear-gradient(135deg,#2f73ff 0%,#4a80ff 52%,#7a56ff 100%);
  color:#fff;
  font-size: 16px;
  font-weight:950;
  cursor:pointer;
  box-shadow:0 14px 34px rgba(74,128,255,.25),0 0 22px rgba(74,128,255,.14);
}
.login-primary:hover{filter:brightness(1.08);transform:translateY(-1px)}
.login-links-row{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:18px;
  align-items:center;
  margin-top:28px;
}
.login-divider{width:1px;height:28px;background:rgba(255,255,255,.18)}
.login-link{
  border:0;
  background:transparent;
  color:var(--blue);
  font-weight:850;
  font-size:16px;
  text-decoration:underline;
  cursor:pointer;
  padding:4px;
}
.login-link.left{text-align:left}
.login-link.right{text-align:right}
.login-link.center{display:block;margin:22px auto 0;text-align:center}
.login-status{
  min-height:18px;
  margin-top:18px;
  text-align:center;
  color:#b8becc;
  font-size:13px;
  line-height:1.45;
}
.login-legal{
  margin-top:26px;
  color:#a9afbf;
  font-size:14px;
  text-align:center;
}
.login-legal button{
  border:0;
  background:transparent;
  color:var(--blue);
  text-decoration:underline;
  cursor:pointer;
  font:inherit;
  padding:0;
}
@keyframes accessGlow{
  0%,100%{opacity:.42;filter:drop-shadow(0 0 8px rgba(74,128,255,.22))}
  50%{opacity:.88;filter:drop-shadow(0 0 22px rgba(74,128,255,.48))}
}
.policy-modal-overlay{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.72);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  z-index:99999;
  display:none;
  align-items:center;
  justify-content:center;
  padding:24px;
}
.policy-modal{
  width:min(760px,100%);
  max-height:85vh;
  overflow:auto;
  border-radius:24px;
  background:linear-gradient(180deg,rgba(12,16,28,.98),rgba(18,22,38,.96));
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 0 44px rgba(0,0,0,.55),0 0 38px rgba(74,128,255,.16);
  padding:28px;
}
.policy-modal h2{margin:0 0 8px;font-size:34px}
.policy-modal .policy-sub{color:var(--muted);margin-bottom:24px}
.policy-modal h3{margin-top:26px;margin-bottom:10px;font-size:18px}
.policy-modal p,.policy-modal li{color:#d7dbe7;line-height:1.7}
.policy-modal ul{padding-left:20px}
.policy-modal-close{
  margin-top:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  color:#fff;
  font-weight:800;
  cursor:pointer;
}
@media(max-width:620px){
  .login-shell{padding:22px 14px;align-items:flex-start}
  .login-brand{gap:12px;margin-top:20px}
  .login-brand .login-mark{font-size:54px}
  .login-brand .login-wordmark{font-size:18px;letter-spacing:.2em}
  .login-tagline{font-size:14px;margin-bottom:18px}
  .login-card{padding:30px 22px 28px;border-radius:22px}
  .login-card h1{font-size:34px}
  .login-card input,.login-primary{min-height:54px}
}


/* Layer 30a — A+ Competency Expansion */
.feature-subrow td:first-child{padding-left:48px!important}
.feature-parent-row{background:rgba(255,255,255,.025)}
.competency-chart{display:grid;gap:14px;margin-top:14px}
.competency-row{display:grid;grid-template-columns:170px minmax(0,1fr) 42px;gap:12px;align-items:center}
.competency-label{font-weight:850;color:#fff}
.competency-track{height:12px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.competency-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,var(--blue),var(--purple))}
.competency-score{color:var(--muted);font-size:12px;text-align:right}
.competency-summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:12px}
.competency-summary-card{border:1px solid var(--border);border-radius:16px;padding:14px;background:rgba(255,255,255,.035)}
.competency-summary-card span{color:var(--muted);font-size:12px}
.competency-summary-card strong{display:block;font-size:18px;margin-top:5px}
.visibility-chip{display:inline-flex;border:1px solid var(--border);border-radius:999px;padding:5px 9px;color:var(--muted);font-size:12px;font-weight:850}
.competency-test-list{display:grid;gap:10px;margin-top:14px}
.competency-test-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;border:1px solid var(--border);border-radius:14px;padding:12px;background:rgba(255,255,255,.035);cursor:pointer}
.competency-test-item:hover{border-color:var(--blue)}
@media(max-width:850px){.competency-row{grid-template-columns:1fr}.competency-score{text-align:left}.competency-summary-grid{grid-template-columns:1fr}}


/* Layer 30b — Expandable competency feedback rows */
.expandable-feedback-card{border:1px solid var(--border);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.02));overflow:hidden;margin-bottom:12px}
.expandable-feedback-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px;align-items:center;padding:16px;cursor:pointer}
.expandable-feedback-head:hover{background:rgba(255,255,255,.035)}
.expandable-feedback-head h3{margin:0 0 4px;font-size:17px}
.expandable-feedback-head p{margin:0;color:var(--muted);line-height:1.45}
.expandable-feedback-chevron{color:var(--muted);font-weight:900;transition:transform .18s ease}
.expandable-feedback-card.open .expandable-feedback-chevron{transform:rotate(90deg)}
.expandable-feedback-detail{display:none;border-top:1px solid rgba(255,255,255,.08);padding:16px;background:rgba(0,0,0,.12)}
.expandable-feedback-card.open .expandable-feedback-detail{display:block}
.inline-competency-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,.8fr);gap:16px}
.inline-competency-notes{border:1px solid var(--border);border-radius:16px;padding:14px;background:rgba(255,255,255,.03)}
.inline-competency-notes h4{margin:0 0 8px}
.inline-competency-notes p{color:var(--muted);margin:0;line-height:1.55}
@media(max-width:900px){.inline-competency-grid{grid-template-columns:1fr}}


/* Layer 30c — Profile modal feedback expansion */
.profile-feedback-row{
  cursor:pointer;
}
.profile-feedback-row:hover{
  background:rgba(255,255,255,.035);
}
.profile-feedback-expansion td{
  padding:0!important;
  border-top:0!important;
}
.profile-feedback-expansion-content{
  padding:8px 16px 16px;
  border-top:1px solid var(--border);
  background:var(--bg);
}

.profile-feedback-expansion-content .card{
  margin:0;
}


/* Layer 30e — working feedback expansion + settings placeholder restoration */
.inline-feedback-expansion-box{margin:12px 0}
.profile-feedback-row.open{background:rgba(255,255,255,.045)}
.profile-feedback-row.open td{border-bottom-color:rgba(255,255,255,.04)}


/* Layer 30f — direct feedback expansion row */
.direct-feedback-expansion-row td{padding:0!important;border-top:0!important}
.profile-feedback-row{cursor:pointer}
.profile-feedback-row:hover{background:rgba(255,255,255,.035)}
.profile-feedback-row.open{background:rgba(255,255,255,.05)}


/* Layer 30g — competency expansion layout cleanup */
.inline-competency-grid{
  display:block!important;
}
.general-observation-card{
  width:100%;
}
.general-observation-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  align-items:flex-start;
  flex-wrap:wrap;
}
.general-observation-title h2{
  margin-bottom:6px;
}
.general-observation-meta{
  color:var(--muted);
  line-height:1.5;
  margin:0;
}
.general-observation-average{
  min-width:120px;
  text-align:right;
  border:1px solid var(--border);
  border-radius:16px;
  padding:12px 14px;
  background:rgba(255,255,255,.035);
}
.general-observation-average span{
  display:block;
  color:var(--muted);
  font-size:12px;
}
.general-observation-average strong{
  display:block;
  font-size:24px;
  margin-top:4px;
}
.general-observation-notes{
  margin-top:16px;
  border:1px solid var(--border);
  border-radius:16px;
  padding:14px;
  background:rgba(255,255,255,.03);
}
.general-observation-notes h4{
  margin:0 0 8px;
}
.general-observation-notes p{
  color:var(--muted);
  margin:0;
  line-height:1.55;
}
.competency-row{
  grid-template-columns:220px minmax(0,1fr) 44px!important;
}
@media(max-width:760px){
  .general-observation-average{text-align:left}
  .competency-row{grid-template-columns:1fr!important}
}


/* Layer 30k — General Observation Scores final layout */
.inline-competency-grid{
  display:block!important;
}
.general-observation-card{
  width:100%;
  max-width:none;
}
.general-observation-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  flex-wrap:wrap;
}
.general-observation-title h2{
  margin:0 0 8px;
}
.general-observation-meta{
  color:var(--muted);
  line-height:1.55;
  margin:0;
}
.general-observation-average{
  min-width:128px;
  text-align:right;
  border:1px solid var(--border);
  border-radius:16px;
  padding:12px 14px;
  background:rgba(255,255,255,.035);
}
.general-observation-average span{
  display:block;
  color:var(--muted);
  font-size:12px;
}
.general-observation-average strong{
  display:block;
  font-size:26px;
  margin-top:4px;
}
.competency-summary-grid{
  display:none!important;
}
.competency-row{
  grid-template-columns:230px minmax(0,1fr) 46px!important;
}
.general-observation-notes{
  margin-top:16px;
  border:1px solid var(--border);
  border-radius:16px;
  padding:16px;
  background:rgba(255,255,255,.03);
}
.general-observation-notes h4{
  margin:0 0 8px;
}
.general-observation-notes p{
  color:var(--muted);
  margin:0;
  line-height:1.6;
}
.general-observation-notes hr{
  border:0;
  border-top:1px solid rgba(255,255,255,.12);
  margin:14px 0;
}
@media(max-width:760px){
  .general-observation-average{text-align:left}
  .competency-row{grid-template-columns:1fr!important}
}


/* Layer 31a — Mentor competency expansion */
.mentor-competency-card{
  width:100%;
  margin-top:14px;
}
.mentor-competency-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  flex-wrap:wrap;
}
.mentor-competency-meta{
  color:var(--muted);
  margin:6px 0 0;
  line-height:1.5;
}
.mentor-competency-table{
  width:100%;
  border-collapse:collapse;
  margin-top:16px;
}
.mentor-competency-table th,
.mentor-competency-table td{
  border-bottom:1px solid rgba(255,255,255,.08);
  padding:10px 8px;
  vertical-align:middle;
}
.mentor-competency-table th{
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:11px;
}
.mentor-competency-table td:first-child{
  font-weight:800;
}
.mentor-standard-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:108px;
  border:1px solid var(--border);
  border-radius:999px;
  padding:6px 10px;
  font-size:12px;
  font-weight:900;
  background:rgba(255,255,255,.04);
}
.mentor-standard-pill.independent{
  background:rgba(39,174,96,.12);
  border-color:rgba(39,174,96,.35);
  color:#1e8449;
}
.mentor-standard-pill.emerging{
  background:rgba(241,196,15,.12);
  border-color:rgba(241,196,15,.4);
  color:#9a7d0a;
}
.mentor-standard-pill.guided{
  background:rgba(230,126,34,.12);
  border-color:rgba(230,126,34,.35);
  color:#a04000;
}
.mentor-standard-pill.not-yet{
  background:rgba(231,76,60,.1);
  border-color:rgba(231,76,60,.3);
  color:#922b21;
}
.mentor-standard-pill.na{
  background:rgba(160,160,160,.1);
  border-color:rgba(160,160,160,.25);
  color:#707070;
}
.mentor-competency-notice{
  margin-top:12px;
  color:var(--muted);
  font-size:13px;
}


/* Layer 31g — Pilot user switcher */
.pilot-switcher{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:9998;
  width:320px;
  border:1px solid var(--border);
  border-radius:18px;
  background:linear-gradient(180deg,rgba(18,22,34,.96),rgba(10,12,18,.96));
  box-shadow:0 20px 50px rgba(0,0,0,.45);
  padding:14px;
}
.pilot-switcher h4{margin:0 0 10px;font-size:14px}
.pilot-switcher label{
  display:block;
  margin-top:10px;
  color:var(--muted);
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:.08em;
}
.pilot-switcher select{
  width:100%;
  margin-top:5px;
  padding:9px 10px;
  border-radius:12px;
  border:1px solid var(--border);
  background:rgba(255,255,255,.06);
  color:#fff;
}
.pilot-switcher small{
  display:block;
  margin-top:10px;
  color:var(--muted);
  line-height:1.4;
}
.pilot-switcher-toggle{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:9999;
  border:1px solid var(--border);
  border-radius:999px;
  padding:10px 14px;
  background:linear-gradient(135deg,var(--blue),var(--purple));
  color:#fff;
  font-weight:900;
  cursor:pointer;
  display:none;
}
.pilot-switcher.collapsed{display:none}
.pilot-switcher.collapsed + .pilot-switcher-toggle{display:block}


/* Layer 32b — Mobile responsiveness pass */
@media(max-width: 900px){
  body{overflow-x:hidden}
  .app,.layout,.shell{width:100%;max-width:100vw}
  aside,.sidebar{width:100%;max-width:100%}
  main,.main,.content{width:100%;max-width:100vw;padding:14px!important}
  .topbar,.header,.app-header{flex-wrap:wrap;gap:10px}
  .topbar h1,.header h1,.welcome h1{font-size:26px!important;line-height:1.12}

  .grid,
  .grid.kpis,
  .profile-kpis,
  .dashboard-kpis-row,
  .dashboard-kpis-row.row-two,
  .dashboard-column-layout,
  .dashboard-main-grid,
  .dashboard-lower-grid,
  .dashboard-lower-grid.equal-height,
  .program-demo-grid,
  .settings-layout,
  .form-grid,
  .lifecycle-status-grid,
  .lifecycle-intake-grid,
  .competency-summary-grid{
    grid-template-columns:1fr!important;
    max-width:100%!important;
  }

  .card{border-radius:16px!important;padding:16px!important;max-width:100%}
  .kpi-value{font-size:32px!important}
  .dashboard-left-column,.dashboard-right-column{display:block!important}

  .dashboard-right-column .dashboard-overlooked-scroll,
  
.overlooked-scroll-card {
  max-height: 520px !important;
  overflow-y: auto !important;
}
  .overlooked-dashboard-panel{
    min-height:320px!important;
    max-height:460px!important;
    height:auto!important;
  }

  .history-table,
  table,
  .visibility-table,
  .lifecycle-table,
  .mentor-competency-table{
    min-width:720px;
  }

  .table-wrap,
  .visibility-table-wrap,
  .lifecycle-table-wrap{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  .history-summary{min-width:260px}

  .modal,
  .modal-panel,
  .modal-content{
    width:calc(100vw - 20px)!important;
    max-width:calc(100vw - 20px)!important;
    max-height:92vh!important;
    overflow:auto!important;
    border-radius:18px!important;
  }

  .modal-head{
    flex-direction:column!important;
    align-items:flex-start!important;
    gap:12px!important;
  }

  .modal-head > div:last-child{width:100%}
  .modal-head .btn,.modal-head button{width:100%}

  .inline-competency-grid{display:block!important}
  .competency-row{
    grid-template-columns:1fr!important;
    gap:8px!important;
    padding:10px 0;
  }
  .competency-score{text-align:left!important}

  .general-observation-head,
  .mentor-competency-head{
    flex-direction:column!important;
    align-items:flex-start!important;
  }

  .general-observation-average{
    text-align:left!important;
    width:100%;
  }

  .mentor-competency-table th,
  .mentor-competency-table td{
    white-space:normal;
  }

  .settings-subnav{
    position:relative!important;
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr;
    gap:8px;
    margin-bottom:12px;
  }

  .settings-subnav h3{grid-column:1 / -1}
  .settings-subnav button{
    width:100%;
    min-height:48px;
    text-align:left;
  }

  .nav-nested{padding-left:8px!important}
  .nav-nested button{
    font-size:13px!important;
    padding:10px!important;
  }

  .pilot-switcher{
    left:10px!important;
    right:10px!important;
    bottom:10px!important;
    width:auto!important;
    max-width:calc(100vw - 20px)!important;
  }

  .pilot-switcher-toggle{
    right:10px!important;
    bottom:10px!important;
  }

  .login-card{
    width:100%!important;
    padding:28px 20px!important;
  }

  .login-brand .login-mark{font-size:54px!important}
  .login-brand .login-wordmark{font-size:18px!important}

  .login-links-row{
    grid-template-columns:1fr!important;
    gap:10px!important;
    text-align:center;
  }

  .login-divider{display:none!important}
  .login-link.left,.login-link.right{text-align:center!important}
}

@media(max-width: 600px){
  .card{padding:14px!important}
  .btn,button,select,input{min-height:44px}
  .grid.kpis{gap:10px!important}
  .kpi-label{font-size:11px!important}
  .kpi-value{font-size:28px!important}
  .topbar h1,.header h1,.welcome h1{font-size:22px!important}
  .profile-kpis{gap:10px!important}

  .program-demo-line,
  .line{
    flex-direction:column;
    align-items:flex-start!important;
    gap:4px;
  }

  .overlooked-row,
  .overlooked-dashboard-item{
    grid-template-columns:1fr!important;
  }

  .coverage-grouped-chart{
    grid-template-columns:42px minmax(640px,1fr)!important;
    overflow-x:auto;
  }

  .coverage-bars-area{min-width:640px}
  .focus-grade-row,.grade-bar-row{grid-template-columns:1fr!important}
  .focus-grade-value,.grade-bar-value{text-align:left!important}
  .mentor-standard-pill{min-width:92px!important}
  .settings-subnav{grid-template-columns:1fr!important}
  .pilot-switcher small{font-size:12px}
}

/* Mobile utility: prevent long labels/feedback from forcing horizontal page overflow */
.history-summary,
.notice,
.card p,
td,
th,
strong,
span{
  overflow-wrap:anywhere;
}


/* Layer 32c — Mobile My Feedback stacked layout */
@media(max-width: 700px){
  .history-table{
    min-width:0!important;
    width:100%!important;
    display:block!important;
  }

  .history-table thead{
    display:none!important;
  }

  .history-table tbody{
    display:block!important;
    width:100%!important;
  }

  .history-table tr.profile-feedback-row{
    display:grid!important;
    grid-template-columns:repeat(3,1fr)!important;
    gap:0!important;
    width:100%!important;
    margin:16px 0 0!important;
    border:1px solid var(--border)!important;
    border-radius:18px!important;
    overflow:hidden!important;
    background:rgba(255,255,255,.035)!important;
    cursor:pointer;
  }

  .history-table tr.profile-feedback-row td{
    display:block!important;
    border:0!important;
    padding:14px!important;
    min-width:0!important;
    white-space:normal!important;
  }

  .history-table tr.profile-feedback-row td:nth-child(1)::before{content:"Date";}
  .history-table tr.profile-feedback-row td:nth-child(2)::before{content:"Type";}
  .history-table tr.profile-feedback-row td:nth-child(3)::before{content:"From";}
  .history-table tr.profile-feedback-row td:nth-child(4)::before{content:"Strengths";}
  .history-table tr.profile-feedback-row td:nth-child(5)::before{content:"Area for Development";}
  .history-table tr.profile-feedback-row td:nth-child(6)::before{content:"Feedback";}

  .history-table tr.profile-feedback-row td::before{
    display:block;
    margin-bottom:6px;
    color:var(--muted);
    font-size:12px;
    font-weight:900;
    letter-spacing:.08em;
    text-transform:uppercase;
  }

  .history-table tr.profile-feedback-row td:nth-child(4),
  .history-table tr.profile-feedback-row td:nth-child(5),
  .history-table tr.profile-feedback-row td:nth-child(6){
    grid-column:1 / -1!important;
    border-top:1px solid rgba(255,255,255,.08)!important;
  }

  .history-table tr.profile-feedback-row td:nth-child(4) .pill,
  .history-table tr.profile-feedback-row td:nth-child(5) .pill{
    white-space:normal!important;
    border-radius:14px!important;
    padding:8px 10px!important;
    display:inline-flex!important;
    max-width:100%!important;
  }

  .history-table tr.profile-feedback-row .history-summary{
    min-width:0!important;
    width:100%!important;
    line-height:1.55!important;
  }

  .direct-feedback-expansion-row{
    display:block!important;
    width:100%!important;
  }

  .direct-feedback-expansion-row td{
    display:block!important;
    width:100%!important;
    padding:0!important;
  }

  .profile-feedback-expansion-content{
    padding:16px 0 0!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  .general-observation-card{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  .general-observation-card .card,
  .general-observation-card{
    overflow:hidden!important;
  }

  .general-observation-head{
    display:block!important;
  }

  .general-observation-title h2{
    font-size:22px!important;
    line-height:1.15!important;
  }

  .general-observation-meta{
    font-size:15px!important;
    line-height:1.5!important;
  }

  .general-observation-average{
    width:100%!important;
    margin-top:16px!important;
    text-align:left!important;
    box-sizing:border-box!important;
  }

  .competency-row{
    display:block!important;
    width:100%!important;
    padding:14px 0!important;
  }

  .competency-row strong{
    display:block!important;
    font-size:18px!important;
    line-height:1.2!important;
    margin-bottom:10px!important;
  }

  .competency-row > div{
    width:100%!important;
    max-width:100%!important;
    margin:0 0 8px!important;
    box-sizing:border-box!important;
  }

  .competency-row span,
  .competency-score{
    display:block!important;
    text-align:left!important;
    font-size:18px!important;
  }

  .mentor-competency-card{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
  }

  .mentor-competency-table{
    min-width:0!important;
    width:100%!important;
    display:block!important;
  }

  .mentor-competency-table thead{
    display:none!important;
  }

  .mentor-competency-table tbody,
  .mentor-competency-table tr,
  .mentor-competency-table td{
    display:block!important;
    width:100%!important;
  }

  .mentor-competency-table tr{
    padding:12px 0!important;
    border-bottom:1px solid rgba(255,255,255,.08)!important;
  }

  .mentor-competency-table td{
    border:0!important;
    padding:4px 0!important;
  }

  .mentor-standard-pill{
    margin-top:6px!important;
  }
}


/* Layer 32d — Compact mobile competency rows */
@media(max-width: 700px){
  .competency-row{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    gap:6px 12px!important;
    align-items:center!important;
    padding:10px 0!important;
    margin-bottom:4px!important;
  }

  .competency-row strong{
    display:block!important;
    grid-column:1!important;
    grid-row:1!important;
    font-size:17px!important;
    line-height:1.2!important;
    margin:0!important;
  }

  .competency-row span,
  .competency-score{
    display:block!important;
    grid-column:2!important;
    grid-row:1!important;
    text-align:right!important;
    font-size:17px!important;
    font-weight:800!important;
    white-space:nowrap!important;
    margin:0!important;
  }

  .competency-row > div{
    grid-column:1 / -1!important;
    grid-row:2!important;
    width:100%!important;
    height:10px!important;
    max-width:100%!important;
    margin:2px 0 0!important;
    box-sizing:border-box!important;
  }

  .general-observation-card{
    padding-bottom:14px!important;
  }

  .general-observation-card > div[style*="margin-top:18px"]{
    margin-top:14px!important;
  }

  .general-observation-average{
    margin-top:12px!important;
  }
}


/* Layer 32e — Mobile dashboard chart + officials table polish */
@media(max-width:700px){

  /* Dashboard: reduce chart card height/overflow */
  .card h2,
  .card h3{
    line-height:1.15;
  }

  .coverage-grouped-chart,
  .coverage-bars-area,
  .coach-activity-ranking,
  .coach-activity-list,
  .coach-ranking-list{
    max-width:100%!important;
    overflow:hidden!important;
  }

  .coverage-grouped-chart{
    min-width:0!important;
    grid-template-columns:32px 1fr!important;
    height:auto!important;
    max-height:260px!important;
  }

  .coverage-bars-area{
    min-width:0!important;
    width:100%!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;
    padding-bottom:4px;
  }

  .coverage-bars-area svg,
  .coverage-grouped-chart svg,
  .chart svg{
    max-width:100%!important;
    height:auto!important;
  }

  .coverage-bars-area .bar-label,
  .coverage-grouped-chart .bar-label{
    font-size:10px!important;
  }

  .coach-activity-ranking,
  .coach-activity-list{
    min-height:0!important;
    max-height:none!important;
  }

  .coach-activity-ranking .ranking-row,
  .coach-activity-list .ranking-row,
  .coach-row{
    margin-bottom:14px!important;
  }

  .coach-activity-ranking strong,
  .coach-activity-list strong,
  .coach-row strong{
    font-size:15px!important;
  }

  .coach-activity-ranking .muted,
  .coach-activity-list .muted,
  .coach-row .muted{
    font-size:12px!important;
  }

  /* Officials table: keep desktop intact, mobile gets compact display */
  #officialsTable,
  .officials-table,
  table.officials{
    min-width:0!important;
    width:100%!important;
    table-layout:fixed!important;
  }

  #officialsTable th,
  #officialsTable td,
  .officials-table th,
  .officials-table td,
  table.officials th,
  table.officials td{
    padding:10px 7px!important;
    vertical-align:middle!important;
  }

  /* Hide email line inside officials list on mobile */
  .official-email,
  .officials-email,
  .official-email-line,
  td .muted.email,
  td small.email{
    display:none!important;
  }

  /* If email is plain second line in first cell, hide small/muted elements */
  #officialsTable td:first-child small,
  #officialsTable td:first-child .muted,
  .officials-table td:first-child small,
  .officials-table td:first-child .muted,
  table.officials td:first-child small,
  table.officials td:first-child .muted{
    display:none!important;
  }

  /* Prevent Grade/Status/Role pills wrapping ugly */
  .history-table .pill,
  #officialsTable .pill,
  .officials-table .pill,
  table.officials .pill{
    white-space:nowrap!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    padding:6px 9px!important;
    font-size:12px!important;
    line-height:1!important;
    max-width:none!important;
  }

  /* Column sizing for officials list */
  #officialsTable th:nth-child(1),
  #officialsTable td:nth-child(1),
  .officials-table th:nth-child(1),
  .officials-table td:nth-child(1),
  table.officials th:nth-child(1),
  table.officials td:nth-child(1){
    width:32%!important;
  }

  #officialsTable th:nth-child(2),
  #officialsTable td:nth-child(2),
  .officials-table th:nth-child(2),
  .officials-table td:nth-child(2),
  table.officials th:nth-child(2),
  table.officials td:nth-child(2){
    width:22%!important;
  }

  #officialsTable th:nth-child(3),
  #officialsTable td:nth-child(3),
  .officials-table th:nth-child(3),
  .officials-table td:nth-child(3),
  table.officials th:nth-child(3),
  table.officials td:nth-child(3){
    width:18%!important;
  }

  #officialsTable th:nth-child(4),
  #officialsTable td:nth-child(4),
  .officials-table th:nth-child(4),
  .officials-table td:nth-child(4),
  table.officials th:nth-child(4),
  table.officials td:nth-child(4){
    width:28%!important;
  }

  #officialsTable th,
  .officials-table th,
  table.officials th{
    font-size:10px!important;
    letter-spacing:.08em!important;
  }
}


/* Layer 32f — exact Officials mobile patch */
@media(max-width:700px){
  .officials-mobile-table{
    min-width:0!important;
    width:100%!important;
    table-layout:fixed!important;
  }

  .officials-mobile-table .hide-mobile-officials{
    display:none!important;
  }

  .officials-mobile-table .officials-mobile-email{
    display:none!important;
  }

  .officials-mobile-table th,
  .officials-mobile-table td{
    padding:10px 6px!important;
  }

  .officials-mobile-table th:nth-child(1),
  .officials-mobile-table td:nth-child(1){
    width:38%!important;
  }

  .officials-mobile-table th:nth-child(2),
  .officials-mobile-table td:nth-child(2){
    width:18%!important;
  }

  .officials-mobile-table th:nth-child(3),
  .officials-mobile-table td:nth-child(3){
    width:16%!important;
  }

  .officials-mobile-table th:nth-child(4),
  .officials-mobile-table td:nth-child(4){
    width:28%!important;
  }

  .officials-mobile-table .pill{
    white-space:nowrap!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:0!important;
    max-width:100%!important;
    padding:6px 8px!important;
    font-size:12px!important;
    line-height:1!important;
  }

  .officials-mobile-table td:first-child strong{
    display:block;
    font-size:13px!important;
    line-height:1.15!important;
  }
}


/* Layer 32g — simple mobile officials list: Name / Grade / Last Obs */
@media(max-width:700px){
  .officials-mobile-table{
    min-width:0!important;
    width:100%!important;
    table-layout:fixed!important;
  }

  .officials-mobile-table .hide-mobile-officials,
  .officials-mobile-table .officials-mobile-email{
    display:none!important;
  }

  .officials-mobile-table th,
  .officials-mobile-table td{
    padding:12px 6px!important;
    vertical-align:middle!important;
  }

  .officials-mobile-table th:nth-child(1),
  .officials-mobile-table td:nth-child(1){
    width:48%!important;
  }

  .officials-mobile-table th:nth-child(2),
  .officials-mobile-table td:nth-child(2){
    width:18%!important;
    text-align:left!important;
  }

  .officials-mobile-table .mobile-last-obs-header,
  .officials-mobile-table .mobile-last-obs-cell{
    display:table-cell!important;
    width:34%!important;
    text-align:right!important;
  }

  .officials-mobile-table .mobile-last-obs-cell{
    color:var(--soft)!important;
    font-size:12px!important;
    white-space:nowrap!important;
  }

  .officials-mobile-table th{
    font-size:10px!important;
    letter-spacing:.08em!important;
    white-space:nowrap!important;
  }

  .officials-mobile-table td:first-child strong{
    display:block!important;
    font-size:13px!important;
    line-height:1.15!important;
  }

  .officials-mobile-table .pill{
    white-space:nowrap!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-width:0!important;
    padding:6px 9px!important;
    font-size:12px!important;
    line-height:1!important;
  }
}


/* Layer 32h — mobile officials card list */
.officials-mobile-cards{
  display:none;
}

@media(max-width:700px){
  .officials-desktop-table{
    display:none!important;
  }

  .officials-mobile-cards{
    display:grid!important;
    gap:10px;
    margin-top:12px;
  }

  .official-mobile-card{
    width:100%;
    border:1px solid rgba(255,255,255,.09);
    border-radius:16px;
    background:rgba(255,255,255,.03);
    color:var(--text);
    padding:13px 14px;
    display:grid;
    grid-template-columns:1fr auto;
    gap:10px;
    align-items:center;
    text-align:left;
    cursor:pointer;
  }

  .official-mobile-card strong{
    display:block;
    font-size:14px;
    line-height:1.15;
    color:var(--text);
  }

  .official-mobile-meta{
    display:flex;
    gap:8px;
    align-items:center;
    justify-content:flex-end;
    color:var(--soft);
    font-size:12px;
    white-space:nowrap;
  }

  .official-mobile-meta span:first-child{
    color:var(--text);
    border:1px solid var(--border);
    background:rgba(255,255,255,.055);
    border-radius:999px;
    padding:6px 9px;
    font-weight:800;
  }
}


/* Layer 32i — restore desktop Officials table alignment */
.officials-table-clean{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
}

.officials-table-clean th,
.officials-table-clean td{
  vertical-align:middle;
}

.officials-table-clean th:nth-child(1),
.officials-table-clean td:nth-child(1){width:15%}

.officials-table-clean th:nth-child(2),
.officials-table-clean td:nth-child(2){width:10%}

.officials-table-clean th:nth-child(3),
.officials-table-clean td:nth-child(3){width:10%}

.officials-table-clean th:nth-child(4),
.officials-table-clean td:nth-child(4){width:20%}

.officials-table-clean th:nth-child(5),
.officials-table-clean td:nth-child(5){width:18%}

.officials-table-clean th:nth-child(6),
.officials-table-clean td:nth-child(6){width:12%}

.officials-table-clean th:nth-child(7),
.officials-table-clean td:nth-child(7){width:7%}

.officials-table-clean th:nth-child(8),
.officials-table-clean td:nth-child(8){width:8%}

@media(max-width:700px){
  .officials-desktop-table{
    display:none!important;
  }
}

/* =========================================================
   Light Theme Stabilisation Layer
   Added after dark-theme legacy rules so it wins the cascade.
   ========================================================= */

/* Core surfaces */
body{
  background:var(--bg)!important;
  color:var(--text)!important;
}

.main{
  background:transparent!important;
}

.sidebar{
  background:linear-gradient(180deg,#0f1220 0%,#161b30 100%)!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
  box-shadow:none!important;
}

.mobile-header{
  background:#ffffff!important;
  color:var(--text)!important;
}

/* Navigation */
.nav button,
.nav-group-toggle,
.nav-nested button{
  color:rgba(255,255,255,.6)!important;
}

.nav button.active,
.nav button:hover,
.nav-nested button.active,
.settings-subnav button.active,
.settings-subnav button:hover{
  color:#fff!important;
  border-color:rgba(88,117,255,.25)!important;
  background:linear-gradient(90deg,rgba(74,128,255,.22),rgba(139,77,255,.1))!important;
}

.nav-group-toggle:hover{
  color:rgba(255,255,255,.9)!important;
}

.nav-nested{
  border-left:1px solid rgba(255,255,255,.1)!important;
}
/* Cards and panels */
.card,
.profile-kpi,
.permission-card,
.sync-status-card,
.connection-card,
.import-type-card,
.lifecycle-status-card,
.competency-summary-card,
.inline-competency-notes,
.general-observation-average,
.general-observation-notes,
.settings-subnav,
.expandable-feedback-card,
.mentor-competency-card,
.policy-modal,
.modal{
  background:#ffffff!important;
  border-color:var(--border)!important;
  color:var(--text)!important;
  box-shadow:0 4px 16px rgba(15,23,42,.06)!important;
}

.access-banner,
.account-pill,
.org-badge,
.lifecycle-chip,
.issue-chip,
.visibility-chip,
.pill{
  background:#f8f9fc!important;
  border-color:#dfe3ee!important;
  color:var(--muted)!important;
}

/* Text that was hardcoded white for dark mode */
.grade-bar-label,
.program-demo-line span,
.competency-label,
.month-value,
th.sortable:hover,
.multi-option:hover,
.settings-subnav button.active,
.settings-subnav button:hover{
  color:var(--text)!important;
}

.brand-text,
.subtitle,
.kpi-label,
.kpi-foot,
.profile-kpi .label,
.profile-kpi .foot,
.notice,
.result-count,
.filter-label,
.module-meta span,
.analytics-main span,
.overlooked-row span,
.overlooked-dashboard-item span,
.focus-grade-value,
.focus-grade-legend,
.grade-bar-value,
.grade-chart-legend,
.coverage-y-axis,
.coverage-grade-label,
.coverage-legend,
.general-observation-meta,
.general-observation-notes p,
.inline-competency-notes p,
.mentor-competency-meta,
.mentor-competency-notice{
  color:var(--muted)!important;
}

/* Buttons */
.btn,
.icon-btn,
.mobile-menu-btn,
.policy-modal-close{
  background:#ffffff!important;
  color:var(--text)!important;
  border-color:var(--border)!important;
}

.btn.primary,
.login-primary,
.pilot-switcher-toggle{
  color:#ffffff!important;
  border:0!important;
  background:linear-gradient(135deg,var(--blue),var(--purple))!important;
}

/* Forms and dropdowns */
input,
select,
textarea,
.multi-filter-button{
  background:#ffffff!important;
  color:var(--text)!important;
  border:1px solid var(--border)!important;
}

input::placeholder,
textarea::placeholder{
  color:var(--soft)!important;
}

select option{
  background:#ffffff!important;
  color:var(--text)!important;
}

.multi-filter-menu{
  background:#ffffff!important;
  border-color:var(--border)!important;
  box-shadow:0 10px 30px rgba(15,23,42,.10)!important;
}

.multi-option{
  color:var(--muted)!important;
}

.multi-option:hover{
  background:#f4f6fb!important;
  color:var(--text)!important;
}

/* Tables */
th,
td{
  border-bottom:1px solid #eceff5!important;
}

th{
  color:var(--muted)!important;
}

.visibility-table th:first-child,
.visibility-table td:first-child{
  background:#ffffff!important;
}

/* Bars/charts/tracks */
.bar-bg,
.mini-bar-bg,
.grade-track,
.focus-grade-track,
.competency-track{
  background:#e9edf6!important;
}

.coverage-bars-area{
  border-left:1px solid #dfe3ee!important;
  border-bottom:1px solid #dfe3ee!important;
  background:
    linear-gradient(to top, rgba(15,23,42,.06) 1px, transparent 1px)!important;
  background-size:100% 48px!important;
}

.coverage-bar.program{
  background:linear-gradient(180deg,#4a80ff,#dce7ff)!important;
}

.coverage-legend .program::before{
  background:linear-gradient(90deg,#4a80ff,#dce7ff)!important;
}

.legend-dot.assessment,
.focus-grade-fill-assessments,
.grade-fill.assessment,
.legend-assessments{
  background:linear-gradient(90deg,#c7d6ff,var(--blue))!important;
}

/* Modals and overlays */
.modal-backdrop,
.policy-modal-overlay,
.sidebar-backdrop{
  background:rgba(15,23,42,.42)!important;
}

.modal-head{
  background:#ffffff!important;
}

/* Scrollbars */
.overlooked-dashboard-panel::-webkit-scrollbar-thumb,
.dashboard-overlooked-scroll::-webkit-scrollbar-thumb{
  background:rgba(15,23,42,.20)!important;
}

.overlooked-dashboard-panel::-webkit-scrollbar-track,
.dashboard-overlooked-scroll::-webkit-scrollbar-track{
  background:rgba(15,23,42,.04)!important;
}

/* Keep login screen intentionally branded/dark until it is redesigned separately */
.login-shell{
  color:#ffffff;
}

/* Pilot switcher remains a temporary dark developer tool */
.pilot-switcher{
  background:linear-gradient(180deg,rgba(18,22,34,.96),rgba(10,12,18,.96))!important;
  color:#ffffff!important;
}

.pilot-switcher select{
  background:rgba(255,255,255,.06)!important;
  color:#ffffff!important;
}

.pilot-switcher .btn{
  background:#ffffff!important;
  color:#111218!important;
}

/* Mobile-specific light cleanups */
@media(max-width:900px){
  .mobile-header{
    background:#ffffff!important;
    backdrop-filter:blur(12px);
  }

  .sidebar{
  background:linear-gradient(180deg,#0f1220 0%,#161b30 100%)!important;
}

  .modal-head{
    background:#ffffff!important;
  }

.profile-feedback-expansion-content{
  background:var(--bg)!important;
  padding:8px 16px 16px!important;
}


.direct-feedback-expansion-row td{
  background:var(--bg)!important;
  padding:0!important;
}

.brand-logo{
  width:170px;
  height:auto;
  display:block;
}

.mobile-header .brand-logo{
  width:140px;
}

.oi-status-good,
.oi-status-warn,
.oi-status-bad {
  display: inline-flex !important;
  align-items: center !important;
  border-radius: 999px !important;
  padding: 5px 11px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.oi-status-good {
  background: #dcfce7 !important;
  color: #166534 !important;
}

.oi-status-warn {
  background: #fef3c7 !important;
  color: #92400e !important;
}

.oi-status-bad {
  background: #fee2e2 !important;
  color: #991b1b !important;
}
.dashboard-layout-clean {
  display: grid !important;
  grid-template-columns: minmax(0, 2fr) minmax(320px, 0.9fr) !important;
  gap: 24px !important;
  align-items: start !important;
}

.dashboard-layout-clean > div:first-child {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.dashboard-left-stack,
.dashboard-right-stack {
  display: flex !important;
  flex-direction: column !important;
  gap: 24px !important;
}

.card {
  margin-bottom: 0;
}

.month-chart {
  min-height: 260px;
  padding-top: 28px;
}

.grade-bar-row {
  display: grid;
  grid-template-columns: 110px 1fr 70px;
  gap: 14px;
  align-items: center;
  margin: 12px 0;
}

.grade-bars {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.grade-track {
  height: 12px;
  background: #e9edf5;
  border-radius: 999px;
  overflow: hidden;
}

.grade-fill {
  height: 100%;
  border-radius: 999px;
}

.grade-bar-value {
  font-size: 13px;
  color: var(--soft);
  text-align: right;
}

.dashboard-layout-clean {
  gap: 20px !important;
}

.dashboard-left-stack,
.dashboard-right-stack {
  gap: 20px !important;
}

.dashboard-left-stack .card,
.dashboard-right-stack .card {
  margin: 0 !important;
}

.overlooked-scroll-card {
  height: 344px !important;
  max-height: 344px !important;
}

#view .dashboard-layout-clean {
  display: grid !important;
  grid-template-columns: minmax(0, 2fr) minmax(320px, 0.9fr) !important;
  column-gap: 20px !important;
  row-gap: 20px !important;
  align-items: start !important;
}

#view .dashboard-left-stack,
#view .dashboard-right-stack {
  display: flex !important;
  flex-direction: column !important;
  row-gap: 20px !important;
  gap: 20px !important;
}

#view .dashboard-left-stack > .card,
#view .dashboard-right-stack > .card {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

#view .overlooked-scroll-card {
  height: 344px !important;
  max-height: 344px !important;
  overflow-y: auto !important;
}

.grade-column-chart {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(58px, 1fr));
  gap: 16px;
  align-items: end;
  min-height: 240px;
  padding-top: 20px;
}

.grade-column-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
}

.grade-column-values {
  display: flex;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  color: var(--soft);
  min-height: 14px;
}

.grade-columns {
  height: 160px;
  display: flex;
  align-items: end;
  gap: 5px;
}

.grade-column {
  width: 14px;
  border-radius: 8px 8px 2px 2px;
  background: linear-gradient(180deg, var(--blue), var(--purple));
}

.grade-column.assessment {
  background: linear-gradient(180deg, #8ab4ff, #dbeafe);
}

.grade-column-label {
  font-size: 12px;
  color: var(--soft);
  text-align: center;
  white-space: nowrap;
}

.observations-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}


.observation-row-head {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 15px;
  margin-bottom: 8px;
}

.observation-row-head span,
.observation-row-meta {
  color: var(--soft);
}

.observation-row-meta {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  font-size: 13px;
  margin-bottom: 10px;
}


#view .observations-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}


#view .observation-row-head {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  font-size: 15px !important;
  margin-bottom: 8px !important;
}

#view .observation-row-head span,
#view .observation-row-meta {
  color: var(--soft) !important;
}

#view .observation-row-meta {
  display: flex !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
  font-size: 13px !important;
  margin-bottom: 10px !important;
}



#view .observation-row-head {
  border-bottom: 1px solid #e5eaf2 !important;
  padding-bottom: 8px !important;
}

.observations-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.observation-row-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding-bottom:8px;
  margin-bottom:10px;
  border-bottom:1px solid var(--border);
}

.observation-row-meta{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-bottom:12px;
  color:var(--muted);
  font-size:13px;
}

/* Observations screen */
#view .observations-list {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}

#view .observation-card-row {
  background: #f8fafc !important;
  border: 1px solid var(--border) !important;
  border-radius: 16px !important;
  padding: 16px !important;
  margin-bottom: 0 !important;
}

#view .observation-row-head {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding-bottom: 8px !important;
  margin-bottom: 10px !important;
  border-bottom: 1px solid var(--border) !important;
}

#view .observation-row-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 14px !important;
  margin-bottom: 12px !important;
  color: var(--muted) !important;
  font-size: 13px !important;
}

#view .observation-card-row p {
  margin: 0 !important;
  line-height: 1.6 !important;
  color: #111827 !important;
}

.observation-card-row {
  background: #f8fafc !important;
  border: 1px solid #dfe3ee !important;
  border-radius: 18px !important;
  padding: 18px !important;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06) !important;
}

#view .observation-card-top {
  display: flex !important;
  justify-content: space-between !important;
  gap: 12px !important;
  margin-bottom: 12px !important;
}

#view .observation-name {
  font-size: 17px !important;
  font-weight: 900 !important;
}

#view .observation-meta-line {
  color: #5f6472 !important;
  font-size: 13px !important;
  margin-top: 3px !important;
}

#view .observation-tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-bottom: 12px !important;
}

#view .observation-tags span {
  display: inline-flex !important;
  border: 1px solid #dfe3ee !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  padding: 5px 9px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #5f6472 !important;
}

#view .observation-feedback {
  line-height: 1.6 !important;
  color: #111827 !important;
}
.obs-feedback-row { cursor: pointer; }
.obs-feedback-row:hover td { background: rgba(0,0,0,.03); }

.observations-table {
  table-layout: fixed;
  width: 100%;
}

.observations-table th,
.observations-table td {
  vertical-align: top;
}

.observation-feedback-cell {
  white-space: normal;
  line-height: 1.45;
}

.observations-table td:first-child,
.observations-table th:first-child {
  white-space: nowrap;
}

.overlooked-dashboard-item {
  display: flex;
  flex-direction: column;
  padding: 10px 0;
  border-bottom: 1px solid var(--border);
}
.overlooked-dashboard-item:last-child { border-bottom: none; }

.nav button{color:rgba(255,255,255,.6);}
.nav button.active{color:#fff;background:linear-gradient(90deg,rgba(74,128,255,.22),rgba(139,77,255,.1));border:0.5px solid rgba(88,117,255,.25);}
.nav-group-toggle{color:rgba(255,255,255,.35) !important;}
.nav-label{color:rgba(255,255,255,.3);font-size:9px;letter-spacing:.12em;}

.main::before{content:"";display:block;height:3px;background:linear-gradient(90deg,var(--blue),var(--purple));border-radius:0 0 4px 4px;margin:-42px -34px 32px -34px;}

.card{transition:box-shadow .15s ease;}
.card:hover{box-shadow:0 4px 24px rgba(74,128,255,.07);}

.brand-logo{width:160px;height:auto;filter:brightness(0) invert(1);}


@media(max-width:900px){
  .dashboard-layout-clean{
    display:flex !important;
    flex-direction:column !important;
  }
  .dashboard-left-stack,
  .dashboard-right-stack{
    width:100% !important;
    min-width:0 !important;
  }
}
@media(max-width:900px){
  .dashboard-column-layout{
    display:flex !important;
    flex-direction:column !important;
  }
  .dashboard-left-column,
  .dashboard-right-column{
    width:100% !important;
    min-width:0 !important;
    float:none !important;
  }
}

@media(max-width:900px){
  .dashboard-column-layout{
    display:block !important;
    width:100% !important;
  }
  .dashboard-left-column{
    display:block !important;
    width:100% !important;
  }
  .dashboard-right-column{
    display:block !important;
    width:100% !important;
  }
}
@media(max-width:900px){
  .month-chart{
    gap:4px !important;
  }
  .month-bar-wrap{
    min-width:0 !important;
    flex:1 !important;
  }
  .month-value{
    font-size:9px !important;
  }
  .month-label{
    font-size:9px !important;
  }
  .dashboard-layout-clean{
    grid-template-columns:1fr !important;
  }
  .dashboard-left-stack,
  .dashboard-right-stack{
    width:100% !important;
    min-width:0 !important;
  }
}
@media(max-width:900px){
  #view .dashboard-layout-clean{
    grid-template-columns:1fr !important;
  }
}
@media(max-width:900px){
  .demo-table-grid{
    display:flex !important;
    overflow-x:auto !important;
    scroll-snap-type:x mandatory !important;
    -webkit-overflow-scrolling:touch !important;
    gap:16px !important;
    padding-bottom:8px !important;
  }
  .demo-mini-table{
    min-width:75vw !important;
    flex-shrink:0 !important;
    scroll-snap-align:start !important;
  }
}
@media(max-width:900px){
  .demo-mini-table .line{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center !important;
    padding:4px 0 !important;
    border-bottom:0.5px solid var(--border) !important;
  }
  .demo-mini-table .line span,
  .demo-mini-table .line strong{
    display:inline !important;
  }
}
@media(max-width:900px){
  .demo-mini-table .line{
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
  }
}
@media(max-width:900px){
  .grade-bar-row{
    margin-bottom:8px !important;
    padding-bottom:8px !important;
  }
  .grade-bar-label{
    font-size:13px !important;
    font-weight:700 !important;
    margin-bottom:4px !important;
  }
  .grade-bar-value{
    font-size:12px !important;
    margin-top:2px !important;
  }
  .grade-track{
    height:8px !important;
    border-radius:4px !important;
  }
  .grade-fill{
    height:8px !important;
    border-radius:4px !important;
  }
}

@media(max-width:900px){
  .grade-bar-chart{ all:revert; }
  .grade-bar-row{ display:grid !important; grid-template-columns:70px 1fr 50px !important; align-items:center !important; gap:8px !important; margin-bottom:6px !important; }
  .grade-bar-label{ font-size:12px !important; font-weight:700 !important; }
  .grade-bars{ display:flex !important; flex-direction:column !important; gap:3px !important; }
  .grade-track{ height:6px !important; border-radius:3px !important; display:block !important; }
  .grade-fill{ height:6px !important; border-radius:3px !important; }
  .grade-bar-value{ font-size:11px !important; text-align:right !important; }
}

@media(max-width:900px){
  .observations-table{
    display:block !important;
    min-width:0 !important;
  }
  .observations-table thead{
    display:none !important;
  }
  .observations-table tbody{
    display:block !important;
  }
  .observations-table tr{
    display:block !important;
    border-bottom:1px solid var(--border) !important;
    padding:12px 0 !important;
    margin-bottom:4px !important;
  }
  .observations-table td{
    display:block !important;
    padding:2px 0 !important;
    border:none !important;
    font-size:13px !important;
  }
  .observations-table td:first-child{
    font-size:11px !important;
    color:var(--text-muted) !important;
  }
  .observations-table td:nth-child(3),
  .observations-table td:nth-child(4),
  .observations-table td:nth-child(5){
    display:none !important;
  }
.observation-feedback-cell{
    font-size:12px !important;
    display:-webkit-box !important;
    -webkit-line-clamp:2 !important;
    line-clamp:2 !important;
    -webkit-box-orient:vertical !important;
    overflow:hidden !important;
  }
}
@media(max-width:900px){
  .themes-layout{
    display:flex !important;
    flex-direction:column !important;
  }
  .themes-layout > .card:last-child{
    overflow-x:auto !important;
    scroll-snap-type:x mandatory !important;
  }
}
@media(max-width:900px){
  .themes-layout > .card:first-child{
    display:none !important;
  }
  .themes-layout{
    display:block !important;
  }
}

@media(max-width:900px){
  .hide-mobile{ display:none !important; }
  .grid.kpis{ grid-template-columns:1fr 1fr !important; }
}

@media(max-width:900px){
  .memories-upload-grid{
    grid-template-columns:1fr 1fr !important;
  }
  .memories-upload-grid > div:last-child{
    grid-column:1 / -1 !important;
  }
}

@media(max-width:900px){
  .memories-table td:nth-child(2),
  .memories-table th:nth-child(2){
    display:none !important;
  }
}

@media(max-width:900px){
  .memories-table{
    min-width:0 !important;
  }
  .memories-table td{
    white-space:nowrap !important;
    font-size:12px !important;
    padding:8px 4px !important;
  }
  .memories-table td:nth-child(3){
    max-width:80px !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }
}

/* Mobile profile modal fixes */
@media(max-width:700px){
  /* Profile header grid - stack vertically */
  .modal [style*="grid-template-columns:1fr 280px"]{
    grid-template-columns:1fr !important;
  }
  
  /* Profile stats row - 2 columns instead of 4 */
  .modal [style*="grid-template-columns:repeat(4,1fr)"]{
    grid-template-columns:1fr 1fr !important;
  }

  /* Competency chart - stack vertically */
  .modal [style*="grid-template-columns:240px 1fr"]{
    grid-template-columns:1fr !important;
  }

  /* Competency chart center on mobile */
  .modal [style*="display:flex;align-items:flex-start;justify-content:center"]{
    justify-content:center !important;
    margin-bottom:16px;
  }

  /* Observation table - horizontal scroll */
  .history-table{
    display:block;
    overflow-x:auto;
    white-space:nowrap;
  }

  /* Modal padding reduction */
  .modal{
    padding:12px !important;
    margin:8px !important;
  }
}

@media(max-width:520px){
  /* Profile stats row - single column on very small screens */
  .modal [style*="grid-template-columns:repeat(4,1fr)"]{
    grid-template-columns:1fr 1fr !important;
  }
}

@media(max-width:700px){
  /* Radar chart - scale down on mobile */
  .modal svg[viewBox="0 0 280 280"]{
    width:180px !important;
    height:180px !important;
  }

  /* Competency list - allow text wrapping */
  .modal [style*="display:flex;justify-content:space-between;align-items:center;padding:8px 0"]{
    flex-wrap:wrap;
    gap:4px;
  }

  .modal [style*="font-size:12px;color:var(--text);flex:1;padding-right:12px"]{
    white-space:normal !important;
    min-width:0;
  }
}

}