:root {
  --nav:#071f41;
  --nav-hover:#102f5d;
  --brand:#0b5cff;
  --brand-hover:#064bd5;
  --canvas:#f6f8fb;
  --card:#ffffff;
  --text:#111c2f;
  --subtle:#627087;
  --border:#dfe5ee;
  --border-strong:#cbd4e1;
  --success:#16833f;
  --success-bg:#eaf7ef;
  --warning:#b86400;
  --warning-bg:#fff4df;
  --danger:#c92323;
  --danger-bg:#fff0f0;
  --info:#155bd7;
  --info-bg:#edf4ff;
  --purple:#7147d9;
  --purple-bg:#f3efff;
  --shadow:0 1px 2px rgba(16,24,40,.04),0 1px 4px rgba(16,24,40,.03);
}

body { background:var(--canvas); color:var(--text); font-size:14px; line-height:1.45; }
.app-shell { min-height:100vh; display:grid; grid-template-columns:212px minmax(0,1fr); }
.side-nav { position:sticky; top:0; height:100vh; background:var(--nav); color:#fff; padding:22px 10px 16px; display:flex; flex-direction:column; z-index:20; }
.side-brand { display:flex; align-items:center; gap:10px; color:#fff; padding:0 12px 26px; font-size:19px; font-weight:800; letter-spacing:.08em; }
.side-brand:hover { color:#fff; text-decoration:none; }
.side-brand .mk { width:18px; height:18px; }
.side-brand .led { fill:var(--nav); }
.side-brand .led-b { fill:#56d782; }
.nav-list { display:flex; flex-direction:column; gap:4px; }
.nav-link { min-height:44px; display:flex; align-items:center; gap:12px; padding:0 12px; border-radius:8px; color:#d9e4f5; font-weight:520; }
.nav-link:hover { background:var(--nav-hover); color:#fff; text-decoration:none; }
.nav-link.active { background:#154e9d; color:#fff; box-shadow:inset 3px 0 #4c8dff; }
.nav-icon { width:20px; text-align:center; font-size:17px; line-height:1; opacity:.95; }
.nav-letter { font-size:12px; font-weight:850; letter-spacing:0; }
.nav-badge { margin-left:auto; min-width:22px; height:22px; padding:0 6px; display:inline-flex; align-items:center; justify-content:center; border-radius:999px; background:#df2b2b; color:#fff; font-size:12px; font-weight:750; }
.side-bottom { margin-top:auto; }

.workspace { min-width:0; display:flex; flex-direction:column; }
.topbar { height:64px; display:grid; grid-template-columns:180px minmax(260px,560px) 1fr auto; align-items:center; gap:18px; padding:0 28px; background:var(--card); border-bottom:1px solid var(--border); position:sticky; top:0; z-index:15; }
.scope-link { height:38px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 12px; color:var(--text); border:1px solid var(--border-strong); border-radius:7px; background:var(--card); font-weight:600; }
.scope-link:hover { text-decoration:none; border-color:var(--subtle); }
.scope-menu { position:relative; min-width:0; }
.scope-menu > summary { height:38px; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:0 12px; color:var(--text); border:1px solid var(--border-strong); border-radius:7px; background:var(--card); font-weight:650; cursor:pointer; list-style:none; }
.scope-menu > summary::-webkit-details-marker { display:none; }
.scope-menu > summary::after { content:"⌄"; color:var(--subtle); }
.scope-menu > summary > span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.scope-menu[open] > summary { border-color:#7fa5e4; box-shadow:0 0 0 3px rgba(11,92,255,.1); }
.scope-popover { position:absolute; top:45px; left:0; width:100%; min-width:280px; max-height:360px; overflow:auto; padding:7px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:0 16px 40px rgba(16,31,55,.16); z-index:50; }
.scope-option button { white-space:normal; }
.scope-popover-head { padding:8px 9px 6px; color:var(--subtle); font-size:12px; font-weight:600; }
.scope-option { margin:0; }
.scope-option button { width:100%; min-height:38px; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 10px; color:var(--text); background:transparent; border:0; border-radius:6px; text-align:left; font-size:14px; font-weight:560; }
.scope-option-label { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.scope-option button > [aria-hidden="true"] { flex:none; }
.scope-option button:hover { background:var(--info-bg); opacity:1; }
.scope-option button[aria-current="true"] { color:var(--info); background:var(--info-bg); font-weight:720; }
.scope-browse { display:block; margin-top:6px; padding:9px 10px 4px; border-top:1px solid var(--border); color:var(--info); font-size:12px; font-weight:680; }
.scope-loading { margin:5px 9px 9px; }
.global-search { position:relative; margin:0; }
.global-search::before { content:""; position:absolute; left:14px; top:50%; width:16px; height:16px; transform:translateY(-50%); background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2397a5ba' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='6.5'/%3E%3Cpath d='m16 16 4.5 4.5'/%3E%3C/svg%3E") no-repeat center / 16px 16px; pointer-events:none; }
.global-search input { width:100%; height:38px; padding:0 14px 0 42px; border:1px solid var(--border-strong); border-radius:7px; background:var(--card); }
.topbar-actions { grid-column:4; display:flex; align-items:center; gap:8px; }
.topbar-action { width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center; border:1px solid transparent; border-radius:50%; color:var(--subtle); background:transparent; }
.topbar-action:hover { border-color:var(--border); background:var(--canvas); text-decoration:none; }
.user-menu { display:flex; align-items:center; gap:9px; color:var(--text); padding-left:4px; }
.user-menu:hover { text-decoration:none; }
.avatar { width:34px; height:34px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; background:var(--info-bg); color:var(--info); font-weight:750; font-size:12px; }
.app-main { width:100%; max-width:1500px; margin:0 auto; padding:26px 28px 52px; }
.app-foot { margin-top:auto; padding:14px 28px 20px; color:var(--subtle); font-size:12px; }

.page-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:20px; }
.page-title h1 { margin:0 0 3px; font-size:28px; line-height:1.2; letter-spacing:-.025em; font-weight:760; }
.page-title p { margin:0; color:var(--subtle); }
.page-actions { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.page-actions .primary-action,.page-actions .secondary-action { white-space:nowrap; }
.read-only-banner { display:flex; align-items:center; gap:12px; margin-bottom:18px; padding:11px 14px; color:var(--info); background:var(--info-bg); border:1px solid color-mix(in srgb,var(--info) 35%,var(--border)); border-radius:8px; }
.read-only-banner span { color:var(--text); }
.primary-action,.secondary-action { min-height:38px; display:inline-flex; align-items:center; justify-content:center; gap:7px; padding:0 16px; border-radius:7px; font-weight:700; }
.primary-action { color:#fff; background:var(--brand); border:1px solid var(--brand); }
.primary-action:hover { color:#fff; background:var(--brand-hover); text-decoration:none; }
.secondary-action { color:var(--text); background:var(--card); border:1px solid var(--border-strong); }
.secondary-action:hover { text-decoration:none; border-color:var(--subtle); }
button.primary-action,button.secondary-action { font-size:14px; min-height:38px; padding:0 16px; }
.add-action { min-height:38px; display:inline-flex; align-items:center; padding:0 13px; color:var(--info); background:var(--card); border:1px solid color-mix(in srgb,var(--info) 42%,var(--border)); border-radius:7px; font-weight:700; }
.add-action:hover { color:var(--info); background:var(--info-bg); text-decoration:none; border-color:color-mix(in srgb,var(--info) 65%,var(--border)); }

.attention-banner { min-height:86px; display:flex; align-items:center; gap:17px; padding:17px 20px; margin-bottom:16px; border:1px solid color-mix(in srgb,var(--danger) 32%,var(--border)); border-radius:9px; background:var(--danger-bg); box-shadow:var(--shadow); }
.attention-icon { width:42px; height:42px; flex:none; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; color:#fff; background:var(--danger); font-weight:800; font-size:20px; }
.attention-copy { min-width:0; }
.attention-copy strong { display:block; color:var(--danger); font-size:18px; line-height:1.25; }
.attention-copy span { color:var(--text); }
.attention-banner .secondary-action { margin-left:auto; white-space:nowrap; color:var(--info); }
.healthy-banner { border-color:color-mix(in srgb,var(--success) 32%,var(--border)); background:var(--success-bg); }
.healthy-banner .attention-icon { background:var(--success); }
.healthy-banner .attention-copy strong { color:var(--success); }
/* First-run welcome, not an error: reuse the attention-banner layout with an
   informational (brand/info) tone instead of the danger red. */
.onboarding-banner { border-color:color-mix(in srgb,var(--info) 30%,var(--border)); background:var(--info-bg); }
.onboarding-banner .attention-icon { background:var(--info); }
.onboarding-banner .attention-copy strong { color:var(--info); }

.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:16px; }
.metric-card { min-height:116px; display:grid; grid-template-columns:48px 1fr; align-items:center; gap:14px; padding:17px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:var(--shadow); transition:border-color .15s, transform .15s; }
.metric-card { color:var(--text); }
.metric-card:hover { text-decoration:none; border-color:var(--border-strong); transform:translateY(-1px); }
.metric-icon { width:48px; height:48px; display:inline-flex; align-items:center; justify-content:center; border-radius:50%; }
.metric-icon svg { width:24px; height:24px; }
.attention-icon svg { width:24px; height:24px; }
.metric-icon.good { color:var(--success); background:var(--success-bg); }
.metric-icon.bad { color:var(--danger); background:var(--danger-bg); }
.metric-icon.live { color:var(--info); background:var(--info-bg); }
.metric-icon.warn { color:var(--warning); background:var(--warning-bg); }
.metric-label { display:block; font-weight:650; }
.metric-value { display:block; margin:1px 0; font-size:24px; line-height:1.1; font-weight:780; font-variant-numeric:tabular-nums; }
.metric-meta { display:block; color:var(--subtle); font-size:13px; }
.metric-card.good .metric-value { color:var(--success); }
.metric-card.bad .metric-value { color:var(--danger); }
.metric-card.live .metric-value { color:var(--info); }
.metric-card.warn .metric-value { color:var(--warning); }

.dashboard-grid { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(300px,.85fr); gap:14px; margin-bottom:14px; }
.bottom-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(300px,.95fr); gap:14px; align-items:start; }
.dashboard-grid.dashboard-single { grid-template-columns:minmax(0,1fr); }
.side-stack { display:grid; gap:14px; align-content:start; min-width:0; }
.success-labels small { display:block; color:var(--subtle); font-size:10.5px; }
.success-legend { display:flex; flex-wrap:wrap; gap:6px 14px; padding:4px 18px 16px; color:var(--subtle); font-size:11.5px; }
.success-legend i { display:inline-block; width:9px; height:9px; border-radius:2px; margin-right:5px; vertical-align:-1px; }
.success-legend .lg-ok { background:var(--success); }
.success-legend .lg-warn { background:var(--warning); }
.success-legend .lg-none { background:var(--border); }
td a.row-title,td .mname,td .machine-name { white-space:nowrap; }
.machine-plan-form > label + button,[data-destination-form] > .destination-fields + button { margin-top:14px; }
.machines-table td[data-label="Issue"],.client-machine-table td[data-label="Issue"] { min-width:200px; }
.machines-table td[data-label="Destination"],.client-machine-table td[data-label="Storage"] { min-width:120px; }
.machines-table td[data-label="Current activity"] { min-width:230px; }
.machines-table td[data-label="Backup status"] { min-width:180px; }
.fleet-refresh { margin:12px 0 8px; font-size:12px; }
.fleet-activity-filters { padding:12px 16px; }
@media (min-width:761px) and (max-width:1100px) {
  .user-menu .email-short { display:none; }
  [data-fleet-panel] .machines-table td[data-label="Backup status"] { min-width:140px; }
  [data-fleet-panel] .machines-table td[data-label="Current activity"] { min-width:160px; }
  [data-fleet-panel] .machines-table .status-pill { white-space:normal; max-width:160px; }
  [data-fleet-panel] .machines-table:not(.client-machine-table) th:nth-child(5),
  [data-fleet-panel] .machines-table:not(.client-machine-table) td:nth-child(5),
  [data-fleet-panel] .machines-table:not(.client-machine-table) th:nth-child(6),
  [data-fleet-panel] .machines-table:not(.client-machine-table) td:nth-child(6),
  [data-fleet-panel] .machines-table:not(.client-machine-table) th:nth-child(7),
  [data-fleet-panel] .machines-table:not(.client-machine-table) td:nth-child(7) { display:none !important; }
}
.m-hero-actions button,.m-hero-actions .secondary-action,.m-hero-actions details.omenu > summary { min-height:38px; font-size:14px; }
.report-storage { color:var(--muted); font-size:12.5px; }
.add-client { position:relative; }
.add-client > summary { list-style:none; cursor:pointer; }
.add-client > summary::-webkit-details-marker { display:none; }
.add-client-form { position:absolute; right:0; top:calc(100% + 8px); z-index:20; width:320px; display:grid; gap:12px; padding:16px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:var(--shadow); }
.settings-nav { display:flex; flex-wrap:wrap; gap:6px; margin:0 0 16px; }
.settings-nav a { padding:6px 12px; border:1px solid var(--border); border-radius:999px; background:var(--card); color:var(--text); font-size:13px; font-weight:600; }
.settings-nav a:hover { border-color:var(--border-strong); text-decoration:none; }
.settings-section-head .secondary-action { white-space:nowrap; flex:none; }
[id] { scroll-margin-top:80px; }
.spreadrow { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:10px 16px; align-items:end; margin-top:14px; }
.spreadrow > label { display:grid; gap:6px; margin:0; font-size:13px; font-weight:600; }
.spreadrow > label select { width:100%; }
.spreadrow > small { grid-column:1/-1; }
.app-main .crumb { margin-top:0; }
.add-client-form .primary-action { color:#fff; background:var(--brand); border-color:var(--brand); }
.schedule-card > .spreadrow { padding:0 18px 14px; }
.field .optional { margin-left:4px; color:var(--subtle); font-size:12px; font-weight:500; }
/* The hidden attribute always hides. Component display rules (field grids,
   flex rows) outranked the browser's own [hidden] rule, so panels the page
   hid, such as a weekly check's day and time under an unticked box, showed. */
[hidden] { display:none !important; }
/* One button size. Form buttons took the old base's 12.8px text while link
   buttons were 14px, so Save and Cancel pairs never matched. */
:is(.app-main,.wizard-main) :where(button) { font-size:14px; font-weight:650; }
/* A quiet red outline for destructive buttons outside a danger zone (Stop
   backup, Remove teammate); it read as a lone all-caps link. */
.app-main :where(button).danger { min-height:38px; padding:0 14px; color:var(--danger); background:transparent; border:1px solid color-mix(in srgb,var(--danger) 45%,var(--border)); border-radius:7px; font-size:14px; font-weight:650; letter-spacing:normal; text-transform:none; }
.app-main :where(button).danger:hover { background:color-mix(in srgb,var(--danger) 8%,transparent); text-decoration:none; }
.releases-table { min-width:0 !important; }
.releases-table td { overflow-wrap:anywhere; }
.alert-actions form:not(:has(select[name="action"] option[value="snooze"]:checked)) .snooze-hours { display:none; }
.audit-action { display:inline-block; }
.audit-action::first-letter { text-transform:uppercase; }
.verpill { white-space:nowrap; }
.bulk-bar button,.bulk-bar .secondary-action { white-space:nowrap; }
@media (max-width:1500px) {
  .machines-table .col-history { display:none; }
}
.client-deploy-layout,.detail-grid { align-items:start; }
.policy-icon svg,.license-mark svg,.recovery-lock-mark svg { width:22px; height:22px; }
.recovery-lock-mark-large svg { width:26px; height:26px; }
.machine-override { margin-top:14px; }
.machine-override > summary { cursor:pointer; font-weight:640; color:var(--info); }
.machine-override textarea { min-height:160px; }
.storage-row { display:grid; gap:2px; min-width:0; }
.storage-row small { font-size:12px; }
.storage-row small::first-letter { text-transform:uppercase; }
.nav-icon svg { width:18px; height:18px; display:block; margin:0 auto; }
.topbar-action svg { width:18px; height:18px; }
.topbar-alerts { position:relative; }
.topbar-badge { position:absolute; top:3px; right:1px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--danger); color:#fff; font-size:10.5px; font-weight:750; line-height:17px; text-align:center; }
details.user-dropdown > summary.user-menu { min-height:0; padding:0 4px; border:0; background:transparent; }
details.user-dropdown[open] > .omenu-pop { top:46px; }
.user-dropdown-who { padding:8px 12px 4px; color:var(--subtle); font-size:12px; }
.user-dropdown-who strong { display:block; color:var(--text); font-size:13px; overflow-wrap:anywhere; }
tr[data-href] { cursor:pointer; }
tr[data-href]:hover > td { background:color-mix(in srgb,var(--info) 5%,var(--card)); }
button.is-busy { cursor:progress !important; opacity:.7; }
/* Values read as values and placeholders as hints: fields were bold, so an
   empty "backup-alerts@yourmsp.com" looked already filled in. */
.app-main input,.app-main select,.app-main textarea,.wizard-main input,.wizard-main select,.wizard-main textarea { font-weight:400; font-size:14px; border-radius:6px; }
.app-main input::placeholder,.app-main textarea::placeholder,.wizard-main input::placeholder,.wizard-main textarea::placeholder { color:color-mix(in srgb,var(--subtle) 70%,transparent); font-weight:400; }
.app-main select,.app-main input:not([type="checkbox"]):not([type="radio"]):not([type="file"]) { min-height:40px; }
.app-main input[type="checkbox"],.app-main input[type="radio"],.wizard-main input[type="checkbox"],.wizard-main input[type="radio"] { accent-color:var(--brand); width:16px; height:16px; }
/* One table header style: the old base uppercase, letter-spaced headers
   still showed on tables without the data-table class. */
.app-main table th { font-size:11.5px; font-weight:650; letter-spacing:.02em; text-transform:none; color:var(--subtle); }
.app-main table td { vertical-align:middle; }
/* A table directly inside a card or panel has no second border of its own. */
:is(.panel,.content-card) > .tw,:is(.panel,.content-card) > div > .tw { border:0; border-radius:0; box-shadow:none; }
/* Times and dates never break across lines. */
.app-main td.time,.app-main td[data-label="Next run"],.app-main td[data-label="Latest backup"],.app-main td[data-label="Last backup"],.app-main td[data-label="When"] { white-space:nowrap; }
/* Color on a card border means status. Decorative accents (a blue top bar
   here, a purple one there, a gradient stripe on Recovery Lock, blue edges
   on plan cards) read as status and meant nothing. */
.card-accent { display:none; }
.recovery-lock-card { border-color:var(--border); }
.recovery-lock-card::before { display:none; }
.client-setup-card { border-left:1px solid var(--border); }
.client-setup-card:hover { border-left-color:var(--border-strong); }
/* Pills are as wide as their words, wherever they sit. */
.status-pill,.verpill { justify-self:start; width:max-content; max-width:100%; }
/* Run page figures use the stat tile look and fill their row. */
.app-main .metrics { grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:10px; margin:14px 0 18px; }
.app-main .metrics > div { position:relative; overflow:hidden; padding:14px 16px 13px 18px; background:var(--card); border:1px solid var(--border); border-radius:8px; box-shadow:var(--shadow); font-size:16px; font-weight:650; color:var(--text); }
.app-main .metrics > div::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--border-strong); }
.app-main .metrics .mk { margin-bottom:4px; color:var(--subtle); font-size:12px; font-weight:500; letter-spacing:normal; text-transform:none; }
.default-badge { display:inline-block; margin-left:8px; padding:2px 8px; border-radius:999px; background:var(--info-bg); color:var(--info); font-size:11px; font-weight:700; letter-spacing:.01em; vertical-align:2px; white-space:nowrap; }
/* One fold-out style: 14px semibold, a chevron that turns when open, blue
   for more options and red for a danger zone. There were five (a small blue
   link, a large one in its own card, black in a grey box, a heading, red). */
:is(.advanced-options,.adv,.cmds,.image-helper-option,.recovery-lock-team,.live-more,.client-new-plan,.advanced-card,.add-later,.shared-drive-guide,.tpl-create,.danger-disclosure) > summary { list-style:none; display:flex; align-items:center; gap:9px; cursor:pointer; color:var(--info); font-size:14px; font-weight:650; }
:is(.advanced-options,.adv,.cmds,.image-helper-option,.recovery-lock-team,.live-more,.client-new-plan,.advanced-card,.add-later,.shared-drive-guide,.tpl-create,.danger-disclosure) > summary::-webkit-details-marker { display:none; }
:is(.advanced-options,.adv,.cmds,.image-helper-option,.recovery-lock-team,.live-more,.client-new-plan,.advanced-card,.add-later,.shared-drive-guide,.tpl-create,.danger-disclosure) > summary::before { content:""; flex:none; width:6px; height:6px; margin:0 2px 2px 1px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .15s; }
:is(.advanced-options,.adv,.cmds,.image-helper-option,.recovery-lock-team,.live-more,.client-new-plan,.advanced-card,.add-later,.shared-drive-guide,.tpl-create,.danger-disclosure)[open] > summary::before { transform:rotate(45deg); margin-bottom:4px; }
:is(.advanced-options,.adv,.cmds,.image-helper-option,.recovery-lock-team,.live-more,.client-new-plan,.advanced-card,.add-later,.shared-drive-guide,.tpl-create,.danger-disclosure)[open] > summary { margin-bottom:12px; }
.danger-disclosure > summary { color:var(--danger); }
.history-heading { padding-bottom:10px; border-bottom:1px solid var(--border); }
.history-heading h2 { margin:0; padding:0; border:0; }
td a.mono,td .row-title { white-space:nowrap; }
.running-strip { margin-bottom:14px; }
.running-strip .running-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); }
.running-strip .running-item { border-right:1px solid var(--border); }
.attention-table .client-cell { white-space:nowrap; }
.attention-table .issue-reason { font-size:13px; }
.alerts-table td:first-child { width:1%; white-space:nowrap; }
.alerts-table td[data-label="Issue"] { min-width:260px; }
.alerts-table .recommended-action { color:var(--subtle); font-size:12.5px; }
.filter-toolbar { display:flex; gap:12px; }
.filter-toolbar .filter-field:first-child { flex:1; }
.filter-toolbar .filter-field .search-box { max-width:none; }
.filter-toolbar select { min-width:150px; }
.filter-toolbar.live > button { display:none; }
h2 span[data-scope-context] { font-size:inherit; font-weight:inherit; color:inherit; }
.filter-panel.report-filters { border-radius:9px; margin-bottom:14px; border-bottom:1px solid var(--border); }
.client-secondary-card form > button,.client-secondary-card form > .setting-choice { margin-top:12px; }
.jobcard-foot > .customize:last-child { margin-left:auto; padding-right:0 !important; }
.storage-row strong { color:var(--text); font-weight:650; }
.quietlist + .quietlist { margin-top:0; }
.machine-plan-form { margin-top:12px; }
.cell-title { display:block; }
[data-destination-form] .callout,.callout + form[data-destination-form] { margin-bottom:16px; }
.callout + form[data-destination-form] { margin-top:16px; }
.storage-type-icon svg { width:20px; height:20px; }
.client-setup-copy p strong { flex:none; width:48px; }
section.content-card + section.content-card,section.content-card + details.content-card { margin-top:14px; }
/* Sign-in: the app's card, blue primary and a labeled field. */
.login { background:var(--canvas); }
.login-card { max-width:360px; padding:36px 32px 30px; background:var(--card); border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow); text-align:left; }
.login-card .brand { justify-content:center; width:100%; color:var(--text); font-size:18px; letter-spacing:.12em; }
.login-card .tagline { text-align:center; margin:10px 0 26px; color:var(--subtle); font-size:13px; }
.login-card .btn-ms { display:flex; align-items:center; justify-content:center; min-height:42px; background:var(--brand); color:#fff; border-radius:7px; font-size:14px; font-weight:650; }
.login-card .pwform label { display:block; margin-bottom:6px; color:var(--text); font-size:13px; font-weight:650; }
.login-card .pwform input { min-height:42px; padding:0 12px; text-align:left; border:1px solid var(--border-strong); border-radius:7px; background:var(--card); color:var(--text); font-size:15px; }
.login-card .pwform button { min-height:42px; margin-top:12px; background:var(--brand); border:1px solid var(--brand); color:#fff; border-radius:7px; font-size:14px; font-weight:650; }
.login-card .pwform button:hover { background:var(--brand-hover); opacity:1; }
.login-card .alert { border-radius:7px; }
.not-found { margin-top:24px; padding:40px 24px; }
.not-found h1 { margin:0 0 6px; font-size:24px; }
.empty-state-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.reports-table td:nth-child(2),.reports-table td:nth-child(4),.reports-table td:nth-child(5) { white-space:nowrap; }
.reports-table td:first-child { width:1%; white-space:nowrap; }
.clamp2 { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
/* overflow-x:auto rather than hidden: a table wider than its panel used to be
   clipped with no scrollbar at every width above the phone breakpoint, which
   silently swallowed a whole column at ~1101px. Vertical stays hidden so the
   rounded corners still clip. */
.panel { background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:var(--shadow); overflow-x:auto; overflow-y:hidden; }
.panel-head { min-height:56px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 16px; border-bottom:1px solid var(--border); }
.panel-head h2 { margin:0; padding:0; border:0; color:var(--text); font-size:18px; letter-spacing:-.01em; text-transform:none; }
.panel-body { padding:16px; }
.panel-link { font-weight:650; }
.filter-chips { display:flex; gap:7px; padding:10px 16px; border-bottom:1px solid var(--border); overflow-x:auto; }
.filter-chip { min-height:32px; flex:none; display:inline-flex; align-items:center; gap:7px; padding:0 12px; border:1px solid var(--border-strong); border-radius:7px; color:var(--text); background:var(--card); font-weight:650; }
.filter-chip:hover { text-decoration:none; border-color:var(--subtle); }
.filter-chip.active { color:#fff; border-color:var(--brand); background:var(--brand); }
.filter-chip .count { color:var(--subtle); font-size:12px; }
.filter-chip.active .count { color:#fff; }

.data-table { width:100%; border-collapse:collapse; }
.data-table th { position:static; padding:9px 14px; background:var(--canvas); color:var(--subtle); font-size:11px; letter-spacing:.025em; text-transform:none; border-bottom:1px solid var(--border); }
.data-table td { padding:11px 14px; border-bottom:1px solid var(--border); vertical-align:middle; }
.data-table tr:last-child td { border-bottom:0; }
.data-table tbody tr:hover td { background:var(--info-bg); }
.row-title { color:var(--text); font-weight:680; }
.row-title:hover { color:var(--info); }
.client-cell { color:var(--subtle); }
.row-action { display:inline-flex; min-height:30px; align-items:center; padding:0 10px; border:1px solid color-mix(in srgb,var(--info) 45%,var(--border)); border-radius:5px; color:var(--info); background:var(--card); font-size:12px; font-weight:680; white-space:nowrap; }
.row-action:hover { text-decoration:none; background:var(--info-bg); }
.status-pill { display:inline-flex; align-items:center; gap:6px; min-height:25px; padding:0 9px; border-radius:5px; font-size:12px; font-weight:700; white-space:nowrap; }
.status-pill::before { content:""; width:6px; height:6px; border-radius:50%; background:currentColor; }
.status-pill.st-ok { color:var(--success); background:var(--success-bg); }
.status-pill.st-fail,.status-pill.st-unprot { color:var(--danger); background:var(--danger-bg); border:0; }
.status-pill.st-off { color:var(--subtle); background:color-mix(in srgb,var(--subtle) 14%,var(--card)); }
.status-pill.st-warn { color:var(--warning); background:var(--warning-bg); }
.status-pill.st-run { color:var(--info); background:var(--info-bg); }
.status-pill.st-neutral { color:var(--subtle); background:var(--canvas); }

.running-list { display:flex; flex-direction:column; }
.running-item { padding:15px 16px; border-bottom:1px solid var(--border); }
.running-item:last-child { border-bottom:0; }
.running-top { display:flex; justify-content:space-between; gap:10px; }
.running-top a { color:var(--text); font-weight:680; }
.running-client,.running-detail { color:var(--subtle); font-size:12px; }
.running-stop { display:inline-block; margin-top:8px; }
.connection-tests:not(.content-card) { margin-top:18px; border-top:1px solid var(--border); padding-top:14px; }
.connection-tests h3 { font-size:14px; margin:0 0 4px; }
.connection-test { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:10px; }
.connection-test-result { flex-basis:100%; margin:0; color:var(--subtle); font-size:12px; }
.running-stop button { font-size:12px; padding:3px 10px; }
.progress-track { height:6px; margin:9px 0 6px; background:var(--border); border-radius:999px; overflow:hidden; }
.progress-fill { height:100%; background:var(--brand); border-radius:999px; }
.run-phases { margin:0 0 18px; }
.run-phase-table .run-phase-num { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.run-phase-table .run-phase-bar { width:38%; }
.run-phase-bar span { display:block; height:6px; min-width:2px; background:var(--brand); border-radius:0 4px 4px 0; }
.run-phase-engine { margin-top:10px; }
.empty-compact { padding:24px 18px; text-align:center; color:var(--subtle); }

.client-health-row { display:grid; grid-template-columns:minmax(180px,1.4fr) .7fr .85fr .8fr 18px; align-items:center; gap:10px; padding:13px 16px; color:var(--text); border-bottom:1px solid var(--border); }
.client-health-row:last-child { border-bottom:0; }
.client-health-row:hover { background:var(--info-bg); text-decoration:none; }
.client-health-row strong { font-weight:680; }
.healthy-text { color:var(--success); }
.problem-text { color:var(--danger); }
.coverage { font-weight:720; font-variant-numeric:tabular-nums; }
.coverage-good { color:var(--success); }
.coverage-warn { color:var(--warning); }
.coverage-bad { color:var(--danger); }
.cell-note { display:block; margin-top:4px; color:var(--subtle); font-size:11px; }
.issue-reason { color:var(--text); font-size:12.5px; }
.note-quote { font-style:italic; }
.restore-target { display:flex; align-items:center; gap:12px; margin:0 0 16px; padding:13px 16px; background:var(--info-bg); border:1px solid color-mix(in srgb,var(--info) 30%,var(--border)); border-radius:9px; }
.restore-target .rt-icon { flex:none; width:22px; height:22px; color:var(--info); }
.restore-target .eyebrow { margin:0; }
.restore-target .rt-name { font-size:16px; font-weight:700; }
.restore-target .rt-client { color:var(--subtle); font-size:13px; }
.dest-label { font-size:12px; }
.recommended-action { font-weight:500; color:var(--text); }
.success-bars { height:174px; padding:18px 18px 12px; display:flex; align-items:flex-end; justify-content:space-between; gap:11px; }
.success-bar { flex:1; max-width:32px; min-width:14px; background:var(--success); border-radius:3px 3px 0 0; position:relative; }
.success-bar.warn { background:var(--warning); }
.success-bar.nodata { background:var(--border); }
.success-labels { display:flex; justify-content:space-between; gap:11px; padding:0 18px 14px; color:var(--subtle); font-size:11px; }
.success-labels span { flex:1; max-width:32px; min-width:14px; text-align:center; white-space:nowrap; display:flex; flex-direction:column; align-items:center; }
.success-bar.today { background:transparent; border:1.5px dashed var(--border-strong); border-bottom:0; }

.section-stack { display:flex; flex-direction:column; gap:14px; }
.content-card { padding:18px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:var(--shadow); }
.content-card h2,.content-card h3 { color:var(--text); text-transform:none; letter-spacing:normal; border:0; padding:0; }
.content-card h2 { margin:0 0 14px; font-size:18px; }
.content-card h3 { margin:0 0 4px; font-size:15px; }
.content-card p { margin:.35rem 0; }
.toolbar { display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:14px; }
.toolbar .search-box { min-width:260px; flex:1; max-width:520px; }
.toolbar input,.toolbar select { min-height:38px; border-radius:7px; background:var(--card); }
.filter-toolbar { align-items:flex-end; padding:14px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:var(--shadow); }
.filter-field { display:flex; flex-direction:column; gap:5px; color:var(--subtle); font-size:11px; font-weight:720; }
.filter-field:first-child { flex:1; }
.filter-field .search-box { width:100%; }
.compact-action { min-height:38px; }

.detail-hero { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:20px; margin-bottom:14px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:var(--shadow); }
.detail-identity { display:flex; align-items:flex-start; gap:14px; }
.device-icon,.client-icon,.policy-icon { width:46px; height:46px; display:flex; align-items:center; justify-content:center; border-radius:9px; color:var(--info); background:var(--info-bg); font-size:22px; }
.client-icon svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.detail-hero h1 { margin:0 0 4px; font-size:24px; }
.detail-meta { color:var(--subtle); }
.detail-status { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.machine-hero { align-items:stretch; }
.machine-hero .detail-status { min-width:min(720px,62%); display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:10px 14px; }
.machine-hero .detail-status > .chip { grid-column:1; grid-row:2; justify-self:start; }
.hero-facts { display:grid; grid-template-columns:repeat(4,minmax(100px,1fr)); gap:0; border:1px solid var(--border); border-radius:8px; overflow:hidden; }
.machine-hero .hero-facts { grid-column:1/-1; grid-row:1; width:100%; }
.hero-facts > span { min-width:0; padding:9px 12px; border-right:1px solid var(--border); }
.hero-facts > span:last-child { border-right:0; }
.hero-facts small,.hero-facts strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hero-facts small { color:var(--subtle); font-size:12px; font-weight:500; }
.hero-facts strong { margin-top:2px; font-size:13px; }
.machine-actions { grid-column:2; grid-row:2; display:flex; justify-content:flex-end; gap:8px; }
.health-guidance { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:15px 17px; margin-bottom:14px; background:var(--card); border:1px solid var(--border); border-left:4px solid var(--warning); border-radius:8px; box-shadow:var(--shadow); }
.health-guidance.st-fail,.health-guidance.st-unprot { border-left-color:var(--danger); }
.health-guidance.st-off { border-left-color:var(--subtle); }
.health-guidance strong,.health-guidance span { display:block; }
.health-guidance span { margin-top:2px; color:var(--subtle); }
.detail-tabs { display:flex; gap:22px; margin:0 0 14px; padding:0 4px; border-bottom:1px solid var(--border); overflow-x:auto; }
.detail-tabs a { flex:none; padding:11px 1px 10px; color:var(--subtle); font-size:13px; font-weight:680; border-bottom:2px solid transparent; white-space:nowrap; }
.detail-tabs a:hover { color:var(--text); text-decoration:none; }
.detail-tabs a.on { color:var(--info); border-bottom-color:var(--info); }
.detail-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(280px,.75fr); gap:14px; }
.stacked-cards { display:flex; flex-direction:column; gap:10px; }

.form-section { padding:20px; margin-bottom:14px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:var(--shadow); }
.form-section > h2 { margin:0 0 5px; padding:0; border:0; color:var(--text); font-size:18px; text-transform:none; letter-spacing:normal; }
.section-help { margin:0 0 16px; color:var(--subtle); }
.form-footer { position:sticky; bottom:0; display:flex; justify-content:flex-end; gap:10px; padding:14px 18px; margin:18px -20px -20px; background:var(--card); border-top:1px solid var(--border); }
.form-section input,.form-section select,.form-section textarea,.jobcard input,.jobcard select,.jobcard textarea { border-radius:6px; background:var(--card); }
.jobcard { background:var(--canvas); border:1px solid var(--border); border-radius:8px; padding:16px; }
.jobcard [hidden] { display:none !important; }
.schedule-card { position:relative; padding:0; overflow:hidden; background:var(--card); border-left:4px solid var(--info); box-shadow:var(--shadow); }
.schedule-legend { float:left; width:100%; padding:16px 18px 14px; border-bottom:1px solid var(--border); }
.schedule-legend + * { clear:both; }
.schedule-legend strong,.schedule-legend span { display:block; }
.schedule-legend strong { color:var(--text); font-size:17px; }
.schedule-legend span { margin-top:2px; color:var(--subtle); font-size:12px; font-weight:450; }
.schedule-primary { display:grid; grid-template-columns:minmax(180px,.8fr) minmax(240px,1.2fr); gap:14px; padding:17px 18px; }
.template-workload-editor { margin:0 18px 17px; padding:16px; color:var(--text); background:var(--info-bg); border:1px solid color-mix(in srgb,var(--info) 22%,var(--border)); border-radius:8px; }
.template-workload-editor[hidden] { display:none; }
.verify-suboption { margin:2px 0 2px 30px; padding-left:14px; border-left:2px solid color-mix(in srgb,var(--info) 30%,var(--border)); }
.verify-suboption[hidden] { display:none; }
.template-workload-editor > .field { margin-top:12px; }
.template-workload-editor textarea { width:100%; min-height:88px; resize:vertical; }
.compact-choice { margin-top:12px; }
.advanced-options { margin-top:12px; border-top:1px solid var(--border); padding-top:10px; }
.advanced-options summary { color:var(--info); cursor:pointer; font-weight:700; }
.advanced-options .field-grid { margin-top:12px; }
.setting-stack { display:grid; gap:14px; }
.indented-settings { margin:-6px 0 4px 42px; padding:14px; background:var(--canvas); border:1px solid var(--border); border-radius:8px; }
.visible-days { display:flex !important; gap:12px; flex-wrap:wrap; }
.sql-options { border:1px solid var(--border); border-radius:8px; padding:12px; }
.sql-options summary { color:var(--text); }
.content-card.advanced-options { padding:18px 20px; border-top:1px solid var(--border); }
.content-card.advanced-options > summary { font-size:16px; }
.machine-care { margin:16px 0 24px; }
.machine-care-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:14px; }
.recovery-access-gate { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:18px; margin-top:24px; padding:22px 24px; border-color:color-mix(in srgb,var(--purple) 30%,var(--border)); }
.recovery-access-gate h2 { margin:2px 0 5px; }
.recovery-access-gate p { margin:0; color:var(--subtle); max-width:760px; }
.recovery-locked { display:block; border-color:color-mix(in srgb,var(--warning) 45%,var(--border)); background:color-mix(in srgb,var(--warning) 6%,transparent); }
.recovery-locked-head { display:flex; gap:16px; align-items:flex-start; }
.recovery-locked-icon { flex:none; width:44px; height:44px; display:grid; place-items:center; border-radius:12px; color:var(--warning); background:color-mix(in srgb,var(--warning) 14%,transparent); }
.recovery-locked-icon svg { width:24px; height:24px; }
.recovery-locked-list { display:flex; flex-wrap:wrap; gap:6px 20px; margin:14px 0 18px; padding:0; list-style:none; }
.recovery-locked-list li { position:relative; padding-left:16px; color:var(--subtle); font-size:14px; }
.recovery-locked-list li::before { content:""; position:absolute; left:2px; top:7px; width:6px; height:6px; border-radius:50%; background:color-mix(in srgb,var(--warning) 70%,var(--border)); }
.backup-action-row { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin:0 0 18px; }
.restore-catalog { margin-top:24px; }
.catalog-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:12px; }
.catalog-heading h2 { margin:0 0 3px; }
.catalog-heading p { margin:0; color:var(--subtle); font-size:12px; }
.catalog-sync { display:inline-flex; align-items:center; gap:7px; color:var(--subtle); font-size:12px; font-weight:600; white-space:nowrap; }
.catalog-sync i { width:7px; height:7px; flex:none; border-radius:50%; background:var(--success); box-shadow:0 0 0 3px color-mix(in srgb,var(--success) 13%,transparent); }
.catalog-sync.is-stale i { background:var(--warning); box-shadow:0 0 0 3px color-mix(in srgb,var(--warning) 13%,transparent); }
.catalog-sync.is-syncing i { background:var(--info); animation:catalog-pulse 1.15s ease-in-out infinite; }
.catalog-sync.is-error i { background:var(--danger); }
@keyframes catalog-pulse { 50% { opacity:.35; transform:scale(.8); } }
.machine-care-actions form { display:grid; gap:7px; align-content:start; }
.machine-care-actions small { color:var(--subtle); line-height:1.45; }
.image-recovery { margin:24px 0; }
.image-recovery-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; }
.image-recovery-head h2 { margin:0 0 5px; }
.image-recovery-head p { max-width:720px; margin:0; color:var(--subtle); }
.secure-transfer-mark { flex:none; display:flex; align-items:center; gap:10px; min-width:205px; padding:10px 12px; color:var(--text); background:color-mix(in srgb,var(--success-bg) 68%,var(--card)); border:1px solid color-mix(in srgb,var(--success) 24%,var(--border)); border-radius:9px; }
.secure-transfer-mark > span:last-child { display:grid; gap:1px; }
.secure-transfer-mark strong { font-size:12px; line-height:1.3; }
.secure-transfer-mark small { color:var(--subtle); font-size:11px; font-weight:500; }
.secure-transfer-icon { width:27px; height:27px; flex:none; display:grid; place-items:center; color:var(--success); background:var(--success-bg); border-radius:8px; font-size:13px; font-weight:850; }
.image-helper-form { display:grid; grid-template-columns:minmax(260px,1fr) minmax(210px,auto); align-items:center; gap:20px; margin:20px 0 14px; padding:17px 18px; background:var(--canvas); border:1px solid var(--border); border-radius:9px; }
.image-helper-field { min-width:0; }
.select-control { position:relative; display:block; }
.select-control::after { content:""; position:absolute; right:15px; top:50%; width:7px; height:7px; border-right:2px solid var(--subtle); border-bottom:2px solid var(--subtle); transform:translateY(-70%) rotate(45deg); pointer-events:none; }
.image-helper-field select { height:44px; padding:0 44px 0 13px; color:var(--text); background:var(--card); border:1px solid var(--border-strong); border-radius:7px; appearance:none; -webkit-appearance:none; color-scheme:inherit; font-weight:650; box-shadow:0 1px 1px rgba(15,23,42,.04); }
.image-helper-field option { color:var(--text); background:var(--card); }
.image-helper-field select:hover { border-color:color-mix(in srgb,var(--info) 55%,var(--border-strong)); }
.image-helper-field select:focus { border-color:var(--info); box-shadow:0 0 0 3px color-mix(in srgb,var(--info) 18%,transparent); outline:0; }
.helper-sync { display:grid; justify-items:end; gap:4px; padding-left:20px; border-left:1px solid var(--border); text-align:right; }
.helper-sync > small { color:var(--subtle); font-size:11px; }
[data-no-image-helper][hidden] { display:none !important; }
.image-point-list { display:grid; gap:9px; margin-top:14px; }
.image-point-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.image-point-heading span { color:var(--subtle); font-size:12px; }
.image-point-row { display:grid; grid-template-columns:minmax(150px,.8fr) minmax(220px,1.2fr) auto; align-items:end; gap:12px; padding:13px 14px; border:1px solid var(--border); border-radius:8px; }
.image-point-row > div strong,.image-point-row > div small { display:block; }
.image-point-row > div small { margin-top:3px; color:var(--subtle); }
.image-security-note { display:grid; gap:4px; margin-top:16px; padding:13px 14px; color:var(--subtle); background:var(--info-bg); border-radius:8px; font-size:12px; line-height:1.5; }
.image-security-note strong { color:var(--text); }
.image-recovery .cmds { margin-top:16px; }
.client-default-setup { margin:26px 0; padding:20px; }
.client-setup-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.client-setup-card { min-height:126px; display:flex; align-items:center; justify-content:space-between; gap:18px; padding:17px 18px; color:var(--text); border-left:3px solid color-mix(in srgb,var(--info) 65%,var(--border)); }
.client-setup-card:hover { border-color:var(--border-strong); border-left-color:var(--info); text-decoration:none; }
.client-setup-copy { min-width:0; }
.client-setup-copy h3 { margin:0; font-size:17px; }
.client-setup-copy p { display:flex; gap:6px; margin:10px 0 0; color:var(--subtle); font-size:12px; }
.client-setup-copy p strong { color:var(--text); }
.client-setup-copy p span { overflow-wrap:anywhere; }
.client-setup-meta { flex:none; display:flex; align-items:center; gap:9px; color:var(--subtle); font-size:12px; }
.client-setup-meta b { color:var(--subtle); font-size:24px; font-weight:450; }
.client-setup-empty { grid-column:1/-1; display:flex; align-items:center; gap:12px; padding:18px; }
.client-setup-empty > span { flex:1; color:var(--subtle); font-size:13px; }
.client-default-head { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; }
.client-default-head h2 { margin:3px 0 4px; padding:0; border:0; color:var(--text); font-size:20px; letter-spacing:-.02em; text-transform:none; }
.client-default-head p { margin:0; color:var(--subtle); }
.default-setup-summary { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:16px 0; padding:14px 16px; color:var(--text); background:var(--canvas); border:1px solid var(--border); border-radius:8px; }
.default-setup-summary:hover { border-color:var(--info); text-decoration:none; }
.default-setup-summary span,.default-setup-summary small { display:block; }
.default-setup-summary small { margin-top:2px; color:var(--subtle); }
.resource-failing { display:flex; flex-direction:column; gap:3px; margin-top:8px; color:var(--danger); font-size:13px; }
.resource-failing strong { color:inherit; font-weight:640; }
.destination-failing { display:flex; flex-direction:column; gap:6px; margin:12px 0 4px; font-size:13px; }
.destination-failing strong { color:var(--text); font-size:12px; text-transform:uppercase; letter-spacing:.04em; }
.destination-failing a { color:var(--danger); }
a.stat-tile { color:inherit; text-decoration:none; }
a.stat-tile:hover { border-color:var(--info); text-decoration:none; }
.report-filters .filter-gap { flex:1; min-width:12px; }
.pager { display:flex; align-items:center; justify-content:center; gap:14px; padding:14px; border-top:1px solid var(--border); }
.client-default-change { margin-top:12px; }
.client-default-change > summary { display:inline-block; color:var(--info); font-size:13px; font-weight:640; cursor:pointer; }
.client-default-change > summary::-webkit-details-marker { display:none; }
.client-default-change > summary::before { content:"\203A"; display:inline-block; margin-right:6px; transition:transform .15s; }
.client-default-change[open] > summary::before { transform:rotate(90deg); }
.client-default-change[open] > summary { margin-bottom:4px; }
.client-default-form { display:flex; align-items:end; gap:10px; margin-top:16px; }
.client-default-form .field { flex:1; margin:0; }
.client-detail-page { width:100%; }
.client-detail-hero { align-items:center; }
.client-stat-row .attention-stat { border-color:var(--border); background:var(--card); }
.client-stat-row .attention-stat::before { background:var(--danger); }
.client-stat-row .attention-stat strong { color:var(--danger); }
.client-machines-panel { margin-bottom:30px; overflow:hidden; }
.client-panel-head { align-items:center; padding:17px 18px; }
.client-panel-head h2 { margin:0; }
.client-panel-head p { margin:3px 0 0; color:var(--subtle); font-size:13px; }
.client-machine-table-wrap { overflow-x:auto; }
.client-machine-table { min-width:960px; }
.client-machine-table td { vertical-align:middle; }
/* History dots and the app version live on the machine page; without them
   the plan column fits beside the rest at laptop width. */
.client-machine-table .col-history,.client-machine-table .col-app { display:none; }
.client-machine-source { min-width:160px; color:var(--subtle); }
.client-group-assignment,.client-group-policy { display:flex; align-items:center; gap:7px; flex-wrap:nowrap; }
.client-group-assignment select { min-width:118px; max-width:170px; }
.client-group-assignment button,.client-group-policy button { min-height:32px; padding:0 10px; }
.client-machine-action { text-align:right; }
.client-empty-state { display:flex; align-items:center; gap:14px; padding:24px 18px; }
.client-empty-state strong { font-size:15px; }
.client-empty-state > span { flex:1; color:var(--subtle); }
.client-section-heading { margin-top:30px; }
.client-protection-layout { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(320px,.75fr); align-items:start; gap:14px; }
.client-setups-panel { min-width:0; }
.subsection-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:10px; }
.subsection-heading h3 { margin:0; font-size:15px; }
.subsection-heading > span { color:var(--subtle); font-size:12px; }
.client-protection-layout .client-setup-grid { grid-template-columns:1fr; }
.client-protection-layout .client-default-setup { margin:0; }
.client-settings-heading { margin-top:34px; }
.client-secondary-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); align-items:stretch; gap:14px; }
.client-secondary-card { min-width:0; }
.secondary-card-head h2 { margin:3px 0 4px; }
.secondary-card-head p { margin:0 0 16px; color:var(--subtle); }
.client-notification-form { display:grid; gap:10px; }
.client-notification-form .field { margin:0; }
.client-notification-form button { justify-self:start; }
.client-group-table-wrap,.client-install-table-wrap { overflow-x:auto; border:1px solid var(--border); border-radius:8px; }
.client-group-table,.client-install-table { min-width:620px; }
.client-group-table th,.client-install-table th { background:var(--canvas); }
.client-group-table td,.client-install-table td { vertical-align:middle; }
.client-group-policy select { min-width:190px; max-width:280px; }
.client-group-delete,.client-token-delete { text-align:right; }
.client-add-group { display:flex; align-items:end; gap:10px; margin-top:14px; }
.client-add-group .field { flex:1; margin:0; }
.client-install-codes { margin-top:14px; }
.client-install-codes > summary { font-size:15px; }
.client-create-token { display:grid; grid-template-columns:minmax(160px,1fr) minmax(150px,.75fr) minmax(220px,1.25fr) auto; align-items:end; gap:10px; margin-top:14px; }
.client-create-token .field { margin:0; }
.deploy-create .field { margin:0 0 12px; }
.deploy-create button.primary { margin-top:4px; }
.deploy-command pre.cmd { white-space:pre-wrap; word-break:break-all; }
.protected-data-choice { display:grid; gap:8px; margin-top:14px; }
.backup-source-callout { display:flex; flex-direction:column; gap:2px; margin:0 0 14px; padding:12px 14px; background:var(--info-bg); border-left:3px solid var(--info); border-radius:0 7px 7px 0; }
.backup-source-callout span { color:var(--subtle); font-size:12px; font-weight:600; }
.backup-source-callout small { color:var(--subtle); }
.backup-source-callout strong { font-size:15px; }
.backup-source-callout a { font-weight:650; }
.workload-card { margin:0 0 14px; padding:17px 18px; }
.workload-card-head { display:flex; align-items:center; gap:8px; margin-bottom:13px; }
.workload-card-head strong { font-size:15px; }
.workload-card .pathslabel { margin:0; }
.workload-card textarea.paths { min-height:96px; }
.workload-card .adv { margin-top:10px; }
.edit-actions { display:flex; align-items:center; gap:14px; margin-top:16px; flex-wrap:wrap; }
.edit-actions a { color:var(--subtle); font-weight:600; }
.template-workload-label { padding-top:2px; color:var(--info); font-size:12px; font-weight:600; }
.schedule-card input,.schedule-card select { width:100%; min-height:40px; color:var(--text); font-size:14px; font-weight:500; }
.schedule-section { padding:15px 18px; border-top:1px solid var(--border); }
.schedule-section-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:12px; }
.schedule-section-head strong { font-size:14px; }
.schedule-section-head span { color:var(--subtle); font-size:12px; }
.schedule-section-head span code,.field small code { font-family:ui-monospace,Consolas,monospace; font-size:.92em; padding:1px 5px; background:var(--canvas); border:1px solid var(--border); border-radius:4px; color:var(--text); white-space:nowrap; }
.schedule-when { display:grid; grid-template-columns:minmax(180px,1fr) minmax(130px,.65fr) minmax(130px,.65fr); gap:14px; align-items:end; }
.schedule-card .daysrow { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; padding:10px 12px; background:var(--canvas); border:1px solid var(--border); border-radius:7px; }
.schedule-card .daysrow .chk { min-width:66px; margin:0; }
.schedule-options { background:var(--canvas); }
.schedule-card .qol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 18px; }
.schedule-card .qol .chk { margin:0; color:var(--text); font-size:13px; }
.schedule-card .qol input[type="checkbox"] { width:auto; min-height:0; }
.schedule-card .insertlimit input { width:72px; min-height:34px; margin:0 5px; }
.section-heading { margin:28px 0 14px; padding-bottom:10px; border-bottom:1px solid var(--border); }
.section-heading h2 { margin:0; padding:0; border:0; font-size:19px; }
.section-heading p { margin:2px 0 0; color:var(--subtle); }
.schedule-add { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:13px 0 20px; }
.schedule-add > span { color:var(--subtle); font-size:13px; }
.schedule-extra-list { flex:1 0 100%; }
.schedule-extra-list > div { margin-top:13px; }
.schedule-extra { position:relative; }
.schedule-extra .schedule-legend { padding-right:140px; }
.schedule-remove { position:absolute; top:13px; right:17px; min-height:32px; padding:0 10px; color:var(--danger); background:var(--card); border:1px solid color-mix(in srgb,var(--danger) 35%,var(--border)); border-radius:6px; font-size:12px; font-weight:680; }
.schedule-remove:hover { background:var(--danger-bg); border-color:var(--danger); }
.setting-choice { display:flex; align-items:flex-start; gap:10px; margin:0; cursor:pointer; }
.setting-choice input { width:16px; height:16px; min-height:0; flex:none; margin:3px 0 0; padding:0; }
.setting-choice strong,.setting-choice small { display:block; }
.setting-choice small { margin-top:3px; color:var(--subtle); font-size:12px; font-weight:450; }
.template-save-bar { position:sticky; bottom:0; z-index:5; display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:18px; padding:14px 16px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:0 -8px 24px rgba(16,31,55,.08); }
.template-save-bar span { color:var(--subtle); font-size:13px; }
.template-save-bar button { flex:none; }

.app-main > h2,.app-main > div[data-machine] > h2 { margin:26px 0 10px; padding:0; border:0; color:var(--text); font-size:18px; letter-spacing:-.01em; text-transform:none; }
.app-main > h2 span,.app-main > div[data-machine] > h2 span { color:var(--subtle); font-size:13px; font-weight:450; letter-spacing:normal; }
.run-outcome { display:grid; grid-template-columns:48px minmax(0,1fr); gap:16px; margin:0 0 16px; padding:20px; background:var(--danger-bg); border:1px solid color-mix(in srgb,var(--danger) 28%,var(--border)); border-radius:10px; }
.run-outcome-ok { background:var(--success-bg); border-color:color-mix(in srgb,var(--success) 28%,var(--border)); }
.run-outcome-warning { background:var(--warning-bg); border-color:color-mix(in srgb,var(--warning) 28%,var(--border)); }
.run-outcome-partial { background:var(--warning-bg); border-color:color-mix(in srgb,var(--warning) 28%,var(--border)); }
.run-outcome-icon { width:44px; height:44px; flex:none; display:flex; align-items:center; justify-content:center; color:#fff; background:var(--danger); border-radius:50%; }
.run-outcome-icon svg { width:26px; height:26px; }
.device-icon svg { width:24px; height:24px; }
.run-outcome-ok .run-outcome-icon { background:var(--success); }
.run-outcome-warning .run-outcome-icon { background:var(--warning); }
.run-outcome-partial .run-outcome-icon { background:var(--warning); }
.run-outcome-copy h2 { margin:0 0 5px; padding:0; border:0; font-size:20px; }
.run-outcome-copy > p { margin:0; max-width:760px; color:var(--text); }
.run-next-step { display:grid; grid-template-columns:auto minmax(0,1fr); gap:8px; margin-top:13px; padding-top:12px; border-top:1px solid color-mix(in srgb,var(--text) 12%,transparent); }
.run-next-step strong { color:var(--text); }
.run-next-step span { color:var(--subtle); }
.run-actions { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-top:15px; }
.run-actions form { margin:0; }
.run-actions .secondary-action { background:var(--card); }
.run-technical { margin-top:20px; }
.run-technical .log { max-height:520px; overflow:auto; padding:16px; color:var(--text); background:var(--canvas); border:1px solid var(--border); border-radius:7px; font-size:12px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; }
.history-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin:25px 0 10px; }
.history-heading h2 { margin:0 0 2px; font-size:19px; }
.history-heading p,.history-heading > span { margin:0; color:var(--subtle); font-size:13px; }
.history-filters { margin-bottom:12px; }
.history-table-wrap { margin:0; }
.history-table { min-width:960px; }
.history-table td { vertical-align:top; }
.history-table td > strong,.history-table td > small,.history-table td > span { display:block; }
.history-table td > .status-pill { display:inline-flex; align-items:center; justify-content:center; }
.history-table td > small { margin-top:3px; color:var(--subtle); line-height:1.4; }
.history-kind { display:inline-flex !important; width:max-content; margin-top:5px; padding:2px 7px; border-radius:999px; font-size:11px; font-weight:750; }
.drill-kind { color:var(--success); background:var(--success-bg); }
.history-table td:nth-child(4) { min-width:280px; max-width:430px; }
.history-time { white-space:nowrap; font-weight:650; }
.app-main .tw { background:var(--card); border:1px solid var(--border); border-radius:9px; overflow-x:auto; box-shadow:var(--shadow); }
.app-main .tw table th { background:var(--canvas); }
.app-main .card { background:var(--card); border-color:var(--border); border-radius:8px; box-shadow:var(--shadow); padding:15px 17px; }
.app-main .metrics div { background:var(--card); border-color:var(--border); border-radius:8px; box-shadow:var(--shadow); }
.app-main .metrics .mono { word-break:normal; }
.app-main .livecard { max-width:none; background:var(--card); border-color:var(--border); border-left-color:var(--brand); border-radius:8px; box-shadow:var(--shadow); }
.live-more { margin-top:10px; font-size:.78rem; }
.live-more > summary { width:max-content; color:var(--subtle); cursor:pointer; font-weight:650; }
.live-facts { display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:8px 16px; margin-top:10px; }
.live-facts span { color:var(--subtle); }
.live-facts strong { display:block; margin-top:2px; color:var(--text); font-variant-numeric:tabular-nums; }
.live-signal { margin:10px 0 0; color:var(--subtle); }
.live-signal-warn { color:var(--warning); }
.live-stop { margin:8px 0 0; font-weight:600; }
.live-stop-warn { color:var(--warning); }
.confirm-dialog { max-width:440px; border:1px solid var(--border); border-radius:10px; padding:20px; background:var(--card); color:var(--text); box-shadow:var(--shadow); }
.confirm-dialog::backdrop { background:rgba(0,0,0,.45); }
.confirm-text { margin:0 0 16px; line-height:1.45; }
.confirm-actions { display:flex; justify-content:flex-end; gap:8px; }
.app-main .notice { border-radius:7px; background:var(--card); border:1px solid var(--border); border-left:3px solid var(--warning); }
.app-main .restform { padding:20px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:var(--shadow); }
.app-main .restore-summary,.app-main .restore-form { max-width:1080px; }
.app-main .restform > h2 { margin:20px 0 9px; padding:0; border:0; color:var(--text); font-size:17px; letter-spacing:normal; text-transform:none; }
.app-main .browser { overflow:hidden; border-color:var(--border); border-radius:9px; background:var(--card); }
.app-main .browse-head { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; padding:14px; background:var(--canvas); border-bottom:1px solid var(--border); }
.restore-scope-option { display:flex; align-items:flex-start; gap:10px; min-height:66px; padding:12px 14px; border:1px solid var(--border); border-radius:8px; background:var(--card); cursor:pointer; }
.restore-scope-option:has(input:checked) { border-color:#7fa5e4; background:var(--info-bg); box-shadow:0 0 0 2px rgba(11,92,255,.07); }
.restore-scope-option input { flex:none; margin-top:4px; }
.restore-scope-option strong,.restore-scope-option small { display:block; }
.restore-scope-option small { margin-top:2px; color:var(--subtle); font-size:12px; font-weight:450; }
.tree-toolbar { min-height:62px; display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 16px; border-bottom:1px solid var(--border); }
.tree-toolbar strong,.tree-toolbar span { display:block; }
.tree-toolbar span { margin-top:2px; color:var(--subtle); font-size:12px; }
.app-main .tree-clear { min-height:32px; flex:none; }
.tree-columns { display:grid; grid-template-columns:minmax(0,1fr) 86px; padding:7px 16px 7px 86px; color:var(--subtle); background:var(--canvas); border-bottom:1px solid var(--border); font-size:11px; font-weight:750; letter-spacing:.06em; }
.tree-columns span:last-child { text-align:right; }
.app-main .tree { max-height:460px; overflow:auto; padding:0; font-size:14px; }
.tree ul { margin:0; padding:0; list-style:none; }
.tree .troot { padding:0; }
.tree .tkids { margin-left:34px; border-left:1px solid var(--border); }
.tnode { min-height:44px; display:grid; grid-template-columns:24px 24px 22px minmax(0,1fr) minmax(64px,86px); align-items:center; gap:7px; padding:4px 16px 4px 10px; border-bottom:1px solid var(--border); }
.tnode:hover { background:var(--canvas); }
.tnode.is-selected { background:var(--info-bg); }
.app-main .ttog { width:24px; min-height:24px !important; height:24px; display:inline-flex; align-items:center; justify-content:center; padding:0 !important; color:var(--subtle) !important; background:transparent !important; border:0 !important; border-radius:5px !important; font-size:14px; line-height:1; }
.app-main .ttog:hover { color:var(--text) !important; background:var(--border) !important; }
.tspacer { width:24px; }
.tcheck { width:16px; height:16px; margin:0; accent-color:var(--brand); }
.ticon { position:relative; display:inline-block; width:17px; height:15px; color:#7890af; }
.ticon-dir { height:12px; margin-top:2px; border:1.5px solid currentColor; border-radius:2px; background:color-mix(in srgb,currentColor 10%,transparent); }
.ticon-dir::before { content:""; position:absolute; left:1px; top:-5px; width:8px; height:5px; border:1.5px solid currentColor; border-bottom:0; border-radius:2px 2px 0 0; background:var(--card); }
.is-open .ticon-dir { color:var(--info); }
.ticon-file { width:14px; height:17px; border:1.5px solid currentColor; border-radius:2px; }
.ticon-file::after { content:""; position:absolute; right:-1.5px; top:-1.5px; width:5px; height:5px; border-left:1.5px solid currentColor; border-bottom:1.5px solid currentColor; background:var(--card); }
.app-main .tname { min-width:0; overflow:hidden; color:var(--text); text-overflow:ellipsis; white-space:nowrap; }
.app-main button.tname { min-height:32px !important; justify-self:start; max-width:100%; padding:0 !important; color:var(--text) !important; background:transparent !important; border:0 !important; text-align:left; font-weight:650; }
.app-main button.tname:hover { color:var(--info) !important; text-decoration:underline; text-underline-offset:2px; }
.tsize { color:var(--subtle); text-align:right; white-space:nowrap; font-size:12px; font-variant-numeric:tabular-nums; }
.tload,.tempty,.tree-error,.tree-empty { padding:14px 16px; color:var(--subtle); }
.tree-error { color:var(--danger); background:var(--danger-bg); }
.tree-loading { min-height:110px; display:flex; align-items:center; justify-content:center; gap:8px; color:var(--subtle); }
.tree-selection { min-height:44px; display:flex; align-items:center; padding:9px 16px; background:var(--canvas); border-top:1px solid var(--border); }
.selcount { margin:0; padding:0; color:var(--text); font-size:13px; font-weight:650; }
.app-main .dest { border-color:var(--border); }
.app-main .log { background:#111827; color:#dbe6f5; border-color:#27364b; border-radius:8px; }
.app-main .rowform,.app-main > form.inline { padding:13px 15px; background:var(--card); border:1px solid var(--border); border-radius:8px; }
.app-main input,.app-main select,.app-main textarea { background:var(--card); border-color:var(--border-strong); }
/* Action hierarchy: buttons are QUIET by default (outline). The one thing a
   screen wants you to do gets class "primary" (or .primary-action on links)
   — at most one filled action per view, sometimes zero. */
.app-main button:where(:not(.ghost):not(.danger):not(.primary):not(.tname)) { min-height:38px; padding:0 15px; color:var(--text); background:transparent; border:1px solid var(--border-strong); border-radius:7px; }
.app-main button:where(:not(.ghost):not(.danger):not(.primary):not(.tname)):hover { background:var(--card); border-color:var(--subtle); opacity:1; }
/* A form's commit button (Save / Create / Apply) is that form's one primary,
   so promote it to filled — without recreating the button wall, since each
   sits in its own form-action container. */
.app-main button.primary,.wizard-main button:where(:not(.ghost):not(.danger)),
.app-main :is(.form-actions,.member-form-actions,.template-save-bar,.guided-actions) > button:where(:not(.ghost):not(.danger):not(.secondary-action)),
.app-main .settings-form > button:where(:not(.ghost):not(.danger)),
.app-main .edit-actions > button:first-child:where(:not(.ghost):not(.danger)),
.app-main .cfg > button:where(:not(.ghost):not(.danger)) { min-height:38px; padding:0 15px; color:#fff; background:var(--brand); border-color:var(--brand); border-radius:7px; }
.app-main button.primary:hover,.wizard-main button:where(:not(.ghost):not(.danger)):hover,
.app-main :is(.form-actions,.member-form-actions,.template-save-bar,.guided-actions) > button:where(:not(.ghost):not(.danger):not(.secondary-action)):hover,
.app-main .settings-form > button:where(:not(.ghost):not(.danger)):hover,
.app-main .edit-actions > button:first-child:where(:not(.ghost):not(.danger)):hover,
.app-main .cfg > button:where(:not(.ghost):not(.danger)):hover { background:var(--brand-hover); opacity:1; }
:where(.app-main,.wizard-main) button.ghost { min-height:38px; padding:0 13px; background:var(--card); border-color:var(--border-strong); border-radius:7px; }
.app-main button:disabled,.wizard-main button:disabled { cursor:not-allowed; opacity:.55; }
.app-main input:disabled,.app-main select:disabled,.app-main textarea:disabled,.wizard-main input:disabled,.wizard-main select:disabled,.wizard-main textarea:disabled { opacity:.5; cursor:not-allowed; background:var(--canvas); color:var(--subtle); }
.app-main :is(.client-default-form,.client-add-group,.client-create-token) button:not(.danger) { min-height:40px; }
.app-main :is(.client-group-assignment,.client-group-policy) :is(select,button) { height:32px; min-height:32px; }
.field-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.field { display:flex; flex-direction:column; gap:6px; color:var(--text); font-size:13px; font-weight:650; }
.field small { color:var(--subtle); font-weight:450; line-height:1.4; }
.field-label { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.field-label small { font-size:11px; }
.field input,.field select { width:100%; min-height:40px; }
.field-wide { grid-column:1/-1; }
.settings-form { margin-top:18px; }
.settings-form > button { margin-top:18px; }
.workspace-admin-stack { display:grid; gap:18px; margin-bottom:18px; }
.workspace-overview-card { position:relative; overflow:hidden; padding:24px; }
.settings-section-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.settings-section-head h2 { margin-bottom:3px; }
.settings-section-head p { margin:0; color:var(--subtle); font-size:13px; line-height:1.5; overflow-wrap:anywhere; }
.workspace-overview-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(260px,.8fr); gap:28px; margin-top:24px; }
.workspace-profile-form { margin:0; }
.workspace-profile-form .form-actions { justify-content:flex-start; }
.workspace-readonly { display:flex; flex-direction:column; gap:5px; padding:17px; border:1px solid var(--border); border-radius:9px; background:var(--canvas); }
.workspace-readonly span { color:var(--subtle); }
.license-summary { padding:20px; border:1px solid var(--border); border-radius:12px; background:linear-gradient(145deg,var(--canvas),var(--card)); }
.license-summary-head { display:flex; align-items:center; gap:12px; }
.license-summary-head h3 { margin:2px 0 0; font-size:18px; }
.license-usage { display:block; margin-top:20px; font-size:22px; letter-spacing:-.02em; }
.license-summary p { margin:8px 0 0; color:var(--subtle); font-size:13px; line-height:1.55; }
.license-summary .callout { margin-top:16px; font-size:12px; line-height:1.5; }
.workspace-id { display:block; margin-top:18px; color:var(--subtle); overflow-wrap:anywhere; }
.license-mark { width:38px; height:38px; flex:none; display:flex; align-items:center; justify-content:center; border-radius:10px; color:var(--purple); background:var(--purple-bg); font-weight:850; }
.team-card { padding:24px; scroll-margin-top:82px; }
.team-card[data-team-locked="1"] .member-access-panel,.team-card[data-team-locked="1"] .invite-form { display:none; }
.team-card[data-team-locked="1"] .invite-panel { grid-template-columns:1fr; }
.inline-notice { margin-top:18px; padding:12px 14px; border:1px solid var(--border); border-radius:8px; font-size:13px; line-height:1.5; }
.notice-success { color:var(--success); border-color:color-mix(in srgb,var(--success) 32%,var(--border)); background:var(--success-bg); }
.notice-warning { color:var(--warning); border-color:color-mix(in srgb,var(--warning) 32%,var(--border)); background:var(--warning-bg); }
.role-guide { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:22px; }
.role-guide article { display:flex; align-items:flex-start; gap:10px; min-height:112px; padding:14px; border:1px solid var(--border); border-radius:10px; background:var(--canvas); }
.role-guide strong { display:block; font-size:13px; }
.role-guide p { margin:4px 0 0; color:var(--subtle); font-size:12px; line-height:1.45; }
.role-icon { width:27px; height:27px; flex:none; display:flex; align-items:center; justify-content:center; border-radius:8px; font-size:12px; font-weight:850; }
.role-owner { color:var(--purple); background:var(--purple-bg); }
.role-admin { color:var(--brand); background:var(--info-bg); }
.role-tech { color:var(--success); background:var(--success-bg); }
.role-read { color:var(--subtle); background:var(--card); border:1px solid var(--border); }
.team-list { display:grid; gap:10px; margin-top:22px; }
.team-member { border:1px solid var(--border); border-radius:10px; background:var(--canvas); overflow:hidden; }
.team-member-summary { min-height:70px; display:grid; grid-template-columns:36px minmax(180px,1fr) auto; align-items:center; gap:12px; padding:14px 16px; }
.team-identity { min-width:0; }
.team-identity strong,.team-identity small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.team-identity small { margin-top:2px; color:var(--subtle); font-size:12px; }
.member-badges { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:7px; }
.access-pill { display:inline-flex; align-items:center; min-height:25px; padding:3px 9px; border:1px solid var(--border); border-radius:999px; color:var(--subtle); background:var(--card); font-size:11px; font-weight:700; }
.member-access-panel { border-top:1px solid var(--border); }
.member-access-panel > summary { padding:11px 16px; color:var(--brand); font-size:12px; font-weight:750; cursor:pointer; list-style:none; }
.member-access-panel > summary::-webkit-details-marker { display:none; }
.member-access-panel > summary::after { content:"+"; float:right; color:var(--subtle); }
.member-access-panel[open] > summary::after { content:"−"; }
.member-access-form { padding:16px; border-top:1px solid var(--border); background:var(--card); }
.member-form-grid { display:grid; grid-template-columns:minmax(180px,.55fr) minmax(0,1.45fr); gap:18px; align-items:start; }
.member-form-actions { display:flex; justify-content:flex-end; margin-top:14px; }
.member-secondary-actions { display:flex; justify-content:flex-end; gap:8px; padding:0 16px 16px; background:var(--card); }
.member-secondary-actions form { margin:0; }
.client-access-field { min-width:0; margin:0; padding:0; border:0; }
.client-access-field legend { margin-bottom:8px; color:var(--text); font-size:13px; font-weight:650; }
.client-access-field > small { display:block; margin-top:8px; color:var(--subtle); font-size:11px; }
.access-options { display:flex; flex-wrap:wrap; gap:16px; min-height:40px; align-items:center; padding:9px 12px; border:1px solid var(--border); border-radius:8px; background:var(--canvas); }
.access-options label { display:flex; align-items:center; gap:6px; color:var(--text); font-size:13px; font-weight:600; cursor:pointer; }
.client-picker { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; max-height:168px; margin-top:8px; padding:10px; overflow:auto; border:1px solid var(--border); border-radius:8px; background:var(--canvas); }
.client-picker[hidden] { display:none; }
.client-picker label { display:flex; align-items:center; gap:7px; min-width:0; padding:7px 8px; border-radius:6px; color:var(--text); font-size:12px; font-weight:600; cursor:pointer; }
.client-picker label:hover { background:var(--info-bg); }
.client-picker span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.client-picker p { grid-column:1/-1; margin:4px; color:var(--subtle); font-size:12px; }
.invite-panel { display:grid; grid-template-columns:minmax(240px,.8fr) minmax(0,1.4fr); gap:28px; margin-top:24px; padding:22px; border:1px solid var(--border); border-radius:12px; background:linear-gradient(145deg,var(--canvas),var(--card)); }
.invite-panel-copy h3 { margin:4px 0 7px; font-size:19px; }
.invite-panel-copy > p { margin:0; color:var(--subtle); font-size:13px; line-height:1.55; }
.invite-form { min-width:0; }
.invite-fields { display:grid; grid-template-columns:minmax(0,1fr) 180px; gap:12px; }
.invite-form .client-access-field { margin-top:14px; }
.form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:16px; }
.choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.choice-card { display:flex; align-items:flex-start; gap:9px; padding:13px; border:1px solid var(--border); border-radius:8px; cursor:pointer; }
.choice-card:has(input:checked) { border-color:#7fa5e4; background:var(--info-bg); }
.choice-card input { margin-top:3px; }
.choice-card strong,.choice-card small { display:block; }
.choice-card small { margin-top:2px; color:var(--subtle); font-weight:450; }
.settings-status { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; padding:14px 0; border-bottom:1px solid var(--border); }
.settings-status:last-child { border-bottom:0; }
.settings-status p { margin:2px 0 0; color:var(--subtle); }
.recovery-lock-card { position:relative; overflow:hidden; border-color:color-mix(in srgb,var(--purple) 30%,var(--border)); }
.recovery-lock-card::before { content:""; position:absolute; inset:0 auto 0 0; width:4px; background:linear-gradient(var(--purple),var(--info)); }
.recovery-lock-head { display:grid; grid-template-columns:44px minmax(0,1fr) auto; align-items:start; gap:13px; }
.recovery-lock-head h2 { margin:1px 0 3px; }
.recovery-lock-head p { max-width:680px; margin:0; color:var(--subtle); }
.recovery-lock-mark { width:44px; height:44px; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,var(--purple),var(--info)); border-radius:12px; box-shadow:0 7px 18px color-mix(in srgb,var(--purple) 20%,transparent); font-size:17px; font-weight:850; }
.recovery-lock-mark-large { width:56px; height:56px; margin-bottom:18px; border-radius:15px; font-size:20px; }
.recovery-lock-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; margin:18px 0 0; overflow:hidden; background:var(--border); border:1px solid var(--border); border-radius:9px; }
.recovery-lock-facts > span { display:grid; gap:4px; padding:12px 14px; color:var(--subtle); background:var(--canvas); font-size:11px; }
.recovery-lock-facts strong { color:var(--text); font-size:13px; }
.recovery-lock-actions { display:flex; align-items:center; gap:9px; flex-wrap:wrap; margin-top:16px; }
.recovery-lock-actions form { margin:0; }
.recovery-lock-setup { margin-top:16px; padding:16px; background:var(--canvas); border:1px solid var(--border); border-radius:9px; }
.recovery-lock-setup[hidden] { display:none !important; }
.recovery-lock-setup img { width:180px; height:180px; padding:8px; background:#fff; border-radius:8px; }
.recovery-lock-enroll { display:grid; grid-template-columns:auto minmax(220px,1fr); gap:18px; align-items:center; }
.recovery-lock-enroll h3 { margin:0 0 5px; }
.recovery-lock-enroll p { margin:0 0 10px; color:var(--subtle); }
.recovery-lock-enroll code { user-select:all; }
.recovery-lock-team { margin-top:16px; border-top:1px solid var(--border); padding-top:12px; }
.recovery-lock-team summary { color:var(--text); cursor:pointer; font-weight:680; }
.recovery-lock-team-list { margin-top:10px; }
.recovery-lock-team-list > div { min-height:48px; display:flex; align-items:center; gap:10px; padding:8px 0; border-top:1px solid var(--border); }
.recovery-lock-team-list > div > span:first-child { min-width:0; flex:1; }
.recovery-lock-team-list strong,.recovery-lock-team-list small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.recovery-lock-team-list small { color:var(--subtle); }
.recovery-stepup-page,.recovery-codes-page { max-width:620px; margin:34px auto; }
.recovery-stepup-card,.recovery-codes-card { padding:30px; }
.recovery-stepup-card h1,.recovery-codes-card h1 { margin:2px 0 8px; font-size:26px; }
.recovery-stepup-card > p,.recovery-codes-card > p { color:var(--subtle); }
.recovery-stepup-card > button { width:100%; margin:14px 0; min-height:44px; }
.recovery-stepup-card details { margin-top:10px; padding:12px 14px; border:1px solid var(--border); border-radius:8px; }
.recovery-stepup-card details summary { cursor:pointer; color:var(--text); font-weight:680; }
.recovery-stepup-card details form { display:grid; gap:10px; margin-top:12px; }
.recovery-primary-verify { display:grid; gap:10px; margin:16px 0 10px; padding:16px; border:1px solid color-mix(in srgb,var(--purple) 32%,var(--border)); border-radius:10px; background:color-mix(in srgb,var(--purple) 5%,transparent); }
.recovery-primary-verify .field input { font-size:20px; letter-spacing:5px; text-align:center; }
.recovery-primary-verify button { min-height:44px; }
.recovery-stepup-card > .secondary-action { width:100%; margin:6px 0 0; }
.recovery-code-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:20px 0; }
.recovery-code-grid code { padding:10px 12px; color:var(--text); background:var(--canvas); border:1px solid var(--border); border-radius:7px; text-align:center; user-select:all; }
.recovery-code-warning { padding:12px 14px; border:1px solid color-mix(in srgb,var(--warning) 32%,var(--border)); border-radius:8px; color:var(--warning) !important; background:var(--warning-bg); font-size:13px; line-height:1.5; }
.callout { display:block; padding:14px 16px; border:1px solid var(--border); border-radius:8px; background:var(--card); }
#sites .data-table { margin-top:14px; }
#sites .sites-actions { width:1%; white-space:nowrap; text-align:right; }
.sites-join { margin-top:14px; display:grid; gap:6px; }
.sites-join-head { display:grid; gap:2px; }
.sites-join p { margin:0; }
.sites-join pre.cmd { margin:0; white-space:pre-wrap; word-break:break-all; }
.sites-new { margin-top:18px; padding-top:16px; border-top:1px solid var(--border); }
.sites-new h3 { margin:0 0 10px; font-size:14px; }
.sites-new-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr) auto; gap:12px; align-items:start; }
.sites-new-grid .field { margin:0; }
.sites-new-grid .field input { width:100%; }
.sites-new-grid button { align-self:start; margin-top:21px; white-space:nowrap; }
@media (max-width:760px) { .sites-new-grid { grid-template-columns:1fr; } .sites-new-grid button { margin-top:0; justify-self:start; } }
.callout:has(> input[type="checkbox"]) { display:flex; gap:12px; }
.callout-action { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.callout-action-copy { min-width:0; }
.callout-action-copy strong,.callout-action-copy span { display:block; }
.callout-action-copy span { margin-top:2px; color:var(--subtle); }
.callout-action button { flex:none; }
.callout-info { border-left:3px solid var(--info); }
.callout-warn { border-left:3px solid var(--warning); }
.card-accent { position:absolute; inset:0 0 auto; height:3px; border-radius:9px 9px 0 0; }
.card-accent-info { background:var(--info); }
.card-accent-purple { background:var(--purple); }
.settings-card,.resource-usage { position:relative; overflow:hidden; }
.usage-row { min-height:54px; display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 -6px; padding:9px 8px; color:var(--text); border-bottom:1px solid var(--border); border-radius:6px; }
.usage-row:last-child { border-bottom:0; }
.usage-row:hover { color:var(--info); background:var(--info-bg); text-decoration:none; }
.usage-row strong,.usage-row small { display:block; }
.usage-row small { margin-top:2px; color:var(--subtle); font-size:12px; }
.destination-health-head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.destination-health-head h2 { margin:0; }
.destination-health-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; margin-top:16px; }
.destination-health-grid span,.destination-health-grid small,.destination-health-grid strong { display:block; }
.destination-health-grid small { color:var(--subtle); font-size:11px; line-height:1.35; }
.destination-health-grid strong { margin-top:3px; font-size:14px; }
.destination-health-note { margin:16px 0 0; padding-top:13px; border-top:1px solid var(--border); font-size:12px; line-height:1.45; }
.destination-space-head { margin:18px 0 0; padding-top:13px; border-top:1px solid var(--border); font-size:13px; }
.danger-zone { border-color:color-mix(in srgb,var(--danger) 30%,var(--border)); background:color-mix(in srgb,var(--danger-bg) 45%,var(--card)); }
.danger-zone h2 { color:var(--danger); }
.danger-zone button.danger { min-height:38px; padding:0 14px; color:#fff; background:var(--danger); border:1px solid var(--danger); border-radius:7px; font-size:13px; font-weight:700; letter-spacing:normal; text-transform:none; }
.danger-zone button.danger:disabled { color:var(--subtle); background:var(--canvas); border-color:var(--border); text-decoration:none; }
.danger-disclosure { max-width:none; margin:26px 0 0; border:1px solid color-mix(in srgb,var(--danger) 28%,var(--border)); border-radius:9px; background:var(--card); overflow:hidden; }
.danger-disclosure > summary { padding:13px 16px; color:var(--danger); font-size:13px; font-weight:680; cursor:pointer; }
.danger-disclosure[open] > summary { border-bottom:1px solid color-mix(in srgb,var(--danger) 22%,var(--border)); background:color-mix(in srgb,var(--danger-bg) 55%,var(--card)); }
.danger-disclosure-body { padding:16px; }
.danger-disclosure-body p { margin:4px 0 14px; color:var(--subtle); }
.danger-disclosure button.danger { min-height:38px; padding:0 14px; color:#fff; background:var(--danger); border:1px solid var(--danger); border-radius:7px; font-size:13px; font-weight:700; letter-spacing:normal; text-transform:none; }
.advanced-card { margin:24px 0 14px; padding:0; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:var(--shadow); }
.advanced-card > summary { padding:14px 16px; color:var(--text); font-weight:680; cursor:pointer; }
.advanced-card[open] > summary { border-bottom:1px solid var(--border); }
.advanced-card > :not(summary) { margin-left:16px; margin-right:16px; }
.advanced-card > :last-child { margin-bottom:16px; }
.content-card.advanced-card { padding:0; margin:0; }
.empty-state { padding:42px 24px; text-align:center; }
.empty-state-icon { width:48px; height:48px; display:flex; align-items:center; justify-content:center; margin:0 auto 12px; border-radius:50%; color:var(--info); background:var(--info-bg); font-size:22px; }
.empty-state-icon.healthy-empty { color:var(--success); background:var(--success-bg); }
.sr-legend { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); border:0; }
.policy-rename { display:flex; align-items:flex-end; gap:10px; margin:4px 0 20px; }
.policy-rename .field { flex:1 1 auto; max-width:420px; }
.bulk-bar { position:fixed; left:50%; bottom:20px; transform:translateX(-50%); z-index:60; display:flex; align-items:center; gap:16px; padding:10px 12px 10px 18px; background:var(--card); border:1px solid var(--border-strong); border-radius:10px; box-shadow:0 12px 34px rgba(16,31,55,.2); max-width:calc(100vw - 24px); }
.bulk-bar[hidden] { display:none; }
.bulk-count { color:var(--subtle); font-size:13px; white-space:nowrap; }
.bulk-count strong { color:var(--text); }
.bulk-bar-actions { display:flex; gap:8px; flex-wrap:wrap; }
.detect-drives { margin-bottom:6px; padding:12px 14px; background:var(--canvas); border:1px solid var(--border); border-radius:8px; }
.detect-row { display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; }
.detect-row .field { flex:1 1 200px; margin:0; }
.detect-results { margin-top:10px; display:flex; flex-direction:column; gap:6px; color:var(--subtle); font-size:13px; }
.detect-results:empty { display:none; }
.detect-drive { text-align:left; padding:9px 12px; color:var(--text); background:var(--card); border:1px solid var(--border-strong); border-radius:7px; cursor:pointer; font-weight:450; }
.detect-drive:hover { border-color:var(--subtle); }
.detect-drive.on { border-color:#7fa5e4; background:var(--info-bg); box-shadow:0 0 0 2px rgba(11,92,255,.08); }
.machines-table .bulk-check,.machines-table [data-bulk-all] { width:16px; height:16px; margin-right:8px; vertical-align:-2px; }
/* The select box and the status pill are one unit: without this the pill drops
   onto its own line under the checkbox as soon as the label is longer than the
   column, which the longer states ("Cloud image copy failing") always are. */
.machines-table th:first-child,.machines-table td:first-child { white-space:nowrap; }
.empty-state h3 { margin:0 0 5px; font-size:16px; }
.empty-state p { max-width:480px; margin:0 auto 16px; color:var(--subtle); }
.command-kind { text-transform:none; }
.policy-list-card { display:block; color:inherit; }
.policy-list-card:hover { border-color:var(--border-strong); text-decoration:none; }
.resource-list-card { display:grid; grid-template-columns:46px minmax(0,1fr) auto; align-items:center; gap:14px; min-height:112px; }
.section-stack + .addrow { margin-top:14px; }
.storage-card { position:relative; }
.storage-card .card-link { color:inherit; }
.storage-card .card-link::after { content:""; position:absolute; inset:0; border-radius:inherit; }
.storage-card form { position:relative; z-index:1; }
.storage-card button { width:100%; }
.resource-card-icon { width:46px; height:46px; display:flex; align-items:center; justify-content:center; border-radius:11px; color:var(--info); background:var(--info-bg); }
.resource-card-icon svg { width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.resource-card-icon-network { color:var(--success); background:var(--success-bg); }
.resource-card-icon-usb { color:var(--purple); background:var(--purple-bg); }
.purple-icon { color:var(--purple); background:var(--purple-bg); }
.resource-card-copy { min-width:0; }
.resource-card-copy h2 { margin-bottom:3px; }
.resource-card-copy p { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.resource-title-row { display:flex; align-items:center; gap:10px; min-width:0; }
.resource-title-row h2 { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.resource-ops { min-width:150px; display:grid; gap:8px; padding-left:16px; border-left:1px solid var(--border); color:var(--subtle); font-size:11px; }
.resource-ops span,.resource-ops strong { display:block; }
.resource-ops strong { margin-bottom:1px; color:var(--text); font-size:13px; }
.resource-chips { display:flex; gap:6px; flex-wrap:wrap; margin-top:9px; }
.resource-chip { display:inline-flex; min-height:23px; align-items:center; padding:0 8px; color:var(--info); background:var(--info-bg); border-radius:999px; font-size:11px; font-weight:680; }
.resource-chip-neutral { color:var(--subtle); background:var(--canvas); }
.purple-chip { color:var(--purple); background:var(--purple-bg); }
.templates-layout { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:14px; align-items:start; }
.template-grid { display:grid; grid-template-columns:1fr; gap:10px; }
.template-card { position:relative; min-height:132px; display:flex; flex-direction:column; padding:17px 50px 17px 18px; border-left:3px solid color-mix(in srgb,var(--info) 65%,var(--border)); }
.template-card-head { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:start; gap:14px; }
.template-card-head h2 { margin:0; line-height:1.25; }
.template-card-head .eyebrow { margin-bottom:2px; }
.template-summary { margin:9px 0 0 !important; color:var(--subtle); font-size:13px; }
.template-card .resource-chips { margin-top:auto; padding-top:13px; }
.template-open { position:absolute; top:50%; right:18px; color:var(--subtle); font-size:27px; line-height:1; transform:translateY(-50%); }
.template-card:hover .template-open { color:var(--info); transform:translate(2px,-50%); }
.usage-badge { min-height:24px; display:inline-flex; align-items:center; padding:0 8px; border-radius:999px; color:var(--subtle); background:var(--canvas); font-size:11px; font-weight:680; white-space:nowrap; }
.usage-badge.usage-active { color:var(--success); background:var(--success-bg); }
.template-create { position:sticky; top:78px; }
.eyebrow { display:block; margin-bottom:4px; color:var(--subtle); font-size:12px; font-weight:600; }
.policy-card-head { display:flex; justify-content:space-between; gap:16px; }
.policy-card-head h2 { margin-bottom:4px; }
.policy-machine-count { min-width:70px; text-align:right; }
.policy-machine-count strong,.policy-machine-count span { display:block; }
.policy-machine-count strong { font-size:20px; }
.policy-machine-count span { color:var(--subtle); font-size:12px; }
.policy-create { align-self:start; }
.policy-create { position:relative; overflow:hidden; }
.full-action { width:100%; margin-top:18px; }
.destination-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:14px; padding-top:14px; border-top:1px solid var(--border); }
.destination-fields[hidden] { display:none !important; }
.storage-wizard { display:grid; gap:14px; max-width:920px; }
.guided-step { display:grid; grid-template-columns:38px minmax(0,1fr); gap:16px; padding:22px; }
.guided-step-number { width:32px; height:32px; display:flex; align-items:center; justify-content:center; color:#fff; background:var(--info); border-radius:50%; font-size:14px; font-weight:800; }
.guided-step-body { min-width:0; }
.guided-step-body > h2 { margin:2px 0 4px; font-size:18px; }
.guided-step-body > p { margin:0 0 17px; color:var(--subtle); }
.guided-step-body > .field { max-width:460px; }
.storage-type-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.storage-type-card { position:relative; display:grid; grid-template-columns:18px 42px minmax(0,1fr); align-items:center; gap:11px; min-height:82px; padding:13px 14px; color:var(--text); background:var(--card); border:1px solid var(--border); border-radius:9px; cursor:pointer; }
.storage-type-card:last-child { grid-column:1 / -1; }
.storage-type-card:hover { border-color:var(--border-strong); }
.storage-type-card:has(input:checked) { border-color:#7fa5e4; background:var(--info-bg); box-shadow:0 0 0 2px rgba(11,92,255,.08); }
.storage-type-card input { margin:0; }
.storage-type-card strong,.storage-type-card small { display:block; }
.storage-type-card strong { margin-bottom:3px; }
.storage-type-card small { color:var(--subtle); font-weight:450; line-height:1.35; }
.storage-type-icon { width:40px; height:40px; display:flex; align-items:center; justify-content:center; color:var(--info); background:var(--card); border:1px solid var(--border); border-radius:9px; font-size:19px; font-weight:800; }
.cloud-icon { font-size:12px; letter-spacing:.03em; }
.guided-actions { display:flex; align-items:center; justify-content:flex-end; gap:18px; padding:4px 0 14px; }
.guided-actions a { color:var(--subtle); }
.destination-picker { display:grid; gap:10px; margin:14px 0; }
.destination-choice { display:flex; align-items:flex-start; gap:11px; padding:14px 16px; cursor:pointer; }
.destination-choice:has(input:checked) { border-color:#7fa5e4; background:var(--info-bg); }
.destination-choice input { margin-top:4px; }
.destination-choice strong,.destination-choice small { display:block; }
.destination-choice small { margin-top:2px; color:var(--subtle); font-weight:450; }
.where-block { margin:0 0 16px; }
.where-block > strong { display:block; font-size:13px; }
.where-block > small { display:block; margin-top:2px; }
.where-block .destination-picker { margin-top:8px; }
.where-checks { display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:8px; }
.where-block .field { max-width:420px; }
.machine-plan-form .field { max-width:420px; }
.filter-panel { background:var(--card); border:1px solid var(--border); border-radius:9px 9px 0 0; }
.alert-filter-stack { background:var(--card); border:1px solid var(--border); border-radius:9px 9px 0 0; overflow:hidden; }
.alert-filter-stack .filter-panel { border:0; border-radius:0; }
.workflow-filters { align-items:center; background:var(--canvas); }
.filter-label { flex:none; color:var(--subtle); font-size:12px; font-weight:600; }
.alerts-panel { border-radius:0 0 9px 9px; }
.alert-actions { position:relative; }
.alert-actions > summary { min-height:30px; display:inline-flex; align-items:center; padding:0 10px; color:var(--info); background:var(--card); border:1px solid color-mix(in srgb,var(--info) 45%,var(--border)); border-radius:5px; font-size:12px; font-weight:680; cursor:pointer; list-style:none; }
.alert-actions > summary::-webkit-details-marker { display:none; }
.alert-actions[open] > summary { background:var(--info-bg); }
.alert-actions form { position:absolute; top:36px; right:0; z-index:10; width:290px; display:grid; gap:10px; padding:14px; background:var(--card); border:1px solid var(--border); border-radius:9px; box-shadow:0 16px 40px rgba(16,31,55,.18); }
.alert-actions form button { width:100%; }
.alert-actions form > a { text-align:center; }

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible { outline:3px solid rgba(11,92,255,.28); outline-offset:2px; }

@media (prefers-color-scheme:dark) {
  /* The dark palette is a full re-statement, not just darker backgrounds:
     the light-mode accent colors are tuned for white paper and turn muddy
     on dark cards. Accents get lighter and slightly desaturated, the nav
     joins the same slate family as the canvas instead of fighting it with
     navy, and shadows disappear (borders carry the depth). */
  :root {
    --nav:#090d15;
    --nav-hover:#1a2540;
    --brand:#3d7bfd;
    --brand-hover:#5d92ff;
    --canvas:#0d1117;
    --card:#171e2a;
    --text:#e7ecf4;
    --subtle:#97a5ba;
    --border:#2a3442;
    --border-strong:#3e4a5c;
    --success:#45d47c;
    --success-bg:#132b1d;
    --warning:#f2ac3c;
    --warning-bg:#2f2512;
    --danger:#f47272;
    --danger-bg:#331b1f;
    --info:#6ba1ff;
    --info-bg:#182742;
    --purple:#ab90f5;
    --purple-bg:#251e3d;
    --shadow:none;
  }
  /* The nav and the canvas are the same slate family on purpose; a hairline
     keeps them from reading as one unbroken surface, and table headers get
     a shade of their own so the column labels stop floating. */
  .side-nav { box-shadow:inset -1px 0 0 var(--border); }
  .data-table thead th,.app-main .tw table th { background:color-mix(in srgb, var(--card) 88%, var(--text)); }
  .metric-card,.content-card,.panel { box-shadow:0 1px 0 rgba(255,255,255,.02) inset; }
  /* Chart and history colors a notch quieter than the status text, so the
     squares are not the loudest thing on a dark page. */
  .success-bar,.daycells .c-ok,.last10 .r-ok,.success-legend .lg-ok { background:#2f9e5b; border-color:#2f9e5b; }
  .success-bar.warn,.daycells .c-warn,.last10 .r-warning,.success-legend .lg-warn { background:#c98a1a; border-color:#c98a1a; }
  .daycells .c-fail,.last10 .r-failed { background:#c9504d; border-color:#c9504d; }
  input[type="checkbox"]:not(:checked),input[type="radio"]:not(:checked) { filter:none; }
}

.wizard-shell { min-height:100vh; background:var(--canvas); }
.wizard-top { height:64px; display:flex; align-items:center; justify-content:space-between; padding:0 28px; background:var(--card); border-bottom:1px solid var(--border); }
.wizard-top .brand { font-size:16px; }
.wizard-main { max-width:760px; margin:0 auto; padding:34px 24px 60px; }
.wizard-card { padding:26px; background:var(--card); border:1px solid var(--border); border-radius:10px; box-shadow:var(--shadow); }
.wizard-card h1 { margin:0 0 5px; font-size:25px; }
.wizard-card h2 { margin:22px 0 10px; padding:0; border:0; color:var(--text); font-size:17px; letter-spacing:normal; text-transform:none; }
.wizard-section { margin-top:24px; padding-top:22px; border-top:1px solid var(--border); }
.wizard-section:first-of-type { margin-top:8px; }
.wizard-section h2 { margin:0 0 4px; }
.wizard-section-copy { margin:0 0 14px; color:var(--subtle); }
.wizard-client-context { display:flex; align-items:center; gap:8px; margin:2px 0 8px; padding:10px 12px; color:var(--subtle); background:var(--canvas); border:1px solid var(--border); border-radius:7px; font-size:13px; }
.wizard-client-context strong { color:var(--text); }
.wizard-guided-section { display:grid; grid-template-columns:34px minmax(0,1fr); gap:14px; }
.wizard-guided-body { min-width:0; }
/* Machine page (Final board): calm hero, job cards, day strip, quiet lists. */
/* Interaction polish: gentle transitions on interactive surfaces and a
   consistent, calm focus ring for keyboard users. */
.jobcard,.tpl-row,.content-card,.quietlist > div,.client-health-row,.metric-card,.data-table tbody tr,button,.primary-action,.secondary-action,.btn,details.omenu > summary,.filter-chip { transition:background-color .15s, border-color .15s, color .12s, transform .15s, box-shadow .15s; }
.jobcard:hover,.tpl-row:hover { transform:translateY(-1px); }
.quietlist > div:hover { background:color-mix(in srgb, var(--card) 55%, transparent); }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible { outline:2px solid var(--brand); outline-offset:2px; border-radius:6px; }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { transition:none !important; animation:none !important; } }
/* Templates list: one clean row per template, create tucked in a disclosure. */
.tpl-list { display:flex; flex-direction:column; gap:10px; max-width:900px; }
.tpl-row { display:flex; align-items:center; gap:18px; padding:16px 20px; background:var(--card); border:1px solid var(--border); border-radius:10px; color:var(--text); }
.tpl-row:hover { border-color:var(--border-strong); text-decoration:none; background:var(--card); }
.tpl-main { flex:1; min-width:0; }
.tpl-head { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.tpl-head strong { font-size:16px; }
.tpl-summary { margin:5px 0 0; color:var(--subtle); font-size:13.5px; }
.tpl-usage { color:var(--subtle); font-size:12.5px; white-space:nowrap; }
.tpl-usage.on { color:var(--text); }
.tpl-open { color:var(--subtle); font-size:20px; flex:none; }
.tpl-create { max-width:900px; margin-top:4px; border:1px dashed var(--border-strong); border-radius:10px; background:transparent; }
.tpl-create > summary { list-style:none; cursor:pointer; padding:14px 20px; color:var(--subtle); font-weight:600; font-size:14px; }
.tpl-create > summary::-webkit-details-marker { display:none; }
.tpl-create > summary:hover { color:var(--text); }
.tpl-create[open] { border-style:solid; border-color:var(--border); background:var(--card); }
.tpl-create[open] > summary { color:var(--text); border-bottom:1px solid var(--border); }
.tpl-create > div { padding:16px 20px 20px; }
.tpl-create-row { display:flex; gap:14px; align-items:flex-end; flex-wrap:wrap; }
.tpl-create-row .field { flex:1; min-width:180px; }
.care-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; margin-bottom:8px; }
.care-row form { display:flex; flex-direction:column; gap:6px; align-items:flex-start; }
.care-row form button { width:auto; }
.care-row small { color:var(--subtle); font-size:12.5px; }
.backup-action-row { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:8px; }

/* Backup & restore — intent cards */
.rc-card { padding:20px 21px; margin-bottom:16px; background:var(--card); border:1px solid var(--border); border-radius:11px; box-shadow:var(--shadow); }
.rc-head { display:flex; align-items:flex-start; gap:13px; }
.rc-head > div { min-width:0; }
.rc-card h2 { margin:0; font-size:16.5px; font-weight:700; letter-spacing:-.01em; text-transform:none; border:0; padding:0; color:var(--text); }
.rc-lead { margin:3px 0 0; color:var(--subtle); font-size:13px; max-width:64ch; }
.rc-body { margin-top:16px; }
.rc-foot { margin:14px 2px 0; color:var(--subtle); font-size:12.5px; }
.rc-subhead { margin:0 0 10px; color:var(--subtle); font-size:11px; font-weight:700; letter-spacing:.06em; }
.rc-glyph { flex:none; width:38px; height:38px; border-radius:9px; display:grid; place-items:center; }
.rc-glyph svg { width:20px; height:20px; }
.rc-glyph.g-files { color:var(--info); background:var(--info-bg); }
.rc-glyph.g-machine { color:var(--purple); background:var(--purple-bg); }
.rc-glyph.g-verify { color:var(--success); background:var(--success-bg); }
.rc-secure { flex:none; display:flex; align-items:center; gap:10px; padding:9px 12px; color:var(--text); background:color-mix(in srgb,var(--success-bg) 68%,var(--card)); border:1px solid color-mix(in srgb,var(--success) 24%,var(--border)); border-radius:9px; }
.rc-secure > span:last-child { display:grid; gap:1px; }
.rc-secure strong { font-size:12px; line-height:1.3; }
.rc-secure small { color:var(--subtle); font-size:11px; }
.rc-secure-icon { display:grid; place-items:center; width:22px; height:22px; flex:none; color:#fff; background:var(--success); border-radius:50%; font-size:12px; }

.verify-card .verify-grid { display:grid; grid-template-columns:1.15fr .85fr; gap:20px; margin-top:16px; }
.verify-launch { display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px; margin-bottom:14px; }
.verify-launch .field { flex:1 1 220px; }
.verify-result { display:flex; gap:12px; align-items:flex-start; padding:11px 0; border-top:1px solid var(--border); }
.verify-shot { flex:none; position:relative; width:120px; border-radius:7px; overflow:hidden; border:1px solid var(--border); background:#0a1526; line-height:0; }
.verify-shot img { width:100%; height:auto; display:block; }
.verify-badge { position:absolute; left:5px; bottom:5px; padding:2px 7px; border-radius:999px; background:rgba(10,21,38,.82); color:#fff; font-size:10px; font-weight:650; line-height:1.4; }
.verify-meta { min-width:0; flex:1 1 auto; display:grid; gap:6px; }
.verify-line { display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.verify-line small { color:var(--subtle); font-size:12px; }
.verify-facts { display:flex; gap:14px; color:var(--subtle); font-size:12.5px; }
.verify-track { height:6px; border-radius:999px; background:var(--border); overflow:hidden; max-width:280px; }
.verify-track > i { display:block; height:100%; background:var(--brand); transition:width .4s ease; }
.care { display:flex; flex-direction:column; }
.care-item { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:11px 0; border-top:1px solid var(--border); }
.care-item:first-child { border-top:0; }
.care-item .tx { font-size:12.5px; color:var(--subtle); max-width:38ch; }
.care-item .tx b { display:block; color:var(--text); font-weight:620; font-size:13px; margin-bottom:1px; }
.care-item form { margin:0; }
@media (max-width:680px) { .verify-card .verify-grid { grid-template-columns:1fr; } .rc-secure { display:none; } }
.m-hero-live { border:0 !important; background:transparent !important; padding:0 !important; margin:4px 0 0 !important; box-shadow:none !important; }
.m-hero-line { display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.m-hero-line .chip { background:transparent; border:0; padding:0; font-size:21px; font-weight:650; display:inline-flex; align-items:center; gap:12px; }
.m-hero-runlink { font-size:13px; color:var(--info); }
.m-hero-line .chip-icon { font-size:0; width:13px; height:13px; flex:none; border-radius:50%; background:currentColor; display:inline-block; }
.m-hero-line .chip.st-run .chip-icon { animation:ress-pulse 1.6s ease-in-out infinite; }
@keyframes ress-pulse { 0%,100% { box-shadow:0 0 0 0 color-mix(in srgb, currentColor 55%, transparent); } 50% { box-shadow:0 0 0 6px transparent; } }
.m-identity .crumb { margin:0; }
.m-identity { display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin:.3rem 0 1rem; flex-wrap:wrap; }
.m-identity .who { display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.m-identity h1 { margin:0; font-size:21px; letter-spacing:.02em; }
.m-identity .who a.tenant { color:var(--subtle); }
.m-identity .meta { display:flex; gap:18px; color:var(--subtle); font-size:13px; }
.m-hero { background:var(--card); border:1px solid var(--border); border-radius:10px; padding:22px 26px; display:flex; align-items:center; justify-content:space-between; gap:28px; margin-bottom:20px; flex-wrap:wrap; }
.m-hero-copy { display:flex; flex-direction:column; gap:9px; min-width:260px; flex:1; }
.m-hero-line { display:flex; align-items:center; gap:12px; font-size:21px; font-weight:650; }
.m-hero-line .dot { width:11px; height:11px; border-radius:50%; flex:none; }
.m-hero-sub { color:var(--subtle); }
.m-hero-diag { margin-top:8px; padding:8px 10px; border-radius:8px; background:var(--danger-bg); color:var(--text); font-size:13.5px; line-height:1.45; }
.m-hero-diag strong { font-weight:640; }
.action-banner { display:flex; align-items:center; gap:12px; margin:0 0 14px; padding:13px 16px; background:var(--success-bg); border:1px solid color-mix(in srgb,var(--success) 32%,var(--border)); border-radius:9px; }
.action-banner .ab-icon { flex:none; width:22px; height:22px; color:var(--success); }
.action-banner .ab-copy { flex:1 1 auto; display:grid; gap:1px; min-width:0; }
.action-banner .ab-copy strong { font-size:14.5px; }
.action-banner .ab-copy small { color:var(--subtle); font-size:12.5px; }
.action-banner .ab-close { flex:none; background:transparent; border:0; color:var(--subtle); font-size:20px; line-height:1; cursor:pointer; padding:0 4px; }
.action-banner .ab-close:hover { color:var(--text); }
.m-hero-facts { margin-top:6px; color:var(--subtle); font-size:13px; }
.m-hero-facts strong { color:var(--text); font-weight:640; }
.m-hero .bar { height:6px; background:var(--border); border-radius:3px; overflow:hidden; margin:6px 0 10px; }
.m-hero .bar-fill { height:100%; background:var(--brand); border-radius:3px; min-width:12px; transition:width .6s; }
.m-hero-live .live-head { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:6px; font-size:14px; }
.m-hero-live .live-head strong { font-weight:600; }
.m-hero-live .live-detail { font-size:13px; }
.m-hero-live .live-more { margin-top:8px; }
.m-hero-actions { display:flex; align-items:center; gap:10px; flex:none; }
.dot-ok { background:var(--success); } .dot-run { background:var(--brand); } .dot-warn { background:var(--warning); } .dot-fail { background:var(--danger); } .dot-idle { background:var(--border-strong); }
.sec-h { display:flex; align-items:baseline; justify-content:space-between; gap:12px; font-size:15px; font-weight:650; padding-bottom:8px; border-bottom:1px solid var(--border); margin:22px 0 10px; }
.sec-h small { color:var(--subtle); font-weight:400; font-size:13px; }
.adopt-card { margin:0 0 12px; }
.adopt-form { display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px; margin-top:10px; }
.adopt-form label { display:flex; flex-direction:column; gap:4px; font-size:13px; }
.adopt-form input { font-family:var(--mono); }
.inline-form { display:inline; }
.search-scope-note { margin:0 0 4px; }
.shared-drive-guide { margin-top:12px; }
.shared-drive-guide pre { white-space:pre; overflow-x:auto; }
/* The overview's attention list shares its row with the running-now panel;
   without a floor the Issue column collapsed to one word per line. */
.attention-table td:nth-child(4) { min-width:230px; }
.attention-table td:nth-child(1) { white-space:nowrap; }
.ico-bell { width:16px; height:16px; vertical-align:-3px; }
.local-boot-test { margin-top:10px; padding-top:10px; border-top:1px solid var(--border); }
.local-boot-test form { display:flex; flex-wrap:wrap; align-items:flex-end; gap:10px; }
.jobcards { display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:16px; }
.jobcard { background:var(--card); border:1px solid var(--border); border-radius:10px; padding:18px 20px; display:flex; flex-direction:column; gap:11px; }
.jobcard-head { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.jobcard-head strong { font-size:15px; }
.jobcard-state { display:flex; align-items:center; gap:7px; font-size:13px; font-weight:600; }
.jobcard-rows { display:flex; flex-direction:column; gap:5px; color:var(--subtle); font-size:13.5px; }
.jobcard-rows > div { display:flex; justify-content:space-between; gap:14px; }
.jobcard-rows b { color:var(--text); font-weight:500; text-align:right; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:70%; }
.jobcard-foot { display:flex; align-items:center; justify-content:space-between; margin-top:2px; gap:10px; }
.runstrip { display:flex; gap:4px; }
.runstrip span { width:10px; height:10px; border-radius:3px; background:var(--border); }
.runstrip .c-neutral { background:var(--border-strong); } .runstrip .c-ok { background:var(--success); } .runstrip .c-warn { background:var(--warning); } .runstrip .c-fail { background:var(--danger); } .runstrip .c-run { background:var(--brand); }
.jobcard-foot form button,.jobcard-foot a.customize { min-height:32px !important; padding:0 13px !important; font-size:13px; }
.jobcard-foot .tools { display:flex; align-items:center; gap:12px; }
.jobcard-foot a.customize { display:inline-flex; align-items:center; color:var(--info); font-size:13px; }
.daystrip { display:flex; gap:12px 18px; align-items:center; justify-content:space-between; flex-wrap:wrap; padding:4px 0; }
.daycells { display:flex; gap:5px; flex-wrap:wrap; }
.daycells span { width:21px; height:21px; border-radius:5px; background:var(--canvas); border:1px solid var(--border); }
.daycells .c-neutral { background:var(--border-strong); border-color:var(--border-strong); } .daycells .c-ok { background:var(--success); border-color:var(--success); } .daycells .c-warn { background:var(--warning); border-color:var(--warning); } .daycells .c-fail { background:var(--danger); border-color:var(--danger); } .daycells .c-run { background:var(--info-bg); border-color:var(--brand); }
.daystrip-legend { display:flex; gap:14px; color:var(--subtle); font-size:12px; align-items:center; flex-wrap:wrap; }
.daystrip-legend i { width:9px; height:9px; border-radius:3px; display:inline-block; margin-right:5px; }
.quietlist { display:flex; flex-direction:column; }
.quietlist > div { display:flex; align-items:center; gap:12px; padding:11px 4px; border-bottom:1px solid var(--border); }
.quietlist > div:last-child { border-bottom:0; }
.quietlist .dot { width:9px; height:9px; border-radius:50%; flex:none; }
.quietlist .grow { color:var(--subtle); flex:1; }
.m-cols { display:grid; grid-template-columns:1.5fr 1fr; gap:26px; align-items:start; }
.m-foot { color:var(--subtle); font-size:13px; border-top:1px solid var(--border); padding-top:14px; margin-top:26px; display:flex; gap:22px; flex-wrap:wrap; }
details.omenu { position:relative; }
details.omenu > summary { list-style:none; cursor:pointer; min-height:40px; display:inline-flex; align-items:center; gap:6px; padding:0 14px; border:1px solid var(--border-strong); background:var(--card); border-radius:7px; color:var(--text); font-size:14px; font-weight:600; }
details.omenu > summary::-webkit-details-marker { display:none; }
details.omenu > summary:hover { border-color:var(--subtle); }
details.omenu > summary .chev { transition:transform .15s; color:var(--subtle); }
details.omenu[open] > summary .chev { transform:rotate(180deg); }
details.omenu[open] > .omenu-pop { position:absolute; right:0; top:44px; z-index:30; background:var(--card); border:1px solid var(--border-strong); border-radius:9px; box-shadow:0 8px 28px rgba(0,0,0,.35); padding:6px; min-width:230px; display:flex; flex-direction:column; }
.omenu-pop a,.omenu-pop button { display:block; width:100%; text-align:left; padding:9px 12px !important; min-height:0 !important; border:0 !important; background:transparent !important; color:var(--text) !important; border-radius:6px; font-size:13.5px; font-weight:500; }
.omenu-pop a:hover,.omenu-pop button:hover { background:var(--canvas) !important; text-decoration:none; }
.omenu-pop .sep { height:1px; background:var(--border); margin:5px 4px; }
@media (max-width:900px){ .m-cols { grid-template-columns:1fr; } .m-hero { flex-direction:column; align-items:stretch; } }
.when-image-row { display:flex; gap:8px; align-items:center; }
.compact-storage-types { margin-bottom:4px; }
.compact-storage-types .storage-type-card { min-height:72px; }
.add-destination-choice { border-style:dashed; }
.wizard-optional { margin-top:18px; border:1px solid var(--border); border-radius:8px; background:var(--card); }
.wizard-optional > summary { padding:14px 16px; color:var(--text); font-weight:700; cursor:pointer; }
.wizard-optional > div { padding:0 16px 16px; border-top:1px solid var(--border); }
.wizard-optional p { color:var(--subtle); }
.wizard-lead { margin:6px 0 4px; color:var(--subtle); }
.wizard-quickstart { margin-top:14px; padding:14px 16px; background:var(--canvas); border:1px solid var(--border); border-radius:8px; }
.quickstart-head { display:flex; align-items:baseline; gap:8px; margin-bottom:10px; flex-wrap:wrap; }
.quickstart-head strong { color:var(--text); }
.quickstart-head span { color:var(--subtle); font-size:13px; }
.quickstart-row { display:flex; gap:10px; flex-wrap:wrap; }
/* Scoped under .wizard-quickstart so these win over the wizard's default
   primary-button styling (.wizard-main button:where(...)), which would
   otherwise paint the chips solid blue and hide the grey subtext. */
.wizard-quickstart .quickstart-chip { flex:1 1 200px; min-width:180px; text-align:left; padding:11px 13px; color:var(--text); background:var(--card); border:1px solid var(--border-strong); border-radius:8px; cursor:pointer; font-weight:450; }
.wizard-quickstart .quickstart-chip:hover { color:var(--text); background:var(--card); border-color:var(--subtle); }
.wizard-quickstart .quickstart-chip.on,.wizard-quickstart .quickstart-chip.on:hover { color:var(--text); border-color:#7fa5e4; background:var(--info-bg); box-shadow:0 0 0 2px rgba(11,92,255,.08); }
.wizard-quickstart .quickstart-chip strong { display:block; margin-bottom:2px; color:var(--text); }
.wizard-quickstart .quickstart-chip small { display:block; color:var(--subtle); font-weight:450; line-height:1.35; }
.yesno { display:inline-flex; gap:0; margin:2px 0 4px; border:1px solid var(--border-strong); border-radius:8px; overflow:hidden; }
.yesno-opt { display:flex; align-items:center; gap:7px; padding:9px 18px; color:var(--text); background:var(--card); cursor:pointer; font-weight:600; }
.yesno-opt + .yesno-opt { border-left:1px solid var(--border-strong); }
.yesno-opt input { margin:0; }
.yesno-opt:has(input:checked) { color:var(--info); background:var(--info-bg); }
.guided-detail { margin-top:14px; padding:14px 16px; background:var(--canvas); border:1px solid var(--border); border-radius:8px; }
.guided-detail[hidden] { display:none; }
.guided-detail .field-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; }
.guided-detail textarea.paths { min-height:84px; }
.guided-none-warn { margin-top:16px; }
.wizard-staging { background:var(--warn-bg,var(--info-bg)); }
.review-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin:16px 0; }
.review-item { min-height:108px; padding:15px; background:var(--canvas); border:1px solid var(--border); border-radius:8px; }
.review-item > span,.review-item > strong,.review-item > small { display:block; }
.review-item > span { margin-bottom:7px; color:var(--subtle); font-size:12px; font-weight:600; }
.review-item > strong { margin-bottom:4px; }
.review-item > small { color:var(--subtle); line-height:1.45; white-space:pre-line; overflow-wrap:anywhere; }
.wizard-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.wizard-new-destination { margin-top:14px; padding:16px; border:1px solid var(--border); border-radius:8px; background:var(--canvas); }
.wizard-new-destination[hidden] { display:none !important; }
.wizard-new-destination .destination-fields { margin-top:14px; }
.field-help { margin:0; color:var(--subtle); font-size:13px; }
input[name^="keep_"] { width:72px; }
.wizard-card .pickrow { padding:13px 15px; align-items:flex-start; }
.wizard-card .pickrow input { margin-top:4px; }
.wizard-card .pickrow strong,.wizard-card .pickrow small { display:block; }
.wizard-card .pickrow small { margin-top:2px; color:var(--subtle); font-weight:450; }
.app-main .pickrow { padding:13px 15px; align-items:flex-start; }
.app-main .pickrow input { margin-top:4px; }
.app-main .pickrow strong,.app-main .pickrow small { display:block; }
.app-main .pickrow small { margin-top:2px; color:var(--subtle); font-weight:450; }
.wizard-card .field select,.wizard-card .field input,.wizard-card .field textarea { width:100%; }
.install-command { white-space:pre-wrap; overflow-wrap:anywhere; }
.wizsteps { margin:22px 0; }
.wizsteps li { background:var(--card); border-radius:7px; }
.wizsteps li.on { color:var(--info); background:var(--info-bg); border-color:#a8c7f7; }
.wizsteps li.done { color:var(--success); background:var(--success-bg); border-color:var(--border); }
.client-filter { position:relative; display:block; margin:0 0 12px; }
.client-filter-icon { position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--subtle); line-height:0; pointer-events:none; }
.client-filter-icon svg { width:17px; height:17px; display:block; }
.client-filter input { width:100%; height:40px; padding:0 14px 0 38px; border:1px solid var(--border-strong); border-radius:8px; background:var(--card); color:var(--text); }
.client-scroll { max-height:340px; overflow-y:auto; padding-right:2px; }
.client-scroll .pickrow[hidden] { display:none !important; }
.client-add-new { margin-top:12px; }
.client-nomatch { padding:16px 4px; margin:0; }
.new-client-field { margin-top:10px; padding:14px 15px; background:var(--canvas); border:1px solid var(--border); border-radius:7px; }
.new-client-field[hidden] { display:none !important; }
.new-client-field .field { margin:0; }
.pickrow,.wizmode,.dest { border-radius:7px; background:var(--card); }
.wizard-main .wizmode:has(> .pickrow input:checked) { background:var(--card); border-color:#7fa5e4; box-shadow:0 0 0 2px rgba(11,92,255,.08); }
.wizard-main .wizmode > .pickrow:has(input:checked) { background:transparent; }
.login { background:var(--canvas); }
.login-card { max-width:380px; padding:34px 32px 30px; background:var(--card); border:1px solid var(--border); border-radius:12px; box-shadow:0 16px 45px rgba(16,31,55,.12); }
.login-card .btn-ms,.login-card button { min-height:42px; border-radius:7px; }
.login-card input { min-height:42px; border-radius:7px; background:var(--card); border-color:var(--border-strong); }
.login-note { margin:10px 0 0; color:var(--subtle); font-size:12px; text-align:center; }

.stat-row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:14px; }
.stat-tile { position:relative; overflow:hidden; padding:16px 17px 15px; background:var(--card); border:1px solid var(--border); border-radius:8px; box-shadow:var(--shadow); }
.stat-tile::before { content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--border-strong); }
.stat-tile.tile-info::before { background:var(--info); }
.stat-tile.tile-success::before { background:var(--success); }
.stat-tile.tile-warning::before { background:var(--warning); }
.stat-tile.tile-danger::before { background:var(--danger); }
.stat-tile span { display:block; color:var(--subtle); font-size:12px; }
.stat-tile strong { display:block; margin-top:3px; font-size:20px; }
.tile-success strong { color:var(--success); }
.tile-warning strong { color:var(--warning); }
.tile-danger strong { color:var(--danger); }
.panel-context { color:var(--subtle); font-size:12px; }
.audit-panel { margin-top:14px; }

@media (max-width:1100px) {
  .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-grid,.bottom-grid,.detail-grid,.client-protection-layout,.client-secondary-grid { grid-template-columns:1fr; }
  .client-create-token { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .topbar { grid-template-columns:150px minmax(220px,1fr) auto; }
  .topbar-actions { grid-column:3; }
  .machine-hero { flex-direction:column; }
  .machine-hero .detail-status { width:100%; min-width:0; }
  .machines-table th:nth-child(7),.machines-table td:nth-child(7),.machines-table th:nth-child(8),.machines-table td:nth-child(8) { display:none; }
  .reports-table th:nth-child(6),.reports-table td:nth-child(6),.reports-table th:nth-child(7),.reports-table td:nth-child(7) { display:none; }
  .activity-table th:nth-child(5),.activity-table td:nth-child(5) { display:none; }
  .client-machine-table { min-width:0; }
  /* Keep the Group column (9) visible on tablets: it is the only place to
     reassign a machine's group, and the stacked card layout only kicks in below
     760px. Hide the lower-priority Next run/Destination/History/App columns. */
  .client-machine-table th:nth-child(5),.client-machine-table td:nth-child(5),.client-machine-table th:nth-child(6),.client-machine-table td:nth-child(6),.client-machine-table th:nth-child(7),.client-machine-table td:nth-child(7),.client-machine-table th:nth-child(10),.client-machine-table td:nth-child(10) { display:none; }
  .history-table { min-width:0; }
  .history-table th:nth-child(5),.history-table td:nth-child(5),.history-table th:nth-child(6),.history-table td:nth-child(6) { display:none; }
  .history-table td:nth-child(4) { min-width:220px; }
  .role-guide { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:900px) {
  .templates-layout { grid-template-columns:1fr; }
  .template-create { position:static; order:-1; }
  .workspace-overview-grid,.invite-panel { grid-template-columns:1fr; }
}

@media (max-width:760px) {
  .app-shell { grid-template-columns:1fr; }
  .side-nav { position:static; height:auto; padding:10px; flex-direction:row; align-items:center; overflow-x:auto; }
  .side-nav { scrollbar-width:none; }
  .side-nav::-webkit-scrollbar { display:none; }
  /* The scrollbar is hidden, so fade the trailing edge: without it Alerts,
     Reports, Activity and Settings sit off-screen with nothing saying so. */
  .side-nav { -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 44px), transparent); mask-image:linear-gradient(to right, #000 calc(100% - 44px), transparent); }
  .side-brand { padding:0 10px; font-size:0; }
  .side-brand .mk { width:20px; height:20px; }
  .nav-list { flex-direction:row; }
  .nav-link { min-height:38px; padding:0 12px; gap:7px; white-space:nowrap; }
  /* Keep the text labels on mobile — the icon glyphs alone are not decipherable.
     The nav is a horizontally scrollable row, so labelled items just scroll. */
  .nav-link span:not(.nav-icon):not(.nav-badge) { font-size:13px; }
  .side-bottom { margin:0 0 0 auto; }
  /* One row under the nav: client scope, search, account. It was three
     rows and 170px before any content. */
  .topbar { position:static; height:auto; min-height:58px; grid-template-columns:minmax(0,1fr) minmax(0,1.25fr) auto; gap:8px; padding:9px 14px; }
  .scope-menu { display:block; grid-column:1; grid-row:1; }
  .scope-popover { width:min(320px,calc(100vw - 28px)); }
  .global-search { grid-column:2; grid-row:1; }
  .global-search input { padding-left:36px; }
  .global-search::before { left:12px; }
  .topbar-actions { grid-column:3; grid-row:1; }
  .nav-link.active { box-shadow:inset 0 -2px #4c8dff; }
  .topbar-action { display:none; }
  .user-menu .email-short { display:none; }
  .app-main { padding:20px 14px 40px; }
  .page-head { align-items:stretch; flex-direction:column; }
  .page-actions .primary-action { width:100%; }
  .metric-grid,.stat-row { grid-template-columns:1fr 1fr; }
  .attention-banner { align-items:flex-start; flex-wrap:wrap; }
  .attention-banner .secondary-action { margin-left:59px; }
  .data-table { min-width:720px; }
  .panel:has(.data-table),.content-card:has(.data-table) { overflow-x:auto; }
  .clients-table,.machines-table,.alerts-table,.reports-table,.activity-table { min-width:640px; table-layout:auto; }
  .clients-table th:nth-child(2),.clients-table td:nth-child(2) { display:none; }
  .machines-table th:nth-child(6),.machines-table td:nth-child(6),.machines-table th:nth-child(7),.machines-table td:nth-child(7),.machines-table th:nth-child(8),.machines-table td:nth-child(8) { display:none; }
  .alerts-table th:nth-child(6),.alerts-table td:nth-child(6) { display:none; }
  .reports-table th:nth-child(5),.reports-table td:nth-child(5),.reports-table th:nth-child(6),.reports-table td:nth-child(6),.reports-table th:nth-child(7),.reports-table td:nth-child(7),.reports-table th:nth-child(8),.reports-table td:nth-child(8) { display:none; }
  .activity-table th:nth-child(5),.activity-table td:nth-child(5) { display:none; }
  .data-table th,.data-table td { padding-left:9px; padding-right:9px; overflow-wrap:anywhere; }
  .client-machines-panel:has(.data-table) { overflow:hidden; }
  .client-machine-table,.client-group-table,.client-install-table { display:block; min-width:0; }
  .client-machine-table thead,.client-group-table thead,.client-install-table thead { display:none; }
  .client-machine-table tbody,.client-group-table tbody,.client-install-table tbody { display:grid; gap:10px; padding:10px; }
  .client-machine-table tr,.client-group-table tr,.client-install-table tr { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 16px; padding:13px; background:var(--card); border:1px solid var(--border); border-radius:8px; }
  .client-machine-table td,.client-group-table td,.client-install-table td { display:grid; grid-template-columns:96px minmax(0,1fr); align-items:start; gap:8px; min-width:0; padding:0; border:0; text-align:left; }
  .client-machine-table td:nth-child(5),.client-machine-table td:nth-child(6),.client-machine-table td:nth-child(7),.client-machine-table td:nth-child(9),.client-machine-table td:nth-child(10) { display:grid; }
  .client-machine-table td[data-label]::before,.client-group-table td[data-label]::before,.client-install-table td[data-label]::before { content:attr(data-label); color:var(--subtle); font-size:11px; font-weight:750; letter-spacing:.05em; text-transform:uppercase; }
  .client-machine-table tr:has(.empty-compact),.client-group-table tr:has(.empty-compact),.client-install-table tr:has(.empty-compact) { display:block; }
  .client-machine-table tr:has(.empty-compact) td,.client-group-table tr:has(.empty-compact) td,.client-install-table tr:has(.empty-compact) td { display:block; }
  .client-machine-action,.client-group-delete,.client-token-delete { grid-column:1/-1; display:flex !important; justify-content:flex-end; }
  .client-group-assignment,.client-group-policy { min-width:0; flex-wrap:wrap; }
  .client-group-assignment select,.client-group-policy select { min-width:0; max-width:none; flex:1; }
  .client-empty-state { align-items:flex-start; flex-direction:column; }
  .client-empty-state .secondary-action { width:100%; text-align:center; }
  .client-add-group { align-items:stretch; flex-direction:column; }
  .client-notification-form button,.client-add-group button { width:100%; }
  .client-create-token { grid-template-columns:1fr; }
  .client-create-token button { width:100%; }
  .client-health-row { grid-template-columns:1.3fr .65fr .75fr 18px; }
  /* Children: name, machine count, attention/Healthy, % protected, chevron.
     Dropping the third removed the only signal saying which client is broken. */
  .client-health-row span:nth-child(4) { display:none; }
  .detail-hero { flex-direction:column; }
  .machine-hero .detail-status { width:100%; min-width:0; grid-template-columns:1fr; }
	.machine-hero .detail-status > .chip,.machine-hero .hero-facts,.machine-actions { grid-column:1; grid-row:auto; }
	.hero-facts { grid-template-columns:1fr 1fr; }
	.hero-facts > span:nth-child(2) { border-right:0; }
	.hero-facts > span:nth-child(-n+2) { border-bottom:1px solid var(--border); }
	.machine-actions { justify-content:stretch; }
	.machine-actions a { flex:1; }
  .health-guidance { align-items:flex-start; flex-direction:column; }
	.field-grid { grid-template-columns:1fr; }
	.wizard-fields { grid-template-columns:1fr; }
	.wizard-guided-section { grid-template-columns:1fr; }
	.review-grid { grid-template-columns:1fr; }
  .destination-fields { grid-template-columns:1fr; }
	.run-outcome { grid-template-columns:1fr; }
	.run-next-step { grid-template-columns:1fr; }
	.history-heading { align-items:flex-start; flex-direction:column; }
	.guided-step { grid-template-columns:1fr; padding:18px; }
	.storage-type-grid { grid-template-columns:1fr; }
	.storage-type-card:last-child { grid-column:auto; }
	.choice-grid { grid-template-columns:1fr; }
	.workspace-overview-card,.team-card { padding:18px; }
	.recovery-lock-head { grid-template-columns:44px minmax(0,1fr); }
	.recovery-lock-head > .status-pill { grid-column:2; justify-self:start; }
	.recovery-lock-facts { grid-template-columns:repeat(2,minmax(0,1fr)); }
	.recovery-lock-enroll { grid-template-columns:1fr; }
	.role-guide { grid-template-columns:1fr; }
	.role-guide article { min-height:0; }
	.team-member-summary { grid-template-columns:36px minmax(0,1fr); }
	.member-badges { grid-column:2; justify-content:flex-start; }
	.member-form-grid,.invite-fields { grid-template-columns:1fr; }
	.client-picker { grid-template-columns:1fr; }
	.member-form-actions,.member-secondary-actions,.form-actions { align-items:stretch; flex-direction:column; }
	.member-form-actions button,.member-secondary-actions button,.form-actions button { width:100%; }
	.client-default-form { align-items:stretch; flex-direction:column; }
	.client-default-form button { width:100%; }
	.client-setup-grid { grid-template-columns:1fr; }
	.client-setup-card,.client-setup-empty { align-items:flex-start; flex-direction:column; }
	.client-setup-meta { width:100%; }
	.client-setup-meta b { margin-left:auto; }
	.schedule-primary,.schedule-when,.schedule-card .qol { grid-template-columns:1fr; }
	.schedule-section-head,.template-save-bar { align-items:flex-start; flex-direction:column; }
	.template-save-bar button { width:100%; }
	.resource-list-card { grid-template-columns:40px minmax(0,1fr); }
	.resource-card-icon { width:40px; height:40px; }
	.resource-list-card .policy-machine-count,.resource-list-card .resource-ops { grid-column:2; text-align:left; }
	.resource-ops { min-width:0; grid-template-columns:repeat(2,minmax(0,1fr)); padding:10px 0 0; border-left:0; border-top:1px solid var(--border); }
	.resource-title-row { align-items:flex-start; flex-direction:column; gap:5px; }
	.destination-health-grid { grid-template-columns:1fr; }
	.template-grid { grid-template-columns:1fr; }
	.template-card-head { grid-template-columns:1fr; }
	.template-card-head .usage-badge { justify-self:start; }
	.machine-care-actions { grid-template-columns:1fr; }
	.recovery-access-gate { grid-template-columns:auto minmax(0,1fr); }
	.recovery-access-gate .primary-action { grid-column:1 / -1; justify-self:start; }
	.image-recovery-head { flex-direction:column; }
	.image-helper-form,.image-point-row { grid-template-columns:1fr; align-items:stretch; }
	.secure-transfer-mark { width:100%; min-width:0; }
	.helper-sync { justify-items:start; padding:13px 0 0; border-left:0; border-top:1px solid var(--border); text-align:left; }
	.image-point-row button { width:100%; }
	.edit-actions { align-items:stretch; flex-direction:column; }
	.edit-actions button { width:100%; }
	.app-main .card { align-items:flex-start; flex-direction:column; }
	.app-main .card .btn { width:100%; text-align:center; }
	.callout-action { align-items:stretch; flex-direction:column; }
	.callout-action button { width:100%; }
	.app-main .browse-head { grid-template-columns:1fr; }
	.tree-columns { padding-left:78px; }
}

@media (max-width:480px) {
  td.cell-empty { display:none !important; }
  /* Chips wrap instead of running off the edge. */
  .filter-chips { flex-wrap:wrap; overflow-x:visible; }
  /* 16px text keeps phones from zooming into a field on focus. */
  .app-main input:not([type="checkbox"]):not([type="radio"]),.app-main select,.app-main textarea { font-size:16px; }
  /* A form's commit button spans the width, the same on every form. */
  :is(.settings-form,.client-notification-form,.client-default-form,.client-secondary-card form,.sites-new,.add-client-form,.machine-plan-form,[data-destination-form],.member-access-form,.client-new-plan-form) > button { width:100%; justify-content:center; }
  .detail-tabs { gap:16px; scroll-snap-type:x proximity; -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent); mask-image:linear-gradient(to right,#000 calc(100% - 24px),transparent); }
  .detail-tabs a { scroll-snap-align:start; white-space:nowrap; }
  /* Icons only so every section fits; the section you're in keeps its
     name, and nothing is cut off, so no edge fade. */
  .nav-link span:not(.nav-icon):not(.nav-badge) { display:none; }
  .nav-link.active span:not(.nav-icon):not(.nav-badge) { display:inline; }
  .side-nav { -webkit-mask-image:none; mask-image:none; padding:8px 6px; }
  .nav-list { gap:2px; }
  .nav-link { position:relative; padding:0 10px; }
  .nav-link .nav-badge { position:absolute; top:2px; right:0; }
  .attention-table { display:block; min-width:0; width:100%; }
  .metric-card { grid-template-columns:1fr; }
  .attention-table thead { display:none; }
  .attention-table tbody { display:grid; gap:10px; padding:10px; }
  .attention-table tr { display:grid; gap:8px; padding:14px; background:var(--card); border:1px solid var(--border); border-radius:8px; }
  .attention-table td { display:grid; grid-template-columns:92px minmax(0,1fr); align-items:start; gap:8px; padding:0; border:0; }
  .attention-table td[data-label]::before { content:attr(data-label); color:var(--subtle); font-size:11px; font-weight:750; letter-spacing:.05em; text-transform:uppercase; }
  .attention-table td.attention-action { display:flex; justify-content:flex-end; }
  .attention-table td:nth-child(4) { min-width:0; }
  .metric-grid,.stat-row { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .metric-card .metric-icon { display:none; }
  .page-title h1 { font-size:24px; }
	.catalog-heading { align-items:flex-start; flex-direction:column; gap:7px; }
  .attention-banner .secondary-action { margin-left:0; width:100%; }
  .clients-table,.machines-table,.alerts-table { min-width:0; table-layout:fixed; }
  /* Reports, Activity and History scroll sideways inside their card on a
     phone; squeezed to 390px their pills overlapped the times. */
  .reports-table,.activity-table { min-width:560px; table-layout:auto; }
  .history-table { min-width:600px; }
  .clients-table th:nth-child(3),.clients-table td:nth-child(3),.clients-table th:nth-child(5),.clients-table td:nth-child(5) { display:none; }
  .machines-table th:nth-child(3),.machines-table td:nth-child(3),.machines-table th:nth-child(6),.machines-table td:nth-child(6),.machines-table th:nth-child(7),.machines-table td:nth-child(7),.machines-table th:nth-child(8),.machines-table td:nth-child(8) { display:none; }
  .alerts-table th:nth-child(1),.alerts-table td:nth-child(1),.alerts-table th:nth-child(7),.alerts-table td:nth-child(7) { display:none; }
  .history-table th:nth-child(4),.history-table td:nth-child(4) { display:none; }
  .client-machine-table tr,.client-group-table tr,.client-install-table tr { grid-template-columns:1fr; }
  .client-machine-action,.client-group-delete,.client-token-delete { grid-column:1; }
  .alerts-table { display:block; min-width:0; }
  .alerts-table thead { display:none; }
  .alerts-table tbody { display:grid; gap:10px; padding:10px; }
  .alerts-table tr { display:grid; grid-template-columns:1fr; gap:9px; padding:14px; background:var(--card); border:1px solid var(--border); border-radius:8px; }
  .alerts-table td,.alerts-table td:nth-child(n) { display:grid; grid-template-columns:92px minmax(0,1fr); align-items:start; gap:8px; padding:0; border:0; }
  .alerts-table td[data-label]::before { content:attr(data-label); color:var(--subtle); font-size:11px; font-weight:750; letter-spacing:.05em; text-transform:uppercase; }
  .alerts-table .alert-manage-cell { display:flex; justify-content:flex-end; }
  .alert-actions form { position:fixed; inset:auto 14px 14px; width:auto; max-height:calc(100vh - 28px); overflow:auto; }
  /* The machines list gets the same card treatment as alerts: a phone is
     where a tech looks up one machine, and a nine-column table at 375px
     collapsed into one word per line. */
  .machines-table { display:block; min-width:0; }
  .machines-table thead { display:none; }
  .machines-table tbody { display:grid; gap:10px; padding:10px; }
  .machines-table tr { display:grid; grid-template-columns:1fr; gap:9px; padding:14px; background:var(--card); border:1px solid var(--border); border-radius:8px; }
  .machines-table td,.machines-table td:nth-child(n) { display:grid; grid-template-columns:92px minmax(0,1fr); align-items:start; gap:8px; padding:0; border:0; white-space:normal; }
  .machines-table td[data-label]::before { content:attr(data-label); color:var(--subtle); font-size:11px; font-weight:750; letter-spacing:.05em; text-transform:uppercase; }
  .machines-table td.bulk-cell { display:flex; align-items:center; gap:10px; }
  /* A cell's second line (the "review the latest run" note) belongs under
     the value, not under the label. */
  .machines-table td .cell-note,.alerts-table td .cell-note { grid-column:2; }
}

@media print {
  .side-nav,.topbar,.app-foot,.page-actions { display:none !important; }
  .app-shell { display:block; }
  .app-main { max-width:none; padding:0; }
}

@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}

.portable-image-row { grid-template-columns:minmax(220px,1fr) auto; }
.image-point-tools { display:flex; align-items:center; justify-content:flex-end; gap:9px; flex-wrap:wrap; }
.image-point-tools form { display:flex; align-items:center; gap:8px; }
.image-point-tools select { min-height:38px; color-scheme:inherit; border-radius:7px; }
.second-computer-note { max-width:48ch; line-height:1.45; }
.second-computer-note strong { color:var(--warning); }
.image-helper-option { grid-column:1/-1; padding-top:12px; border-top:1px solid var(--border); }
.image-helper-option summary { color:var(--subtle); font-size:13px; font-weight:700; cursor:pointer; }
.image-helper-option form { display:grid; grid-template-columns:minmax(220px,1fr) auto; align-items:end; gap:12px; margin-top:12px; }
.recovery-grant-page { max-width:1040px; margin:0 auto; }
.recovery-grant-grid { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:18px; align-items:start; }
.recovery-grant-steps ol { display:grid; gap:24px; margin:0; padding-left:24px; }
.recovery-grant-steps li { padding-left:6px; }
.recovery-grant-steps li::marker { color:var(--brand); font-weight:800; }
.recovery-grant-steps li>strong,.recovery-grant-steps li>span { display:block; margin-bottom:8px; }
.recovery-grant-steps .primary-action { display:inline-flex; }
.command-line { display:block; overflow:auto; padding:12px 14px; border:1px solid var(--border); border-radius:7px; background:var(--canvas); color:var(--text); white-space:nowrap; }
.recovery-grant-code { position:sticky; top:82px; text-align:center; }
.recovery-grant-code>code { display:block; margin:16px 0; color:var(--text); font-size:24px; font-weight:800; letter-spacing:.08em; }
.recovery-grant-code>button { width:100%; }
.recovery-grant-code>small { display:block; margin-top:12px; color:var(--subtle); line-height:1.5; }
.recovery-grant-progress { margin-top:18px; }
.recovery-progress-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; }
.recovery-progress-head h2 { margin:4px 0 0; }
.recovery-progress-head>strong { color:var(--brand); font-size:24px; }
.recovery-progress-track { height:9px; margin:18px 0 12px; overflow:hidden; border-radius:999px; background:var(--border); }
.recovery-progress-track i { display:block; width:0; height:100%; border-radius:inherit; background:var(--brand); transition:width .25s ease; }
.recovery-grant-progress dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; margin:20px 0 0; }
.recovery-grant-progress dl div { padding:12px; border:1px solid var(--border); border-radius:7px; background:var(--canvas); }
.recovery-grant-progress dt { color:var(--subtle); font-size:12px; font-weight:600; }
.recovery-grant-progress dd { margin:4px 0 0; font-weight:700; }
[data-recovery-state="complete"] .recovery-progress-track i { background:var(--success); }
[data-recovery-state="failed"] .recovery-progress-track i { background:var(--danger); }

@media (max-width:760px) {
  .portable-image-row,.image-helper-option form,.recovery-grant-grid { grid-template-columns:1fr; }
  .image-point-tools,.image-point-tools form,.image-point-tools button,.image-point-tools select { width:100%; }
  .image-point-tools form { flex-direction:column; align-items:stretch; }
  .recovery-grant-code { position:static; }
  .recovery-grant-progress dl { grid-template-columns:1fr; }
}

/* Client page tabs and the backup plan form. */
.client-tabs { margin-bottom:18px; }
.client-new-plan { margin-top:16px; }
.client-new-plan > summary { cursor:pointer; font-weight:640; color:var(--info); }
.client-new-plan[open] > summary { margin-bottom:12px; }
.client-new-plan-form { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto; gap:14px; align-items:end; }
.client-new-plan-form .field { margin:0; }
.client-setup-copy p.problem-text { display:block; margin-top:8px; font-size:12px; }
.bulk-move { display:flex; align-items:center; gap:6px; color:var(--subtle); font-size:13px; white-space:nowrap; }
@media (min-width:980px) { .bulk-bar { flex-wrap:nowrap; } .bulk-bar-actions { flex-wrap:nowrap; } }
.bulk-move select { min-width:180px; }
.plan-summary-facts { display:grid; grid-template-columns:90px minmax(0,1fr); gap:12px 18px; margin:16px 0; }
.plan-summary-facts dt { color:var(--subtle); }
.plan-summary-facts dd { margin:0; overflow-wrap:anywhere; }
.plan-edit > summary { cursor:pointer; font-weight:600; padding:4px 0; }
.plan-edit[open] > summary { margin-bottom:20px; }
.workload-daystrip { margin-top:10px; }
.plan-form .content-card { margin-bottom:12px; }
.plan-kind { padding:0; overflow:hidden; }
.plan-kind-off { background:var(--canvas); }
.plan-kind-toggle { padding:16px 18px; }
.plan-kind-toggle strong { font-size:15px; }
.plan-kind-body { margin:0; padding:4px 18px 18px; border:0; border-top:1px solid var(--border); border-radius:0; background:var(--card); box-shadow:none; }
.plan-kind-body[hidden] { display:none; }
.plan-kind-body > .field,.plan-kind-body > .setting-choice,.plan-kind-body > details { margin-top:14px; }
.plan-kind-body .field textarea { width:100%; min-height:88px; resize:vertical; }
.plan-kind-body .schedule-when,.plan-kind-body .spreadrow { margin-top:14px; }
.plan-kind-body .qol { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 18px; margin-top:8px; }
.plan-kind-body .qol .chk { margin:0; font-size:13px; }
.plan-kind-body .qol input[type="checkbox"] { width:auto; min-height:0; }
.plan-kind-body .insertlimit input { width:72px; min-height:34px; margin:0 5px; }
.plan-also { margin-top:18px; }
.plan-when-head { padding:14px 18px 0; margin:0; }
.plan-kind[hidden] { display:none; }
.plan-kind-body .qol .insertlimit { grid-column:1/-1; margin-left:26px; }
.plan-keep input { width:72px; min-height:34px; margin:0 4px; }
.plan-more > summary { cursor:pointer; font-weight:640; }
.plan-more[open] > summary { margin-bottom:14px; }
@media (max-width:760px) {
  .client-new-plan-form,.plan-kind-body .qol { grid-template-columns:1fr; }
}

.image-recovery-details>summary {cursor:pointer;padding:16px 24px;font-weight:600;border-top:1px solid var(--border)}
.machine-report-panel .panel-head p {margin:4px 0 0;max-width:760px;font-size:13px}
.machine-report-table time {white-space:normal}