:root {
  --ui-font: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ui-navy: #101827;
  --ui-navy-raised: #18243a;
  --ui-canvas: #f4f6f9;
  --ui-surface: #ffffff;
  --ui-surface-muted: #f8fafc;
  --ui-ink: #101828;
  --ui-muted: #667085;
  --ui-rule: #dce2ea;
  --ui-blue: #2563eb;
  --ui-blue-dark: #1d4ed8;
  --ui-blue-soft: #eaf1ff;
  --ui-success: #157347;
  --ui-warning: #9a6700;
  --ui-danger: #b42318;
  --ui-control: 46px;
  --ui-control-compact: 40px;
  --ui-radius-control: 10px;
  --ui-radius-surface: 14px;
  --ui-shadow: 0 10px 26px rgba(16, 24, 40, .08);
}

* { box-sizing: border-box; }
html { background: var(--ui-canvas); }
body.app-page { min-width: 320px; margin: 0; color: var(--ui-ink); background: var(--ui-canvas); font-family: var(--ui-font); font-size: 15px; line-height: 1.45; }
.app-page :is(button, input, select, textarea) { font: inherit; }
.app-page :is(h1, h2, h3, p) { margin-top: 0; }
.app-page :is(h1, h2, h3) { color: var(--ui-ink); font-weight: 760; letter-spacing: -.028em; }
.app-page h1 { margin-bottom: 5px; font-size: clamp(28px, 3vw, 36px); line-height: 1.08; }
.app-page h2 { margin-bottom: 4px; font-size: 22px; line-height: 1.18; }
.app-page h3 { margin-bottom: 4px; font-size: 16px; }
.app-page .subtle, .app-page .mini { color: var(--ui-muted); }
.app-page .label { display: inline-block; color: var(--ui-muted); font-size: 12px; font-weight: 700; letter-spacing: .01em; font-variant-numeric: tabular-nums; }
.app-page .eyebrow { display: none; }
.app-page a { color: inherit; }

.app-page .shell { min-height: 100dvh; }
.app-page .side { position: fixed; inset: 0 auto 0 0; z-index: 20; display: flex; width: 264px; flex-direction: column; padding: 28px 16px 22px; color: #d5deec; background: var(--ui-navy); }
.app-page .brand { display: grid; gap: 4px; padding: 8px 10px 28px; border-bottom: 1px solid rgba(220, 226, 234, .18); color: #fff; font-size: 15px; font-weight: 780; letter-spacing: -.015em; }
.app-page .brand small, .app-page .nav-title { color: #aab8cc; font-size: 11px; font-weight: 750; letter-spacing: .1em; }
.app-page .brand-mark { display: grid; width: 48px; height: 48px; place-items: center; overflow: hidden; border-radius: 11px; background: #fff; }
.app-page .brand-mark img { display: block; width: 100%; height: 100%; object-fit: contain; }
.app-page nav { display: grid; gap: 6px; margin-top: 28px; }
.app-page .nav-title { margin: 0 12px 8px; }
.app-page nav a { position: relative; display: flex; min-height: 44px; gap: 12px; align-items: center; padding: 0 12px; border-radius: 9px; color: #d5deec; font-size: 15px; font-weight: 680; text-decoration: none; }
.app-page nav a:hover { background: rgba(255,255,255,.06); }
.app-page nav a.active { color: #fff; background: var(--ui-navy-raised); }
.app-page nav a.active::before { position: absolute; left: 0; width: 3px; height: 22px; content: ''; border-radius: 2px; background: var(--ui-blue); }
.app-page nav svg { width: 19px; height: 19px; flex: 0 0 19px; stroke-width: 1.9; }
.app-page .user-block { display: grid; gap: 4px; margin-top: auto; padding: 20px 10px 0; border-top: 1px solid rgba(220, 226, 234, .18); font-size: 14px; font-weight: 700; }
.app-page .user-block small { color: #aab8cc; font-size: 12px; font-weight: 600; }
.app-page .logout-link { margin-top: 16px; padding: 0 10px; color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; }

.app-page .main { width: calc(100% - 264px); min-height: 100dvh; margin-left: 264px; padding: 32px 40px 48px; }
.app-page .topbar { display: flex; min-height: 126px; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 20px; padding: 26px 28px; border-radius: var(--ui-radius-surface); color: #fff; background: var(--ui-navy); box-shadow: var(--ui-shadow); }
.app-page .topbar h1 { color: #fff; }
.app-page .topbar .subtle { max-width: 66ch; margin: 0; color: #c4d0e1; font-size: 15px; font-weight: 600; }
.app-page .topbar .actions { display: flex; flex: 0 0 auto; gap: 8px; }

.app-page .panel, .app-page .operator-tools, .app-page .business-access-overview, .app-page .deployment-start { margin: 0 0 16px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-surface); background: var(--ui-surface); box-shadow: none; }
.app-page .panel { padding: 20px; }
.app-page .panel-head { display: flex; min-height: 42px; align-items: center; justify-content: space-between; gap: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--ui-rule); }
.app-page .panel-head > div { min-width: 0; }
.app-page .panel-head p { margin-bottom: 0; }
.app-page .split, .app-page .settings-split, .app-page .business-split, .app-page .deployments-split, .app-page .users-split, .app-page .accounts-split { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.app-page .business-manage-panel, .app-page .business-registry-panel { position: static; }
.app-page .business-registry-panel { order: 1; }
.app-page .business-manage-panel { order: 2; }

.app-page .btn { display: inline-flex; min-height: var(--ui-control); gap: 8px; align-items: center; justify-content: center; padding: 0 16px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); color: var(--ui-ink); background: var(--ui-surface); font-family: var(--ui-font); font-size: 14px; font-weight: 720; letter-spacing: -.01em; line-height: 1; text-decoration: none; white-space: nowrap; cursor: pointer; transition: border-color .16s ease, background-color .16s ease, color .16s ease, transform .16s ease; }
.app-page .btn:hover { border-color: #b8c5d6; background: var(--ui-surface-muted); }
.app-page .btn:active { transform: translateY(1px); }
.app-page .btn:disabled { opacity: .55; cursor: not-allowed; }
.app-page .btn.primary { border-color: var(--ui-blue); color: #fff; background: var(--ui-blue); }
.app-page .btn.primary:hover { border-color: var(--ui-blue-dark); background: var(--ui-blue-dark); }
.app-page .btn.danger, .app-page button.danger { border-color: #f0bbb7; color: var(--ui-danger); background: #fff; }
.app-page :is(.btn, button, input, select, textarea):focus-visible { outline: 0; box-shadow: 0 0 0 3px rgba(37, 99, 235, .2); }
.app-page :is(button, a.btn) svg { width: 18px; height: 18px; stroke-width: 2; }

.app-page .form-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.app-page .field { display: grid; min-width: 0; gap: 6px; }
.app-page .field.full { grid-column: auto; }
.app-page .field > span, .app-page label { color: var(--ui-muted); font-size: 13px; font-weight: 700; }
.app-page :is(input:not([type='radio']):not([type='checkbox']), textarea, select) { width: 100%; min-height: var(--ui-control); padding: 0 13px; border: 1px solid #b8c5d6; border-radius: var(--ui-radius-control); color: var(--ui-ink); background: #fff; }
.app-page textarea { min-height: 104px; padding-block: 11px; resize: vertical; }
.app-page input::placeholder, .app-page textarea::placeholder { color: #8b98ad; }
.app-page input[type='radio'] { width: 18px; height: 18px; margin: 0; appearance: none; border: 1px solid var(--ui-muted); border-radius: 50%; background: #fff; box-shadow: inset 0 0 0 4px #fff; }
.app-page input[type='radio']:checked { border-color: var(--ui-blue); background: var(--ui-blue); }
.app-page label:has(> input[type='radio']) { display: inline-flex; width: fit-content; min-height: 36px; gap: 8px; align-items: center; cursor: pointer; }
.app-page input[type='file'] { min-height: var(--ui-control); padding: 5px; }
.app-page input[type='file']::file-selector-button { height: 34px; margin-right: 10px; padding: 0 10px; border: 1px solid var(--ui-rule); border-radius: 7px; background: var(--ui-surface-muted); font: inherit; font-weight: 700; }

.app-page details { overflow: hidden; }
.app-page details > summary { display: flex; min-height: 52px; align-items: center; justify-content: space-between; padding: 0 16px; list-style: none; font-size: 15px; font-weight: 720; cursor: pointer; }
.app-page details > summary::-webkit-details-marker { display: none; }
.app-page details > summary::after { width: 8px; height: 8px; content: ''; border-right: 2px solid var(--ui-muted); border-bottom: 2px solid var(--ui-muted); transform: rotate(45deg) translateY(-3px); }
.app-page details[open] > summary { border-bottom: 1px solid var(--ui-rule); background: var(--ui-surface-muted); }
.app-page details[open] > summary::after { transform: rotate(225deg) translate(-2px, -2px); }
.app-page .editor-disclosure { padding: 0; }
.app-page .editor-disclosure-body { padding: 20px; }
.app-page .operator-tools { padding: 0; }
.app-page .operator-tools-body { display: grid; grid-template-columns: minmax(0, 1fr); }
.app-page .operator-tool-group { padding: 16px 20px; }
.app-page .operator-tool-group + .operator-tool-group { border-top: 1px solid var(--ui-rule); }

.app-page .registry-toolbar, .app-page .desk-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; }
.app-page .search-field { flex: 1 1 280px; }
.app-page .registry-card, .app-page .remote-folder, .app-page .deployment-business-group { margin: 0; border: 0; border-bottom: 1px solid var(--ui-rule); border-radius: 0; background: transparent; }
.app-page .registry-card:last-child, .app-page .remote-folder:last-child, .app-page .deployment-business-group:last-child { border-bottom: 0; }
.app-page .registry-card > summary, .app-page .remote-folder > summary, .app-page .deployment-business-summary { display: grid; min-height: 64px; grid-template-columns: 44px minmax(180px, 1fr) auto auto 16px; gap: 12px; align-items: center; padding: 10px 4px; background: transparent; }
.app-page .registry-card > summary:hover, .app-page .remote-folder > summary:hover, .app-page .deployment-business-summary:hover { background: var(--ui-surface-muted); }
.app-page .business-avatar, .app-page .registry-avatar { width: 36px; height: 36px; overflow: hidden; border-radius: 9px; background: var(--ui-blue-soft); }
.app-page .business-avatar img, .app-page .registry-avatar img { width: 100%; height: 100%; object-fit: contain; }
.app-page .registry-main, .app-page .remote-device-name { min-width: 0; }
.app-page .registry-main > div:nth-child(2) { display: grid; gap: 2px; min-width: 0; }
.app-page .registry-main strong, .app-page .remote-device-name strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }
.app-page .registry-main small, .app-page .remote-device-name small { color: var(--ui-muted); font-size: 12px; }
.app-page .registry-main :is(h3, p) { margin: 0; }
.app-page .registry-main h3 { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.app-page .registry-main p { color: var(--ui-muted); font-size: 12px; }
.app-page .registry-stats { display: flex; gap: 12px; align-items: center; color: var(--ui-muted); font-size: 12px; font-weight: 650; white-space: nowrap; }
.app-page .registry-access-status { color: var(--ui-muted); font-size: 12px; font-weight: 650; white-space: nowrap; }
.app-page :is(.registry-main, .remote-folder) img { max-width: 36px; height: 36px; object-fit: contain; }
.app-page .registry-details { padding: 0 4px 16px 52px; }
.app-page .registry-location { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; padding: 12px 0; border-top: 1px solid var(--ui-rule); }

.app-page .remote-subfolder-title { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 10px 4px; color: var(--ui-muted); font-size: 12px; font-weight: 700; }
.app-page .remote-device-row { display: grid; grid-template-columns: minmax(150px,1.2fr) minmax(120px,.8fr) minmax(160px,1fr) minmax(110px,.7fr) auto; gap: 16px; align-items: center; padding: 14px 4px 14px 52px; border-top: 1px solid var(--ui-rule); }
.app-page .remote-id { display: flex; gap: 6px; align-items: center; font-variant-numeric: tabular-nums; }
.app-page .remote-id code { padding: 7px 9px; border: 1px solid var(--ui-rule); border-radius: 8px; background: var(--ui-surface-muted); font-family: var(--ui-font); font-size: 13px; font-weight: 700; }
.app-page .remote-actions, .app-page .row-actions { display: flex; gap: 8px; align-items: center; }
.app-page .remote-actions .btn, .app-page .row-actions .btn { min-width: var(--ui-control); padding-inline: 12px; }
.app-page .remote-copy { color: var(--ui-muted); }

.app-page .record-row { display: flex; min-height: 72px; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--ui-rule); }
.app-page .record-row:last-child { border-bottom: 0; }
.app-page .record-row p { margin: 0; }
.app-page .record-row strong { font-size: 15px; }
.app-page .deployment-summary { padding-left: 4px; }
.app-page .deployment-share-box { margin: 0 0 14px; padding: 14px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: var(--ui-surface-muted); }

.app-page .settings-status-panel, .app-page .download-files-panel { display: grid; gap: 0; }
.app-page .settings-status-panel > h2, .app-page .download-files-panel > h3 { margin: 0; padding-bottom: 14px; border-bottom: 1px solid var(--ui-rule); }
.app-page .settings-status-panel :is(.build-status,.rdgen-monitor,.rdgen-progress-card,.rdgen-sync-line,.rdgen-auto-line,.artifact-receipt,.operator-macos-status), .app-page .health-check, .app-page .port-card, .app-page .tutorial-card { padding: 14px 0; border: 0; border-bottom: 1px solid var(--ui-rule); border-radius: 0; background: transparent; box-shadow: none; }
.app-page .direct-exe-download { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 14px 0; padding: 14px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: var(--ui-surface-muted); }
.app-page .direct-exe-download > div:first-child { display: grid; gap: 3px; }
.app-page .operator-macos-downloads { display: flex; flex-wrap: wrap; gap: 8px; }
.app-page .rdgen-progress-bar { height: 6px; overflow: hidden; border-radius: 999px; background: var(--ui-rule); }
.app-page .rdgen-progress-bar span { display: block; height: 100%; background: var(--ui-blue); }
.app-page .tutorial-grid, .app-page .diagnostics-grid { display: grid; grid-template-columns: minmax(0,1fr); gap: 0; border-top: 1px solid var(--ui-rule); }
.app-page .tutorial-card { display: grid; grid-template-columns: 30px minmax(0,1fr); column-gap: 12px; }
.app-page .tutorial-card h3, .app-page .tutorial-card p, .app-page .tutorial-card .btn { grid-column: 2; }
.app-page .step-badge { display: grid; width: 26px; height: 26px; grid-row: span 3; place-items: center; border-radius: 50%; color: #fff; background: var(--ui-navy); font-size: 12px; font-weight: 760; }

.app-page .pill { display: inline-flex; min-height: 0; gap: 6px; align-items: center; padding: 0; border: 0; border-radius: 0; background: transparent !important; font-size: 12px; font-weight: 700; }
.app-page .pill::before { width: 7px; height: 7px; flex: 0 0 7px; content: ''; border-radius: 50%; background: currentColor; }
.app-page :is(.green,.ready,.online) { color: var(--ui-success); }
.app-page :is(.amber,.warning,.attention,.outdated,.stale) { color: var(--ui-warning); }
.app-page :is(.red,.danger,.failure,.missing) { color: var(--ui-danger); }

.app-page .select-menu { position: relative; min-width: 0; }
.app-page .select-native { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; white-space: nowrap !important; }
.app-page .select-trigger { position: relative; display: flex; width: 100%; min-height: var(--ui-control); align-items: center; padding: 0 44px 0 13px; border: 1px solid #b8c5d6; border-radius: var(--ui-radius-control); color: var(--ui-ink); background: #fff; text-align: left; cursor: pointer; }
.app-page .select-trigger::after { position: absolute; top: 50%; right: 17px; width: 8px; height: 8px; content: ''; border-right: 2px solid var(--ui-muted); border-bottom: 2px solid var(--ui-muted); transform: translateY(-70%) rotate(45deg); }
.app-page .select-menu.is-open .select-trigger { border-color: var(--ui-blue); box-shadow: 0 0 0 3px rgba(37,99,235,.18); }
.app-page .select-options { position: absolute; z-index: 60; top: calc(100% + 6px); right: 0; left: 0; display: none; max-height: 280px; padding: 6px; overflow-y: auto; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: #fff; box-shadow: 0 14px 30px rgba(16,24,40,.16); }
.app-page .select-menu.is-open .select-options { display: grid; gap: 2px; }
.app-page .select-option { display: flex; min-height: 40px; align-items: center; padding: 0 10px; border: 0; border-radius: 8px; color: var(--ui-ink); background: transparent; font-weight: 650; text-align: left; cursor: pointer; }
.app-page .select-option:hover, .app-page .select-option:focus-visible, .app-page .select-option[aria-selected='true'] { outline: 0; background: var(--ui-blue-soft); }
.app-page .select-option[aria-selected='true'] { font-weight: 760; }

.app-page .mobile-nav { display: none; }
@media (max-width: 1180px) { .app-page .side { width: 236px; } .app-page .main { width: calc(100% - 236px); margin-left: 236px; padding-inline: 24px; } }
@media (max-width: 760px) {
  .app-page .shell { padding-bottom: calc(78px + env(safe-area-inset-bottom)); }
  .app-page .side { display: none; }
  .app-page .main { width: 100%; min-height: auto; margin-left: 0; padding: 14px 14px calc(90px + env(safe-area-inset-bottom)); }
  .app-page .topbar { min-height: 0; align-items: flex-start; flex-direction: column; padding: 20px; }
  .app-page .topbar .actions, .app-page .topbar .actions .btn { width: 100%; }
  .app-page .panel { padding: 16px; }
  .app-page .panel-head, .app-page .direct-exe-download, .app-page .record-row { align-items: stretch; flex-direction: column; }
  .app-page .row-actions { width: 100%; }
  .app-page .row-actions .btn, .app-page .row-actions form { flex: 1; }
  .app-page .registry-card > summary, .app-page .remote-folder > summary, .app-page .deployment-business-summary { grid-template-columns: 36px minmax(0,1fr) auto 14px; gap: 10px; }
  .app-page .registry-stats, .app-page .registry-access-status { grid-column: 2; }
  .app-page .registry-details { padding-left: 0; }
  .app-page .remote-device-row { grid-template-columns: minmax(0,1fr) auto; gap: 9px 12px; padding: 14px 0 14px 42px; }
  .app-page .remote-device-name { grid-column: 1; }
  .app-page .remote-actions { grid-column: 2; grid-row: 1 / span 2; }
  .app-page .remote-id, .app-page .remote-agent-state, .app-page .remote-build-status { grid-column: 1; }
  .app-page .mobile-nav { position: fixed; z-index: 30; right: 10px; bottom: max(10px, env(safe-area-inset-bottom)); left: 10px; display: grid; grid-template-columns: repeat(4,1fr); padding: 5px; border-radius: 12px; background: var(--ui-navy); box-shadow: var(--ui-shadow); }
  .app-page .mobile-nav a { display: grid; min-height: 52px; place-items: center; color: #c4d0e1; font-size: 11px; font-weight: 700; text-decoration: none; }
  .app-page .mobile-nav a.active { border-radius: 8px; color: #fff; background: var(--ui-navy-raised); }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0ms !important; } }

/* Access directory: the operational ledger owns its hierarchy. */
.app-page .brand { grid-template-columns: 48px minmax(0, 1fr); column-gap: 12px; align-items: center; }
.app-page .brand > div:last-child { display: grid; gap: 2px; min-width: 0; }
.app-page .brand > div:last-child strong { color: #fff; font-size: 15px; line-height: 1.15; }
.app-page .brand > div:last-child span { color: #aab8cc; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.app-page .nav { display: grid; gap: 6px; margin-top: 28px; }
.app-page .nav-section { margin: 12px 12px 5px; color: #aab8cc; font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.app-page .nav-link { position: relative; display: flex; min-height: 44px; gap: 12px; align-items: center; padding: 0 12px; border-radius: 9px; color: #d5deec; font-size: 15px; font-weight: 680; text-decoration: none; }
.app-page .nav-link:hover { background: rgba(255,255,255,.06); }
.app-page .nav-link.active { color: #fff; background: var(--ui-navy-raised); }
.app-page .nav-link.active::before { position: absolute; left: 0; width: 3px; height: 22px; content: ''; border-radius: 2px; background: var(--ui-blue); }
.app-page .side-foot { display: grid; gap: 4px; margin-top: auto; padding: 20px 10px 0; border-top: 1px solid rgba(220,226,234,.18); }
.app-page .side-foot strong { color: #fff; font-size: 14px; }
.app-page .side-foot span { overflow: hidden; color: #aab8cc; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.app-page .side-foot a { margin-top: 12px; color: #fff; font-size: 14px; font-weight: 700; text-decoration: none; }
.app-page .side-foot .btn { width: fit-content; min-height: 38px; margin-top: 12px; padding-inline: 12px; border-color: rgba(220,226,234,.28); color: #fff; background: transparent; }
.app-page .side-foot .btn:hover { border-color: rgba(220,226,234,.5); background: rgba(255,255,255,.07); }

.app-page .remote-folder > summary { grid-template-columns: 36px minmax(0,1fr) auto 16px; min-height: 64px; gap: 14px; }
.app-page .folder-avatar { display: grid; width: 36px; height: 36px; place-items: center; overflow: hidden; border-radius: 9px; background: var(--ui-blue-soft); font-size: 13px; font-weight: 760; }
.app-page .folder-avatar .business-avatar-fallback { display: grid; width: 100%; height: 100%; place-items: center; }
.app-page .folder-avatar.has-logo .business-avatar-fallback { display: none; }
.app-page .folder-avatar img { display: block; width: 100%; height: 100%; object-fit: contain; }
.app-page .remote-folder-title { display: grid; min-width: 0; gap: 2px; }
.app-page .remote-folder-title strong { overflow: hidden; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.app-page .remote-folder-title small, .app-page .remote-folder-count small { color: var(--ui-muted); font-size: 12px; }
.app-page .remote-folder-count { display: grid; justify-items: end; gap: 2px; font-variant-numeric: tabular-nums; }
.app-page .remote-folder-count strong { font-size: 14px; }
.app-page .folder-chevron { width: 9px; height: 9px; border-right: 2px solid var(--ui-muted); border-bottom: 2px solid var(--ui-muted); transform: rotate(45deg) translateY(-3px); }
.app-page .remote-folder[open] .folder-chevron { transform: rotate(225deg) translate(-2px,-2px); }
.app-page .remote-subfolder-title { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 10px; align-items: center; padding: 10px 4px; color: var(--ui-muted); font-size: 12px; font-weight: 700; }
.app-page .point-marker { display: grid; width: 28px; height: 24px; place-items: center; border: 1px solid var(--ui-rule); border-radius: 7px; color: var(--ui-muted); font-size: 11px; }
.app-page .point-name { display: grid; min-width: 0; gap: 2px; }
.app-page .point-name strong { overflow: hidden; color: var(--ui-ink); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.app-page .point-name small { overflow: hidden; color: var(--ui-muted); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.app-page .point-count { color: var(--ui-muted); font-size: 12px; white-space: nowrap; }

.app-page .remote-device-name { display: grid; grid-template-columns: 8px minmax(0,1fr); gap: 10px; align-items: start; }
.app-page .remote-device-name > div, .app-page .remote-agent-state, .app-page .remote-build-status { display: grid; min-width: 0; gap: 2px; }
.app-page .remote-device-name strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-page .remote-agent-state small, .app-page .remote-build-status small { color: var(--ui-muted); font-size: 12px; }
.app-page .remote-actions { display: grid; gap: 6px; justify-items: stretch; }
.app-page .remote-actions > * { width: 100%; }
.app-page .icon-copy { display: inline-grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--ui-rule); border-radius: 8px; color: var(--ui-muted); background: var(--ui-surface); }
.app-page .icon-copy:hover { color: var(--ui-ink); background: var(--ui-surface-muted); }
.app-page .icon-copy svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.app-page .icon-copy { min-width: var(--ui-control); min-height: var(--ui-control); touch-action: manipulation; }
.app-page :is(a,button,summary) { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.network-status { position: fixed; z-index: 60; right: 14px; bottom: max(92px, calc(78px + env(safe-area-inset-bottom))); max-width: min(360px, calc(100vw - 28px)); padding: 10px 12px; border: 1px solid #edcf8f; border-radius: var(--ui-radius-control); color: var(--ui-warning); background: #fff7e6; box-shadow: var(--ui-shadow); font-size: 13px; font-weight: 700; }
.network-status[hidden] { display: none; }
@media (min-width: 761px) { .network-status { bottom: 18px; } }

@media (max-width: 1180px) and (min-width: 761px) {
  .app-page .remote-device-row { grid-template-columns: minmax(0,1.2fr) 130px minmax(140px,1fr) 94px; gap: 10px 14px; padding-left: 42px; }
  .app-page .remote-device-name { grid-row: span 2; }
  .app-page .remote-id { grid-column: 2; grid-row: 1 / span 2; }
  .app-page .remote-agent-state { grid-column: 3; }
  .app-page .remote-build-status { grid-column: 3; }
  .app-page .remote-actions { grid-column: 4; grid-row: 1 / span 2; }
}

/* Shared ledger primitives for directory rows, action menus and deployment groups. */
.app-page .remote-folder > summary::after { display: none; }
.app-page .status-dot { width: 9px; height: 9px; margin-top: 5px; border-radius: 50%; background: var(--ui-muted); box-shadow: 0 0 0 3px var(--ui-surface); }
.app-page .status-dot.online { background: var(--ui-success); }
.app-page .status-dot.outdated, .app-page .status-dot.stale { background: var(--ui-warning); }
.app-page .status-dot.missing, .app-page .status-dot.offline { background: var(--ui-danger); }

.app-page .device-actions-primary { position: relative; display: grid; gap: 6px; }
.app-page .device-more-actions { position: relative; overflow: visible; }
.app-page .device-more-actions > summary { width: 100%; min-height: var(--ui-control-compact); padding: 0 10px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); color: var(--ui-ink); background: var(--ui-surface); font-family: var(--ui-font); font-size: 13px; font-weight: 720; line-height: 1; justify-content: center; }
.app-page .device-more-actions > summary::after { width: 7px; height: 7px; margin-left: 4px; }
.app-page .device-more-actions[open] > summary { border-color: var(--ui-blue); background: var(--ui-blue-soft); }
.app-page .device-more-menu { position: absolute; z-index: 50; right: 0; bottom: calc(100% + 8px); display: grid; min-width: 190px; gap: 4px; padding: 6px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: var(--ui-surface); box-shadow: 0 14px 30px rgba(16,24,40,.16); }
.app-page .device-more-menu :is(.btn, button, a) { width: 100%; min-height: 38px; justify-content: flex-start; padding-inline: 10px; border: 0; border-radius: 7px; background: transparent; font-size: 13px; }
.app-page .device-more-menu :is(.btn, button, a):hover { background: var(--ui-blue-soft); }

.app-page .deployment-start { display: flex; min-height: 0; align-items: center; justify-content: space-between; gap: 20px; padding: 22px 24px; }
.app-page .deployment-start h2 { margin-bottom: 5px; }
.app-page .deployment-start p { margin: 0; color: var(--ui-muted); }
.app-page .deployment-business-summary { display: grid; grid-template-columns: 36px minmax(0,1fr) auto 16px; min-height: 60px; gap: 14px; align-items: center; padding: 0 14px; }
.app-page .deployment-business-summary::after { display: none; }
.app-page .deployment-business-summary strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-page .deployment-group-count, .app-page .deployment-group-activity { color: var(--ui-muted); font-size: 12px; font-weight: 650; white-space: nowrap; }
.app-page .deployment-group-activity { padding-left: 14px; border-left: 1px solid var(--ui-rule); }

@media (max-width: 760px) {
  .app-page .device-more-menu { right: 0; left: auto; max-width: calc(100vw - 28px); }
  .app-page .deployment-start { align-items: stretch; flex-direction: column; padding: 18px; }
  .app-page .deployment-start .btn { width: 100%; }
  .app-page .deployment-business-summary { grid-template-columns: minmax(0,1fr) 16px; gap: 6px 10px; padding-block: 12px; }
  .app-page .deployment-group-count, .app-page .deployment-group-activity { grid-column: 1; padding-left: 0; border-left: 0; }
}

/* Compatibility layer: every secondary module consumes the same working primitives. */
.app-page :is(.device-page-layout,.map-layout,.workflow-panel,.business-board,.device-grid,.agent-summary-grid,.port-grid,.settings-status-panel,.tutorial-sections) { display: grid; grid-template-columns: minmax(0,1fr); gap: 16px; }
.app-page :is(.device-list-panel,.device-form-panel,.device-detail-panel,.map-panel,.workflow-intro,.workflow-steps,.credential-card,.access-box,.ops-alerts,.diagnostics-main) { min-width: 0; }
.app-page :is(.device-business-section,.device-location-section,.credential-card,.map-detail-card,.deployment-card,.advanced-section,.client-message,.password-update-menu) { border-bottom: 1px solid var(--ui-rule); }
.app-page :is(.device-business-head,.device-location-head,.credential-main,.map-detail-head,.workflow-steps > *, .definition-list > *,.check-row) { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 58px; padding: 12px 0; border-bottom: 1px solid var(--ui-rule); }
.app-page :is(.device-business-head,.device-location-head,.credential-main,.map-detail-head) > div { min-width: 0; }
.app-page :is(.device-business-head,.device-location-head,.credential-main,.map-detail-head) :is(h2,h3,p) { margin: 0; }
.app-page :is(.device-business-head,.device-location-head,.credential-main,.map-detail-head) p { color: var(--ui-muted); font-size: 12px; }
.app-page :is(.device-card,.dashboard-device-row) { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 12px; align-items: center; padding: 14px 0; border-bottom: 1px solid var(--ui-rule); }
.app-page :is(.device-card-main,.dashboard-device-main,.device-identity,.member-name) { display: grid; gap: 3px; min-width: 0; }
.app-page :is(.device-card-main,.dashboard-device-main,.device-identity,.member-name) strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-page :is(.device-card-main,.dashboard-device-main,.device-identity,.member-name) :is(span,small) { color: var(--ui-muted); font-size: 12px; }
.app-page :is(.credential-list,.credential-fields,.download-file-list,.download-url-grid,.definition-list,.health-check-list) { display: grid; gap: 0; }
.app-page :is(.credential-list > *,.credential-fields > *,.download-file-list > *,.download-url-grid > *,.definition-list > *,.health-check-list > *) { padding: 12px 0; border-bottom: 1px solid var(--ui-rule); }
.app-page .table-wrap { max-width: 100%; overflow-x: auto; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: var(--ui-surface); }
.app-page table { width: 100%; min-width: 720px; border-collapse: collapse; font-size: 13px; }
.app-page :is(th,td) { padding: 12px 14px; border-bottom: 1px solid var(--ui-rule); text-align: left; vertical-align: middle; }
.app-page th { color: var(--ui-muted); background: var(--ui-surface-muted); font-size: 11px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.app-page tr:last-child td { border-bottom: 0; }
.app-page .empty,.app-page .flash,.app-page .ops-alert,.app-page .diagnostic-note { padding: 14px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); color: var(--ui-muted); background: var(--ui-surface-muted); }
.app-page .flash.success { color: var(--ui-success); }
.app-page .flash.error,.app-page .ops-alert.error { color: var(--ui-danger); }
.app-page .map-canvas,.app-page .map-stage { min-height: 320px; overflow: hidden; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: var(--ui-surface-muted); }
.app-page .map-detail-list,.app-page .map-list { display: grid; gap: 0; }
.app-page .map-detail-card { padding: 14px 0; }
.app-page .map-business-logo { width: 36px; height: 36px; object-fit: contain; }
.app-page .action-confirm-dialog { width: min(440px,calc(100vw - 28px)); padding: 0; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-surface); box-shadow: var(--ui-shadow); }
.app-page .action-confirm-content { display: grid; gap: 16px; padding: 22px; }
.app-page .action-confirm-actions,.app-page .quiet-actions,.app-page .config-actions { display: flex; flex-wrap: wrap; gap: 8px; }

@media (max-width: 1023px) and (min-width: 761px) {
  .app-page .main { padding-inline: 20px; }
  .app-page .remote-device-row { grid-template-columns: minmax(0,1.1fr) 122px minmax(128px,.9fr) 90px; gap: 10px; }
}
@media (pointer: coarse) {
  .app-page :is(.btn,.select-trigger,.select-option,.device-more-actions > summary,.nav-link) { min-height: 48px; }
}
@media (max-width: 760px) {
  .app-page :is(.device-business-head,.device-location-head,.credential-main,.map-detail-head,.workflow-steps > *,.definition-list > *,.check-row,.device-card,.dashboard-device-row) { align-items: stretch; flex-direction: column; }
  .app-page :is(.device-card,.dashboard-device-row) { grid-template-columns: minmax(0,1fr); }
  .app-page .table-wrap { margin-inline: -2px; border-inline: 0; border-radius: 0; }
  .app-page table { min-width: 640px; }
  .app-page .select-options { right: auto; max-width: calc(100vw - 28px); }
}

/* A select menu must be wide enough for the longest operational filter. */
.app-page .select-options { width: max-content; min-width: max(100%, 210px); }
.app-page .select-option { white-space: nowrap; }

/* Group primitive: every operational cluster has the same header, metadata and disclosure rhythm. */
.app-page :is(.remote-folder,.registry-card,.deployment-business-group,.device-business-section,.map-business-group) { overflow: hidden; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: var(--ui-surface); }
.app-page :is(.remote-folder,.registry-card,.deployment-business-group,.device-business-section,.map-business-group) + :is(.remote-folder,.registry-card,.deployment-business-group,.device-business-section,.map-business-group) { margin-top: 10px; }
.app-page :is(.remote-folder > summary,.registry-card > summary,.deployment-business-summary,.device-business-head,.map-business-summary) { min-height: 58px; padding-inline: 14px; background: var(--ui-surface); }
.app-page :is(.remote-folder[open] > summary,.registry-card[open] > summary,.deployment-business-group[open] > .deployment-business-summary) { background: var(--ui-blue-soft); }
.app-page .remote-folder-list,.app-page .registry-list,.app-page .deployment-list,.app-page .device-registry { display: grid; gap: 10px; }
.app-page :is(.remote-folder-list,.registry-list) > :is(.remote-folder,.registry-card),.app-page .deployment-list > :is(.remote-folder,.deployment-business-group) { margin: 0; }

.app-page .desk-toolbar { grid-template-columns: minmax(280px,1fr) minmax(180px,.46fr) minmax(300px,.7fr); align-items: stretch; gap: 12px; padding: 12px; }
.app-page .desk-search,.app-page .desk-filter,.app-page .desk-summary { min-height: 76px; padding: 10px 12px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: var(--ui-surface-muted); }
.app-page .desk-search,.app-page .desk-filter { align-content: start; }
.app-page .desk-summary { display: flex; align-content: center; justify-content: flex-start; padding-top: 27px; }
.app-page .desk-search input,.app-page .desk-filter :is(select,.select-menu) { min-height: 42px; }

@media (max-width: 1180px) and (min-width: 761px) {
  .app-page .desk-toolbar { grid-template-columns: minmax(0,1fr) minmax(180px,.55fr); }
  .app-page .desk-summary { grid-column: 1 / -1; min-height: 52px; padding-top: 14px; }
}
@media (max-width: 760px) {
  .app-page .desk-search,.app-page .desk-filter,.app-page .desk-summary { min-height: auto; padding: 10px; }
  .app-page .desk-summary { padding-top: 10px; }
}

/* Access control strip and a compact, readable client ledger. */
.app-page .desk-toolbar { display: grid; grid-template-columns: minmax(280px,1fr) minmax(180px,.45fr) auto; gap: 12px 16px; align-items: end; margin: 0 0 20px; padding: 16px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-surface); background: var(--ui-surface); }
.app-page .desk-search, .app-page .desk-filter { display: grid; gap: 6px; min-width: 0; }
.app-page .desk-summary { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; min-height: var(--ui-control); color: var(--ui-muted); font-size: 13px; font-weight: 650; }
.app-page .desk-summary b { color: var(--ui-ink); font-size: 16px; }
.app-page .desk-summary .attention { color: var(--ui-warning); }
.app-page .remote-folder-count { display: inline-flex; gap: 4px; align-items: baseline; justify-self: end; font-variant-numeric: tabular-nums; white-space: nowrap; }
.app-page .remote-folder-count strong { font-size: 14px; }
.app-page .remote-folder-count small { color: var(--ui-muted); font-size: 12px; }
.app-page .registry-card > summary { grid-template-columns: 36px minmax(0,1fr) auto 16px; min-height: 56px; gap: 14px; padding-block: 8px; }
.app-page .registry-card > summary::after { display: none; }
.app-page .registry-details { padding: 0; }
.app-page .registry-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 12px 14px; border-bottom: 1px solid var(--ui-rule); background: var(--ui-surface-muted); }
.app-page .registry-more-actions { display: block; }
.app-page .registry-more-actions .device-more-menu { min-width: 190px; }
.app-page .registry-location { padding: 0; border: 0; }
.app-page .registry-location + .registry-location { border-top: 1px solid var(--ui-rule); }
.app-page .registry-location-title { display: grid; grid-template-columns: 34px minmax(0,1fr) auto; gap: 10px; align-items: center; min-height: 52px; padding: 10px 14px; background: var(--ui-surface-muted); }
.app-page .registry-location .row-actions { justify-content: flex-end; padding: 10px 14px; }
.app-page .business-registry-panel .panel-head { align-items: end; }
.app-page .business-registry-panel .registry-toolbar { display: grid; grid-template-columns: minmax(260px,1fr) auto; gap: 8px 12px; align-items: end; }
.app-page .business-registry-panel .registry-toolbar .search-field { grid-column: 1 / -1; width: 100%; }
.app-page .business-registry-panel .registry-toolbar > .label { align-self: center; color: var(--ui-muted); font-variant-numeric: tabular-nums; }
.app-page .business-registry-panel .registry-editor-actions { display: flex; gap: 8px; justify-content: flex-end; }
.app-page .remote-subfolder { border-top: 1px solid var(--ui-rule); }
.app-page .remote-subfolder-title { padding: 12px 4px; background: var(--ui-surface-muted); }
.app-page .point-marker { border-color: #b9cef9; color: var(--ui-blue-dark); background: var(--ui-blue-soft); }
.app-page .remote-subfolder-title.warning .point-marker { border-color: #edcf8f; color: var(--ui-warning); background: #fff7e6; }
.app-page .remote-subfolder-title.warning .point-name strong { color: var(--ui-warning); }
.app-page .device-more-actions .action-text { display: none; }

/* Deployments use the same ledger hierarchy as access: client, links, then details. */
.app-page .deployment-start { display: none; }
.app-page .deployments-split { display: grid; grid-template-columns: minmax(0,1fr); }
.app-page .deployment-history-panel { container-type: inline-size; order: 1; }
.app-page .deployment-editor { order: 2; }
.app-page .panel-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.app-page .deployment-history-panel .panel-head { min-height: 64px; }
.app-page .deployment-history-panel .panel-head p { margin: 2px 0 0; }
.app-page .deployment-group-links { border-top: 1px solid var(--ui-rule); }
.app-page .deployment-point-group + .deployment-point-group { border-top: 1px solid var(--ui-rule); }
.app-page .deployment-point-head { display: grid; grid-template-columns: 54px minmax(0,1fr) auto; gap: 10px; align-items: center; min-height: 52px; padding: 10px 14px; background: var(--ui-surface-muted); }
.app-page .deployment-point-head .point-marker { width: 48px; }
.app-page .deployment-row { margin: 0; border: 0; border-radius: 0; background: var(--ui-surface); }
.app-page .deployment-row + .deployment-row { border-top: 1px solid var(--ui-rule); }
.app-page .deployment-row > summary { display: grid; grid-template-columns: minmax(0,1fr) auto 16px; gap: 12px; align-items: center; min-height: 58px; padding: 10px 14px; background: var(--ui-surface); }
.app-page .deployment-row[open] > summary { border-bottom: 1px solid var(--ui-rule); background: var(--ui-blue-soft); }
.app-page .deployment-row > summary::after { width: 8px; height: 8px; content: ''; border-right: 2px solid var(--ui-muted); border-bottom: 2px solid var(--ui-muted); transform: rotate(45deg) translateY(-3px); }
.app-page .deployment-row[open] > summary::after { transform: rotate(225deg) translate(-2px,-2px); }
.app-page .deployment-title { display: grid; min-width: 0; gap: 2px; }
.app-page .deployment-title strong, .app-page .deployment-title .mini { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-page .deployment-title strong { font-size: 14px; }
.app-page .deployment-title .mini { color: var(--ui-muted); font-size: 12px; }
.app-page .deployment-row .deployment-share-box { display: grid; gap: 8px; margin: 14px; padding: 14px; }
.app-page .deployment-row .wide-copy-line { display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: 8px; align-items: center; }
.app-page .deployment-row .wide-copy-line code { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-page .deployment-meta { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0 14px; padding: 0 14px 14px; }
.app-page .deployment-meta > div { display: grid; min-width: 0; gap: 3px; padding: 10px 0; border-top: 1px solid var(--ui-rule); }
.app-page .deployment-meta strong { overflow: hidden; font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.app-page .deployment-row :is(.deployment-open-log,.client-message) { margin: 0 14px; }
.app-page .deployment-row :is(.deployment-open-log,.client-message) > summary { position: relative; min-height: 48px; padding: 0 30px 0 0; }
.app-page .deployment-row :is(.deployment-open-log,.client-message) > summary::after { position: absolute; right: 4px; }
.app-page .deployment-row .row-actions { display: flex; justify-content: flex-end; gap: 8px; padding: 14px; border-top: 1px solid var(--ui-rule); }
.app-page .deployment-row .row-actions > :not(.primary), .app-page .deployment-row .row-actions > .danger { display: none; }
.app-page .deployment-row .row-actions .deployment-more-actions { display: block; }
.app-page .deployment-row .device-more-menu { min-width: 210px; }
@container (max-width: 680px) {
  .app-page .deployment-row .wide-copy-line { grid-template-columns: minmax(0,1fr) var(--ui-control) var(--ui-control); }
  .app-page .deployment-row .deployment-share-action { width: var(--ui-control); min-width: var(--ui-control); padding: 0; }
  .app-page .deployment-row .deployment-share-action .action-text { display: none; }
  .app-page .deployment-row .deployment-copy-action { border-color: #b9cef9; color: var(--ui-blue-dark); background: var(--ui-blue-soft); }
  .app-page .deployment-row .deployment-whatsapp-action { border-color: #aad9c0; color: var(--ui-success); background: #edf8f1; }
  .app-page .deployment-meta { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 14px; }
  .app-page .deployment-meta strong { white-space: normal; }
  .app-page .deployment-row .row-actions { justify-content: stretch; }
  .app-page .deployment-row .row-actions > * { flex: 1; min-width: 0; }
}
.app-page .operator-tools { display: grid; gap: 12px; margin-top: 16px; padding: 16px; }
.app-page .operator-tools-head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }
.app-page .operator-tools-head :is(h2,p) { margin: 0; }
.app-page .operator-tools-head p { margin-top: 3px; color: var(--ui-muted); font-size: 13px; }
.app-page .operator-tools-body { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.app-page .operator-tool-card { display: grid; gap: 4px; min-height: 96px; padding: 14px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); color: var(--ui-ink); background: var(--ui-surface-muted); text-decoration: none; }
.app-page .operator-tool-card:hover { border-color: #9dbbf8; background: var(--ui-blue-soft); }
.app-page .operator-tool-card small { color: var(--ui-muted); }

/* Settings stays one operating sheet instead of a pile of unrelated cards. */
.app-page .settings-status-panel { padding: 24px; }
.app-page .settings-status-panel > h2 { margin-bottom: 0; }
.app-page .settings-status-panel .build-status { display: grid; gap: 4px; }
.app-page .settings-status-panel .rdgen-monitor { display: grid; gap: 10px; }
.app-page .settings-status-panel .operator-macos-status { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 16px; align-items: center; }

@media (max-width: 980px) and (min-width: 761px) {
  .app-page .desk-toolbar { grid-template-columns: minmax(0,1fr) minmax(180px,.55fr); }
  .app-page .desk-summary { grid-column: 1 / -1; }
}
@media (max-width: 960px) and (min-width: 761px) {
  .app-page .business-registry-panel .panel-head { align-items: stretch; flex-direction: column; }
  .app-page .business-registry-panel .registry-toolbar { grid-template-columns: minmax(0,1fr) auto; }
}
@media (max-width: 760px) {
  .app-page .desk-toolbar { grid-template-columns: 1fr; padding: 14px; }
  .app-page .desk-summary { min-height: 0; }
  .app-page .panel-actions, .app-page .panel-actions .btn { width: 100%; }
  .app-page .panel-actions { justify-content: stretch; }
  .app-page .deployment-row > summary { grid-template-columns: minmax(0,1fr) 16px; padding-block: 12px; }
  .app-page .deployment-row .pill { grid-column: 1; }
  .app-page .deployment-row .wide-copy-line { grid-template-columns: minmax(0,1fr) auto; }
  .app-page .deployment-row .wide-copy-line .btn:last-child { grid-column: 1 / -1; }
  .app-page .deployment-meta { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-page .deployment-row .row-actions { justify-content: stretch; }
  .app-page .deployment-row .row-actions > * { flex: 1; }
  .app-page .business-registry-panel .panel-head { align-items: stretch; }
  .app-page .business-registry-panel .registry-toolbar { grid-template-columns: minmax(0,1fr); }
  .app-page .business-registry-panel .registry-toolbar .search-field { grid-column: auto; }
  .app-page .business-registry-panel .registry-editor-actions { justify-content: stretch; }
  .app-page .business-registry-panel .registry-editor-actions .btn { flex: 1; }
  .app-page .deployment-business-summary { grid-template-columns: 36px minmax(0,1fr) auto 16px; padding-inline: 14px; }
  .app-page .deployment-point-head { grid-template-columns: 48px minmax(0,1fr); }
  .app-page .deployment-point-head .point-count { grid-column: 2; }
  .app-page .operator-tools-head { align-items: stretch; flex-direction: column; }
  .app-page .operator-tools-body { grid-template-columns: 1fr; }
  .app-page .settings-status-panel .operator-macos-status { grid-template-columns: 1fr; }
}

/* Dense access hierarchy: client -> point -> device. */
.app-page .remote-folder > summary { min-height: 56px; padding-block: 8px; }
.app-page .remote-folder[open] > summary { background: var(--ui-blue-soft); }
.app-page .remote-folder-title { gap: 1px; }
.app-page .remote-folder-title strong { font-size: 15px; }
.app-page .remote-subfolder-title { min-height: 52px; margin: 0; padding: 10px 14px; border-block: 1px solid #d7e3fb; background: #f5f8ff; }
.app-page .remote-subfolder-body { padding: 0 14px; }
.app-page .remote-device-row { min-height: 88px; padding: 14px 0; }
.app-page .remote-device-name { grid-template-columns: 10px minmax(0,1fr); }
.app-page .status-dot { width: 10px; height: 10px; margin-top: 5px; box-shadow: 0 0 0 3px var(--ui-surface); }
.app-page .remote-actions .device-actions-primary { min-width: 104px; }
.app-page .device-more-actions > summary { min-height: 36px; padding-inline: 9px; }
.app-page .device-more-actions .action-icon { display: inline-grid; width: 18px; height: 18px; place-items: center; }
.app-page .device-more-actions .action-icon svg { width: 18px; height: 18px; }

/* Focused device detail: one factual ledger, not a second dashboard. */
.app-page .device-detail-panel .device-card { grid-template-columns: minmax(240px,.78fr) minmax(0,1.42fr); gap: 0; padding: 0; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: var(--ui-surface); }
.app-page .device-detail-panel .device-card-main { align-content: start; min-height: 100%; padding: 20px; border-right: 1px solid var(--ui-rule); background: var(--ui-surface-muted); }
.app-page .device-detail-panel .device-identity h3 { margin: 2px 0 0; font-size: 20px; }
.app-page .device-detail-panel .device-identity p { margin: 2px 0 0; color: var(--ui-muted); font-size: 13px; }
.app-page .device-detail-panel .device-state { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.app-page .device-detail-panel .device-state .pill { min-height: 28px; padding: 4px 8px; font-size: 12px; }
.app-page .device-detail-panel .device-access-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 18px; padding: 8px 20px; }
.app-page .device-detail-panel .access-box { display: grid; grid-template-columns: 112px minmax(0,1fr); gap: 3px 10px; min-height: 58px; padding: 12px 0; border: 0; border-bottom: 1px solid var(--ui-rule); border-radius: 0; background: transparent; }
.app-page .device-detail-panel .access-box .label { grid-column: 1; grid-row: 1 / span 2; align-self: start; }
.app-page .device-detail-panel .access-box > :not(.label) { grid-column: 2; min-width: 0; }
.app-page .device-detail-panel .access-box small { overflow: hidden; color: var(--ui-muted); text-overflow: ellipsis; white-space: nowrap; }
.app-page .device-detail-panel :is(.credential-strip,.device-issues,.device-note,.device-actions) { grid-column: 1 / -1; margin: 0; padding: 14px 20px; border-top: 1px solid var(--ui-rule); }
.app-page .device-detail-panel .device-actions-primary { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }
.app-page .device-detail-panel .device-actions-primary > .btn { min-width: 120px; }
.app-page .device-detail-panel .device-more-actions { width: auto; }
.app-page .device-detail-panel .device-more-actions > summary { min-width: 110px; }
.app-page .device-detail-panel .device-more-actions .action-text { display: inline; }
.app-page .device-detail-panel .device-retiring { color: var(--ui-warning); font-size: 13px; font-weight: 700; }
.app-page .device-detail-panel .device-retirement-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
@media (max-width: 760px) {
  .app-page .device-detail-panel .device-card { grid-template-columns: 1fr; }
  .app-page .device-detail-panel .device-card-main { border-right: 0; border-bottom: 1px solid var(--ui-rule); }
  .app-page .device-detail-panel .device-access-grid { grid-template-columns: 1fr; padding-inline: 16px; }
  .app-page .device-detail-panel .device-actions-primary { align-items: stretch; flex-direction: column; }
  .app-page .device-detail-panel .device-actions-primary > .btn, .app-page .device-detail-panel .device-more-actions, .app-page .device-detail-panel .device-more-actions > summary { width: 100%; }
}
.app-page .device-more-actions > summary::after { display: none; }
.app-page .device-more-actions[open] > summary { border-color: var(--ui-blue); }

@media (max-width: 1180px) and (min-width: 761px) {
  .app-page .remote-device-row { min-height: 96px; padding-block: 12px; }
}

/* Settings: health is an at-a-glance card set; build detail is progressively disclosed. */
.app-page #system-health .editor-disclosure-body { padding: 16px; }
.app-page #system-health .diagnostics-grid { grid-template-columns: minmax(0,1.15fr) minmax(0,1fr) minmax(0,.8fr); gap: 12px; border: 0; }
.app-page #system-health .panel { margin: 0; padding: 16px; border-radius: var(--ui-radius-control); background: var(--ui-surface-muted); }
.app-page #system-health .panel-head { min-height: 0; padding-bottom: 10px; }
.app-page #system-health .panel-head h2 { font-size: 16px; }
.app-page #system-health .panel-head .subtle { display: none; }
.app-page #system-health .health-check-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 6px 12px; }
.app-page #system-health .health-check { display: grid; gap: 2px; padding: 6px 0; border: 0; font-size: 12px; }
.app-page #system-health .health-check span { color: var(--ui-muted); }
.app-page #system-health .port-grid { display: grid; gap: 0; }
.app-page #system-health .port-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 2px 8px; padding: 7px 0; border: 0; border-bottom: 1px solid var(--ui-rule); background: transparent; }
.app-page #system-health .port-card span { font-size: 12px; }
.app-page #system-health .port-card strong { grid-column: 2; grid-row: 1 / span 2; font-size: 12px; }
.app-page #system-health .port-card small { color: var(--ui-muted); font-size: 11px; }
.app-page #system-health .agents-health-card { cursor: default; }
.app-page #system-health .agent-summary-grid { display: grid; gap: 7px; }
.app-page #system-health .agent-summary-grid a { display: flex; min-height: 38px; align-items: center; justify-content: space-between; padding: 0 9px; border: 1px solid var(--ui-rule); border-radius: 7px; color: var(--ui-ink); background: var(--ui-surface); text-decoration: none; }
.app-page #system-health .agent-summary-grid a:hover { border-color: #b9cef9; background: var(--ui-blue-soft); }
.app-page #system-health .agent-summary-grid strong { font-size: 16px; }
.app-page #system-health .agent-summary-grid span { color: var(--ui-muted); font-size: 12px; font-weight: 700; }

.app-page .settings-brand-editor .form-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px 16px; }
.app-page .settings-brand-editor .form-grid .field.full { grid-column: 1 / -1; }
.app-page .config-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 12px; border-top: 1px solid var(--ui-rule); }
.app-page .config-actions .btn { min-height: 40px; padding-inline: 12px; font-size: 13px; }
.app-page .settings-status-panel { display: grid; gap: 16px; }
.app-page .settings-status-panel > :is(.build-status,.direct-exe-download,.rdgen-monitor,.operator-macos-status,.rdgen-technical-details,.download-files-panel) { margin: 0; padding: 16px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-control); background: var(--ui-surface-muted); }
.app-page .settings-status-panel .build-status { color: var(--ui-success); background: #f1fbf5; }
.app-page .settings-status-panel .build-status span { color: var(--ui-ink); }
.app-page .settings-status-panel .rdgen-monitor { gap: 12px; }
.app-page .settings-status-panel :is(.rdgen-sync-line,.rdgen-auto-line,.artifact-receipt,.artifact-receipt-list) { display: none; }
.app-page .settings-status-panel .rdgen-progress-card { padding: 0; border: 0; background: transparent; }
.app-page .settings-status-panel .operator-macos-status { grid-template-columns: minmax(0,1fr) 170px; }

@media (max-width: 1100px) {
  .app-page #system-health .diagnostics-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .app-page #system-health .agents-health-card { grid-column: 1 / -1; }
  .app-page #system-health .agent-summary-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .app-page #system-health .diagnostics-grid, .app-page .settings-brand-editor .form-grid { grid-template-columns: 1fr; }
  .app-page #system-health .agents-health-card { grid-column: auto; }
  .app-page #system-health .agent-summary-grid { grid-template-columns: 1fr; }
  .app-page #system-health .health-check-list { grid-template-columns: 1fr; }
  .app-page .settings-status-panel .operator-macos-status { grid-template-columns: 1fr; }
}
body.install-page { min-height: 100dvh; color: var(--ui-ink); background: #f1f4f8; font-family: var(--ui-font); }
.install-shell { display: grid; grid-template-columns: minmax(280px,.72fr) minmax(0,1.28fr); min-height: 100dvh; }
.install-brand-field { display: flex; flex-direction: column; justify-content: space-between; padding: 42px; color: #fff; background: var(--ui-navy); }
.install-brand-logo { width: 160px; height: auto; }
.install-brand-copy { margin-top: auto; }
.install-client-logo { display: block; max-width: 160px; max-height: 54px; margin-bottom: 18px; object-fit: contain; }
.install-brand-copy p { margin: 0; font-size: 24px; font-weight: 700; }
.install-brand-copy span,
.install-brand-explainer { display: block; margin-top: 6px; color: #c4d0e1; }
.install-sheet { display: grid; place-items: center; padding: 42px; background: #fff; }
.install-content { width: min(680px,100%); }
.install-intro h1 { margin: 0; font-size: clamp(32px,4vw,48px); letter-spacing: -.04em; }
.install-intro p { color: var(--ui-muted); }
.install-download-zone { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 34px 0; padding: 20px; border: 1px solid var(--ui-rule); border-radius: var(--ui-radius-surface); background: #f8fafc; }
.install-download-zone p { margin: 0; color: var(--ui-muted); }
.install-download-button,
.install-secondary-button { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; padding: 0 18px; gap: 8px; border-radius: var(--ui-radius-control); color: #fff; background: var(--ui-blue); font-weight: 700; text-decoration: none; }
.install-steps { display: grid; gap: 16px; padding: 0; list-style: none; }
.install-steps li { display: grid; grid-template-columns: 42px minmax(0,1fr); gap: 14px; }
.install-step-number { display: grid; width: 42px; height: 42px; place-items: center; border-radius: 50%; color: var(--ui-blue); background: var(--ui-blue-soft); }
.install-steps strong { display: block; }
.install-steps p { margin: 3px 0 0; color: var(--ui-muted); }
.install-assurance { margin-top: 28px; padding: 14px 16px; border-left: 1px solid var(--ui-rule); background: #f8fafc; }
.install-assurance p { margin: 0; font-size: 13px; }
.install-alternative,
.install-support { margin-top: 18px; border-top: 1px solid var(--ui-rule); }
.install-alternative summary,
.install-support summary { padding: 16px 0; cursor: pointer; font-weight: 700; }
.install-alternative-content { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding-bottom: 16px; }
.install-alternative-content p { color: var(--ui-muted); font-size: 13px; }
.install-manual-form { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; }
.install-manual-form label { display: grid; gap: 5px; font-size: 13px; font-weight: 700; }
.install-manual-form input { min-height: 44px; padding: 0 10px; border: 1px solid var(--ui-rule-strong); border-radius: 8px; }
.install-manual-form button,
.install-location-button { min-height: 44px; padding: 0 14px; border: 0; border-radius: 8px; color: #fff; background: var(--ui-blue); font-weight: 700; }
/* Mobile control ledger: the canvas, not just the viewport, drives density. */
@media (max-width: 860px) {
  :root {
    --ui-control: 44px;
    --ui-control-compact: 40px;
    --ui-page-gutter: 14px;
  }

  html,
  body {
    min-width: 0;
    overflow-x: clip;
  }

  .app-shell,
  .app-layout {
    display: block;
    min-width: 0;
  }

  .sidebar,
  .app-sidebar,
  .site-sidebar {
    position: static;
    width: 100%;
    min-height: auto;
    height: auto;
    padding: max(14px, env(safe-area-inset-top)) var(--ui-page-gutter) 12px;
    border-right: 0;
    border-bottom: 1px solid var(--ui-border);
  }

  .sidebar > :not(nav):not(.sidebar-nav):not(.app-nav):not(.site-nav),
  .app-sidebar > :not(nav):not(.sidebar-nav):not(.app-nav):not(.site-nav),
  .site-sidebar > :not(nav):not(.sidebar-nav):not(.app-nav):not(.site-nav) {
    display: none;
  }

  .sidebar nav,
  .sidebar-nav,
  .app-nav,
  .site-nav {
    display: flex;
    gap: 6px;
    width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }

  .sidebar nav::-webkit-scrollbar,
  .sidebar-nav::-webkit-scrollbar,
  .app-nav::-webkit-scrollbar,
  .site-nav::-webkit-scrollbar {
    display: none;
  }

  .sidebar nav a,
  .sidebar-nav a,
  .app-nav a,
  .site-nav a {
    flex: 0 0 auto;
    min-height: var(--ui-control-compact);
    padding: 0 12px;
    white-space: nowrap;
  }

  main#main-content,
  .main-content,
  .app-main {
    width: 100%;
    min-width: 0;
    padding: 16px var(--ui-page-gutter) calc(24px + env(safe-area-inset-bottom));
  }

  .page-hero,
  .app-page-header,
  .page-header {
    min-height: 0;
    padding: 22px 18px;
  }

  .page-hero h1,
  .app-page-header h1,
  .page-header h1 {
    font-size: clamp(1.7rem, 7vw, 2.2rem);
    line-height: 1.05;
  }

  .split,
  .settings-split,
  .deployments-split,
  .device-detail-grid,
  .diagnostics-grid,
  .form-grid,
  .filter-grid,
  .toolbar-grid {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .panel,
  .details-card,
  .device-card,
  .deployment-card,
  .business-card,
  .settings-card {
    min-width: 0;
    border-radius: 14px;
  }

  .panel > header,
  .panel-header,
  .section-header,
  .toolbar,
  .row-head,
  .row-actions {
    flex-wrap: wrap;
    gap: 10px;
  }

  .panel > header > *,
  .panel-header > *,
  .section-header > *,
  .toolbar > *,
  .row-head > * {
    min-width: 0;
  }

  .filter-bar,
  .registry-toolbar,
  .client-toolbar,
  .deployment-toolbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
  }

  .filter-bar :is(input, select, .btn),
  .registry-toolbar :is(input, select, .btn),
  .client-toolbar :is(input, select, .btn),
  .deployment-toolbar :is(input, select, .btn) {
    width: 100%;
  }

  .btn,
  button,
  select,
  input[type="submit"],
  input[type="button"] {
    min-height: var(--ui-control);
    touch-action: manipulation;
  }

  .row-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .row-actions > * {
    width: 100%;
    min-width: 0;
  }

  .device-more-actions,
  .deployment-more-actions {
    min-width: 0;
  }

  .device-more-menu,
  .deployment-more-menu {
    position: fixed;
    z-index: 100;
    right: max(12px, env(safe-area-inset-right));
    left: max(12px, env(safe-area-inset-left));
    width: auto;
    max-width: none;
    transform: translate3d(0, 0, 0);
  }

  .device-more-menu :is(.btn, button, a),
  .deployment-more-menu :is(.btn, button, a) {
    justify-content: flex-start;
    width: 100%;
  }

  .deployment-summary,
  .device-summary,
  .business-summary,
  .client-summary,
  .settings-summary {
    min-width: 0;
    padding-right: 34px;
  }

  .deployment-summary::after,
  .device-summary::after,
  .business-summary::after,
  .client-summary::after,
  .settings-summary::after {
    right: 12px;
  }

  table,
  .data-table,
  .table-wrap {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  :is(input, select, textarea) {
    max-width: 100%;
    font-size: 16px;
  }
}

@media (max-width: 560px) {
  :root { --ui-page-gutter: 12px; }

  .page-hero,
  .app-page-header,
  .page-header { padding: 18px 16px; }

  .panel,
  .details-card,
  .device-card,
  .deployment-card,
  .business-card,
  .settings-card { border-radius: 12px; }

  .panel > header,
  .panel-header,
  .section-header { align-items: stretch; }

  .panel > header .btn,
  .panel-header .btn,
  .section-header .btn { width: 100%; }

  .device-card :is(.device-meta, .device-facts),
  .business-card :is(.business-meta, .client-meta),
  .settings-card :is(.settings-meta, .health-meta) {
    grid-template-columns: minmax(0, 1fr);
  }
}
/* Mobile remediation: keep accessibility available without leaving chrome on-screen. */
.skip-link {
  position: fixed;
  z-index: 1000;
  top: -72px;
  left: max(12px, env(safe-area-inset-left));
  padding: 10px 14px;
  border-radius: var(--ui-radius-control);
  background: var(--ui-navy);
  color: #fff;
  font-weight: 750;
  box-shadow: 0 10px 30px rgba(16, 24, 39, .24);
  transition: top .16s ease;
}

.skip-link:focus,
.skip-link:focus-visible {
  top: max(12px, env(safe-area-inset-top));
  color: #fff;
}

@media (max-width: 860px) {
  body.app-page main#main-content,
  body.app-page .main-content,
  body.app-page .app-main {
    padding-bottom: calc(108px + env(safe-area-inset-bottom));
  }

  .deployment-history-panel {
    padding: 14px;
  }

  .deployment-history-panel > :is(header, .panel-header, .section-header) {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
  }

  .deployment-history-panel > :is(header, .panel-header, .section-header) .btn {
    width: 100%;
  }

  .deployment-business-group,
  .deployment-point-group {
    min-width: 0;
    overflow: clip;
  }

  .deployment-business-group > summary,
  .deployment-point-head {
    min-height: 64px;
    padding: 12px 14px;
  }

  .deployment-row .deployment-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 4px 10px;
    min-height: 76px;
    padding: 12px 42px 12px 14px;
  }

  .deployment-row .deployment-title,
  .deployment-row .deployment-title small {
    min-width: 0;
  }

  .deployment-row .deployment-status {
    justify-self: start;
  }

  .deployment-row .deployment-share-box {
    padding: 14px;
  }

  .deployment-row .deployment-meta {
    gap: 12px;
    padding: 14px;
  }

  .deployment-row .deployment-open-log,
  .deployment-row .client-message {
    padding-inline: 14px;
  }
}

@media (max-width: 420px) {
  body.app-page main#main-content,
  body.app-page .main-content,
  body.app-page .app-main {
    padding-bottom: calc(114px + env(safe-area-inset-bottom));
  }

  .deployment-history-panel { padding: 12px; }

  .deployment-business-group > summary,
  .deployment-point-head { padding-inline: 12px; }

  .deployment-row .deployment-summary { padding-left: 12px; }
}
/* Compact operating surfaces: client/device and deployment ledgers. */
@media (max-width: 720px) {
  .desk-toolbar {
    gap: 12px;
  }

  .desk-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    padding: 0;
    border: 0;
    background: transparent;
  }

  .desk-summary > * {
    display: grid;
    align-content: center;
    min-height: 68px;
    padding: 10px 9px;
    border: 1px solid var(--ui-border);
    border-radius: 12px;
    background: #fff;
    color: var(--ui-ink);
    line-height: 1.15;
  }

  .desk-summary :is(strong, b) {
    display: block;
    font-size: 1.25rem;
    letter-spacing: -.03em;
  }

  .desk-summary :is(small, span) {
    min-width: 0;
    color: var(--ui-muted);
    font-size: .72rem;
    font-weight: 700;
    overflow-wrap: anywhere;
  }

  .desk-summary > :last-child {
    border-color: #ebd6a1;
    background: #fffaf0;
  }

  .remote-device-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 102px;
    gap: 12px;
    align-items: start;
    padding: 14px;
  }

  .remote-device-row > * {
    min-width: 0;
  }

  .remote-device-row .row-actions {
    grid-column: 2;
    grid-row: 1 / span 4;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    align-self: stretch;
    width: 102px;
  }

  .remote-device-row .row-actions > * {
    min-height: 44px;
  }

  .remote-device-row :is(.device-id, .remote-device-id, .device-access-id) {
    max-width: calc(100% - 114px);
  }

  .remote-device-row :is(.device-status, .agent-status, .device-version) {
    max-width: calc(100% - 114px);
  }

  .deployment-history-panel {
    padding: 0;
    border: 0;
    background: transparent;
  }

  .deployment-history-panel > :is(header, .panel-header, .section-header) {
    margin-bottom: 12px;
    padding: 16px;
    border: 1px solid var(--ui-border);
    border-radius: 14px;
    background: #fff;
  }

  .deployment-business-group {
    margin-bottom: 10px;
    border: 1px solid var(--ui-border);
    border-radius: 14px;
    background: #fff;
    box-shadow: none;
  }

  .deployment-business-group > summary {
    min-height: 62px;
    background: #fff;
  }

  .deployment-business-group[open] > summary {
    border-bottom: 1px solid var(--ui-border);
    background: var(--ui-blue-soft);
  }

  .deployment-point-group {
    border: 0;
    border-radius: 0;
    background: transparent;
  }

  .deployment-point-head {
    min-height: 58px;
    border-bottom: 1px solid var(--ui-border);
    background: #fff;
  }

  .deployment-row {
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .deployment-row > .deployment-summary {
    min-height: 68px;
    background: #fff;
  }

  .deployment-row[open] > .deployment-summary {
    border-bottom: 1px solid var(--ui-border);
    background: #f4f7fc;
  }

  .deployment-row .deployment-share-box {
    margin: 12px;
    padding: 12px;
    border-radius: 12px;
    background: #f7f9fc;
  }

  .deployment-row .deployment-meta {
    padding: 12px;
    background: #fff;
  }
}

@media (max-width: 420px) {
  .desk-summary {
    gap: 6px;
  }

  .desk-summary > * {
    min-height: 62px;
    padding: 9px 7px;
  }

  .desk-summary :is(strong, b) { font-size: 1.1rem; }
  .desk-summary :is(small, span) { font-size: .68rem; }

  .remote-device-row {
    grid-template-columns: minmax(0, 1fr) 92px;
    gap: 10px;
    padding: 12px;
  }

  .remote-device-row .row-actions { width: 92px; }
  .remote-device-row :is(.device-id, .remote-device-id, .device-access-id,
    .device-status, .agent-status, .device-version) { max-width: calc(100% - 102px); }
}
/* Final mobile deployment ledger: one fact at each hierarchy level. */
@media (max-width: 760px) {
  .app-page .deployment-history-panel > .panel-head {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 6px 12px;
    margin: 0 0 12px;
    padding: 16px;
    border: 1px solid var(--ui-rule);
    border-radius: 14px;
    background: var(--ui-surface);
  }

  .app-page .deployment-history-panel > .panel-head :is(h2,p) {
    margin: 0;
  }

  .app-page .deployment-history-panel > .panel-head .panel-actions {
    display: grid;
    grid-template-columns: auto minmax(0,1fr);
    align-items: center;
    gap: 10px;
    width: 100%;
    margin-top: 4px;
  }

  .app-page .deployment-history-panel > .panel-head .panel-actions .btn {
    width: 100%;
  }

  .app-page .deployment-business-group {
    overflow: hidden;
    border-radius: 14px;
  }

  .app-page .deployment-point-head {
    display: flex;
    min-height: 50px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0 14px;
    border-bottom: 1px solid var(--ui-rule);
    background: var(--ui-surface);
  }

  .app-page .deployment-point-head .point-marker,
  .app-page .deployment-point-head .point-name small {
    display: none;
  }

  .app-page .deployment-point-head .point-name strong {
    font-size: 13px;
  }

  .app-page .deployment-point-head .point-count {
    grid-column: auto;
    color: var(--ui-muted);
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
  }

  .app-page .deployment-row > .deployment-summary {
    grid-template-columns: minmax(0,1fr) auto 16px;
    min-height: 62px;
    padding: 10px 14px;
  }

  .app-page .deployment-row .pill {
    grid-column: auto;
    max-width: 132px;
    overflow: hidden;
    font-size: 11px;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .app-page .deployment-row .deployment-share-box {
    margin: 0;
    padding: 12px 14px;
    border: 0;
    border-bottom: 1px solid var(--ui-rule);
    border-radius: 0;
    background: var(--ui-surface-muted);
  }

  .app-page .deployment-row .wide-copy-line {
    display: grid;
    grid-template-columns: minmax(0,1fr) var(--ui-control) var(--ui-control);
    gap: 8px;
    align-items: center;
  }

  .app-page .deployment-row .wide-copy-line .btn:last-child,
  .app-page .deployment-row .wide-copy-line .deployment-share-action {
    grid-column: auto;
    width: var(--ui-control);
    min-width: var(--ui-control);
    padding: 0;
  }

  .app-page .deployment-row .wide-copy-line code {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .app-page .deployment-row .deployment-open-log {
    margin: 0;
    padding: 0 14px;
    border-bottom: 1px solid var(--ui-rule);
    background: var(--ui-surface);
  }

  .app-page .deployment-row .deployment-open-log > summary {
    min-height: 54px;
    padding-right: 28px;
  }

  .app-page .deployment-row .deployment-open-log > div {
    padding: 0 0 14px;
  }

  .app-page .deployment-row .deployment-meta,
  .app-page .deployment-row .client-message {
    display: none;
  }

  .app-page .deployment-row .row-actions {
    margin: 0;
    padding: 12px 14px;
    border-top: 0;
  }
}
/* Narrow deployment cards: preserve the complete operational fact. */
@media (max-width: 520px) {
  .app-page .deployment-row > .deployment-summary {
    grid-template-columns: minmax(0,1fr) minmax(120px,auto) 16px;
    gap: 6px;
  }

  .app-page .deployment-row .pill {
    max-width: none;
    overflow: visible;
    font-size: 10px;
    text-align: right;
    text-overflow: clip;
    white-space: normal;
  }

  .app-page .deployment-row .wide-copy-line code {
    font-size: clamp(10px, 2.2vw, 13px);
    letter-spacing: -.025em;
  }

  .app-page .deployment-open-log > div {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 10px;
  }

  .app-page .deployment-open-log > div > span {
    display: grid;
    grid-template-columns: 72px minmax(0,1fr);
    gap: 8px;
    align-items: start;
    padding: 10px 0;
    border-bottom: 1px solid var(--ui-rule);
  }

  .app-page .deployment-open-log > div > span:last-child {
    border-bottom: 0;
  }

  .app-page .deployment-open-log > div > span strong {
    min-width: 0;
    overflow-wrap: anywhere;
  }

  .app-page .deployment-group-links {
    margin: 0 10px 10px;
    border-left: 2px solid #d7e4fb;
  }

  .app-page .deployment-point-group {
    margin-left: 10px;
  }

  .app-page .deployment-point-head {
    min-height: 54px;
    padding: 0 12px;
    border: 1px solid var(--ui-rule);
    border-width: 1px 1px 1px 0;
    background: #f5f8ff;
  }

  .app-page .deployment-point-head .point-name strong {
    font-size: 14px;
    letter-spacing: .01em;
  }

  .app-page .deployment-point-head .point-count {
    padding: 4px 7px;
    border-radius: 999px;
    background: #fff;
  }

  .app-page .operator-tools {
    gap: 10px;
    padding: 16px;
  }

  .app-page .operator-tools-body {
    gap: 8px;
  }

  .app-page .operator-tool-card {
    position: relative;
    min-height: 78px;
    padding: 14px 14px 14px 76px;
  }

  .app-page .operator-tool-card[href*="install-operator.ps1"]::before,
  .app-page .operator-tool-card[href*="install-operator-mac"]::before {
    position: absolute;
    top: 14px;
    left: 14px;
    display: grid;
    width: 48px;
    height: 28px;
    place-items: center;
    border: 1px solid #b9cef9;
    border-radius: 7px;
    color: var(--ui-blue-dark);
    background: var(--ui-blue-soft);
    font-size: 10px;
    font-weight: 800;
  }

  .app-page .operator-tool-card[href*="install-operator.ps1"]::before { content: "Windows"; }
  .app-page .operator-tool-card[href*="install-operator-mac"]::before { content: "macOS"; color: var(--ui-success); border-color: #aad9c0; background: #edf8f1; }
}
/* Access metrics are filters, not passive copy. */
.app-page .desk-toolbar {
  grid-template-columns: minmax(0,1fr) minmax(220px,.5fr);
}

.app-page .desk-summary {
  grid-column: 1 / -1;
  order: -1;
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 10px;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
}

.app-page .desk-summary-card {
  display: grid;
  min-height: 82px;
  align-content: center;
  gap: 4px;
  padding: 14px 16px;
  border: 1px solid var(--ui-rule);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
  color: var(--ui-ink);
  text-align: left;
  cursor: pointer;
}

.app-page .desk-summary-card strong {
  font-size: 26px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.04em;
  line-height: 1;
}

.app-page .desk-summary-card span {
  color: var(--ui-muted);
  font-size: 12px;
  font-weight: 750;
}

.app-page .desk-summary-card:hover,
.app-page .desk-summary-card.is-active {
  border-color: #9dbbf8;
  background: var(--ui-blue-soft);
}

.app-page .desk-summary-card.is-online { border-color: #b7ddc7; }
.app-page .desk-summary-card.is-online.is-active { background: #edf8f1; }
.app-page .desk-summary-card.is-attention { border-color: #ead49d; }
.app-page .desk-summary-card.is-attention.is-active { background: #fff8e8; }

@media (max-width: 720px) {
  .app-page .desk-summary { gap: 8px; }
  .app-page .desk-summary-card { min-height: 72px; padding: 11px 10px; border-radius: 12px; }
  .app-page .desk-summary-card strong { font-size: 22px; }
  .app-page .desk-summary-card span { font-size: 10px; line-height: 1.15; }
}
/* Access directory: explicit client -> location -> device hierarchy. */
.app-page .remote-folder-list {
  display: grid;
  gap: 12px;
}

.app-page .remote-folder.remote-client {
  overflow: hidden;
  border: 1px solid var(--ui-rule);
  border-radius: var(--ui-radius-control);
  background: var(--ui-surface);
}

.app-page .remote-folder.remote-client > summary {
  min-height: 58px;
  padding: 9px 14px;
  background: var(--ui-surface);
}

.app-page .remote-folder.remote-client[open] > summary {
  border-bottom: 1px solid var(--ui-rule);
  background: var(--ui-blue-soft);
}

.app-page .remote-folder.remote-client > summary .remote-folder-title strong {
  font-size: 15px;
}

.app-page .remote-folder.remote-client[open] > .remote-subfolder {
  margin: 10px 12px 12px;
  border: 1px solid var(--ui-rule);
  border-left: 3px solid var(--ui-blue);
  background: var(--ui-surface-muted);
}

.app-page .remote-folder.remote-client .remote-subfolder-title {
  min-height: 46px;
  padding: 8px 12px;
  border: 0;
  border-bottom: 1px solid var(--ui-rule);
  background: var(--ui-surface);
}

.app-page .remote-folder.remote-client .remote-subfolder-body {
  padding: 0 12px 0 18px;
  background: var(--ui-surface-muted);
}

.app-page .remote-folder.remote-client .remote-device-row {
  min-height: 72px;
  padding: 8px 0;
  grid-template-columns: minmax(170px,1.15fr) 124px minmax(150px,.9fr) minmax(128px,.85fr) 88px;
  gap: 10px;
  background: transparent;
}

.app-page .remote-folder.remote-client .remote-device-row + .remote-device-row {
  border-top: 1px solid var(--ui-rule);
}

.app-page .remote-folder.remote-client .remote-device-name small,
.app-page .remote-folder.remote-client .remote-agent-state small,
.app-page .remote-folder.remote-client .remote-build-status small {
  font-size: 11px;
}

.app-page .remote-folder.remote-client .remote-actions,
.app-page .remote-folder.remote-client .remote-actions .device-actions-primary {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 6px;
  min-width: 0;
}

.app-page .remote-folder.remote-client .remote-actions :is(.btn, .device-more-actions > summary) {
  display: grid;
  width: 40px;
  min-width: 40px;
  min-height: 40px;
  padding: 0;
  place-items: center;
}

.app-page .remote-folder.remote-client .remote-actions .action-text {
  display: none;
}

.app-page .remote-folder.remote-client .remote-actions .device-more-actions > summary {
  font-size: 0;
}

.app-page .remote-folder.remote-client .remote-actions .device-more-actions > summary::before {
  content: "...";
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 1px;
}

@media (max-width: 980px) {
  .app-page .remote-folder.remote-client .remote-device-row {
    grid-template-columns: minmax(0,1.1fr) 112px minmax(130px,.9fr) 86px;
  }

  .app-page .remote-folder.remote-client .remote-build-status {
    display: none;
  }
}

@media (max-width: 720px) {
  .app-page .remote-folder-list { gap: 10px; }
  .app-page .remote-folder.remote-client[open] > .remote-subfolder { margin: 8px; }
  .app-page .remote-folder.remote-client .remote-subfolder-body { padding-left: 12px; }
  .app-page .remote-folder.remote-client .remote-device-row { min-height: 0; }
}
/* Desktop access ledger: stable columns and a quiet action rail. */
@media (min-width: 981px) {
  .app-page .remote-folder.remote-client .remote-device-row {
    grid-template-columns: minmax(200px,1.2fr) minmax(122px,.58fr) minmax(180px,.95fr) minmax(144px,.74fr) 86px;
    gap: 12px;
    min-height: 66px;
    padding-block: 7px;
  }
}

.app-page .remote-folder.remote-client .remote-id {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 6px;
}

.app-page .remote-folder.remote-client .remote-id code {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-page .remote-folder.remote-client .remote-id .icon-copy {
  display: grid;
  width: 34px;
  min-width: 34px;
  height: 34px;
  padding: 0;
  place-items: center;
}

.app-page .remote-folder.remote-client .remote-agent-state,
.app-page .remote-folder.remote-client .remote-build-status {
  min-width: 0;
}

.app-page .remote-folder.remote-client .remote-agent-state :is(strong,small),
.app-page .remote-folder.remote-client .remote-build-status :is(span,small) {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-page .remote-folder.remote-client .remote-actions {
  justify-self: end;
  padding-left: 4px;
  border-left: 1px solid var(--ui-rule);
}

.app-page .remote-folder.remote-client .remote-actions :is(.btn, .device-more-actions > summary) {
  width: 36px;
  min-width: 36px;
  min-height: 36px;
  border-radius: 9px;
}

.app-page .remote-folder.remote-client .remote-actions .device-more-actions > summary::before {
  font-size: 15px;
}

.app-page .remote-folder.remote-client .remote-subfolder-title .point-marker {
  width: 28px;
  min-width: 28px;
  height: 28px;
  border-radius: 8px;
}

.app-page .remote-folder.remote-client .remote-subfolder-title .point-name strong {
  font-size: 13px;
  letter-spacing: .02em;
}

.app-page .remote-folder.remote-client .remote-subfolder-title .point-name small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.app-page .remote-folder.remote-client .remote-device-row:hover {
  background: #f8fbff;
  box-shadow: inset 2px 0 0 var(--ui-blue);
}
/* Access directory breakpoints: desktop table, tablet ledger, mobile card. */
@media (min-width: 721px) and (max-width: 980px) {
  .app-page .remote-folder.remote-client .remote-device-row {
    grid-template-columns: minmax(160px,1.15fr) minmax(112px,.55fr) minmax(150px,.9fr) 82px;
    gap: 10px;
    min-height: 66px;
    padding-block: 8px;
  }

  .app-page .remote-folder.remote-client .remote-build-status { display: none; }
  .app-page .remote-folder.remote-client .remote-actions { justify-self: end; }
}

@media (max-width: 720px) {
  .app-page .topbar { margin-bottom: 14px; }
  .app-page .topbar h1 { font-size: clamp(25px, 8vw, 32px); }
  .app-page .topbar .subtle { font-size: 12px; line-height: 1.4; }

  .app-page .desk-toolbar {
    gap: 10px;
    padding: 14px;
  }

  .app-page .desk-summary { gap: 8px; }
  .app-page .desk-search, .app-page .desk-filter { min-width: 0; }

  .app-page .remote-folder.remote-client > summary {
    min-height: 54px;
    padding: 8px 12px;
  }

  .app-page .remote-folder.remote-client[open] > .remote-subfolder {
    margin: 8px;
  }

  .app-page .remote-folder.remote-client .remote-subfolder-title {
    min-height: 48px;
    padding: 8px 10px;
  }

  .app-page .remote-folder.remote-client .remote-subfolder-body {
    padding: 0 10px;
  }

  .app-page .remote-folder.remote-client .remote-device-row {
    grid-template-columns: minmax(0,1fr) 82px;
    grid-template-areas:
      "identity actions"
      "identifier actions"
      "agent agent"
      "build build";
    gap: 8px 10px;
    min-height: 0;
    padding: 12px 0;
  }

  .app-page .remote-folder.remote-client .remote-device-name { grid-area: identity; }
  .app-page .remote-folder.remote-client .remote-id { grid-area: identifier; }
  .app-page .remote-folder.remote-client .remote-agent-state { grid-area: agent; }
  .app-page .remote-folder.remote-client .remote-build-status { grid-area: build; }

  .app-page .remote-folder.remote-client .remote-actions {
    grid-area: actions;
    align-self: start;
    justify-self: end;
    padding-left: 8px;
    border-left: 1px solid var(--ui-rule);
  }

  .app-page .remote-folder.remote-client .remote-actions,
  .app-page .remote-folder.remote-client .remote-actions .device-actions-primary {
    gap: 5px;
  }

  .app-page .remote-folder.remote-client .remote-actions :is(.btn, .device-more-actions > summary) {
    width: 36px;
    min-width: 36px;
    min-height: 36px;
  }

  .app-page .remote-folder.remote-client .remote-agent-state,
  .app-page .remote-folder.remote-client .remote-build-status {
    display: flex;
    align-items: baseline;
    gap: 8px;
    min-width: 0;
  }

  .app-page .remote-folder.remote-client .remote-agent-state small,
  .app-page .remote-folder.remote-client .remote-build-status small {
    flex: 1;
  }
}

@media (max-width: 420px) {
  .app-page .desk-search, .app-page .desk-filter { grid-column: 1 / -1; }
  .app-page .remote-folder.remote-client .remote-device-row { grid-template-columns: minmax(0,1fr) 76px; }
  .app-page .remote-folder.remote-client .remote-actions { padding-left: 6px; }
}
/* One-line mobile device ledger: name, ID, state, actions. */
.app-page .remote-directory-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.app-page .remote-directory-head > span {
  display: none;
}

.app-page .remote-folder.remote-client .remote-actions .device-more-actions > summary::before {
  content: none;
}

@media (min-width: 521px) and (max-width: 720px) {
  .app-page .remote-folder.remote-client .remote-device-row {
    grid-template-columns: minmax(0,1fr) 96px minmax(104px,.7fr) 82px;
    grid-template-areas: "identity identifier agent actions";
    align-items: center;
    gap: 8px;
    min-height: 54px;
    padding: 8px 0;
  }

  .app-page .remote-folder.remote-client .remote-build-status {
    display: none;
  }

  .app-page .remote-folder.remote-client .remote-agent-state {
    display: block;
  }

  .app-page .remote-folder.remote-client .remote-agent-state small {
    display: none;
  }

  .app-page .remote-folder.remote-client .remote-device-name small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

@media (max-width: 520px) {
  .app-page .remote-folder.remote-client .remote-device-row {
    grid-template-columns: minmax(0,1fr) 90px 76px;
    grid-template-areas: "identity identifier actions";
    align-items: center;
    gap: 8px;
    min-height: 54px;
    padding: 8px 0;
  }

  .app-page .remote-folder.remote-client .remote-agent-state,
  .app-page .remote-folder.remote-client .remote-build-status {
    display: none;
  }

  .app-page .remote-folder.remote-client .remote-id .icon-copy {
    display: none;
  }

  .app-page .remote-folder.remote-client .remote-actions {
    padding-left: 6px;
  }
}
/* Public installation handoff is intentionally independent from the operator shell. */
@media (max-width: 760px) {
  body.install-page {
    background: #edf2f8;
  }

  .install-shell {
    grid-template-columns: minmax(0,1fr);
    min-height: 100dvh;
  }

  .install-brand-field {
    display: grid;
    grid-template-columns: 54px minmax(0,1fr);
    gap: 14px;
    align-items: center;
    min-height: 118px;
    padding: max(20px, env(safe-area-inset-top)) 20px 20px;
  }

  .install-brand-logo {
    width: 54px;
  }

  .install-brand-copy {
    margin: 0;
    min-width: 0;
  }

  .install-client-logo {
    max-width: 112px;
    max-height: 34px;
    margin-bottom: 7px;
  }

  .install-brand-copy p {
    font-size: 18px;
  }

  .install-brand-copy span,
  .install-brand-explainer {
    margin-top: 3px;
    font-size: 12px;
  }

  .install-brand-explainer { display: none; }

  .install-sheet {
    display: block;
    padding: 20px 16px calc(32px + env(safe-area-inset-bottom));
    background: #edf2f8;
  }

  .install-content {
    width: 100%;
  }

  .install-intro {
    padding: 20px;
    border-radius: 16px 16px 0 0;
    background: #fff;
  }

  .install-intro h1 {
    font-size: clamp(28px, 8vw, 36px);
  }

  .install-intro p {
    margin-bottom: 0;
    font-size: 14px;
  }

  .install-download-zone {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 12px;
    margin: 0;
    padding: 16px 20px 20px;
    border: 0;
    border-top: 1px solid var(--ui-rule);
    border-radius: 0;
    background: #fff;
  }

  .install-download-button {
    width: 100%;
    min-height: 52px;
  }

  .install-steps-section,
  .install-assurance,
  .install-alternative,
  .install-support {
    padding-inline: 20px;
    background: #fff;
  }

  .install-steps-section { padding-top: 18px; }
  .install-steps { gap: 14px; }
  .install-steps li { grid-template-columns: 36px minmax(0,1fr); gap: 12px; }
  .install-step-number { width: 36px; height: 36px; }
  .install-steps p { font-size: 13px; line-height: 1.45; }

  .install-assurance {
    margin-top: 0;
    padding-top: 18px;
    padding-bottom: 18px;
    border-left: 0;
    border-top: 1px solid var(--ui-rule);
  }

  .install-alternative,
  .install-support {
    margin-top: 0;
    padding-bottom: 1px;
  }

  .install-support { border-radius: 0 0 16px 16px; }
  .install-alternative-content,
  .install-manual-form { grid-template-columns: minmax(0,1fr); }
}
/* Public install handoff: identity first, assurance as a compact fact. */
.install-brand-field {
  justify-content: flex-start;
  gap: 48px;
}

.install-brand-copy {
  margin-top: 0;
}

.install-assurance {
  display: grid;
  grid-template-columns: 24px minmax(0,1fr);
  gap: 12px;
  align-items: start;
}

.install-assurance svg {
  display: block;
  width: 24px;
  height: 24px;
  min-width: 24px;
  color: var(--ui-blue);
}

.install-assurance p {
  min-width: 0;
}

@media (max-width: 760px) {
  .install-brand-field { gap: 14px; }
  .install-assurance { grid-template-columns: 22px minmax(0,1fr); }
  .install-assurance svg { width: 22px; height: 22px; min-width: 22px; }
}
/* Public install restore: light handoff surface, separate from the operator UI. */
body.install-page {
  --install-canvas: #f1f4f8;
  --install-surface: #fff;
  --install-ink: var(--ui-ink);
  --install-muted: var(--ui-muted);
  --install-rule: var(--ui-rule);
  --install-action: var(--ui-blue);
  --install-action-hover: var(--ui-blue-dark);
  margin: 0;
  background: var(--install-canvas);
}

.install-shell {
  grid-template-columns: minmax(300px,.62fr) minmax(0,1.38fr);
  width: 100%;
  min-height: 100dvh;
  margin: 0;
}

.install-brand-field {
  justify-content: space-between;
  min-height: 100%;
  padding: clamp(30px,4vw,54px);
  color: var(--install-ink);
  background: transparent;
}

.install-brand-lockup {
  width: max-content;
  padding: 11px 14px;
  background: #fff;
}

.install-brand-logo {
  width: min(250px,20vw);
  min-width: 182px;
}

.install-brand-copy {
  max-width: 18rem;
  margin: auto 0;
}

.install-brand-copy p {
  margin: 0 0 8px;
  color: var(--install-ink);
  font-size: clamp(28px,3.1vw,42px);
  font-weight: 760;
  line-height: 1.02;
}

.install-brand-copy span {
  color: var(--install-muted);
  font-size: 15px;
  font-weight: 600;
}

.install-brand-explainer {
  display: block;
  margin-top: 28px !important;
  color: var(--install-ink) !important;
  font-size: 15px !important;
  font-weight: 540 !important;
  line-height: 1.58 !important;
}

.install-sheet {
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 0;
  background: var(--install-surface);
  box-shadow: 0 20px 50px rgba(16,24,40,.09);
}

.install-content {
  width: min(100%,760px);
  margin: auto;
  padding: clamp(38px,4.5vw,54px) clamp(26px,7vw,78px);
}

.install-intro {
  max-width: 41rem;
  padding: 0;
  border-radius: 0;
  background: transparent;
}

.install-intro h1 {
  font-size: clamp(37px,4.2vw,54px);
  line-height: .98;
}

.install-intro p {
  max-width: 39rem;
  margin: 15px 0 0;
  font-size: 16px;
  line-height: 1.5;
}

.install-download-zone {
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  margin-top: clamp(32px,4vw,42px);
  padding: 20px 0;
  gap: 24px;
  border: 0;
  border-top: 1px solid var(--install-rule);
  border-bottom: 1px solid var(--install-rule);
  border-radius: 0;
  background: transparent;
}

.install-download-button,
.install-secondary-button {
  min-height: 54px;
  border: 1px solid var(--install-action);
  color: #fff;
  background: var(--install-action);
}

.install-steps-section {
  margin-top: clamp(34px,4vw,42px);
  padding: 0;
  background: transparent;
}

.install-steps-section h2 { font-size: clamp(23px,2.4vw,28px); }
.install-steps { margin: 22px 0 0; }
.install-steps li { padding-bottom: 15px; }
.install-step-number { border: 1px solid #8eaeF4; color: var(--install-action); background: #fff; }

.install-assurance {
  display: flex;
  margin-top: 2px;
  padding: 12px 0 0 60px;
  border: 0;
  background: transparent;
}

.install-assurance svg { width: 22px; height: 22px; min-width: 22px; color: var(--ui-success); }

.install-alternative,
.install-support {
  margin-top: 26px;
  padding: 0;
  border-radius: 0;
  border-bottom: 1px solid var(--install-rule);
  background: transparent;
}

@media (max-width: 860px) {
  .install-shell { grid-template-columns: 1fr; min-height: 0; }
  .install-brand-field { min-height: auto; padding: 23px 26px; }
  .install-brand-lockup { margin-bottom: 30px; padding: 8px 10px; }
  .install-brand-logo { width: 156px; min-width: 0; }
  .install-brand-copy { max-width: 38rem; margin: 0; }
  .install-client-logo { max-height: 38px; margin-bottom: 14px; }
  .install-brand-copy p { font-size: 25px; }
  .install-brand-explainer { max-width: 34rem; margin-top: 18px !important; }
  .install-content { max-width: 720px; margin: 0; }
}

@media (max-width: 620px) {
  .install-brand-field { padding: 24px 20px 26px; }
  .install-brand-lockup { margin-bottom: 25px; }
  .install-content { padding: 42px 20px; }
  .install-intro h1 { font-size: clamp(35px,12vw,49px); }
  .install-download-zone { grid-template-columns: 1fr; align-items: start; }
  .install-download-button { width: 100%; }
  .install-assurance { padding-left: 59px; }
  .install-alternative-content,
  .install-manual-form { grid-template-columns: 1fr; }
}
/* Public page guard: never inherit the dark operator rail. */
body.install-page {
  margin: 0 !important;
  background: #f1f4f8 !important;
}

body.install-page .install-brand-field {
  justify-content: space-between !important;
  min-height: 100% !important;
  padding: clamp(30px,4vw,54px) !important;
  color: var(--ui-ink) !important;
  background: #f1f4f8 !important;
}

body.install-page .install-brand-lockup {
  width: max-content !important;
  padding: 11px 14px !important;
  background: #fff !important;
}

body.install-page .install-brand-copy {
  max-width: 18rem !important;
  margin: auto 0 !important;
}

body.install-page .install-brand-copy p,
body.install-page .install-brand-explainer {
  color: var(--ui-ink) !important;
}

body.install-page .install-brand-copy span {
  color: var(--ui-muted) !important;
}

body.install-page .install-sheet {
  display: flex !important;
  flex-direction: column !important;
  padding: 0 !important;
  background: #fff !important;
}

body.install-page .install-content {
  width: min(100%,760px) !important;
  margin: auto !important;
  padding: clamp(38px,4.5vw,54px) clamp(26px,7vw,78px) !important;
}

@media (max-width: 860px) {
  body.install-page .install-brand-field {
    min-height: auto !important;
    padding: 23px 26px !important;
  }

  body.install-page .install-brand-copy {
    max-width: 38rem !important;
    margin: 0 !important;
  }
}
/* Public install compact type scale and explicitly secondary help. */
body.install-page .install-brand-copy p {
  font-size: clamp(24px,2.5vw,34px) !important;
}

body.install-page .install-brand-copy span,
body.install-page .install-brand-explainer {
  font-size: 13px !important;
}

body.install-page .install-intro h1 {
  font-size: clamp(34px,3.6vw,46px) !important;
}

body.install-page .install-intro p,
body.install-page .install-download-zone p {
  font-size: 14px !important;
}

body.install-page .install-steps-section h2 {
  font-size: clamp(21px,2.1vw,25px) !important;
}

body.install-page .install-steps strong { font-size: 14px; }
body.install-page .install-steps p { font-size: 12px; }

body.install-page .install-download-button {
  min-width: 220px;
  min-height: 48px;
  padding-inline: 14px;
  font-size: 14px;
  white-space: nowrap;
}

body.install-page .install-help {
  margin-top: 24px;
  border-top: 1px solid var(--ui-rule);
}

body.install-page .install-help-label {
  margin: 14px 0 0;
  color: var(--ui-muted);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}

body.install-page .install-help :is(.install-alternative,.install-support) {
  margin-top: 0;
}

@media (max-width: 620px) {
  body.install-page .install-brand-copy p { font-size: 22px !important; }
  body.install-page .install-intro h1 { font-size: clamp(30px,10vw,38px) !important; }
  body.install-page .install-download-button { width: 100%; min-width: 0; }
  body.install-page .install-help { margin-top: 20px; }
}
/* Client identity keeps its logo rhythm even when no asset is available. */
body.install-page .install-client-logo-slot {
  display: flex;
  width: 100%;
  min-height: 54px;
  align-items: center;
  margin-bottom: 18px;
}

body.install-page .install-client-logo {
  max-width: 132px;
  max-height: 46px;
  margin: 0;
}

@media (max-width: 860px) {
  body.install-page .install-client-logo-slot {
    min-height: 38px;
    margin-bottom: 14px;
  }
}
body.install-page .install-brand-copy .install-brand-explainer {
  font-size: 13px !important;
  font-weight: 540 !important;
  line-height: 1.58 !important;
}
