/* Browser-local display size. Default intentionally inherits the incumbent site. */
.display-density { min-width: 0; margin: 0; padding: 0; border: 0; }
.display-density legend { padding: 0; font: 700 1rem var(--sans); color: var(--text); }
.display-density-options { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .55rem; }
.display-density-options label { position: relative; display: inline-flex; cursor: pointer; }
.display-density-options input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.display-density-options span { display: inline-flex; align-items: center; min-height: 44px; padding: .5rem .85rem; border: 1.5px solid var(--line); border-radius: 9px; color: var(--text); font: 650 .9rem/1.2 var(--sans); }
.display-density-options input:checked + span { border-color: var(--ink); color: var(--ink); background: color-mix(in srgb, var(--ink) 10%, var(--panel)); }
.display-density-options input:focus-visible + span { outline: 3px solid var(--ink); outline-offset: 2px; }
.display-density > p { margin: .65rem 0 0; color: var(--muted); font-size: .82rem; line-height: 1.4; }
.admin-display-settings { margin-top: .7rem; }
.admin-display-settings > summary { display: flex; align-items: center; min-height: 44px; color: var(--ink); font-weight: 700; cursor: pointer; }
.admin-display-settings > summary:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.admin-display-settings .display-density { margin-top: .6rem; }
.admin-display-settings .display-density-options { display: grid; grid-template-columns: 1fr; gap: .3rem; }
.admin-display-settings .display-density-options span { width: 100%; }

/* Compact: denser information rhythm without removing content or controls. */
html[data-density="compact"] { font-size: 15px; }
html[data-density="compact"] body { font-size: 15px; line-height: 1.48; }
html[data-density="compact"] .small { font-size: 12px; }
html[data-density="compact"] .admin-nav-label { font-size: 11px; }
html[data-density="compact"] .section { padding-block: clamp(1rem, 2.2vw, 1.65rem); }
html[data-density="compact"] body.home .section { padding-block: clamp(.7rem, 1.6vw, 1.1rem); }
html[data-density="compact"] h2 { margin-block: 2.1rem 1rem; }
html[data-density="compact"] .section-head { margin-bottom: 1rem; }
html[data-density="compact"] .section-sub { margin-bottom: 1rem; }
html[data-density="compact"] .cards, html[data-density="compact"] .cabinet-grid { gap: .7rem; }
html[data-density="compact"] .panel, html[data-density="compact"] .card,
html[data-density="compact"] .calc, html[data-density="compact"] .auth-choice { padding: .85rem; }
html[data-density="compact"] .card-photo { margin: -.85rem -.85rem .7rem; }
html[data-density="compact"] .counter { padding: .65rem .8rem; }
html[data-density="compact"] .field { margin-bottom: .55rem; }
html[data-density="compact"] .field input, html[data-density="compact"] .field select,
html[data-density="compact"] .field textarea { padding: .5rem .7rem; min-height: 44px; }
html[data-density="compact"] .table th, html[data-density="compact"] .table td,
html[data-density="compact"] .admin-table th, html[data-density="compact"] .admin-table td { padding: .35rem .45rem; }
html[data-density="compact"] .admin-sidebar-head { padding: .65rem .7rem; }
html[data-density="compact"] .admin-nav-links a { padding-block: .32rem; min-height: 38px; }
html[data-density="compact"] .verification-summary { padding: .55rem .75rem; min-height: 44px; }
html[data-density="compact"] .verification-body { padding: .75rem; }
html[data-density="compact"] .verification-queue { gap: .45rem; }
html[data-density="compact"] .sub-row { padding: .55rem .7rem; margin-bottom: .45rem; }
html[data-density="compact"] .cabinet-head { margin-bottom: .9rem; }
html[data-density="compact"] .site-stats-plot { height: 370px; }
html[data-density="compact"] .chart-js-canvas--pie { width: 136px !important; height: 136px !important; }
html[data-density="compact"] .finance-grouped-chart svg { height: 115px !important; }

/* Large: a comfortably readable alternate size, including controls. */
html[data-density="large"] { font-size: 18px; }
html[data-density="large"] body { font-size: 19px; line-height: 1.65; }
html[data-density="large"] .small,
html[data-density="large"] .admin-nav-label,
html[data-density="large"] .admin-sidebar-account,
html[data-density="large"] .admin-top-item > a,
html[data-density="large"] .admin-nav-planned small,
html[data-density="large"] .table th,
html[data-density="large"] .admin-table th,
html[data-density="large"] .verification-email,
html[data-density="large"] .verification-summary-side,
html[data-density="large"] .verification-badge { font-size: 15px; }
@media (min-width: 1000px) and (max-width: 1199.98px) {
  html[data-density="large"] .admin-chrome .header-row { flex-wrap: wrap; }
  html[data-density="large"] .admin-chrome-brand { flex: 1 1 auto; }
  html[data-density="large"] .admin-chrome-exit { margin-left: 0; }
  html[data-density="large"] .admin-top-nav { flex: 1 1 100%; order: 3; flex-wrap: wrap; }
  html[data-density="large"] .admin-top-drop { display: none; }
  html[data-density="large"] .admin-top-item > a { border-radius: 8px; padding: .4rem .55rem; }
}
html[data-density="large"] .section { padding-block: clamp(2.3rem, 5.5vw, 4rem); }
html[data-density="large"] .panel, html[data-density="large"] .card,
html[data-density="large"] .calc, html[data-density="large"] .auth-choice { padding: 1.45rem; }
html[data-density="large"] .card-photo { margin: -1.45rem -1.45rem 1rem; }
html[data-density="large"] .counter { padding: 1.15rem 1.3rem; }
html[data-density="large"] .field input, html[data-density="large"] .field select,
html[data-density="large"] .field textarea { min-height: 48px; }
html[data-density="large"] .table th, html[data-density="large"] .table td,
html[data-density="large"] .admin-table th, html[data-density="large"] .admin-table td { padding: .7rem .75rem; }
html[data-density="large"] .verification-summary { min-height: 56px; padding: 1rem 1.1rem; }
html[data-density="large"] .admin-nav-links a { min-height: 44px; }
html[data-density="large"] .display-density-options span { min-height: 48px; }
html[data-density="large"] .site-stats-plot { height: 530px; }
html[data-density="large"] .chart-js-canvas--pie { width: 192px !important; height: 192px !important; }
html[data-density="large"] .site-series-toggle,
html[data-density="large"] .site-stats-scale-note,
html[data-density="large"] .site-stats-axis-choice,
html[data-density="large"] .site-marker__tip { font-size: 15px; }
html[data-density="large"] .admin-chart-tooltip { font-size: 15px !important; }
html[data-density="large"] .admin-chart-tooltip div[style*="font-size"] { font-size: 14px !important; }
html[data-density="large"] .finance-grouped-chart svg { height: 165px !important; }
html[data-density="large"] .finance-grouped-chart .finance-grouped-label { font-size: 14px !important; }

@media (max-width: 699px), (pointer: coarse) {
  /* Compact mode should never turn a phone into a tiny desktop UI. */
  html[data-density="compact"] { font-size: 16px; }
  html[data-density="compact"] body { font-size: 16px; }
  html[data-density="compact"] .btn, html[data-density="compact"] .admin-nav-links a,
  html[data-density="compact"] .verification-summary { min-height: 44px; }
  html[data-density="compact"] .site-stats-plot { height: 330px; }
  html[data-density="large"] .site-stats-plot { height: 450px; }
}