diff --git a/.changepacks/changepack_log_devup_ui_skill_reset_and_alpha.json b/.changepacks/changepack_log_devup_ui_skill_reset_and_alpha.json
new file mode 100644
index 00000000..06ed826c
--- /dev/null
+++ b/.changepacks/changepack_log_devup_ui_skill_reset_and_alpha.json
@@ -0,0 +1,7 @@
+{
+  "changes": {
+    "crates/devup-mcp/Cargo.toml": "Patch"
+  },
+  "note": "Re-vendors the devup-ui skill from dev-five-git/devup-ui@c7295916, which answers two things readers previously worked out the hard way. `@devup-ui/reset-css` is a normalize rather than a preflight: for form controls it sets `margin: 0` and `-webkit-appearance: button`, and that second rule *preserves* the native control appearance instead of removing it, so button `padding`, `border` and `appearance` are deliberately untouched. That stays invisible until a button is sized in design units, because `box-sizing: border-box` is global and an explicit `8px` width cannot shrink below the `6 + 6 + 2 + 2 = 16px` that Chrome's default `padding: 1px 6px` and `border: 2px outset` already occupy - an 8x8 button from a design renders 16x8, which is the reset behaving as specified rather than a defect, and the document now says so with the call-site fix. The second is alpha: a token is a CSS custom property, which the `$token Scope` section already establishes, so a token at partial opacity is `color-mix()` over `var(--token)` and needs neither an alpha token nor a hardcoded copy of the colour. Without that, a screen hardcoded `#F7F3EC66` beside a `$bg` of the same value, which is not merely redundant but wrong under theming - `$bg` follows the active theme and the literal does not, so the surface stays light in dark mode. This matters here because devup-mcp vendors the document into the binary, so `devup_skills install` writes it on machines with no network, which are the machines least able to work either answer out for themselves.",
+  "date": "2026-09-21T23:15:00+09:00"
+}
diff --git a/crates/devup-mcp/src/server/skills/devup-ui/SKILL.md b/crates/devup-mcp/src/server/skills/devup-ui/SKILL.md
index cd0a4cd7..ade2c1c0 100644
--- a/crates/devup-mcp/src/server/skills/devup-ui/SKILL.md
+++ b/crates/devup-mcp/src/server/skills/devup-ui/SKILL.md
@@ -506,6 +506,34 @@ Do not add `include`, `optimizeDeps.exclude` or `ssr.noExternal` entries for it.
 They are redundant, and writing them suggests to the next reader that a devup-ui
 package needs wiring when none does.
 
+**It is a normalize, not a preflight.** It sets `box-sizing: border-box`
+globally and zeroes a few margins, but for form controls it does exactly two
+things:
+
+```ts
+':where(button,input,select)': { m: 0 },
+':where(button,[type=button i],[type=reset i],[type=submit i])': {
+  WebkitAppearance: 'button',
+},
+```
+
+The second *preserves* the native control appearance rather than removing it.
+Button `padding`, `border` and `appearance` are deliberately left alone, so a
+button still carries the UA defaults — in Chrome `padding: 1px 6px` and
+`border: 2px outset`.
+
+That floor shows up the moment a button is sized in design units. Because
+`box-sizing: border-box` is global, an explicit `8px` width cannot shrink below
+the `6 + 6 + 2 + 2 = 16px` the horizontal padding and border already occupy, so
+an 8x8 button from a design renders 16x8. Nothing is broken and no token is
+wrong; the reset never claimed those properties.
+
+When a button is meant to be a plain box, remove them at the call site:
+
+```tsx
+<Box as="button" appearance="none" border="none" p={0} w="8px" h="8px" />
+```
+
 ## What Decides Static Extraction
 
 One rule explains `Dynamic Values = CSS Variables`, `$token Scope` and
@@ -570,6 +598,25 @@ const colors = { active: 'var(--primary)' }
 <Box bg={colors.active} />
 ```
 
+### Token With Alpha
+
+Because a token *is* a CSS custom property, a token at partial opacity is
+`color-mix()` over `var(--token)`. There is no separate alpha token to define
+and no hardcoded copy of the colour to keep in sync.
+
+```tsx
+// CORRECT - 40% of the theme's own background, still theme-reactive
+<Box bg="color-mix(in srgb, var(--bg) 40%, transparent)" />
+
+// WRONG - a literal copy, frozen at whatever the token was that day
+<Box bg="#F7F3EC66" />
+```
+
+The literal is not merely redundant, it is wrong under theming: `$bg` follows
+the active theme and `#F7F3EC66` does not, so the surface stays light in dark
+mode. `opacity` is not a substitute either — it fades the element together
+with everything inside it, while `color-mix()` fades only the paint.
+
 ## Inline Variant Pattern (Preferred)
 
 Use inline object indexing instead of external config objects:
diff --git a/crates/devup-mcp/src/server/skills/manifest.json b/crates/devup-mcp/src/server/skills/manifest.json
index 48b09419..06a911d6 100644
--- a/crates/devup-mcp/src/server/skills/manifest.json
+++ b/crates/devup-mcp/src/server/skills/manifest.json
@@ -10,16 +10,16 @@
       "usedFor": "The TSX devup_figma_export returns is devup-ui code. Without this the agent does not know its components are compile-time placeholders, that $token means devup.json, or that a style prop takes a responsive array.",
       "repo": "dev-five-git/devup-ui",
       "path": "SKILL.md",
-      "commit": "601dd15cd0f5d3c5b94076155a1ba25f70007c26",
-      "committedAt": "2026-09-15T06:31:11Z",
+      "commit": "c7295916e43657ee357e35f2682b78900c5232c2",
+      "committedAt": "2026-09-21T14:05:45Z",
       "documents": [
         {
           "path": "SKILL.md",
-          "bytes": 21253,
-          "sha256": "2ef847f01a91a7b43d38b2d1a1072e05487624c1f38f2b8f3742ad0e82fd25a2"
+          "bytes": 23101,
+          "sha256": "12787e610016e90ef9e483bd2b82e3c9312aec4b106fed29f07c816e5b0c7fba"
         }
       ],
-      "sourceUrl": "https://github.com/dev-five-git/devup-ui/blob/601dd15cd0f5d3c5b94076155a1ba25f70007c26/SKILL.md",
+      "sourceUrl": "https://github.com/dev-five-git/devup-ui/blob/c7295916e43657ee357e35f2682b78900c5232c2/SKILL.md",
       "latestUrl": "https://github.com/dev-five-git/devup-ui/blob/HEAD/SKILL.md"
     },
     {