/* ==========================================================================
   VoriTools design polish — second pass over direction A.
   Every rule below replaces a value a legacy sheet still forces; the
   evidence (computed style, matched rule, source sheet) is recorded in
   work/redesign/probe/{audit,leaks,ui,measure,winners}.mjs output.

   Loaded last on every route, after voritools-tool-tokens.css.
   ========================================================================== */

/* ---------- 1. one text face everywhere ----------
 * before: body.kiv-contextual-nav-page .kiv-contextual-nav-root inherited
 * -apple-system/Helvetica from voritools-tool-workbench.css (22 elements on
 * /json/, 32 on /privacy/, including every h2 of the policy cards). */
html body.kiv-contextual-nav-page .kiv-contextual-nav-root,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root button,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root input,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root select,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root textarea {
  font-family: var(--vt-text);
}

/* The Latin faces carry no kana/Hangul, so ja pages fell back to whatever the
 * browser picked. Name the CJK families instead of leaving it to chance. */
html body {
  --vt-text: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI',
    'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Noto Sans JP', 'Yu Gothic UI',
    'Noto Sans SC', 'Noto Sans KR', 'Helvetica Neue', Arial, sans-serif;
  --vt-mono: 'Geist Mono', ui-monospace, 'SF Mono', Menlo, Consolas,
    'Noto Sans Mono', monospace;
  /* Reading measure. The ch unit is the width of "0" in Instrument Sans
   * (~0.67em), so 58ch ~= 83 characters of running copy and 68ch ~= 83 on the
   * larger masthead lede. Before: /privacy/ ran 119-160 characters per line
   * and the tool summary 112-164. */
  --vt-measure: 58ch;
  --vt-measure-lede: 68ch;
  /* the fill green for controls that carry white text in both themes */
  --vt-cta: #0b7a4b;
  --vt-cta-deep: #054a2e;
  --vt-cta-wash: #e7f5ee;
}

/* ---------- 2. one brand green ----------
 * before: the tool CTAs were #178b58 (--kiv-layout-accent, adaptive-layout)
 * next to #0b7a4b tabs and a #087f5b brand tile; white on #178b58 measured
 * 4.31:1, below the 4.5:1 AA floor. */
html body[class*="kiv-tool-layout-"] {
  --kiv-layout-accent: var(--vt-cta);
  --kiv-layout-accent-deep: var(--vt-cta-deep);
  --kiv-layout-accent-soft: var(--vt-cta-wash);
}
/* light shell only: the dark shell pairs --ui-accent with dark text */
html:not(.kiv-shell-dark) {
  --ui-accent: var(--vt-cta);
  --ui-accent-soft: var(--vt-cta-wash);
}
html body.kiv-ui .logo_ico { background: var(--vt-cta); }

/* ---------- 3. small type floor ----------
 * before: json command-bar buttons 11px, pane heads 11px uppercase, command
 * label 11px, status bar 11.5px, footer 11px, search kbd 10px. The workbench
 * rules stay >=768px so the phone floor voritools-mobile-fixes.css already
 * sets keeps winning there.
 * polish2: the pane-head floor has to name the child span as well — the
 * 11px in voritools-tool-polish.css (html body.kiv-ui-json …) outranks the
 * inherited parent size, so "Ctrl / Cmd" hints and the output state chip
 * stayed at 11px on desktop. */
@media (min-width: 768px) {
  html body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-pane-head,
  html body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-pane-head > span,
  html body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-pane-head strong,
  html body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-statusbar,
  html body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-command-label {
    font-size: var(--vt-xs);
  }
  /* adaptive-layout.css forces 11px !important here; the tool token layer
   * already asked for --vt-sm and loses to it. */
  html body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-command-bar .btn {
    font-size: var(--vt-sm) !important;
  }
}
html body.kiv-ui #footer { font-size: var(--vt-xs); }
html body.kiv-ui-home .kiv-home-search kbd { font-size: 11px; }

/* ---------- 4. reading measure ----------
 * before: the tool purpose line ran 112 characters, the policy cards 119-160
 * (tool-guide.css resets max-width to none, so this needs the same weight). */
html body.kiv-ui-privacy .tool-card-body p,
html body.kiv-contextual-nav-page .kiv-api-tool .tool-card-body > p {
  max-width: var(--vt-measure) !important;
}
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .tool-intro:not(.alert) p,
html body.kiv-ui-privacy .tool-intro p {
  max-width: var(--vt-measure-lede) !important;
}

/* ---------- 5. one radius scale ----------
 * before: header controls 3px/7px, catalog tile 4px with a 5px icon, nav
 * toggles 4px — none of them on the 8/16/999 token scale. */
html body.kiv-ui .logo_ico,
html body.kiv-ui .icon-button,
html body.kiv-ui .kiv-account-launch,
html body.kiv-ui .kiv-locale-launch,
html body .kiv-theme-launch,
html body.kiv-ui #top_menu[data-kiv-navigation] > li > .kiv-nav-toggle,
html body.kiv-ui-home .kiv-catalog-tools > li > .kiv-home-tool-icon,
html body.kiv-ui-home .kiv-catalog-tools > li > a {
  border-radius: var(--vt-r-sm);
}

/* ---------- 6. dark shell: ink on the bright accent ----------
 * The dark palette keeps a bright green for accents, but every filled control
 * still carried white text: white on #55d39a (json CTA) measured 1.88:1 and on
 * #35c98a (active tool tab, home CTA) 2.13:1 — both below AA. The shell
 * already pairs its bright accent with dark ink (--ui-on-accent: #143326), so
 * the filled controls use the same pairing. Values measured before/after with
 * work/redesign/probe/dark.mjs. */
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-command-bar .btn.kiv-json-primary,
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-command-bar .btn.kiv-json-primary:hover,
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-command-bar .btn.kiv-json-primary:focus,
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-detail-nav.nav-tabs.kiv-detail-nav-compact.kiv-detail-nav-toolbar > li.active > a,
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-detail-nav.nav-tabs.kiv-detail-nav-compact.kiv-detail-nav-toolbar > li.active > a:hover,
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-detail-nav.nav-tabs.kiv-detail-nav-compact.kiv-detail-nav-toolbar > li > a[aria-current="page"],
html.kiv-shell-dark body.kiv-ui-home .kiv-home-featured-head .kiv-home-featured-all,
html.kiv-shell-dark body.kiv-ui-home .kiv-home-featured-head .kiv-home-featured-all:hover,
html.kiv-shell-dark body.kiv-ui-home .kiv-home-workspace-guest .kiv-home-workspace-button,
html.kiv-shell-dark body.kiv-ui-home .kiv-home-workspace-button:hover {
  color: #08281b !important;
}

/* ==========================================================================
   polish3 — 2026-09-27.  Third pass over the live audit
   (work/redesign3/probe/{audit3,dark3,scan-dark}.mjs, out/live-*.json).
   ========================================================================== */

/* ---------- 5. one grey family in dark mode ----------
 * before: the dark shell kept a blue-grey navy family (#1b2630 body, #18232d
 * chrome, #141d26 / #18222c / #1d2127 surfaces) while the light theme and
 * every direction-A tool surface are green-tinted.  Measured with the class
 * toggle applied: /json/ 9 navy panes, /ja/ 13 navy tiles, /subnetmask/ 8 navy
 * blocks, /sql-lineage/ 17 navy panels, /blurhash/ 12 navy cards.  Re-point
 * both token layers to the green family; luminance of every replacement is
 * within 0.004 of the value it replaces (contrast re-measured in dark3.mjs). */
html.kiv-shell-dark {
  --vt-ink: #e9f1ec;
  --vt-ink-2: #c5d1c9;
  --vt-ink-3: #93a39a;
  --vt-line: #2c3b34;
  --vt-line-strong: #36493f;
  --vt-surface: #15211c;
  --vt-surface-2: #19251f;
  --vt-surface-3: #1f2b25;
  --vt-shadow-1: 0 1px 2px rgba(4, 16, 10, .55);
  --vt-shadow-2: 0 18px 40px -24px rgba(4, 16, 10, .9);
  /* the ui-* layer the workbench shells and the /json/ panes read */
  --ui-canvas: #131b17;
  --ui-surface: #1b2620;
  --ui-workspace: #1b2620;
  --ui-surface-soft: #24322b;
  --ui-text: #e8efe9;
  --ui-muted: #a6b2a9;
  --ui-line: #2f4038;
  --ui-menu-shadow: 0 12px 36px rgba(4, 14, 9, .45);
}

/* The shell writes these as literals (voritools-shell.css dark block), so the
 * token overrides above cannot reach them. */
html.kiv-shell-dark body { background: #1a2721; color: #dce7e0; }
html.kiv-shell-dark .navbar-default { background: #182620; }
html.kiv-shell-dark .footer-nav,
html.kiv-shell-dark .col10main,
html.kiv-shell-dark .panel,
html.kiv-shell-dark .kiv-api-tool .tool-card {
  border-color: #33463c;
  background-color: #22302a;
  color: #dce7e0;
}
html.kiv-shell-dark .kiv-api-tool .tool-card-heading,
html.kiv-shell-dark .kiv-api-tool .code-output,
html.kiv-shell-dark .kiv-api-tool .claim-grid .claim-cell,
html.kiv-shell-dark .kiv-api-tool .result-stat,
html.kiv-shell-dark .kiv-api-tool .tool-table th,
html.kiv-shell-dark .kiv-api-tool .tool-table td {
  border-color: #36493f;
  background: #202e27;
  color: #dce7e0;
}
html.kiv-shell-dark .kiv-api-tool .tool-intro p,
html.kiv-shell-dark .kiv-api-tool .tool-note,
html.kiv-shell-dark .kiv-api-tool .tool-disclosure,
html.kiv-shell-dark .text-muted { color: #aebbb2 !important; }
html.kiv-shell-dark .form-control,
html.kiv-shell-dark textarea,
html.kiv-shell-dark input,
html.kiv-shell-dark select {
  border-color: #3d5347;
  background-color: #17231d;
  color: #e5eee8;
}
html.kiv-shell-dark .nav-tabs,
html.kiv-shell-dark .hbflag { border-color: #33463c; background-color: #202e27; }
html.kiv-shell-dark .copyright { background: #182620; color: #b0bcb3; }
html.kiv-shell-dark .kiv-shell-dialog { border-color: #3f5449; background: #202e27; }
html.kiv-shell-dark .kiv-shell-dialog-header,
html.kiv-shell-dark .kiv-shell-results,
html.kiv-shell-dark .kiv-shell-footnote,
html.kiv-shell-dark .kiv-shell-result,
html.kiv-shell-dark .kiv-shell-pin { border-color: #33463c; }
html.kiv-shell-dark .kiv-shell-dialog-header h2,
html.kiv-shell-dark .kiv-shell-result-link,
html.kiv-shell-dark .kiv-shell-pin { color: #e2ece6; }
html.kiv-shell-dark .kiv-shell-result-link:hover,
html.kiv-shell-dark .kiv-shell-result-link:focus { background: #26362e; color: #a8edbc; }
html.kiv-shell-dark .kiv-shell-pin { background: #202e27; }
html.kiv-shell-dark .kiv-shell-theme { border-color: #46604f; background: #26362e; color: #d7e2da; }

/* ---------- 6. the legacy calculator family joins the palette ----------
 * /subnetmask/ still renders the old .bg-blue02 fill (#f7fafd), .bor-a1s and
 * .bb-blue borders (#c6cede) and the #f1f9ff button wash.  In dark mode the
 * fills stayed near-white inside a dark page (6 elements, scan-dark.mjs); in
 * light mode the blue-grey reads as a second grey family next to the green. */
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .bor-a1s,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .bb-blue {
  border-color: var(--vt-line) !important;
}
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .bg-blue02 {
  background-color: var(--vt-surface-2) !important;
}
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .MCentlist input.Intxt {
  border-color: var(--vt-line) !important;
}
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .MCentlist input.Inbtn,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .UnitCountCent li input.UccBtn,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root input.HTxt01 {
  border-color: var(--vt-line) !important;
  background-color: var(--vt-accent-wash) !important;
  color: var(--vt-accent-ink) !important;
}
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .MCentlist input.Intxt {
  background-color: var(--vt-surface) !important;
  border-color: var(--vt-line) !important;
  color: var(--vt-ink) !important;
}
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .MCentlist input.Inbtn,
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .UnitCountCent li input.UccBtn,
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root input.HTxt01 {
  background-color: var(--vt-surface-3) !important;
  border-color: var(--vt-line) !important;
  color: var(--vt-accent-ink) !important;
}
html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-contextual-nav-root .bg-blue02 {
  background-color: var(--vt-surface-2) !important;
}

/* the shared data-workbench status chip keeps its success/error semantics but
 * stops flashing a light block inside the dark shell (/diff3/ measured
 * rgb(234,248,241) at 53k px^2 in scan-dark.mjs). */
html.kiv-shell-dark .dw-status.is-ok { color: #b7e9cd; background: #142c26; }
html.kiv-shell-dark .dw-status.is-error { color: #f3c2c6; background: #3a1f22; }

/* ---------- 7. skip link ----------
 * the audit found no way past the header for keyboard users on any route
 * (skip=false on all six probed pages).  UiPresentation emits the link and
 * gives the first h1 the target id; the link only appears on focus. */
html body a.kiv-skip-link {
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 1300;
  padding: 10px 16px;
  border-radius: var(--vt-r-sm);
  /* the deep green, not --vt-accent: white on #35c98a measured 1.94:1 while
   * white on #0b7a4b is 5.72:1, and .kiv-ui a / the home sheet both colour
   * anchors with higher specificity than a bare class. */
  background: var(--vt-cta);
  color: #fff !important;
  font: 600 14px/1 var(--vt-text);
  text-decoration: none;
  box-shadow: var(--vt-shadow-2);
  transform: translateY(-180%);
  transition: transform .15s ease-out;
}
html body a.kiv-skip-link:focus {
  transform: translateY(0);
  outline: 3px solid var(--vt-accent-hi);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) { html body a.kiv-skip-link { transition: none; } }

/* ==========================================================================
   polish4 — 2026-09-27.  Keyboard focus on the chrome, and the desktop type
   floor of the frontend-lab workbench.  Evidence: work/redesign/audit/
   {focus-inventory,focus-check2,small-type-why2}.mjs against live pages.
   ========================================================================== */

/* ---------- 8. one focus ring on every control ----------
 * before: 6-10 of the first 10-23 tab stops drew no ring on every route —
 * the logo, the theme/account/locale buttons, the tool-bar link, the
 * "More tools" toggle, the back-to-top link, the tool action buttons
 * (.fl-button / .fm-button / .kiv-reference-copy) and the json source
 * textarea.  `.kiv-ui :focus-visible` (ui-system.css) paints 2px, but the
 * tool sheets reset it later on equal specificity: `.kiv-theme-launch:hover,
 * .kiv-theme-launch:focus`, `.kiv-account-launch:focus`,
 * `.kiv-locale-launch:focus`, `.kiv-frontend-tool .fl-button:focus` and
 * `.fm-button:focus` all set `outline: 0`, and the focused element measured
 * outline-style: none.  No sheet in the tree uses `outline … !important`. */
html body :is(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--vt-accent-hi) !important;
  outline-offset: 2px !important;
}
/* #12a065 is 3.36:1 on white and #4ede9c 5.0:1 on the dark shell — both clear
 * the 3:1 non-text floor, so the ring survives the theme switch. */

/* ---------- 9. desktop type floor for the frontend-lab workbench ----------
 * voritools-mobile-fixes.css floors the same selectors at 12px below 768px,
 * so desktop was the only place cssclamp labels, step badges, sample chips
 * and captions still rendered at 9-10.2px (18 leaf nodes measured). */
@media (min-width: 768px) {
  html body .fl-workbench small,
  html body .fl-workbench label,
  html body .fl-workbench figcaption,
  html body .fl-workbench .fl-step,
  html body .fl-workbench .fl-code-label,
  html body .fl-workbench .fl-code-tabs button,
  html body .fl-workbench .fl-grid-preview span,
  html body .fl-actions button,
  html body .fl-actions .fl-button,
  html body .fl-rail small,
  html body .fl-sample-row span,
  html body .fl-viewport-readout,
  html body .fl-dropzone small,
  html body .fl-image-meta {
    font-size: 12px !important;
  }
}

/* ==========================================================================
   polish5 — 2026-09-27.  Fourth type-floor pass: the css-studio workbench.
   Evidence: work/logicalcss/probe/out/small-type-dry.json measured sixteen
   leaf chains at 8-11 px on the desktop /logicalcss/ page (rail note 10.2,
   pane eyebrows 9, field labels / check copy 10, buttons 11, flow labels 8).
   voritools-mobile-fixes.css already floors the same family below 768 px, so
   desktop was the hole.  Selector set mirrors that mobile list; the second
   block folds in the in-stage labels the live family sweep still found at
   9-11 px on cssfilter / keyframes / scrollbar / specificity / containerquery
   / csslayers, each measured at exactly 12 px on the 390 px layout.
   ========================================================================== */

/* ---------- 10. desktop type floor for the css-studio workbench ---------- */
@media (min-width: 768px) {
  html body .kiv-css-studio .cs-rail small,
  html body .kiv-css-studio .cs-console > header > span,
  html body .kiv-css-studio .cs-stage-shell > header > span,
  html body .kiv-css-studio .cs-stage-shell > header small,
  html body .kiv-css-studio .cs-export > header > span,
  html body .kiv-css-studio .cs-field label,
  html body .kiv-css-studio .cs-check,
  html body .kiv-css-studio .cs-check span,
  html body .kiv-css-studio .cs-button,
  html body .kiv-css-studio .cs-replay,
  html body .kiv-css-studio .cs-flow-label,
  html body .kiv-css-studio .cs-flow-demo small,
  html body .kiv-css-studio .cs-tabs > li > a,
  html body .kiv-css-studio .cs-filter-target span,
  html body .kiv-css-studio .cs-key-marker span,
  html body .kiv-css-studio .cs-scroll-content > span,
  html body .kiv-css-studio .cs-specificity-row strong,
  html body .kiv-css-studio .cs-container-card > span,
  html body .kiv-css-studio .cs-container-card > strong,
  html body .kiv-css-studio .cs-layer-card > span,
  html body .kiv-css-studio small {
    font-size: 12px !important;
  }
}

/* ==========================================================================
   polish6 — 2026-09-27.  Owner review after T296.
   ========================================================================== */

/* ---------- 11. the boxed tool note spans the card ----------
 * before: the 68ch measure kept p[data-kiv-tool-purpose] at 679 px inside a
 * 1300 px card on ~315 tool pages, so the note box looked like a stray column
 * (report: "简短描述 宽度固定了").  Prose pages keep the measure; the box
 * that also carries the // marker is a container and fills the card. */
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .tool-intro:not(.alert) p[data-kiv-tool-purpose],
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .tool-intro:not(.alert) p {
  max-width: none !important;
}

/* ---------- 12. safe distance inside the Bootstrap-era form cards ----------
 * before: the nine pages below render .panel > form.form-horizontal with the
 * card at padding 0, so Bootstrap's .form-group negative margin pushed the
 * label column 15 px outside the card and the textarea sat flush on the
 * card's top and right edge (the rounded corner and the control overlapped).
 * 26 px matches the intro card; 16 px below 768 px keeps the phone layout. */
html body:is(.kiv-ui-htmlfromcsv, .kiv-ui-barcode, .kiv-ui-createmeta, .kiv-ui-guid, .kiv-ui-hexconvert, .kiv-ui-htpasswd, .kiv-ui-password, .kiv-ui-refresh, .kiv-ui-uuid) .kiv-contextual-nav-root .panel {
  padding: 24px 26px !important;
}

@media (max-width: 767px) {
  html body:is(.kiv-ui-htmlfromcsv, .kiv-ui-barcode, .kiv-ui-createmeta, .kiv-ui-guid, .kiv-ui-hexconvert, .kiv-ui-htpasswd, .kiv-ui-password, .kiv-ui-refresh, .kiv-ui-uuid) .kiv-contextual-nav-root .panel {
    padding: 18px 16px !important;
  }
}

/* ==========================================================================
   polish9 — 2026-09-27.  Owner review: "首页还是用之前的风格" — the home page
   goes back to the shell the older sheets already describe (hero rule,
   outlined "Explore all tools", filled "Create workspace", coloured featured
   shelf, catalog list).  voritools-home-tokens.css is no longer mounted on
   the home page (UiPresentation.php), so everything below repairs what the
   direction-A layers had taken over while they were there.
   ========================================================================== */

/* ---------- 13. home page keeps its previous shell ---------- */
/* ==========================================================================
   Home page — previous shell repairs (owner call 2026-09-27).
   The home page no longer loads voritools-home-tokens.css (direction A), so
   the older sheets (voritools-ui-home.css / voritools-home-featured.css /
   voritools-layout.css) take over again: hero rule, outlined "Explore all
   tools", filled "Create workspace", coloured featured shelf, catalog list.

   Two repairs are needed on top of that fallback:
   1. --ui-accent was re-pointed at var(--vt-cta) by the polish layer, but
      --vt-cta only exists inside the tool-page scope, so on the home page
      the accent computed to an empty value and the light-theme controls lost
      their fill (measured: computed --ui-accent "" on / while home-tokens
      were blocked).  Re-declaring the accent on the home body restores the
      values the old ui-* layer expects, without touching other routes.
   2. The search field and the two CTAs keep the pairing the home shell
      shipped with; in the dark shell they keep the light-green fill the
      dark palette already used.
   ========================================================================== */

html:not(.kiv-shell-dark) body.kiv-ui-home {
  --vt-cta: #0b7a4b;
  --vt-cta-deep: #054a2e;
  --vt-cta-wash: #e7f5ee;
  --ui-accent: #0b7a4b;
  --ui-accent-soft: #e7f5ee;
}

/* Explore all tools — outlined button, brand-green label */
html body.kiv-ui-home .kiv-home-featured-head .kiv-home-featured-all {
  background: #fff;
  color: #0b7a4b !important;
  border: 1px solid #b9dec8 !important;
  font-size: 13px;
  padding: 8px 12px;
  border-radius: 999px;
}
html body.kiv-ui-home .kiv-home-featured-head .kiv-home-featured-all:hover,
html body.kiv-ui-home .kiv-home-featured-head .kiv-home-featured-all:focus {
  background: #f3faf5;
  color: #054a2e !important;
  border-color: #0b7a4b !important;
}

/* Create workspace — filled button, white label */
html body.kiv-ui-home .kiv-home-workspace-button,
html body.kiv-ui-home .kiv-home-workspace-manage {
  background: #0b7a4b !important;
  color: #fff !important;
  border: 1px solid #0b7a4b !important;
  border-radius: 7px;
  font-size: 13px;
  padding: 7px 12px;
}
html body.kiv-ui-home .kiv-home-workspace-button:hover,
html body.kiv-ui-home .kiv-home-workspace-manage:hover {
  background: #054a2e !important;
  border-color: #054a2e !important;
}

/* dark shell: both controls keep the light-green fill with dark ink */
html.kiv-shell-dark body.kiv-ui-home .kiv-home-featured-head .kiv-home-featured-all,
html.kiv-shell-dark body.kiv-ui-home .kiv-home-workspace-button,
html.kiv-shell-dark body.kiv-ui-home .kiv-home-workspace-manage {
  background: #35c98a !important;
  color: #08281b !important;
  border: 1px solid #35c98a !important;
}
html.kiv-shell-dark body.kiv-ui-home .kiv-home-featured-head .kiv-home-featured-all:hover,
html.kiv-shell-dark body.kiv-ui-home .kiv-home-featured-head .kiv-home-featured-all:focus,
html.kiv-shell-dark body.kiv-ui-home .kiv-home-workspace-button:hover,
html.kiv-shell-dark body.kiv-ui-home .kiv-home-workspace-manage:hover {
  background: #4ede9c !important;
  border-color: #4ede9c !important;
}

/* dark shell: the search field is a surface, not a white slab */
html.kiv-shell-dark body.kiv-ui-home .kiv-home-search input,
html.kiv-shell-dark body.kiv-ui-home .kiv-home-search input[type="search"] {
  background: var(--vt-surface-2, #18222c) !important;
  border-color: var(--vt-line, #2c3b34) !important;
  color: var(--vt-ink, #e9f1ec) !important;
}

/* ==========================================================================
   polish10 — 2026-09-27.  Owner review: "安全距离都距离 多少页面是这样的问题".
   ========================================================================== */

/* ---------- 14. one safe distance rule for the Bootstrap-era form cards ----
 * polish8 patched nine htmlfromcsv-family pages by hand.  The full sweep of
 * the 318 English pages (painted-content gap measured against the card edge
 * at 1440 px, probe work/formgap/probe/scan-paint.mjs) found the same defect
 * on 95 pages: the template drops a <form> (or a legacy div.form-horizontal)
 * straight into a .panel, Bootstrap's .panel has no padding of its own, so a
 * textarea sat 1 px from the card's top and right edge and the rounded corner
 * cut the control.  A dry run of this exact selector on all 318 pages fixed
 * 83 flush panels and added no horizontal overflow anywhere
 * (work/formgap/probe/simulate-rule.mjs -> out/simulate-rule.json).
 * 26 px matches the intro card; 16 px below 768 px keeps the phone layout. */
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .panel:has(> form, > .form-horizontal) {
  padding: 24px 26px !important;
}

@media (max-width: 767px) {
  html body.kiv-contextual-nav-page .kiv-contextual-nav-root .panel:has(> form, > .form-horizontal) {
    padding: 18px 16px !important;
  }
}

/* ==========================================================================
   polish11 — 2026-09-27.  Reference workbench + the last legacy cards.
   ========================================================================== */

/* ---------- 15. reference cards and seven legacy cards breathe too -------
 * The reference workbench flattens the legacy .panel (transparent, no border)
 * and renders its own table surface, so nobody ever gave the outer card an
 * inner distance: the section label sat 1 px from the rounded border and the
 * sticky table header ran flush into it (measured on all 21 reference pages,
 * probe work/formgap/probe/ref-pages.mjs + ref-structure.mjs).  The seven
 * legacy slugs below are the same defect in other template generations:
 * hexrgb (input-group addon at the card edge), checkurl (URL field at the
 * corner), tuya (tool strip), tesufuhao (section H4), dns + browserinfo
 * (table against the border) and nianlvli (two H2 column titles at 1 px,
 * probe nianlvli-dry.mjs).  26 px matches the intro card; 16 px below
 * 768 px keeps the phone layout.  Dry run over the 318 English pages:
 * 40 pages improved, 0 still tight, 0 new overflow. */
html body.kiv-reference-page .kiv-contextual-nav-root .panel,
html body:is(.kiv-ui-hexrgb, .kiv-ui-checkurl, .kiv-ui-tuya, .kiv-ui-tesufuhao, .kiv-ui-dns, .kiv-ui-browserinfo, .kiv-ui-nianlvli) .kiv-contextual-nav-root .panel {
  padding: 24px 26px !important;
}

@media (max-width: 767px) {
  html body.kiv-reference-page .kiv-contextual-nav-root .panel,
  html body:is(.kiv-ui-hexrgb, .kiv-ui-checkurl, .kiv-ui-tuya, .kiv-ui-tesufuhao, .kiv-ui-dns, .kiv-ui-browserinfo, .kiv-ui-nianlvli) .kiv-contextual-nav-root .panel {
    padding: 18px 16px !important;
  }
}

/* 16 — Tabular figures on the data surfaces (polish12, 2026-09-27).
 * Tool pages are mostly numbers: metric tiles, reference tables, timezone
 * tables and byte counts.  Proportional digits make those columns wobble from
 * row to row, so the data surfaces switch to tabular figures.  Dry run over 12
 * pages spanning every template generation (work/tabular/probe/dryrun.mjs):
 * 0 new horizontal overflow, 0 metric or table width change. */
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .fm-metric strong,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .fm-metric span,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root table td,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root table th,
html body.kiv-reference-page .kiv-contextual-nav-root table td,
html body.kiv-reference-page .kiv-contextual-nav-root table th {
  font-variant-numeric: tabular-nums;
}

/* 17 — Tabular figures on the metric rows of the newer bundles (polish13,
 * 2026-09-27).  Section 16 covered the files-media metric tiles and every
 * table; the data-workbench (.dw-metric / .dw-pipeline-node), ops, diag, rel,
 * obs, pro and workflow bundles render their metric tiles as
 * [class*="metric"] > b/span, which stayed proportional.  Dry run
 * (work/tabular/probe/dryrun3.mjs) drove the example data of 10 pages across
 * those generations: 0 new overflow, 0 box change. */
html body.kiv-contextual-nav-page .kiv-contextual-nav-root [class*="metric"] > b,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root [class*="metric"] > strong,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root [class*="metric"] > em,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root [class*="metric"] > i,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root [class*="metric"] > span,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root [class*="metric"] > small,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .dw-pipeline-node > i,
html body.kiv-contextual-nav-page .kiv-contextual-nav-root .kiv-json-statusbar > span {
  font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   downloads1 — 2026-09-27.  The navigator footer outside the home page
   (work/downloads/probe/{style_delta,catalog_compare}.mjs).

   /downloads/ and the privacy pages render the same server catalog as the
   home page, but the tile rules that give that catalog its shape were scoped
   to body.kiv-ui-home: the icons the icon script injects measured 0x0 px, the
   intro stacked instead of holding title and total on one row, and the link
   radius fell back to 4 px.
   ========================================================================== */

html body.kiv-ui:not(.kiv-ui-home) .footer-nav .kiv-catalog-tools > li > .kiv-home-tool-icon {
  display: inline-flex;
  flex: 0 0 23px;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
  margin: 0;
  border-radius: var(--vt-r-sm, 8px);
  background: var(--ui-surface-soft, #f1f3f5);
  color: var(--ui-muted, #68717c);
}

html body.kiv-ui:not(.kiv-ui-home) .footer-nav .kiv-catalog-tools > li > .kiv-home-tool-icon svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
}

html body.kiv-ui:not(.kiv-ui-home) .footer-nav .kiv-home-catalog-intro {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin: 0 0 18px;
  padding-top: 10px;
  scroll-margin-top: 90px;
}

html body.kiv-ui:not(.kiv-ui-home) .footer-nav .kiv-home-catalog-intro h2 {
  margin: 6px 0 0;
  color: var(--ui-text, #20262e);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: -.025em;
  line-height: 1.3;
}

html body.kiv-ui:not(.kiv-ui-home) .footer-nav .kiv-home-catalog-total {
  flex: 0 0 auto;
  padding-bottom: 2px;
  color: var(--ui-muted, #68717c);
  font-size: 13px;
  line-height: 1.5;
}

html body.kiv-ui:not(.kiv-ui-home) .footer-nav .kiv-catalog-tools > li > a {
  border-radius: var(--vt-r-sm, 8px);
}

@media (max-width: 767px) {
  html body.kiv-ui:not(.kiv-ui-home) .footer-nav .kiv-home-catalog-intro {
    align-items: flex-start;
    flex-direction: column;
    gap: 9px;
  }
}


/* ==========================================================================
   polish15 — 2026-09-27.  The reference family polish11 missed, and the cue
   for the section a reader lands on.
   ========================================================================== */

/* ---------- 19. the same inner distance on body.kiv-tool-layout-reference --
 * Section 15 keyed the reference-workbench padding on body.kiv-reference-page,
 * but that workbench mounts two body classes: 20 pages carry both, while 11
 * carry only kiv-tool-layout-reference (unixtime, shizhong, jieri,
 * lishishangdejintian, dns, srihash, sbom, sourcemap, sshkey, icsviewer,
 * keyinspector).  Four of the eleven still painted a flush card at 1440 px —
 * unixtime (2 cards), shizhong (1), jieri (2, including the nested legacy
 * panel) and lishishangdejintian (2) measured 0-1 px of inner distance
 * (probe work/leftover/probe/ref2.mjs).  The other seven paint no card of
 * that shape, so the rule is a no-op there.  Dry run at 1440 px: every
 * affected panel lands on 24px 26px with zero new horizontal overflow.
 * 26 px matches the intro card, 16 px below 768 px keeps the phone layout. */
html body.kiv-tool-layout-reference .kiv-contextual-nav-root .panel {
  padding: 24px 26px !important;
}

@media (max-width: 767px) {
  html body.kiv-tool-layout-reference .kiv-contextual-nav-root .panel {
    padding: 18px 16px !important;
  }
}

/* ---------- 20. the section you jumped to shows where you landed ----------
 * The reference workbench builds a sticky row of section links
 * (.kiv-reference-section-links > a, already covered with hover and
 * focus-visible) whose href points at the H4 anchors marked
 * .kiv-reference-section-heading.  The heading is not a control, so its hover
 * stays untouched; :target is the state it was missing, and it is what tells
 * a reader arriving from the link row which section they are standing in.
 * The accent follows the shell: #0b7a4b in the light theme, #8bd5a7 in the
 * dark one. */
html body.kiv-contextual-nav-page .kiv-reference-section-heading:target {
  padding: 2px 10px 2px 9px;
  border-left: 3px solid #0b7a4b;
  border-radius: 0 8px 8px 0;
  background: rgba(11, 122, 75, .08);
}

html.kiv-shell-dark body.kiv-contextual-nav-page .kiv-reference-section-heading:target {
  border-left-color: #8bd5a7;
  background: rgba(139, 213, 167, .16);
}

/* ==========================================================================
   polish16 — 2026-09-28.  Owner review: "安全距离都距离 多少页面是这样的问题".
   The full-site text-rect scan (work/redesign/probe/verify-safe1-mobile.mjs,
   318 pages x 1440/390) came back with two pages still inside 10px of the card
   edge below 768px; both are fixed here, the rest of the site is clean.
   ========================================================================== */

/* ---------- 21. the favicon size fieldset keeps the card's inner distance --
 * body.kiv-ui-favicon paints .panel > form.form-horizontal > fieldset.form-group,
 * and Bootstrap's .form-group margins (-15px 15px) pulled the legend back out
 * of the padding the panel already carries: "ICO dimensions:" measured 11px
 * from the card edge at 1440px and 1px at 390px.  The fieldset is not in a
 * Bootstrap grid, so it has nothing to compensate for. */
html body.kiv-ui-favicon .kiv-contextual-nav-root fieldset.form-group {
  margin-right: 0 !important;
  margin-left: 0 !important;
}

/* ---------- 22. the keyboard-tester note clears the card edge --------------
 * #anjian_test_xia_zuo (keyboard.css) floats with margin-left: 3px inside a
 * card that paints no padding, so the Num-Lock note sat 3px from the border on
 * phones.  The key board above it is a fixed-width pannable surface and keeps
 * its bleed; only the note row takes the inset. */
@media (max-width: 767px) {
  html[data-kiv-tool="keyboardtest"] #anjian_test_xia {
    padding-right: 16px;
    padding-left: 16px;
  }
  html[data-kiv-tool="keyboardtest"] #anjian_test_xia_zuo {
    margin-left: 0;
  }
}