ui-style-kit-css 2.7.0 → 2.7.1

package/styles/neumorphism.css

@@ -442,7 +442,8 @@
 .neo-card, .neo-panel { background: var(--neo-card-bg); }
 .neo-toolbar, .neo-table-wrap { background: var(--neo-control-bg); }
 /** Attribute-selected variants bypass the legacy neutral-only paint fallback. */
-.neo-button:where(:not([data-ui-variant])):not(.neo-button-primary):not(.neo-button-secondary):not(.neo-button-danger):not(.neo-button-warning):not(.neo-button-ghost), .neo-icon-button { background: var(--neo-control-bg); }
+/** Neutral defaults exclude outlined actions so their hover fill and ink remain paired. */
+.neo-button:where(:not([data-ui-variant])):not(.neo-button-primary):not(.neo-button-secondary):not(.neo-button-danger):not(.neo-button-warning):not(.neo-button-ghost):not(.neo-button-outline-heavy), .neo-icon-button { background: var(--neo-control-bg); }
 .neo-button, .neo-icon-button, .neo-badge, .neo-nav-link { font-family: var(--neo-font-control); }
 
 
@@ -520,7 +521,8 @@
 .neo-table { width: 100%; border-collapse: collapse; }
 .neo-table th, .neo-table td { padding: .95rem 1rem; text-align: left; border-bottom: 1px solid var(--neo-border); }
 .neo-table th { color: var(--neo-text); font-size: .82rem; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; background: rgb(var(--neo-primary-rgb) / .08); }
-.neo-table td { color: var(--neo-text-muted); }
+/** Table values use surface text because the inset material can reduce muted-ink contrast. */
+.neo-table td { color: var(--neo-text); }
 .neo-table tr:hover td { background: rgb(var(--neo-primary-rgb) / .045); }
 
 /* =========================================================
@@ -801,7 +803,8 @@
 .neo-button-primary,
 .neo-button-secondary,
 .neo-button-danger {
-  background-image: linear-gradient(155deg, rgb(255 255 255 / .28), transparent 52%, rgb(0 0 0 / .08));
+  /** Keep the molded highlight at the edges, outside the central label lane. */
+  background-image: linear-gradient(155deg, rgb(255 255 255 / .28), transparent 20%, transparent 80%, rgb(0 0 0 / .08));
 }
 
 .neo-button-primary {
@@ -842,8 +845,10 @@
   box-shadow: inset .28rem .28rem .58rem rgb(0 0 0 / .34), inset -.22rem -.22rem .5rem rgb(255 255 255 / .22);
 }
 
+/** Neutral defaults exclude outlined actions so their hover fill and ink remain paired. */
+
 .neo-button-ghost,
-.neo-button:where(:not([data-ui-variant])):not(.neo-button-primary):not(.neo-button-secondary):not(.neo-button-danger):not(.neo-button-warning):not(.neo-button-ghost),
+.neo-button:where(:not([data-ui-variant])):not(.neo-button-primary):not(.neo-button-secondary):not(.neo-button-danger):not(.neo-button-warning):not(.neo-button-ghost):not(.neo-button-outline-heavy),
 .neo-icon-button {
   background-color: var(--neo-material-raised);
   background-image: linear-gradient(145deg, var(--neo-material-top-light), transparent 52%);
@@ -863,7 +868,7 @@
 .neo-button-outline-heavy {
   background-color: var(--neo-material-raised);
   background-image: linear-gradient(145deg, var(--neo-material-top-light), transparent 52%);
-  color: var(--usk-primary-ink, var(--neo-primary));
+  color: var(--usk-primary-ink, var(--neo-text));
   border: 1px solid var(--neo-material-edge);
   border-radius: var(--neo-radius-md);
   box-shadow: var(--neo-button-shadow);

package/styles/organic-modern.css

@@ -630,7 +630,7 @@
 .organic-button.organic-button-outline-heavy,
 .organic-button-outline-heavy {
   background: transparent;
-  color: var(--usk-primary-ink, var(--organic-primary));
+  color: var(--usk-primary-ink, var(--organic-text));
   border-style: solid;
   border-width: 2px;
   border-color: var(--organic-primary);

package/styles/paper-editorial.css

@@ -438,7 +438,8 @@
 .paper-card, .paper-panel { background: var(--paper-card-bg); }
 .paper-toolbar, .paper-table-wrap { background: var(--paper-control-bg); }
 /** Attribute-selected variants bypass the legacy neutral-only paint fallback. */
-.paper-button:where(:not([data-ui-variant])):not(.paper-button-primary):not(.paper-button-secondary):not(.paper-button-danger):not(.paper-button-warning):not(.paper-button-ghost), .paper-icon-button { background: var(--paper-control-bg); }
+/** Neutral defaults exclude outlined actions so their hover fill and ink remain paired. */
+.paper-button:where(:not([data-ui-variant])):not(.paper-button-primary):not(.paper-button-secondary):not(.paper-button-danger):not(.paper-button-warning):not(.paper-button-ghost):not(.paper-button-outline-heavy), .paper-icon-button { background: var(--paper-control-bg); }
 .paper-button, .paper-icon-button, .paper-badge, .paper-nav-link { font-family: var(--paper-font-control); }
 
 
@@ -630,7 +631,7 @@
 .paper-button.paper-button-outline-heavy,
 .paper-button-outline-heavy {
   background: transparent;
-  color: var(--usk-primary-ink, var(--paper-primary));
+  color: var(--usk-primary-ink, var(--paper-text));
   border-style: solid;
   border-width: 2px;
   border-color: var(--paper-primary);
@@ -942,7 +943,8 @@
 @media print {
   [data-ui="paper-editorial"] { background: #fff !important; color: #000 !important; }
   [data-ui="paper-editorial"] * { box-shadow: none !important; text-shadow: none !important; }
-  [data-ui="paper-editorial"] a { color: #000 !important; text-decoration: underline; }
+  /** Inline-link ink must not override the foreground paired with an action surface. */
+[data-ui="paper-editorial"] a { color: #000 !important; text-decoration: underline; }
 }
 }
 
@@ -1070,13 +1072,13 @@
 
 :where([data-ui="paper-editorial"]) :where(button,input,select,textarea) { font: inherit; }
 
-[data-ui="paper-editorial"] a {
+[data-ui="paper-editorial"] a:where(:not(.paper-button):not(.paper-icon-button):not(.paper-nav-link)) {
   color: var(--paper-sheet-blue);
   text-decoration-thickness: 1px;
   text-underline-offset: 3px;
 }
 
-[data-ui="paper-editorial"] a:hover { color: var(--paper-sheet-oxblood); }
+[data-ui="paper-editorial"] a:where(:not(.paper-button):not(.paper-icon-button):not(.paper-nav-link)):hover { color: var(--paper-sheet-oxblood); }
 
 .paper-kicker,
 .paper-label,

package/styles/retro-glass.css

@@ -485,7 +485,8 @@
 .rg-card, .rg-panel { background: var(--rg-card-bg); }
 .rg-toolbar, .rg-table-wrap { background: var(--rg-control-bg); }
 /** Attribute-selected variants bypass the legacy neutral-only paint fallback. */
-.rg-button:where(:not([data-ui-variant])):not(.rg-button-primary):not(.rg-button-secondary):not(.rg-button-danger):not(.rg-button-warning):not(.rg-button-ghost), .rg-icon-button { background: var(--rg-control-bg); }
+/** Neutral defaults exclude outlined actions so their hover fill and ink remain paired. */
+.rg-button:where(:not([data-ui-variant])):not(.rg-button-primary):not(.rg-button-secondary):not(.rg-button-danger):not(.rg-button-warning):not(.rg-button-ghost):not(.rg-button-outline-heavy), .rg-icon-button { background: var(--rg-control-bg); }
 .rg-button, .rg-icon-button, .rg-badge, .rg-nav-link { font-family: var(--rg-font-control); }
 
 /** All loader APIs share a complete circular track with one rotating accent. */
@@ -607,7 +608,7 @@
 .rg-button.rg-button-outline-heavy,
 .rg-button-outline-heavy {
   background: transparent;
-  color: var(--usk-primary-ink, var(--rg-primary));
+  color: var(--usk-primary-ink, var(--rg-text));
   border-style: solid;
   border-width: 2px;
   border-color: var(--rg-primary);
@@ -995,7 +996,9 @@
 .rg-icon-button { inline-size: var(--rg-control-height); padding: 8px; aspect-ratio: 1; }
 .rg-button-primary { background: var(--rg-gloss); color: var(--rg-gloss-ink); border-color: var(--rg-primary); }
 .rg-button-secondary { background: var(--rg-control-material); color: var(--rg-text); border-color: var(--rg-line-strong); }
-.rg-button-danger { background: var(--rg-danger-gloss); color: rgb(var(--usk-danger-text-rgb, 255 255 255)); border-color: var(--rg-danger); }
+/** Danger gloss retains its semantic foreground pair and confines reflection to the upper edge. */
+.rg-button-danger { background: linear-gradient(180deg, rgb(255 255 255 / .4), transparent 12%), var(--rg-danger); color: var(--rg-on-danger); border-color: var(--rg-danger); }
+.rg-button-primary:hover { background: var(--rg-gloss); color: var(--rg-gloss-ink); }
 /**
  * Lets explicit runtime foreground edits win without changing the default
  * Retro Glass danger gloss treatment used by the reference specimen.
@@ -1096,7 +1099,8 @@
 .rg-tab:hover, .rg-tab.is-active, .rg-tab[aria-selected="true"] { background: linear-gradient(rgb(var(--rg-primary-rgb) / .2), rgb(var(--rg-primary-rgb) / .2)), var(--rg-surface-input); border-bottom-color: var(--rg-primary); color: var(--rg-text); }
 .rg-pagination-page { min-inline-size: 36px; padding: 8px; font-size: 12px; }
 .rg-nav { padding: 0; background: transparent; border: 0; box-shadow: none; gap: 6px; }
-.rg-nav-link { min-block-size: var(--rg-control-height); padding: 8px 12px; background: var(--rg-control-material); border: 1px solid var(--rg-line-strong); border-radius: var(--rg-radius-sm); color: var(--rg-text-soft); text-shadow: none; letter-spacing: 0; }
+/** Chrome reflections need full surface ink for ordinary navigation labels. */
+.rg-nav-link { min-block-size: var(--rg-control-height); padding: 8px 12px; background: var(--rg-control-material); border: 1px solid var(--rg-line-strong); border-radius: var(--rg-radius-sm); color: var(--rg-text); text-shadow: none; letter-spacing: 0; }
 .rg-nav-link:hover { color: var(--rg-text); background: var(--rg-control-material); }
 .rg-nav-link.is-active, .rg-nav-link[aria-current="page"] { background: var(--rg-gloss); color: var(--rg-gloss-ink); box-shadow: inset 0 1px 0 var(--rg-highlight); }
 .rg-table-wrap { background: transparent; border: 0; box-shadow: none; }

package/styles/retrofuturism.css

@@ -439,7 +439,8 @@
 .retro-card, .retro-panel { background: var(--retro-card-bg); }
 .retro-toolbar, .retro-table-wrap { background: var(--retro-control-bg); }
 /** Attribute-selected variants bypass the legacy neutral-only paint fallback. */
-.retro-button:where(:not([data-ui-variant])):not(.retro-button-primary):not(.retro-button-secondary):not(.retro-button-danger):not(.retro-button-warning):not(.retro-button-ghost), .retro-icon-button { background: var(--retro-control-bg); }
+/** Neutral defaults exclude outlined actions so their hover fill and ink remain paired. */
+.retro-button:where(:not([data-ui-variant])):not(.retro-button-primary):not(.retro-button-secondary):not(.retro-button-danger):not(.retro-button-warning):not(.retro-button-ghost):not(.retro-button-outline-heavy), .retro-icon-button { background: var(--retro-control-bg); }
 .retro-button, .retro-icon-button, .retro-badge, .retro-nav-link { font-family: var(--retro-font-control); }
 
 
@@ -638,7 +639,7 @@
 .retro-button.retro-button-outline-heavy,
 .retro-button-outline-heavy {
   background: transparent;
-  color: var(--usk-primary-ink, var(--retro-primary));
+  color: var(--usk-primary-ink, var(--retro-text));
   border-style: solid;
   border-width: 2px;
   border-color: var(--retro-primary);
@@ -1336,7 +1337,7 @@
 
 .retro-button.retro-button-outline-heavy, .retro-button-outline-heavy {
   background: var(--retro-enamel-bg);
-  color: var(--usk-primary-ink, var(--retro-primary));
+  color: var(--usk-primary-ink, var(--retro-text));
   border: 4px double var(--retro-metal-edge);
   border-radius: var(--retro-radius-pill);
   clip-path: inset(0 round var(--retro-radius-pill));

package/styles/tactile.css

@@ -468,7 +468,8 @@
 .tactile-card, .tactile-panel { background: var(--tactile-card-bg); }
 .tactile-toolbar, .tactile-table-wrap { background: var(--tactile-card-bg); }
 /** Attribute-selected variants bypass the legacy neutral-only paint fallback. */
-.tactile-button:where(:not([data-ui-variant])):not(.tactile-button-primary):not(.tactile-button-secondary):not(.tactile-button-danger):not(.tactile-button-warning):not(.tactile-button-ghost), .tactile-icon-button { background: var(--tactile-control-bg); }
+/** Neutral defaults exclude outlined actions so their hover fill and ink remain paired. */
+.tactile-button:where(:not([data-ui-variant])):not(.tactile-button-primary):not(.tactile-button-secondary):not(.tactile-button-danger):not(.tactile-button-warning):not(.tactile-button-ghost):not(.tactile-button-outline-heavy), .tactile-icon-button { background: var(--tactile-control-bg); }
 .tactile-button, .tactile-icon-button, .tactile-badge, .tactile-nav-link { font-family: var(--tactile-font-control); }
 
 
@@ -664,7 +665,7 @@
 .tactile-button.tactile-button-outline-heavy,
 .tactile-button-outline-heavy {
   background: transparent;
-  color: var(--usk-primary-ink, var(--tactile-primary));
+  color: var(--usk-primary-ink, var(--tactile-text));
   border-style: solid;
   border-width: 2px;
   border-color: var(--tactile-primary);
@@ -1552,7 +1553,8 @@
 /** Enhances supported browsers with the reference's light-to-dark enamel ramp. */
 @supports (color: color-mix(in srgb, black, white)) {
   .tactile-button-primary {
-    background: linear-gradient(180deg, color-mix(in srgb, var(--tactile-primary), white 16%), var(--tactile-primary) 48%, color-mix(in srgb, var(--tactile-primary), black 18%));
+    /** Both enamel stops retain the same tested primary foreground pair. */
+    background: linear-gradient(180deg, var(--tactile-primary-hover), var(--tactile-primary) 48%, var(--tactile-primary));
     border-color: color-mix(in srgb, var(--tactile-primary), black 34%);
     box-shadow: inset 0 1px 0 rgb(255 255 255 / .42), inset 0 -2px 0 rgb(0 0 0 / .25), 0 1px 2px rgb(var(--tactile-material-shadow-rgb) / .3);
   }
@@ -1705,7 +1707,8 @@
 
 .tactile-nav-link[aria-current="page"],
 .tactile-nav-link.is-active {
-  color: var(--tactile-brass);
+  /** The copper rail carries selection; text retains the sidebar's paired foreground. */
+  color: var(--tactile-sidebar-fg);
   background: rgb(var(--tactile-sidebar-text-rgb) / .06);
   border-color: rgb(var(--tactile-sidebar-text-rgb) / .18);
   box-shadow: inset .18rem 0 0 var(--tactile-copper), inset .08rem .08rem .18rem rgb(0 0 0 / .38);

package/styles/technical-blueprint.css

@@ -556,7 +556,8 @@
 .blueprint-card, .blueprint-panel { background: var(--blueprint-card-bg); }
 .blueprint-toolbar, .blueprint-table-wrap { background: var(--blueprint-control-bg); }
 /** Attribute-selected variants bypass the legacy neutral-only paint fallback. */
-.blueprint-button:where(:not([data-ui-variant])):not(.blueprint-button-primary):not(.blueprint-button-secondary):not(.blueprint-button-danger):not(.blueprint-button-warning):not(.blueprint-button-ghost), .blueprint-icon-button { background: var(--blueprint-control-bg); }
+/** Neutral defaults exclude outlined actions so their hover fill and ink remain paired. */
+.blueprint-button:where(:not([data-ui-variant])):not(.blueprint-button-primary):not(.blueprint-button-secondary):not(.blueprint-button-danger):not(.blueprint-button-warning):not(.blueprint-button-ghost):not(.blueprint-button-outline-heavy), .blueprint-icon-button { background: var(--blueprint-control-bg); }
 .blueprint-button, .blueprint-icon-button, .blueprint-badge, .blueprint-nav-link { font-family: var(--blueprint-font-control); }
 
 
@@ -748,7 +749,7 @@
 .blueprint-button.blueprint-button-outline-heavy,
 .blueprint-button-outline-heavy {
   background: transparent;
-  color: var(--usk-primary-ink, var(--blueprint-primary));
+  color: var(--usk-primary-ink, var(--blueprint-text));
   border-style: solid;
   border-width: 2px;
   border-color: var(--blueprint-primary);
@@ -892,7 +893,8 @@
 .blueprint-surface, .blueprint-card, .blueprint-panel, .blueprint-toolbar, .blueprint-table-wrap { border-radius: 0; box-shadow: inset 0 0 0 1px rgb(var(--blueprint-primary-rgb) / .12); }
 .blueprint-card, .blueprint-panel, .blueprint-toolbar { background-image: linear-gradient(90deg, transparent calc(100% - .55rem), rgb(var(--blueprint-primary-rgb) / .3) calc(100% - .55rem), rgb(var(--blueprint-primary-rgb) / .3) calc(100% - .48rem), transparent calc(100% - .48rem)); }
 .blueprint-button, .blueprint-icon-button { border-radius: 0; box-shadow: none; font-family: var(--blueprint-font-control); text-transform: uppercase; letter-spacing: .06em; }
-.blueprint-button:where(:not([data-ui-variant])):not(.blueprint-button-primary):not(.blueprint-button-secondary):not(.blueprint-button-danger):not(.blueprint-button-warning) { background: transparent; }
+/** Flat neutral paint yields to outlined CTA hover fills. */
+.blueprint-button:where(:not([data-ui-variant])):not(.blueprint-button-primary):not(.blueprint-button-secondary):not(.blueprint-button-danger):not(.blueprint-button-warning):not(.blueprint-button-outline-heavy) { background: transparent; }
 .blueprint-nav { border-radius: 0; box-shadow: none; }
 .blueprint-nav-link { border-radius: 0; font-family: var(--blueprint-font-control); font-size: .75rem; text-transform: uppercase; }
 .blueprint-input, .blueprint-textarea, .blueprint-select, .blueprint-badge, .blueprint-alert, .blueprint-metric, .blueprint-well, .blueprint-inset { border-radius: 0; }
@@ -1103,7 +1105,7 @@
   --blueprint-fallback-border-rgb: 20 95 147;
   --blueprint-fallback-primary-rgb: 7 95 157;
   --blueprint-fallback-primary-hover-rgb: 6 76 124;
-  --blueprint-fallback-danger-rgb: 201 49 44;
+  --blueprint-fallback-danger-rgb: 197 45 40;
   --blueprint-fallback-success-rgb: 24 111 64;
   --blueprint-fallback-warning-rgb: 132 76 0;
   --blueprint-fallback-warning-text-rgb: 255 255 255;
@@ -1171,6 +1173,8 @@
 }
 .blueprint-icon-button { inline-size: 36px; padding: 8px; aspect-ratio: 1; }
 .blueprint-button-primary { background: var(--blueprint-fill); color: var(--blueprint-fill-ink); border-color: var(--blueprint-primary); }
+/** The hover fill uses the primary role, so its label must use that role's foreground. */
+.blueprint-button-primary:hover { color: var(--blueprint-on-primary); }
 .blueprint-button-secondary { background: transparent; color: var(--blueprint-secondary); border-color: var(--blueprint-secondary); }
 .blueprint-button-ghost { border-style: dashed; color: var(--blueprint-text-soft); }
 .blueprint-button-danger { background: transparent; border-color: var(--blueprint-danger); color: var(--blueprint-danger); }

package/styles/y2k.css

@@ -433,7 +433,8 @@
 }
 [data-ui="y2k"] *, [data-ui="y2k"] *::before, [data-ui="y2k"] *::after { box-sizing: border-box; }
 [data-ui="y2k"][data-mode] { background: var(--y2k-theme-bg); background-size: var(--y2k-theme-bg-size); }
-[data-ui="y2k"] a { color: var(--y2k-link); text-decoration-thickness: 0.11em; text-underline-offset: 0.18em; } [data-ui="y2k"] ::selection { background: var(--y2k-primary); color: var(--y2k-on-primary); }
+/** Inline-link ink must not override the foreground paired with an action surface. */
+[data-ui="y2k"] a:where(:not(.y2k-button):not(.y2k-icon-button)) { color: var(--y2k-link); text-decoration-thickness: 0.11em; text-underline-offset: 0.18em; } [data-ui="y2k"] ::selection { background: var(--y2k-primary); color: var(--y2k-on-primary); }
 
 .y2k-page { min-height: 100vh; padding: clamp(1rem, 4vw, 3rem); background-image: radial-gradient(rgb(var(--y2k-border-rgb) / var(--y2k-grid-alpha)) 1px, transparent 1px); background-size: 22px 22px; }
 .y2k-container { width: min(100% - 2rem, 1200px); margin-inline: auto; } .y2k-stack { display: flex; flex-direction: column; gap: var(--y2k-space-4); } .y2k-cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--y2k-space-3); } .y2k-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr)); gap: var(--y2k-space-5); } .y2k-section { padding: clamp(1.25rem, 4vw, 2.5rem); }
@@ -467,7 +468,8 @@
 .y2k-card, .y2k-panel { background: var(--y2k-card-bg); }
 .y2k-toolbar, .y2k-table-wrap { background: var(--y2k-control-bg); }
 /** Attribute-selected variants bypass the legacy neutral-only paint fallback. */
-.y2k-button:where(:not([data-ui-variant])):not(.y2k-button-primary):not(.y2k-button-secondary):not(.y2k-button-danger):not(.y2k-button-warning):not(.y2k-button-ghost), .y2k-icon-button { background: var(--y2k-control-bg); }
+/** Neutral defaults exclude outlined actions so their hover fill and ink remain paired. */
+.y2k-button:where(:not([data-ui-variant])):not(.y2k-button-primary):not(.y2k-button-secondary):not(.y2k-button-danger):not(.y2k-button-warning):not(.y2k-button-ghost):not(.y2k-button-outline-heavy), .y2k-icon-button { background: var(--y2k-control-bg); }
 .y2k-button, .y2k-icon-button, .y2k-badge, .y2k-nav-link { font-family: var(--y2k-font-control); }
 
 /* Spinner geometry follows the y2k preset's glossy plastic controls. */
@@ -568,7 +570,7 @@
 .y2k-button.y2k-button-outline-heavy,
 .y2k-button-outline-heavy {
   background: transparent;
-  color: var(--usk-primary-ink, var(--y2k-primary));
+  color: var(--usk-primary-ink, var(--y2k-text));
   border-style: solid;
   border-width: 2px;
   border-color: var(--y2k-primary);
@@ -926,7 +928,7 @@
   font: 400 11px/1.2 Tahoma, Verdana, Arial, sans-serif;
 }
 
-[data-ui="y2k"] a {
+[data-ui="y2k"] a:where(:not(.y2k-button):not(.y2k-icon-button)) {
   color: var(--y2k-link);
   text-decoration: underline;
   text-decoration-thickness: auto;
@@ -1098,10 +1100,11 @@
   padding: 0;
 }
 
-.y2k-button:hover,
+/** Hovered neutral controls retain the foreground paired with their neutral surface. */
+.y2k-button:where(:not(.y2k-button-primary):not(.y2k-button-danger):not(.y2k-button-warning)):hover,
 .y2k-icon-button:hover {
-  background: var(--y2k-primary-hover);
-  color: var(--y2k-on-primary);
+  background: var(--y2k-surface-soft);
+  color: var(--y2k-text);
   transform: none;
   box-shadow: var(--y2k-bevel-raised);
 }
@@ -1118,11 +1121,17 @@
 }
 
 .y2k-button-primary {
-  background: linear-gradient(180deg, rgb(255 255 255 / .2), transparent 48%), var(--y2k-primary);
+  /** Keep the raised bevel's reflection outside the label lane. */
+  background: linear-gradient(180deg, rgb(255 255 255 / .2), transparent 20%), var(--y2k-primary);
   color: var(--y2k-on-primary);
   border-color: var(--y2k-border);
 }
 
+.y2k-button-primary:hover {
+  background: var(--y2k-primary-hover);
+  color: var(--y2k-on-primary);
+}
+
 .y2k-button-secondary {
   background: var(--y2k-surface-soft);
   color: var(--y2k-text);
@@ -1131,8 +1140,9 @@
 
 .y2k-button-danger {
   background: var(--y2k-surface-soft);
-  color: var(--y2k-danger);
-  border-color: var(--y2k-border);
+  /** The outline carries the danger signal while surface ink keeps its label readable. */
+  color: var(--y2k-text);
+  border-color: var(--y2k-danger);
 }
 
 /**
@@ -1157,12 +1167,16 @@
 .y2k-button.y2k-button-outline-heavy {
   min-inline-size: 0;
   min-block-size: 1.375rem;
-  background: var(--y2k-surface-soft);
   border: 1px outset var(--y2k-border);
   border-radius: 0;
   box-shadow: var(--y2k-bevel-raised);
   clip-path: none;
 }
+/** Compact CTA geometry preserves a primary action's filled paint and paired ink. */
+.y2k-button-cut:where(:not(.y2k-button-primary)),
+.y2k-button.y2k-button-cut:where(:not(.y2k-button-primary)),
+.y2k-button-outline-heavy,
+.y2k-button.y2k-button-outline-heavy { background: var(--y2k-surface-soft); }
 
 .y2k-field {
   gap: .125rem;
@@ -1380,6 +1394,11 @@
   text-align: center;
 }
 
+/** The two-line seal needs its own frame; compact icon dimensions clip its labels. */
+.y2k-badge-seal { inline-size: 4rem; min-inline-size: 4rem; block-size: 4rem; }
+/** Native inline spacing must not consume the compact seal's label tracks. */
+.y2k-badge-seal > strong, .y2k-badge-seal > small { margin: 0; padding: 0; white-space: nowrap; }
+
 .y2k-feature-item > .y2k-icon-medallion,
 .y2k-callout-bar > .y2k-icon-medallion {
   min-inline-size: 2.75rem;