/* NEXAM UI 3.0 — responsive top navigation. Scoped to pages using the staff/student shell. */
:root { --nx-shell-max:1800px; --nx-shell-gutter:clamp(16px,1.8vw,32px); --nx3-ink:#162b4c; --nx3-blue:#2756ce; --nx3-border:#e3eaf3; --nx3-bg:#f5f8fd; --nx3-text:#60728e; --nx3-shadow:0 12px 36px rgba(15,39,79,.065); }
html.nx3-layout body { background:var(--nx3-bg); }
html.nx3-layout .wrapper { display:block; min-height:100vh; }
html.nx3-layout .wrapper > #sidebar { display:none!important; }
html.nx3-layout .wrapper > .main { width:100%!important; max-width:100%!important; min-width:0!important; min-height:100vh; margin:0!important; padding:0!important; }
html.nx3-layout .main > main.content { padding:26px var(--nx-shell-gutter) 40px!important; max-width:var(--nx-shell-max); margin:0 auto!important; width:100%!important; box-sizing:border-box; align-self:center; }
html.nx3-layout .main .container-fluid { max-width:100%; }
html.nx3-layout .main > .footer { padding:14px var(--nx-shell-gutter); }
html.nx3-layout .nx3-header { display:block!important; z-index:1030; position:sticky; top:0; width:100%; margin:0; padding:0 var(--nx-shell-gutter)!important; box-sizing:border-box; min-height:76px; background:rgba(255,255,255,.97)!important; border-bottom:1px solid var(--nx3-border); box-shadow:0 6px 22px rgba(26,52,95,.04); backdrop-filter:blur(15px); }
.nx3-header-row { display:flex; align-items:center; gap:clamp(14px,2vw,30px); min-height:76px; width:100%; max-width:calc(var(--nx-shell-max) - var(--nx-shell-gutter) - var(--nx-shell-gutter)); margin:0 auto; }
.nx3-brand { text-decoration:none; flex-shrink:0; display:flex; align-items:center; gap:10px; color:#12386a!important; font-size:20px; font-weight:900; letter-spacing:-.9px; }
.nx3-brand-icon { display:grid; place-items:center; width:40px; height:40px; border-radius:12px; background:linear-gradient(135deg,#184a9b,#35a2d6); color:#fff; box-shadow:0 7px 16px rgba(27,85,167,.18); font-size:17px; }
.nx3-brand small { display:block; font-size:9px; font-weight:650; color:#8293aa; letter-spacing:1.3px; text-transform:uppercase; margin-top:-4px; }
.nx3-nav { display:flex; align-items:center; justify-content:flex-start; min-width:0; gap:2px; flex:1; align-self:stretch; }
.nx3-nav-link, .nx3-nav-group>summary { display:inline-flex; align-items:center; justify-content:center; gap:8px; padding:11px 12px; color:#536780!important; border-radius:11px; font-size:12px; font-weight:750; text-decoration:none!important; white-space:nowrap; background:transparent; cursor:pointer; list-style:none; height:auto; }
.nx3-nav-link i, .nx3-nav-group>summary i { font-size:12px; opacity:.82; }
.nx3-nav-group>summary::-webkit-details-marker { display:none; }
.nx3-nav-link:hover, .nx3-nav-group>summary:hover, .nx3-nav-link.nx3-active, .nx3-nav-group.nx3-active>summary, .nx3-nav-group[open]>summary { background:#ecf3ff!important; color:#2158c5!important; }
.nx3-nav-group { position:relative; align-content:center; }
.nx3-chevron { font-size:9px!important; transition:transform .18s; }
.nx3-nav-group[open] .nx3-chevron { transform:rotate(180deg); }
.nx3-dropdown { position:absolute; top:calc(100% + 9px); left:0; width:max-content; min-width:230px; max-width:300px; max-height:min(70vh,540px); overflow-y:auto; z-index:1040; padding:8px; background:#fff; border:1px solid #e4eaf3; border-radius:16px; box-shadow:0 20px 56px rgba(15,39,79,.17); }
.nx3-drop-link { display:flex; align-items:center; gap:11px; text-decoration:none!important; border-radius:9px; color:#455a76!important; padding:11px 12px; font-size:12px; font-weight:650; }
.nx3-drop-link i { width:16px; text-align:center; color:#6585b1; }
.nx3-drop-link:hover, .nx3-drop-link.nx3-active { background:#eff5ff; color:#2458c9!important; }
.nx3-tools { display:flex; align-items:center; justify-content:flex-end; gap:12px; margin-left:auto; flex-shrink:0; }
.nx3-lang { display:inline-flex; gap:2px; padding:3px; border:1px solid #e3eaf4; background:#f1f5fb; border-radius:11px; }
.nx3-lang button { border:0; background:transparent; color:#7486a2; border-radius:8px; min-width:31px; height:29px; padding:0 7px; font-size:11px; font-weight:850; }
.nx3-lang button[aria-pressed=true] { background:#2756ce; box-shadow:0 2px 7px rgba(39,86,206,.2); color:#fff; }
.nx3-header #darkModeToggle { display:grid; place-items:center; width:37px; height:37px; border:1px solid #e4eaf3; border-radius:11px; padding:0!important; color:#587195; }
.nx3-header #userDropdown { border-radius:11px; padding:4px 7px!important; }
.nx3-header #userDropdown:hover { background:#f2f6fc; }
.nx3-header .nx3-profile { width:36px!important; height:36px!important; flex:0 0 36px!important; border:1px solid #e8edf5; }
.nx3-header .nx3-profile img { width:36px!important; height:36px!important; }
.nx3-header .nx3-profile i { font-size:17px!important; }
.nx3-header .nx3-profile-text strong { color:#172e52; font-size:12px!important; max-width:132px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nx3-header .nx3-profile-text small { font-size:10px!important; }
.nx3-header .dropdown-menu { border:1px solid #e4eaf3; border-radius:14px; box-shadow:var(--nx3-shadow); }
.nx3-menu-button { display:none; align-items:center; justify-content:center; background:#eef4ff; border:1px solid #dce6f7; color:#2458c9; border-radius:11px; width:42px; height:40px; }
html.nx3-layout .card { border-radius:16px; box-shadow:var(--nx3-shadow); }
html.nx3-layout .btn:not(.btn-link) { border-radius:9px; }
html.nx3-layout .form-control, html.nx3-layout .form-select { border-radius:9px; }
html.nx3-layout .table-responsive { border-radius:12px; }
.nx3-bottom-nav { display:none; }
html.dark-mode.nx3-layout body { --nx3-bg:#192434;--nx3-ink:#f0f5fa;--nx3-border:#36475c; background:var(--nx3-bg)!important; }
html.dark-mode.nx3-layout .nx3-header { background:#243347!important; border-bottom-color:#3e5065; }
html.dark-mode.nx3-layout .nx3-brand { color:#e4eeff!important; }
html.dark-mode.nx3-layout .nx3-brand small { color:#9eafc5; }
html.dark-mode.nx3-layout .nx3-nav-link, html.dark-mode.nx3-layout .nx3-nav-group>summary { color:#bdcce0!important; }
html.dark-mode.nx3-layout .nx3-nav-link:hover,html.dark-mode.nx3-layout .nx3-nav-group>summary:hover,html.dark-mode.nx3-layout .nx3-nav-link.nx3-active,html.dark-mode.nx3-layout .nx3-nav-group[open]>summary,html.dark-mode.nx3-layout .nx3-nav-group.nx3-active>summary { background:#334b6a!important; color:#d2e3ff!important; }
html.dark-mode.nx3-layout .nx3-dropdown { background:#26374c; border-color:#43566d; }
html.dark-mode.nx3-layout .nx3-drop-link { color:#d4e0f0!important; }
html.dark-mode.nx3-layout .nx3-drop-link:hover,html.dark-mode.nx3-layout .nx3-drop-link.nx3-active { background:#344d69; }
html.dark-mode.nx3-layout .nx3-lang { background:#1d2d40; border-color:#47596e; }
html.dark-mode.nx3-layout .nx3-lang button:not([aria-pressed=true]) { color:#b2c3d7; }
html.dark-mode.nx3-layout .nx3-header #darkModeToggle { border-color:#53647b; color:#baccdc; }
html.dark-mode.nx3-layout .nx3-header .nx3-profile-text strong { color:#edf3fd; }
html.dark-mode.nx3-layout .nx3-menu-button { background:#334b69; color:#e8effb; border-color:#526783; }
.nx3-guest-language { position:fixed; top:15px; right:20px; z-index:1100; padding:5px; border-radius:14px; background:rgba(255,255,255,.92); box-shadow:0 7px 28px rgba(0,0,0,.13); }
@media(max-width:1290px) { .nx3-header { padding-inline:14px!important; } .nx3-nav-link, .nx3-nav-group>summary { padding:10px 8px; gap:5px; font-size:11px; } .nx3-brand small { display:none; } .nx3-header-row { gap:12px; } .nx3-tools { gap:7px; } }
@media(max-width:1080px) {
  .nx3-header-row { flex-wrap:wrap; justify-content:space-between; min-height:67px; }
  .nx3-menu-button { display:inline-flex; order:2; }
  .nx3-tools { order:1; margin-left:auto; }
  .nx3-brand { order:0; }
  .nx3-nav { display:none; order:3; flex:0 0 100%; align-self:auto; flex-direction:column; align-items:stretch; gap:1px; max-height:calc(100vh - 90px); overflow-y:auto; border-top:1px solid var(--nx3-border); padding:10px 0 14px; }
  .nx3-header.nx3-open .nx3-nav { display:flex; }
  .nx3-nav-link,.nx3-nav-group>summary { justify-content:flex-start; padding:12px 14px; width:100%; font-size:13px; }
  .nx3-nav-group { width:100%; }
  .nx3-dropdown { position:static; width:100%; max-width:none; max-height:none; box-shadow:none; margin:0 0 4px; border-radius:11px; }
}
@media(max-width:640px) {
  html.nx3-layout .main > main.content { padding:16px var(--nx-shell-gutter) 94px!important; }
  html.nx3-layout .nx3-header { min-height:63px; padding:0 var(--nx-shell-gutter)!important; }
  .nx3-header-row { gap:7px; min-height:63px; }
  .nx3-brand { gap:7px; font-size:17px; }
  .nx3-brand-icon { width:34px; height:34px; font-size:14px; border-radius:10px; }
  .nx3-tools { gap:4px; }
  .nx3-header .nx3-profile-text { display:none!important; }
  .nx3-header #userDropdown { padding:3px!important; }
  .nx3-header #darkModeToggle { width:30px; height:32px; }
  .nx3-lang { padding:2px; }
  .nx3-lang button { min-width:27px; padding:0 3px; height:28px; font-size:10px; }
  .nx3-menu-button { width:35px; height:35px; }
  .nx3-bottom-nav { position:fixed; bottom:0; left:0; right:0; z-index:1025; display:flex; align-items:center; justify-content:space-around; padding:8px 8px max(10px, env(safe-area-inset-bottom)); border-top:1px solid var(--nx3-border); background:rgba(255,255,255,.97); box-shadow:0 -8px 28px rgba(25,56,98,.08); }
  .nx3-bottom-nav a { display:flex; flex:1; align-items:center; flex-direction:column; gap:4px; color:#72839d; font-size:10px; text-decoration:none; font-weight:700; }
  .nx3-bottom-nav a i { font-size:17px; }
  .nx3-bottom-nav a.nx3-active { color:#2359cf; }
  html.dark-mode.nx3-layout .nx3-bottom-nav { background:#243347; border-color:#445970; }
  html.dark-mode.nx3-layout .nx3-bottom-nav a { color:#b9c8dc; }
  html.dark-mode.nx3-layout .nx3-bottom-nav a.nx3-active { color:#8dbbff; }
  .nx3-guest-language { top:8px; right:8px; }
}

/* UI 3.1 audit: consistent spacing, readable type and predictable responsive navigation. */
:root{--nx3-radius:16px;--nx3-focus:#3b82f6}
html.nx3-layout{scroll-padding-top:90px}
html.nx3-layout,html.nx3-layout body{max-width:100%;overflow-x:clip}
html.nx3-layout .main,html.nx3-layout .content,html.nx3-layout .container-fluid{min-width:0}
html.nx3-layout .main > main.content{max-width:var(--nx-shell-max);box-sizing:border-box;padding:28px var(--nx-shell-gutter) 48px!important;margin-left:auto!important;margin-right:auto!important}
html.nx3-layout .nx3-header{padding:0 var(--nx-shell-gutter)!important;min-height:72px}
.nx3-header-row{min-height:72px;max-width:calc(var(--nx-shell-max) - var(--nx-shell-gutter) - var(--nx-shell-gutter));gap:clamp(12px,1.7vw,28px)}
.nx3-brand{font-size:19px;line-height:1.05;gap:10px}
.nx3-nav{gap:3px}
.nx3-nav-link,.nx3-nav-group>summary{font-size:12px;line-height:1.35;font-weight:700;padding:11px clamp(9px,.8vw,13px);min-height:38px}
.nx3-nav-group>summary:focus-visible,.nx3-nav-link:focus-visible,.nx3-drop-link:focus-visible,.nx3-lang button:focus-visible,.nx3-menu-button:focus-visible{outline:3px solid var(--nx3-focus);outline-offset:2px}
.nx3-nav-group[open]{z-index:1041}
.nx3-tools{gap:9px}
.nx3-tools .navbar-nav{min-width:0}
.nx3-header #userDropdown{max-width:215px;border:1px solid #e6ecf5;padding:4px 8px!important;min-width:0}
.nx3-profile-text{min-width:0;max-width:135px}
.nx3-header .nx3-profile-text strong{display:block;max-width:124px}
.nx3-header .dropdown-menu{min-width:215px}
.nx3-header .nx3-brand-icon{flex-shrink:0}
.nx3-header .nx3-lang{white-space:nowrap}
.nx3-header .nx3-menu-button{flex-shrink:0}
.nx3-nav .nx3-dropdown{overscroll-behavior:contain}
html.nx3-layout .form-control:focus,html.nx3-layout .form-select:focus{box-shadow:0 0 0 3px rgba(37,99,235,.14)}
html.nx3-layout .table-responsive{max-width:100%;overflow-x:auto}
html.nx3-layout .card{border:1px solid var(--nx3-border);box-shadow:0 9px 26px rgba(15,44,89,.04)}
/* Summary and visualization components share a common layout rhythm. */
.nxdash52{gap:19px!important}
.nxdash52-hero{border-radius:24px!important;min-height:160px;padding:28px 32px!important;box-shadow:0 16px 36px rgba(22,78,169,.13)!important}
.nxdash52-hero h1{font-size:clamp(25px,2.1vw,33px)!important;line-height:1.18!important}
.nxdash52-hero p{font-size:13px!important;line-height:1.7!important;padding-right:180px}
.nxdash52-kicker{font-size:11px!important;letter-spacing:.12em!important}
.nxdash52-livebar{border:1px solid var(--nx3-border)!important;border-radius:17px;overflow:hidden;background:rgba(255,255,255,.78)!important}
.nxdash52-liveitem{padding:18px 22px!important;min-height:125px!important}
.nxdash52-label{font-size:10px!important;letter-spacing:.08em!important}
.nxdash52-num{font-size:36px!important;margin:9px 0 5px!important}
.nxdash52-help{font-size:11px!important;line-height:1.5}
.nxdash52-link{width:32px!important;height:32px!important;right:17px!important;top:17px!important}
.nxdash52-rail{gap:13px!important}
.nxdash52-railitem{padding:16px!important;border:1px solid var(--nx3-border)!important;border-radius:15px;background:rgba(255,255,255,.7);min-width:0}
.nxdash52-railicon{flex-shrink:0}
.nxdash52-railtxt{line-height:1.4}
.nxdash52-analytics{gap:24px!important;grid-template-columns:minmax(300px,.85fr) minmax(0,1.6fr)!important}
.nxdash52-sectionhead{align-items:flex-start!important}
.nxdash52-sectionhead h2{font-size:16px!important;line-height:1.35!important}
.nxdash52-ranking{min-width:0}
.nxdash52-visuals{min-width:0}
.nxdash52-charttop{gap:10px}
.nxdash52-charttop h3{font-size:14px!important;line-height:1.4}
.nxdash52-charttop span{line-height:1.35;text-align:right}
.nxdash52-rankrow{min-width:0}
.nxdash52-score{font-variant-numeric:tabular-nums}
html.dark-mode.nx3-layout .nxdash52-livebar,html.dark-mode.nx3-layout .nxdash52-railitem{background:#243347!important;border-color:#394e65!important}
html.dark-mode.nx3-layout .nx3-header #userDropdown{border-color:#43566c}
@media(max-width:1360px){
 .nx3-header-row{flex-wrap:wrap;justify-content:space-between;min-height:68px;gap:10px}
 .nx3-menu-button{display:inline-flex;order:2}
 .nx3-tools{order:1;margin-left:auto}
 .nx3-brand{order:0}
 .nx3-nav{display:none;order:3;flex:0 0 100%;align-self:auto;flex-direction:column;align-items:stretch;gap:2px;max-height:calc(100vh - 92px);overflow-y:auto;border-top:1px solid var(--nx3-border);padding:10px 0 14px}
 .nx3-header.nx3-open .nx3-nav{display:flex}
 .nx3-nav-link,.nx3-nav-group>summary{justify-content:flex-start;padding:12px 15px;width:100%;font-size:13px}
 .nx3-nav-group{width:100%}
 .nx3-dropdown{position:static;width:100%;max-width:none;max-height:none;box-shadow:none;margin:0 0 4px;border-radius:11px}
 .nxdash52-analytics{grid-template-columns:minmax(260px,.9fr) minmax(0,1.5fr)!important}
}
@media(max-width:1020px){.nxdash52-analytics{grid-template-columns:1fr!important}.nxdash52-visuals{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto!important;gap:17px!important}.nxdash52-chartzone{min-height:240px}}
@media(max-width:760px){
 :root{--nx-shell-gutter:14px}
 html.nx3-layout .main > main.content{padding:18px var(--nx-shell-gutter) 96px!important}
 .nxdash52{gap:14px!important}
 .nxdash52-hero{padding:24px 20px 70px!important;min-height:190px}
 .nxdash52-hero p{padding-right:0!important;font-size:12px!important}
 .nxdash52-live{left:20px;right:auto;bottom:18px}
 .nxdash52-livebar{grid-template-columns:1fr!important}
 .nxdash52-liveitem{min-height:110px!important;padding:15px 19px!important}
 .nxdash52-liveitem+.nxdash52-liveitem{border-left:0!important;border-top:1px solid var(--nx3-border)}
 .nxdash52-rail{grid-template-columns:1fr!important}
 .nxdash52-visuals{grid-template-columns:1fr!important}
 .nxdash52-chartzone{min-height:245px}
 .nxdash52-analytics{gap:16px!important}
}
@media(max-width:640px){.nx3-header-row{min-height:63px}.nx3-header #userDropdown{border:0!important;padding:3px!important}.nx3-header .nx3-profile-text{display:none!important}.nx3-brand small{display:none!important}.nx3-tools{gap:4px}.nx3-lang button{min-width:28px}.nx3-bottom-nav a{min-width:0}}
@media(prefers-reduced-motion:reduce){.nxdash52-hero,.nx3-nav-link,.nx3-drop-link{transition:none!important}}


/* R7.15 precision: one coherent page grid for staff and student pages. */
:root { --nx-page-max: 1800px; --nx-page-gutter: clamp(18px, 1.8vw, 34px); }
html.nx3-layout, html.nx3-layout body { width:100%; min-width:0; margin:0; }
html.nx3-layout body > .wrapper, html.nx3-layout .wrapper { width:100%!important; max-width:100%!important; margin:0!important; padding:0!important; }
html.nx3-layout .wrapper > .main {
  display:block!important; flex:0 0 100%!important; width:100%!important;
  max-width:none!important; min-width:0!important; margin:0!important;
}
html.nx3-layout .main > main.content {
  display:block!important; flex:none!important; width:100%!important;
  max-width:var(--nx-page-max)!important; min-width:0!important;
  margin-inline:auto!important; padding:24px var(--nx-page-gutter) 48px!important;
  box-sizing:border-box!important;
}
html.nx3-layout .main > main.content > .container-fluid {
  display:block; width:100%!important; max-width:none!important; min-width:0!important;
  margin:0!important; padding:0!important; box-sizing:border-box!important;
}
html.nx3-layout .nx3-header {
  width:100%!important; max-width:none!important; padding-inline:var(--nx-page-gutter)!important;
}
html.nx3-layout .nx3-header-row {
  width:100%!important; max-width:calc(var(--nx-page-max) - 2 * var(--nx-page-gutter))!important;
  margin-inline:auto!important; min-width:0!important;
}
/* Header branding: two separate typography rows instead of an overlapping small element. */
.nx3-brand { display:inline-flex; flex-shrink:0; align-items:center; gap:10px; min-width:0; line-height:normal!important; letter-spacing:normal!important; }
.nx3-brand-wordmark { display:flex; flex-direction:column; justify-content:center; gap:3px; min-width:0; white-space:nowrap; }
.nx3-brand-name { display:block; font-size:20px; font-weight:900; line-height:1!important; letter-spacing:-.055em!important; color:inherit; }
.nx3-brand-tagline { display:block!important; font-size:8.5px!important; font-weight:750!important; line-height:1.15!important; margin:0!important; letter-spacing:.13em!important; color:#7487a3; text-transform:uppercase; }
.nx3-header .nx3-brand-icon { flex-shrink:0; }
/* Three summary cells, three KPI cells, same horizontal grid throughout dashboard. */
.nxdash52, .nxdash52-hero, .nxdash52-livebar, .nxdash52-rail, .nxdash52-analytics { width:100%; min-width:0; box-sizing:border-box; }
.nxdash52-livebar, .nxdash52-rail { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
.nxdash52-analytics { grid-template-columns:minmax(0,1fr) minmax(0,1.85fr)!important; }
.nxdash52-hero p { max-width:680px; }
@media(max-width:1280px){
  .nx3-brand-name{font-size:18px}
  .nx3-brand-tagline{font-size:8px!important}
}
@media(max-width:1020px){
  .nxdash52-analytics { grid-template-columns:1fr!important; }
  .nxdash52-livebar, .nxdash52-rail { grid-template-columns:repeat(3,minmax(0,1fr))!important; }
}
@media(max-width:780px){
  html.nx3-layout .main > main.content {padding:18px var(--nx-page-gutter) 94px!important}
  .nxdash52-livebar, .nxdash52-rail { grid-template-columns:1fr!important; }
  .nxdash52-hero p { padding-right:0!important; }
}
@media(max-width:430px){
  .nx3-brand-name {font-size:17px}
  .nx3-brand-tagline {font-size:7.3px!important;letter-spacing:.10em!important}
  .nx3-brand-wordmark {gap:2px}
}


/* R7.16 — remove the split geometry and align all major columns with a single layout contract.
   Uses independent header/content rails, no inherited box padding/max-width arithmetic. */
:root {
 --nx16-rail-width:1760px;
 --nx16-gutter:clamp(16px,2vw,34px);
 --nx16-col-gap:14px;
}
html.nx3-layout body,html.nx3-layout .wrapper,html.nx3-layout .wrapper>.main { width:100%!important;max-width:none!important;min-width:0!important; }
html.nx3-layout .wrapper>.main { display:block!important;flex:none!important; margin:0!important; padding:0!important; }
html.nx3-layout .main>.nx3-header { width:100%!important;max-width:none!important; padding:0!important;margin:0!important; }
html.nx3-layout .nx3-header>.nx3-header-row,
html.nx3-layout .wrapper>.main>main.content {
 width:min(var(--nx16-rail-width),calc(100% - 2 * var(--nx16-gutter)))!important;
 max-width:none!important;
 box-sizing:border-box!important;
 margin-left:auto!important;
 margin-right:auto!important;
 min-width:0!important;
}
html.nx3-layout .wrapper>.main>main.content {
 display:block!important;
 padding:24px 0 48px!important;
 flex:none!important;
}
html.nx3-layout .wrapper>.main>main.content>.container-fluid {
 width:100%!important;max-width:none!important;min-width:0!important;
 margin:0!important;padding:0!important;box-sizing:border-box!important;
}
html.nx3-layout .nx3-header>.nx3-header-row {padding:0!important;min-height:72px;}
html.nx3-layout .nxdash52 {
 width:100%!important;max-width:100%!important;
 display:flex!important;flex-direction:column!important;align-items:stretch!important;
 gap:18px!important;min-width:0!important;
}
html.nx3-layout .nxdash52>section {width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;}
/* Exactly three balanced columns, and the analytic left column matches KPI column one. */
html.nx3-layout .nxdash52-rail {grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:var(--nx16-col-gap)!important;}
html.nx3-layout .nxdash52-analytics {
 display:grid!important;
 grid-template-columns:repeat(3,minmax(0,1fr))!important;
 gap:var(--nx16-col-gap)!important;
 align-items:start!important;
}
html.nx3-layout .nxdash52-ranking {grid-column:span 1;min-width:0;}
html.nx3-layout .nxdash52-visuals {
 display:flex!important;flex-direction:column!important;gap:20px!important;
 grid-column:span 2; min-width:0!important;
 grid-template-rows:none!important;
}
html.nx3-layout .nxdash52-chartzone {flex:0 0 auto;min-height:0!important;padding:0 0 18px!important;}
html.nx3-layout .nxdash52-chartcanvas {height:220px!important;}
html.nx3-layout .nxdash52-chartcanvas.small {height:195px!important;}
html.nx3-layout .nxdash52-rankname {min-width:0;}
/* Avoid clipping chart labels at narrower browser zoom/viewport values. */
html.nx3-layout .nxdash52-charttop {gap:12px;flex-wrap:wrap;}
html.nx3-layout .nx3-brand-wordmark {gap:3px!important;}
html.nx3-layout .nx3-brand-name {line-height:1.05!important;}
html.nx3-layout .nx3-brand-tagline {line-height:1.2!important;margin:0!important;}
@media(max-width:1100px) {
 html.nx3-layout .nxdash52-analytics {grid-template-columns:1fr!important;gap:22px!important;}
 html.nx3-layout .nxdash52-ranking,html.nx3-layout .nxdash52-visuals {grid-column:auto!important;}
 html.nx3-layout .nxdash52-visuals {display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important;}
}
@media(max-width:760px) {
 html.nx3-layout .wrapper>.main>main.content {padding:16px 0 96px!important;}
 html.nx3-layout .nxdash52-livebar,html.nx3-layout .nxdash52-rail {grid-template-columns:1fr!important;}
 html.nx3-layout .nxdash52-visuals {display:flex!important;flex-direction:column!important;}
 html.nx3-layout .nxdash52-chartcanvas,html.nx3-layout .nxdash52-chartcanvas.small {height:225px!important;}
}