/* Shared tablet layout: iPad 10th generation (820 × 1180 / 1180 × 820).
   Keep the selected colours/widgets; adapt the chrome and available space. */
@media (min-width:641px) and (max-width:1599px) {
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .shell {
    grid-template-columns:196px minmax(0,1fr)!important;
    grid-template-rows:minmax(0,1fr)!important;
    width:calc(100% - 16px)!important;max-width:none!important;
    height:calc(var(--cb-viewport-height,100dvh) - 16px)!important;min-height:0!important;
    margin:8px!important;padding:6px!important;gap:8px!important;
  }
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side {
    display:flex!important;flex-direction:column!important;align-items:stretch!important;
    position:relative!important;inset:auto!important;width:196px!important;
    height:100%!important;min-width:0!important;min-height:0!important;
    padding:16px 12px!important;gap:0!important;overflow-x:hidden!important;
    overflow-y:auto!important;scrollbar-width:none;border-radius:16px!important;
    -webkit-overflow-scrolling:touch;
  }
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side #menuMain {display:block!important;flex:none}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .ng {display:grid!important;flex:none;position:static}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .ngb {display:grid!important;position:static!important;max-height:0;min-width:0!important;padding:0 0 0 6px!important;overflow:hidden;background:none!important;box-shadow:none!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .ng.open>.ngb {max-height:1800px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .ngsub>.ngb {max-height:none!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .ngh {display:flex!important;align-items:center;gap:8px;min-height:44px;height:auto;width:100%;padding:8px!important;white-space:normal}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .ngh>.i {display:block!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .ngsub>.ngh {display:none!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side :is(.brand b,.sigw) {display:block!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .brand {display:flex!important;align-items:center;gap:7px;padding:0 2px 10px!important;margin:0!important;flex:none}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .brand b {font-size:13px;white-space:nowrap}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .brand .logo {width:28px;height:28px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .sec {display:flex!important;align-items:center;justify-content:space-between;margin:12px 8px 6px;min-height:30px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .sep {display:block!important;margin:8px 4px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .nav {
    display:flex!important;flex:0 0 auto!important;flex-direction:row!important;
    align-items:center!important;justify-content:flex-start!important;gap:10px!important;
    width:100%!important;min-width:0!important;min-height:44px!important;height:auto!important;
    padding:8px!important;margin:0!important;border-radius:10px!important;
  }
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .nav .i {display:block!important;width:18px!important;height:18px!important;flex:none}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .nav span {display:block!important;font-size:13px!important;line-height:1.3!important;min-width:0;white-space:normal!important;text-align:left}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .nav::after {display:none!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .nav .bdg:not([hidden]) {display:block!important;flex:none}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .nrow {display:flex!important;flex-direction:row!important;justify-content:space-between;gap:4px;padding:0;flex:none}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .nrow .nav {width:auto!important;flex:1 1 0!important;justify-content:center!important;padding:8px 2px!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .nrow .nav span {display:none!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .sidetools {display:flex!important;align-items:center;justify-content:space-between;max-width:100%;min-height:44px;flex:none;margin:4px 0!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .side-ai {display:flex!important;align-items:center;justify-content:center;flex:1 0 110px;width:100%;margin:0!important;padding:16px 0!important;order:0}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .sup {display:flex!important;flex:none!important;width:100%!important;max-width:100%;min-height:50px;margin:8px 0 0!important;padding:6px!important;justify-content:flex-start!important;gap:8px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .side .sup-t {display:grid!important;gap:2px;min-width:0;text-align:left}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .col {min-width:0;min-height:0;height:100%;gap:8px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body header.top {
    display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;
    align-items:center!important;gap:6px!important;padding:8px 10px!important;
    min-width:0!important;min-height:60px!important;height:auto!important;
    width:100%!important;position:relative!important;inset:auto!important;
  }
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body header.top .gsearch {
    flex:1 1 150px!important;min-width:120px!important;max-width:none!important;
    width:auto!important;height:44px!important;order:0!important;
  }
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body header.top :is(.rb,.pill:not([hidden])) {min-height:44px!important;flex-shrink:0}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body header.top .rb {width:44px!important;height:44px!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body header.top :is(.sp,.kbd) {display:none!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body header.top .topmonth {max-width:100%;flex-wrap:wrap;zoom:1!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .content {padding:14px!important;min-width:0;min-height:0;overflow-x:hidden;overflow-y:auto}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .view {min-width:0;max-width:100%;overflow-wrap:break-word}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .cb-macos-dock {display:none!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body #view-dash.cb-design-macos {padding-bottom:0!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body :is(.head,.head .actions,.filters,.brow) {flex-wrap:wrap;min-width:0;max-width:100%}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .head h1 {font-size:28px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body :is(.kpis,.stats,.asum.c4) {grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body :is(.dgrid,.d2,.rgrid,.sgrid,.pgrid,.pcols,.abody,.cgrid,.egrid,.dgrid2,.aiw) {min-width:0}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body :is(.card,.kpi,.stat,.panel,.field) {min-width:0;max-width:100%}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body :is(.tw,.bw-table) {max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .filters > * {max-width:100%;min-width:0}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body :is(input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),select,textarea) {font-size:16px;max-width:100%}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body :is(.btn,.mini,.chip,.tab,.pg) {min-height:44px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body :is(.btn,.mini) {height:auto;white-space:normal}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body dialog {max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px)}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body dialog .dlg {max-height:calc(100dvh - 32px);overflow:auto}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-grid {gap:14px;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-card {padding:16px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-metrics {gap:12px;grid-template-columns:repeat(3,minmax(0,1fr))}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-metrics>.mac2-card {padding:18px 14px;gap:12px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-metrics strong {font-size:24px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-card-head {flex-wrap:wrap;gap:8px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-period>button {width:44px;height:44px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body :is(.mac2-link,.mac2-balance-footer>button) {min-width:44px;min-height:44px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-row {min-height:58px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview):not(.gapp):not(.mapp) body .mac2-heading {margin-top:18px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview).cb-ubuntu-home body .mac2-card:not(.mac2-balance)>.mac2-card-head {margin:-16px -16px 16px;padding:12px 16px}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview).nomenu:not(.gapp):not(.mapp) body .shell {grid-template-columns:minmax(0,1fr)!important}
  html:root:where([data-cb-tablet],[data-cb-compact-window],.cb-tablet-preview).nomenu body .side {display:none!important}
}
@media (min-width:641px) and (max-width:900px) {
  html:root:not(.gapp):not(.mapp) body :is(.d2,.rgrid,.sgrid,.pgrid,.pcols,.abody,.cgrid,.egrid,.dgrid2,.aiw) {grid-template-columns:minmax(0,1fr)!important}
  html:root:not(.gapp):not(.mapp) body .d2>.card {grid-column:auto!important;grid-row:auto!important}
  html:root:not(.gapp):not(.mapp) body .mac2-grid {grid-template-columns:minmax(0,1fr)}
  html:root:not(.gapp):not(.mapp) body .mac2-balance {min-height:200px;padding:24px}
  html:root:not(.gapp):not(.mapp) body .mac2-heading h1 {font-size:28px}
  html:root:not(.gapp):not(.mapp) body .mac2-metrics strong {font-size:22px}
  html:root:not(.gapp):not(.mapp) body .mac2-metrics small {font-size:12px;max-width:none;padding-top:28px}
  html:root:not(.gapp):not(.mapp) body .mac2-metric-icon {top:12px;left:14px;right:auto}
}

/* Card density follows the page's available width, including sidebar changes
   and split-screen windows, rather than a device-name or screen resolution. */
html:root:not(.gapp):not(.mapp) body .content {
  container:cbpage / inline-size;
  --cb-card-padding:clamp(12px,2cqi,22px);
  --cb-card-gap:clamp(10px,1.5cqi,18px);
}
html:root:not(.gapp):not(.mapp) body .view :is(.card,.panel,.kpi,.stat,.bw-card,.bw-stat,.pt-card,.as-card,.loan-card,.bill-card,.doc-card,.emcard) {
  min-width:0;max-width:100%;height:auto;
  padding:var(--cb-card-padding,16px)!important;
}
html:root:not(.gapp):not(.mapp) body .view :is(.kpis,.stats,.asum,.dsum,.bw-stats,.cards) {
  display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))!important;
  gap:var(--cb-card-gap,12px)!important;
}
html:root:not(.gapp):not(.mapp) body #view-dash .topg {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))!important;
  grid-template-rows:auto!important;gap:var(--cb-card-gap,12px)!important;
}
html:root:not(.gapp):not(.mapp) body .mac2-grid {gap:var(--cb-card-gap,14px)}
html:root:not(.gapp):not(.mapp) body .mac2-card,
html:root:not(.gapp):not(.mapp) body .mac2-metrics>.mac2-card {
  padding:var(--cb-card-padding,16px)!important;min-width:0;height:auto;
}
html:root:not(.gapp):not(.mapp) body .mac2-metrics {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr))!important;
  gap:var(--cb-card-gap,12px)!important;
}
html:root:not(.gapp):not(.mapp) body .mac2-metrics>.mac2-card:last-child {grid-column:auto!important}
html:root:not(.gapp):not(.mapp) body .mac2-balance {
  padding:clamp(18px,3cqi,30px)!important;min-height:clamp(170px,24cqi,230px);
}
html:root:not(.gapp):not(.mapp) body .mac2-metrics strong {font-size:clamp(21px,3cqi,29px)!important;overflow-wrap:anywhere}
html:root:not(.gapp):not(.mapp) body .mac2-card-head {flex-wrap:wrap}
html:root.cb-ubuntu-home:not(.gapp):not(.mapp) body .mac2-card:not(.mac2-balance)>.mac2-card-head {
  margin:calc(-1 * var(--cb-card-padding,16px)) calc(-1 * var(--cb-card-padding,16px)) var(--cb-card-padding,16px)!important;
  padding:12px var(--cb-card-padding,16px)!important;
}
@container cbpage (max-width:759px) {
  html:root:not(.gapp):not(.mapp) body .mac2-grid {grid-template-columns:minmax(0,1fr)!important}
  html:root:not(.gapp):not(.mapp) body .view :is(.rgrid,.sgrid,.pgrid,.pcols,.abody,.cgrid,.egrid,.dgrid2,.aiw) {grid-template-columns:minmax(0,1fr)!important}
  html:root:not(.gapp):not(.mapp) body #view-dash .d2 {grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto!important}
  html:root:not(.gapp):not(.mapp) body #view-dash .d2>.card {grid-column:auto!important;grid-row:auto!important}
  html:root:not(.gapp):not(.mapp) body #view-dash .dgrid {grid-template-columns:minmax(0,1fr)!important;grid-template-rows:auto!important;grid-template-areas:"an" "rem" "tr" "pr" "acc" "bud"!important}
  html:root:not(.gapp):not(.mapp) body .mac2-metrics small {max-width:none;padding-top:28px}
  html:root:not(.gapp):not(.mapp) body .mac2-metric-icon {top:12px;left:var(--cb-card-padding,16px);right:auto}
}
@container cbpage (min-width:760px) {
  html:root:not(.gapp):not(.mapp) body .mac2-grid {grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)!important}
}

/* Original overview: six compact tiles and one two-row loan tile form a
   complete rectangle, instead of auto-fitting five columns with empty cells. */
html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg {
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  grid-template-rows:none!important;grid-auto-rows:132px;grid-auto-flow:row dense;
  gap:12px!important;align-items:stretch;margin-bottom:12px;
}
html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg :is(.kpis,.difrow) {display:contents!important}
html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg :is(.kpi,.difrow>*) {
  margin:0!important;min-width:0;min-height:0!important;height:100%!important;
  padding:14px!important;box-sizing:border-box;align-self:stretch;
}
html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg .kpis>.kpi.lnt {
  grid-column:2!important;grid-row:2 / span 2!important;
  height:100%!important;justify-content:space-between;gap:4px;
}
html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg .lnt .srg {flex:1;min-height:0;max-height:148px}
html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg .kpi>b {max-width:100%;white-space:normal;overflow-wrap:anywhere}
@container cbpage (min-width:960px) {
  html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg {grid-template-columns:repeat(4,minmax(0,1fr))!important}
  html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg .kpis>.kpi.lnt {grid-column:4!important;grid-row:1 / span 2!important}
  html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg:not(:has(.lnt)) {grid-template-columns:repeat(3,minmax(0,1fr))!important}
}
@container cbpage (max-width:599px) {
  html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg {grid-template-columns:minmax(0,1fr)!important;grid-auto-rows:auto}
  html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg :is(.kpi,.difrow>*) {min-height:132px!important;height:auto!important}
  html:root:not(.gapp):not(.mapp) body #view-dash:is(.cb-design-original,.cb-design-premium,.cb-design-advanced) .topg .kpis>.kpi.lnt {grid-column:auto!important;grid-row:auto!important;min-height:264px!important}
}
/* Keep the full desktop menu readable; only Support uses the remaining space. */
@media(min-width:1200px) {
  html:root:not(.cb-macos-home):not(.rail):not(.nomenu):not(.gbar):not(.gapp):not(.mapp):not([data-skin=coral]):not([data-skin=glass]):not([data-skin=kova]) body .shell {grid-template-columns:224px minmax(0,1fr)}
  html:root:not(.cb-macos-home):not(.rail):not(.gbar):not([data-skin=coral]):not([data-skin=glass]):not([data-skin=kova]) body .side .nav {height:auto;min-height:42px;padding:9px 10px;gap:10px}
  html:root:not(.cb-macos-home):not(.rail):not(.gbar):not([data-skin=coral]):not([data-skin=glass]):not([data-skin=kova]) body .side .nav span {min-width:0;white-space:normal;overflow:visible;text-overflow:clip;line-height:1.3}
  html:root:not(.cb-macos-home):not(.rail):not(.gbar):not([data-skin=coral]):not([data-skin=glass]):not([data-skin=kova]) body .side-ai {margin-top:18px!important;padding-top:0}
  html:root:not(.cb-macos-home):not(.rail):not(.gbar):not([data-skin=coral]):not([data-skin=glass]):not([data-skin=kova]) body .side .side-ai~.sup {margin-top:auto!important;padding-top:6px;flex-shrink:0}
}