/* Text-size button in the top bar (next to the theme switch) */
#densityToggle[aria-pressed="true"] { background: var(--bg-card-hover, #222); border-color: var(--text-secondary, #a3a3a3); color: var(--text, #e4e4e7); }   /* grey "on" state (owner 2026-10-25) */
#densityToast { position: fixed; left: 50%; bottom: 1.5rem; transform: translate(-50%, 1rem); z-index: 3000;
    padding: 0.5rem 0.875rem; border-radius: 0.5rem; background: var(--text); color: var(--bg);
    font: 600 0.8125rem var(--font, sans-serif); opacity: 0; pointer-events: none; transition: opacity 0.15s, transform 0.15s; }
#densityToast.show { opacity: 1; transform: translate(-50%, 0); }

/* ---- Compact: computers with a mouse/trackpad. Same layout, smaller and lighter. ---- */

/* Filter panel */
html[data-density="compact"] .filter-sidebar { width: 14.5rem; padding: 0.5rem 0.625rem 0.875rem; }
html[data-density="compact"] .fp { gap: 0.75rem; }
html[data-density="compact"] .fp-head { min-height: 2rem; }
html[data-density="compact"] .fp-title { font-size: 0.9375rem; }
html[data-density="compact"] .fp-reset { min-height: 1.75rem; font-size: 0.75rem; padding: 0 0.375rem; }
html[data-density="compact"] .fp-group { gap: 0.3125rem; }
html[data-density="compact"] .fp-label { font-size: 0.75rem; }
html[data-density="compact"] .fp-value { font-size: 0.8125rem; }

html[data-density="compact"] .seg-btn { min-height: 1.875rem; font-size: 0.75rem; gap: 0.25rem; border-radius: 0.375rem; }
html[data-density="compact"] .seg-btn svg { width: 0.875rem; height: 0.875rem; }
html[data-density="compact"] .chip-grid { gap: 0.3125rem; }
html[data-density="compact"] .chip { min-height: 1.875rem; font-size: 0.75rem; font-weight: 500; border-radius: 0.4375rem; }

html[data-density="compact"] .fp-range { height: 1.5rem !important; }
html[data-density="compact"] .fp-range::-webkit-slider-thumb { width: 1rem !important; height: 1rem !important;
    margin-top: -0.3125rem; border-width: 2px; }
html[data-density="compact"] .fp-range::-moz-range-thumb { width: 0.875rem; height: 0.875rem; border-width: 2px; }

html[data-density="compact"] .ms-btn { min-height: 2rem; font-size: 0.8125rem; font-weight: 500; gap: 0.4375rem;
    padding: 0 0.5rem 0 0.625rem; border-radius: 0.4375rem; }
html[data-density="compact"] .ms-btn > svg { width: 0.9375rem; height: 0.9375rem; }
html[data-density="compact"] .ms-btn[aria-expanded="true"] { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
html[data-density="compact"] .ms-count { min-width: 1.125rem; height: 1.125rem; font-size: 0.6875rem; }
html[data-density="compact"] .ms-pop { border-radius: 0 0 0.4375rem 0.4375rem; }
html[data-density="compact"] .ms-hint { font-size: 0.75rem; }
html[data-density="compact"] .ms-clear { min-height: 1.75rem; font-size: 0.75rem; }
html[data-density="compact"] .ms-opt { min-height: 1.875rem; font-size: 0.8125rem; gap: 0.4375rem; }
html[data-density="compact"] .ms-opt > svg { width: 0.9375rem; height: 0.9375rem; }
html[data-density="compact"] .ms-box { width: 1rem; height: 1rem; border-radius: 0.25rem; border-width: 1.5px; }
html[data-density="compact"] .ms-box svg { width: 0.6875rem; height: 0.6875rem; }

html[data-density="compact"] .switch-row { min-height: 2rem; font-size: 0.8125rem; font-weight: 500; padding: 0 0.625rem;
    border-radius: 0.4375rem; }
html[data-density="compact"] .switch { width: 2rem; height: 1.125rem; }
html[data-density="compact"] .switch::after { top: 0.15625rem; left: 0.15625rem; width: 0.8125rem; height: 0.8125rem; }
html[data-density="compact"] .switch-row.active .switch::after { transform: translateX(0.875rem); }

/* Station panel */
html[data-density="compact"] .nb-box, html[data-density="compact"] .checkin-box { padding: 0.625rem 0.75rem; }
html[data-density="compact"] .nb-title { font-size: 0.8125rem; margin-bottom: 0.375rem; }
html[data-density="compact"] .nb-title small { font-size: 0.75rem; }
html[data-density="compact"] .nb-chips { gap: 0.375rem; }
html[data-density="compact"] .nb-chip { min-height: 1.875rem; padding: 0 0.625rem; gap: 0.3125rem; font-size: 0.8125rem; font-weight: 500; }
html[data-density="compact"] .nb-chip svg { width: 0.9375rem; height: 0.9375rem; }
html[data-density="compact"] .nb-list li { font-size: 0.8125rem; padding: 0.3125rem 0; }
html[data-density="compact"] .nb-ad { font-size: 0.75rem; }
html[data-density="compact"] .checkin-q { font-size: 0.8125rem; margin-bottom: 0.375rem; }
html[data-density="compact"] .checkin-btns .btn { min-height: 1.875rem; font-size: 0.8125rem; }
html[data-density="compact"] .checkin-status { font-size: 0.75rem; }