/* PCDA-ZAP visual foundation. Loaded last to cover old module-specific colors safely. */
@font-face {
  font-family: "Manrope PCDA";
  src: url("../fonts/Manrope-Variable.946beb949095.ttf") format("truetype");
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}

:root {
  color-scheme: light;
  --ui-bg: #f6f7f9;
  --ui-surface: #ffffff;
  --ui-surface-raised: #ffffff;
  --ui-surface-muted: #f0f2f5;
  --ui-surface-hover: #e9edf4;
  --ui-border: #dfe3ea;
  --ui-border-strong: #cbd2dc;
  --ui-text: #171b26;
  --ui-text-soft: #586174;
  --ui-text-muted: #7d8798;
  --ui-sidebar: #17191d;
  --ui-sidebar-hover: #262932;
  --ui-sidebar-text: #bec4d0;
  --ui-overlay: rgba(15, 18, 24, .58);
  --ui-primary: #3157d5;
  --ui-primary-hover: #2849ba;
  --ui-primary-soft: #e8edff;
  --ui-input: #ffffff;
  --ui-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 8px 22px rgba(16, 24, 40, .035);
  --jm-bg: var(--ui-bg);
  --jm-surface: var(--ui-surface);
  --jm-soft: var(--ui-surface-muted);
  --jm-muted: var(--ui-surface-muted);
  --jm-border: var(--ui-border);
  --jm-border-strong: var(--ui-border-strong);
  --jm-text: var(--ui-text);
  --jm-text-soft: var(--ui-text-soft);
  --jm-text-muted: var(--ui-text-muted);
  --jm-primary: var(--ui-primary);
  --jm-primary-dark: var(--ui-primary-hover);
  --jm-primary-soft: var(--ui-primary-soft);
  --jm-sidebar: var(--ui-sidebar);
  --jm-sidebar-soft: var(--ui-sidebar-hover);
  --jm-sidebar-text: var(--ui-sidebar-text);
  --sidebar-width: 218px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  font-family: "Manrope PCDA", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --ui-bg: #17191d;
  --ui-surface: #1e2025;
  --ui-surface-raised: #24272d;
  --ui-surface-muted: #292c33;
  --ui-surface-hover: #30343c;
  --ui-border: #353941;
  --ui-border-strong: #454a55;
  --ui-text: #f2f3f5;
  --ui-text-soft: #bdc3cd;
  --ui-text-muted: #919aa8;
  --ui-sidebar: #111316;
  --ui-sidebar-hover: #252830;
  --ui-sidebar-text: #c7ccd5;
  --ui-overlay: rgba(0, 0, 0, .7);
  --ui-primary: #91a9ff;
  --ui-primary-hover: #b1c0ff;
  --ui-primary-soft: #27325a;
  --ui-input: #202329;
  --ui-shadow: 0 1px 2px rgba(0, 0, 0, .22), 0 12px 28px rgba(0, 0, 0, .18);
  --jm-success-soft: #153a2e;
  --jm-amber-soft: #46351b;
  --jm-danger-soft: #462626;
  --jm-violet-soft: #332a50;
  --jm-cyan-soft: #183a43;
}

html { font-size: 13px; background: var(--ui-bg); }
body { background: var(--ui-bg); color: var(--ui-text); line-height: 1.48; font-weight: 440; letter-spacing: -.008em; }
h1, h2, h3 { letter-spacing: -.045em; }
h1 { font-size: clamp(1.48rem, 2vw, 1.82rem); }
h2 { font-size: 1.18rem; }
h3 { font-size: 1rem; }
.sidebar { padding: 20px 12px 16px; background: var(--ui-sidebar); }
.brand { margin: 0 7px 20px; }
.brand-mark { width: 38px; height: 38px; border-radius: 10px; }
.brand strong { font-size: .92rem; font-weight: 760; letter-spacing: -.025em; }
.brand small { font-size: .66rem; }
.nav-label { margin: 18px 10px 6px; font-size: .6rem; }
.sidebar nav a, .nav-alert-button { min-height: 36px; padding: 7px 10px !important; font-size: .76rem !important; font-weight: 570 !important; border-radius: 8px; }
.sidebar-footer strong { font-size: .72rem; }
.sidebar-footer small { font-size: .63rem; }
.topbar { min-height: 68px; padding: 12px 22px; background: color-mix(in srgb, var(--ui-surface) 94%, transparent); border-color: var(--ui-border); }
.topbar h1 { margin-bottom: 2px; font-size: 1.02rem; font-weight: 720; }
.topbar p { margin: 0; font-size: .75rem; }
.topbar .eyebrow { font-size: .59rem; }
.profile { gap: 12px; }
.profile strong { font-size: .78rem; }
.profile small, .profile > a { font-size: .7rem; }
.avatar { width: 36px; height: 36px; border-radius: 10px; }
.container { max-width: 1460px; padding: 24px clamp(18px, 3vw, 42px) 56px; }
.panel, .form-card, .auth-card, .recovery, .grid-list article, .code-panel,
.metric-overview article, .scheduler-calendar, .instance-card, .quick-panel { background: var(--ui-surface); border-color: var(--ui-border); box-shadow: var(--ui-shadow); }
input, textarea, select { min-height: 40px; padding: 8px 10px; border-color: var(--ui-border-strong); background: var(--ui-input); color: var(--ui-text); font: inherit; font-size: .84rem; }
label { margin-bottom: 6px; font-size: .79rem; }
.helptext, form ul { font-size: .73rem; }
button, .button { min-height: 38px; padding: 0 14px; border-radius: 8px; font: inherit; font-size: .77rem; font-weight: 660; }
th, td { font-size: .8rem; }
th { font-size: .66rem; }
.badge { font-size: .69rem; }
.alert { font-size: .8rem; }
.muted, .page-head p, .section-heading p, .quick-panel p { color: var(--ui-text-soft); font-size: .82rem; }
.global-service-alert { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 18px; padding: 14px 16px; border: 1px solid #e7b44f; border-radius: 12px; background: #fff7df; color: #69440b; box-shadow: var(--ui-shadow); }
.global-service-alert[hidden] { display: none; }
.global-service-alert strong { display: block; margin-bottom: 3px; color: #573706; }
.global-service-alert p { margin: 0; font-size: .78rem; }
.global-service-alert a { flex: none; color: #69440b; font-size: .76rem; font-weight: 750; }
.sidebar-footer.service-warning .online-dot { background: #f59e0b; box-shadow: 0 0 0 4px rgba(245,158,11,.18); }
.sidebar-footer.service-warning strong { color: #f5c86d; }
.health-service-ok { color: #168152; }
.health-service-danger { color: #b42318; font-weight: 700; }
:root[data-theme="dark"] .global-service-alert { border-color: #745c2f; background: #3b301d; color: #f4d49b; }
:root[data-theme="dark"] .global-service-alert strong, :root[data-theme="dark"] .global-service-alert a { color: #ffd889; }
tbody tr:hover { background: var(--ui-surface-muted); }

.theme-control { display: inline-flex; gap: 2px; padding: 3px; border: 1px solid var(--ui-border); border-radius: 9px; background: var(--ui-surface-muted); }
.theme-control button { width: 30px; min-width: 30px; min-height: 28px; padding: 0; border: 0; border-radius: 6px; background: transparent; color: var(--ui-text-soft); box-shadow: none; font-size: .8rem; }
.theme-control button:hover { transform: none; background: var(--ui-surface-hover); color: var(--ui-text); box-shadow: none; }
.theme-control button[aria-pressed="true"] { background: var(--ui-surface-raised); color: var(--ui-primary); box-shadow: 0 1px 3px rgba(0, 0, 0, .12); }
.app-navigation-toggle, .app-navigation-backdrop { display: none; }
#attendance #toggle-navigation { display: none !important; }

:root[data-theme="dark"] a { color: var(--ui-primary); }
:root[data-theme="dark"] .sidebar a { color: var(--ui-sidebar-text); }
:root[data-theme="dark"] td,
:root[data-theme="dark"] td code,
:root[data-theme="dark"] .page-head h1,
:root[data-theme="dark"] .panel h1,
:root[data-theme="dark"] .panel h2,
:root[data-theme="dark"] .panel h3,
:root[data-theme="dark"] .form-card h1,
:root[data-theme="dark"] .form-card h2,
:root[data-theme="dark"] .form-card h3 { color: var(--ui-text); }
:root[data-theme="dark"] .button.secondary,
:root[data-theme="dark"] button.secondary { background: var(--ui-surface-raised); color: var(--ui-text); border-color: var(--ui-border-strong); }
:root[data-theme="dark"] .button:not(.secondary):not(.danger),
:root[data-theme="dark"] button:not(.secondary):not(.danger):not([data-theme-value]):not(.app-navigation-toggle):not(.scheduler-view-button) { color: #10152a; }
:root[data-theme="dark"] .button.secondary:hover,
:root[data-theme="dark"] button.secondary:hover { background: var(--ui-surface-hover); color: var(--ui-primary); }
:root[data-theme="dark"] button:disabled,
:root[data-theme="dark"] .button[aria-disabled="true"] { color: var(--ui-text-muted); background: var(--ui-surface-muted); opacity: .72; }
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder { color: var(--ui-text-muted); opacity: 1; }
:root[data-theme="dark"] .topbar,
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .form-card,
:root[data-theme="dark"] .auth-card,
:root[data-theme="dark"] .recovery,
:root[data-theme="dark"] .grid-list article,
:root[data-theme="dark"] .code-panel,
:root[data-theme="dark"] .metric-overview article,
:root[data-theme="dark"] .scheduler-calendar,
:root[data-theme="dark"] .instance-card,
:root[data-theme="dark"] .quick-panel,
:root[data-theme="dark"] dialog { background: var(--ui-surface); color: var(--ui-text); border-color: var(--ui-border); }
:root[data-theme="dark"] .dashboard-hero,
:root[data-theme="dark"] .hero-status,
:root[data-theme="dark"] .cards article,
:root[data-theme="dark"] .charts article,
:root[data-theme="dark"] .filters,
:root[data-theme="dark"] .table-wrap,
:root[data-theme="dark"] .info-card,
:root[data-theme="dark"] .capacity-dashboard-summary article,
:root[data-theme="dark"] .lead-summary article,
:root[data-theme="dark"] .lead-card,
:root[data-theme="dark"] .lead-empty,
:root[data-theme="dark"] .lead-overview span,
:root[data-theme="dark"] .lead-scroll-hint,
:root[data-theme="dark"] .lead-bulk-bar,
:root[data-theme="dark"] .section-tabs,
:root[data-theme="dark"] .template-folder-nav a,
:root[data-theme="dark"] .template-empty,
:root[data-theme="dark"] .scheduler-view-switch { background: var(--ui-surface); color: var(--ui-text); border-color: var(--ui-border); }
:root[data-theme="dark"] .cards article span,
:root[data-theme="dark"] .cards article small,
:root[data-theme="dark"] .hero-status small,
:root[data-theme="dark"] .hero-status p { color: var(--ui-text-soft) !important; }
:root[data-theme="dark"] .cards article strong,
:root[data-theme="dark"] .dashboard-hero h2,
:root[data-theme="dark"] .section-heading h2 { color: var(--ui-text); }
:root[data-theme="dark"] table, :root[data-theme="dark"] th, :root[data-theme="dark"] td { border-color: var(--ui-border); }
:root[data-theme="dark"] th, :root[data-theme="dark"] .calendar-weekdays span { background: var(--ui-surface-muted); color: var(--ui-text-soft); }
:root[data-theme="dark"] .calendar-day, :root[data-theme="dark"] .calendar-day.outside-month { background: var(--ui-surface); }
:root[data-theme="dark"] .calendar-day.today { background: var(--ui-primary-soft); }
:root[data-theme="dark"] .scheduler-view-button { background: transparent; color: var(--ui-text-soft); }
:root[data-theme="dark"] .scheduler-view-button:hover { background: var(--ui-surface-hover); color: var(--ui-text); }
:root[data-theme="dark"] .scheduler-view-button.active { background: var(--ui-primary); color: #10152a; }
:root[data-theme="dark"] .inline-editor > summary, :root[data-theme="dark"] .inline-editor form { background: var(--ui-surface-raised); color: var(--ui-text); border-color: var(--ui-border); }
:root[data-theme="dark"] .send-alert-dialog::backdrop, :root[data-theme="dark"] dialog::backdrop { background: var(--ui-overlay); }

/* Atendimento needs explicit colors because its original WhatsApp-like palette predates themes. */
:root[data-theme="dark"] #attendance .at-workspace,
:root[data-theme="dark"] #attendance .at-inbox,
:root[data-theme="dark"] #attendance .at-chat-head,
:root[data-theme="dark"] #attendance .at-composer,
:root[data-theme="dark"] #attendance .at-detail,
:root[data-theme="dark"] #attendance .at-tools-panel,
:root[data-theme="dark"] #attendance .at-conversation-group,
:root[data-theme="dark"] #attendance .at-conversation-group > summary,
:root[data-theme="dark"] #quick-reply-options,
:root[data-theme="dark"] #quick-reply-options button,
:root[data-theme="dark"] .at-purchase-dialog { background: var(--ui-surface); color: var(--ui-text); border-color: var(--ui-border); }
:root[data-theme="dark"] #attendance .at-chat-head,
:root[data-theme="dark"] #attendance .at-composer { background: var(--ui-surface-muted); }
:root[data-theme="dark"] #attendance .at-messages { background-color: #1b1d21; background-image: radial-gradient(#33363c 1px, transparent 1px); }
:root[data-theme="dark"] #attendance .at-bubble { background: #2a2d33; color: var(--ui-text); }
:root[data-theme="dark"] #attendance .at-bubble.mine { background: #203b33; }
:root[data-theme="dark"] #attendance .at-chat-head button,
:root[data-theme="dark"] #attendance .at-textbox textarea,
:root[data-theme="dark"] #attendance .at-search input { background: var(--ui-input); color: var(--ui-text); border-color: var(--ui-border); }
:root[data-theme="dark"] #attendance .at-conversation,
:root[data-theme="dark"] #attendance .at-conversation[aria-pressed="true"] { color: var(--ui-text); border-color: var(--ui-border); }
:root[data-theme="dark"] #attendance .at-conversation { background: var(--ui-surface); }
:root[data-theme="dark"] #attendance .at-conversation:hover { background: var(--ui-surface-hover); }
:root[data-theme="dark"] #attendance .at-conversation[aria-pressed="true"] { background: var(--ui-primary-soft); }
:root[data-theme="dark"] #attendance .at-conversation.has-unread { background: #18372d; border-left-color: #45c28a; }
:root[data-theme="dark"] #attendance .at-conversation.has-due-reminder { background: #382a1a; }
:root[data-theme="dark"] #attendance .at-conversation.has-unread.has-due-reminder { background: linear-gradient(90deg, #382a1a 0 5px, #18372d 5px); }
:root[data-theme="dark"] #attendance .at-conversation strong,
:root[data-theme="dark"] #attendance .at-inbox-title h2,
:root[data-theme="dark"] #attendance .at-chat-head h2 { color: var(--ui-text); }
:root[data-theme="dark"] #attendance .at-snippet,
:root[data-theme="dark"] #attendance .at-last-activity,
:root[data-theme="dark"] #attendance .at-group-empty,
:root[data-theme="dark"] #attendance .at-help { color: var(--ui-text-soft); }
:root[data-theme="dark"] #attendance .at-avatar { background: var(--ui-surface-muted); color: var(--ui-text-soft); }
:root[data-theme="dark"] #attendance .at-last-client { background: #4a2d1f; color: #ffc08f; }
:root[data-theme="dark"] #attendance .at-last-agent { background: #27365f; color: #bdcaff; }
:root[data-theme="dark"] #attendance .at-last-none { background: var(--ui-surface-muted); color: var(--ui-text-soft); }
:root[data-theme="dark"] #attendance .at-conversation .at-contact-reminder { color: #f4b86d; }
:root[data-theme="dark"] #attendance .at-conversation-group > summary { background: var(--ui-surface-muted); color: var(--ui-text); border-color: var(--ui-border); }
:root[data-theme="dark"] #attendance .at-conversation-group > summary strong { background: var(--ui-surface-hover); color: var(--ui-text); }
:root[data-theme="dark"] #attendance .at-group-empty { background: var(--ui-surface); }
:root[data-theme="dark"] #attendance .at-day,
:root[data-theme="dark"] #attendance .at-reactions span,
:root[data-theme="dark"] #attendance #reply-preview,
:root[data-theme="dark"] #attendance .at-reply-quote { background: var(--ui-surface-raised); color: var(--ui-text); border-color: var(--ui-border-strong); }
:root[data-theme="dark"] #attendance .at-scheduled,
:root[data-theme="dark"] #attendance .at-reminder-panel { background: #32291c; color: var(--ui-text); border-color: #8a682f; }
:root[data-theme="dark"] #attendance .at-scheduled article,
:root[data-theme="dark"] #attendance #reminder-list article { border-color: #66512d; }
:root[data-theme="dark"] #attendance .at-message-text a,
:root[data-theme="dark"] #attendance .at-bubble.mine .at-message-text a,
:root[data-theme="dark"] #attendance .at-message-media a { color: #a9bbff; }
:root[data-theme="dark"] #attendance .at-message-state,
:root[data-theme="dark"] #attendance .at-bubble small { color: var(--ui-text-soft); }
:root[data-theme="dark"] #attendance .at-icon,
:root[data-theme="dark"] #attendance .at-tools > summary,
:root[data-theme="dark"] #attendance .at-schedule summary { color: var(--ui-text-soft); }
:root[data-theme="dark"] #attendance .at-notice,
:root[data-theme="dark"] #attendance #attendance-warning:not(:empty) { background: #3b301d; color: #f4d49b; border-color: #745c2f; }
:root[data-theme="dark"] #attendance .at-summary article,
:root[data-theme="dark"] #attendance .at-tabs button[aria-pressed="false"],
:root[data-theme="dark"] #attendance .at-client,
:root[data-theme="dark"] #attendance .at-empty { background: var(--ui-surface); color: var(--ui-text); border-color: var(--ui-border); }
:root[data-theme="dark"] #catalog-dialog,
:root[data-theme="dark"] .at-purchase-card { background: var(--ui-surface); color: var(--ui-text); border-color: var(--ui-border); }
:root[data-theme="dark"] #catalog-list,
:root[data-theme="dark"] #catalog-list article,
:root[data-theme="dark"] .at-payment-row,
:root[data-theme="dark"] .at-purchase-entry,
:root[data-theme="dark"] #purchase-form { border-color: var(--ui-border); }
:root[data-theme="dark"] #quick-reply-options button[aria-selected="true"] { background: #18372d; color: var(--ui-text); outline-color: #45c28a; }
:root[data-theme="dark"] #attendance .at-message-state,
:root[data-theme="dark"] #attendance .at-chat-head small,
:root[data-theme="dark"] #attendance #sound-status { color: var(--ui-text-muted); }

@media (max-width: 900px) {
  .app-shell { display: block; }
  .sidebar { position: fixed; inset: 0 auto 0 0; width: min(286px, 86vw); height: 100dvh; padding-top: 64px; transform: translateX(-105%); transition: transform .2s ease; z-index: 80; }
  .sidebar .brand { position: absolute; top: 14px; left: 14px; }
  .sidebar nav { display: flex; flex-direction: column; overflow-y: auto; overflow-x: hidden; padding-bottom: 18px; }
  .sidebar nav a, .nav-alert-button { flex: none; width: 100%; }
  .nav-label, .sidebar-footer { display: flex; }
  .app-navigation-open .sidebar { transform: translateX(0); }
  .app-navigation-toggle { position: fixed; top: 12px; left: 14px; z-index: 75; display: grid; place-items: center; width: 40px; min-width: 40px; min-height: 40px; padding: 0; border: 1px solid var(--ui-border); background: var(--ui-surface); color: var(--ui-text); box-shadow: var(--ui-shadow); }
  .app-navigation-toggle { font-size: 0; }
  .app-navigation-toggle::before { content: ""; width: 18px; height: 2px; border-radius: 2px; background: currentColor; box-shadow: 0 -6px currentColor, 0 6px currentColor; }
  :root[data-theme="dark"] .app-navigation-toggle { background: var(--ui-surface-raised); color: var(--ui-text); border-color: var(--ui-border-strong); }
  .app-navigation-backdrop { position: fixed; inset: 0; z-index: 79; display: block; width: 100%; height: 100%; padding: 0; border: 0; border-radius: 0; background: var(--ui-overlay); box-shadow: none; }
  .app-navigation-backdrop[hidden] { display: none; }
  .topbar { position: sticky; top: 0; z-index: 60; min-height: 64px; padding: 10px 14px 10px 66px; }
  .topbar > div:first-child p { display: none; }
  .topbar h1 { font-size: .95rem; }
  .profile > span:not(.avatar), .profile > a:first-of-type { display: none; }
  .container { padding: 18px 14px 42px; }
  .page-head { gap: 12px; }
  .theme-control button { width: 34px; min-width: 34px; min-height: 34px; }
  body.app-navigation-open { overflow: hidden; }
  body.app-navigation-open:has(#attendance[data-live]) .sidebar {
    display: flex;
    inset: 0 auto 0 0;
    width: min(286px, 86vw);
    height: 100dvh;
    padding-top: 64px;
    transform: translateX(0);
    z-index: 80;
  }
}

@media (max-width: 600px) {
  html { font-size: 13px; }
  .topbar { padding-right: 10px; }
  .topbar .avatar { display: none; }
  .profile { gap: 7px; }
  .profile > a:last-child { font-size: .72rem; }
  .container { padding: 14px 10px 34px; }
  .panel, .form-card, .auth-card, .recovery { padding: 16px 14px; border-radius: 10px; }
  input, textarea, select { min-height: 44px; font-size: 16px; }
  button, .button { min-height: 44px; }
  .actions, .row-actions { flex-wrap: wrap; min-width: 0; }
  .actions > *, .row-actions > * { max-width: 100%; }
  .table-wrap { margin-inline: -14px; padding-inline: 14px; }
  dialog { width: calc(100vw - 20px) !important; max-width: none !important; max-height: calc(100dvh - 20px) !important; padding: 16px !important; }
  .global-service-alert { align-items: flex-start; flex-direction: column; gap: 9px; }
}

@media (prefers-reduced-motion: reduce) {
  .sidebar { transition: none; }
}

/* Mautic 7 typography and restrained surfaces; PCDA identity retained. */
@font-face { font-family: 'Source Sans 3 PCDA'; src: url("../fonts/SourceSans3-Regular.8f0b014bbfd5.woff2") format('woff2'); font-style: normal; font-weight: 400; font-display: swap; }
@font-face { font-family: 'Source Sans 3 PCDA'; src: url("../fonts/SourceSans3-Semibold.955cd026d0b9.woff2") format('woff2'); font-style: normal; font-weight: 600; font-display: swap; }
@font-face { font-family: 'Source Sans 3 PCDA'; src: url("../fonts/SourceSans3-Bold.b7c79f3ce736.woff2") format('woff2'); font-style: normal; font-weight: 700; font-display: swap; }
:root { font-family: 'Source Sans 3 PCDA', 'Helvetica Neue', Helvetica, Arial, sans-serif; --ui-bg: #f4f4f4; --ui-border: #e0e0e0; --ui-sidebar: #f4f4f4; --ui-sidebar-hover: #e5e5e5; --ui-sidebar-text: #525252; --radius-sm: 3px; --radius-md: 4px; --radius-lg: 6px; --ui-shadow: none; }
:root[data-theme='dark'] { --ui-bg: #17191d; --ui-border: #353941; --ui-sidebar: #111316; --ui-sidebar-hover: #252830; --ui-sidebar-text: #c7ccd5; }
html { font-size: 14px; }
body { font-weight: 400; letter-spacing: normal; }
h1, h2, h3 { letter-spacing: normal; font-weight: 600; }
.sidebar { border-right: 1px solid var(--ui-border); }
.brand strong { color: var(--ui-text); font-weight: 600; }
.brand small { color: var(--ui-text-soft); }
.sidebar nav a, .nav-alert-button { font-size: 14px !important; font-weight: 400 !important; border-radius: 2px; min-height: 40px; }
.nav-label { font-size: 11px; letter-spacing: .04em; }
.topbar { min-height: 56px; padding: 10px 22px; }
.topbar h1 { font-size: 18px; font-weight: 600; }
.topbar p, .profile strong, .profile small, .profile > a { font-size: 13px; }
button, .button { border-radius: 3px; font-size: 14px; font-weight: 600; }
input, textarea, select { border-radius: 3px; font-size: 14px; }
label { font-size: 14px; font-weight: 600; }
.helptext, form ul { font-size: 13px; }
.panel, .form-card, .grid-list article, .instance-card { border-radius: 4px; }
#live-messages { font-size: 16px; line-height: 1.5; }
@media (max-width: 700px) { input, textarea, select { font-size: 16px; } button, .button, .sidebar nav a, .nav-alert-button { min-height: 44px; } }

.sidebar .nav-icon { width: 18px; height: 18px; flex: 0 0 18px; color: var(--ui-text-soft); transition: color .15s ease; }
.sidebar nav a:hover, .sidebar .nav-alert-button:hover,
.sidebar nav a:focus-visible, .sidebar .nav-alert-button:focus-visible { background: var(--ui-sidebar-hover); color: var(--ui-text); }
.sidebar nav a:hover .nav-icon, .sidebar .nav-alert-button:hover .nav-icon,
.sidebar nav a:focus-visible .nav-icon, .sidebar .nav-alert-button:focus-visible .nav-icon,
.sidebar nav a[aria-current="page"] .nav-icon { color: var(--ui-primary); }
.sidebar nav a[aria-current="page"] { background: var(--ui-sidebar-hover); color: var(--ui-text); }
.sidebar nav a:focus-visible, .sidebar .nav-alert-button:focus-visible { outline: 2px solid var(--ui-primary); outline-offset: -2px; }
@media(prefers-reduced-motion:reduce) { .sidebar .nav-icon { transition: none; } }