@kungal/ui-vue 1.6.3 → 1.8.0

package/CHANGELOG.md

@@ -1,5 +1,66 @@
 # @kungal/ui-vue
 
+## 1.8.0
+
+### Minor Changes
+
+- 3e821c4: feat(tokens,vue): surface-elevation system — cards & inputs pop by fill+shadow, not borders
+
+  Move from a border-defined look to an elevation scale. The page background is now
+  a soft neutral (light `#f5f5f7`, dark near-black `#0a0a0a`) instead of pure
+  white/black, so raised surfaces read as raised:
+
+  - **Card** is a raised surface — `bg-content1` (`#fff` / `#18181b`) + `shadow-kun-sm`;
+    border is now OFF by default (`bordered` is opt-in). It no longer shares the
+    page background.
+  - **Inputs are borderless and share the card surface**: Input, Textarea, Select,
+    NumberInput, TagInput, PinInput, Autocomplete, DatePicker trigger and the
+    Pagination field use `bg-content1` + `shadow-kun-sm` (same fill as a card, lifted
+    by a small shadow). The error state is a danger **ring**, not a border.
+  - **Floating panels lose their border** and rely on shadow + the `content1`
+    surface: Dropdown, Select/Autocomplete lists, ContextMenu, Popover, Tooltip,
+    DatePicker calendar, Modal, Drawer.
+  - **Placeholder** now uses a theme-adaptive `::placeholder` colour (the browser
+    default grey didn't follow light/dark).
+
+  Visual change only; component APIs are unchanged except `KunCard`'s `bordered`
+  default (true→false) and `KunTagInput`'s `variant` default (bordered→flat).
+
+### Patch Changes
+
+- @kungal/ui-core@1.8.0
+
+## 1.7.0
+
+### Minor Changes
+
+- 82de3b5: feat(tokens): regenerate the semantic palette in OKLCH with contrast-guaranteed on-colors
+
+  The whole semantic color system is now **generated** (scripts/gen-tokens.mjs,
+  OKLCH via culori) instead of hand-authored HSL. Each hue is defined once by its
+  OKLCH hue + a vivid `solidL`; every shade is laid on a perceptual lightness ramp
+  (so `-500` means the same perceived lightness for every color), and each color
+  ships a paired **`--color-{c}-foreground`** on-color DERIVED by measured WCAG
+  contrast. The generator asserts AA on every solid (fill, text) pair in BOTH light
+  and dark and fails the build on any regression — illegible solids can't ship
+  again. Adds the previously-missing `-950` shade.
+
+  What changes visually: solids keep HeroUI-style vivid fills (bright amber warning,
+  bright green success — no more muddy darkened `-600` fills), with white text on
+  the medium hues (primary/danger/default) and a refined dark tint on the bright
+  ones (secondary/success/warning/info). Solids are now mode-independent, so the
+  per-variant `dark:bg-{c}-{n}` pins are gone. **This is a visual change** to every
+  colored surface; the component API (color/variant names) is unchanged.
+
+  `@kungal/ui-core`: `kunSolidClasses` / `kunSolidFgClasses` / `kunSolidBgClasses`
+  and the Button solid/shadow rows now use `bg-{c} text-{c}-foreground`. CheckBox,
+  DatePicker, Switch, Carousel drop their hardcoded white/black + dark pins.
+
+### Patch Changes
+
+- Updated dependencies [82de3b5]
+  - @kungal/ui-core@1.7.0
+
 ## 1.6.3
 
 ### Patch Changes

package/dist/components/Card.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Card.vue.d.ts","sourceRoot":"","sources":["../../src/components/Card.vue"],"names":[],"mappings":"AAyHA,OAAO,EAAyB,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAKxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AA2L3C,QAAA,IAAI,QAAQ,IAAU,EAAE,QAAQ,IAAW,EAAE,QAAQ,IAAW,EAAE,QAAQ,IAAY,CAAE;AACxF,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC3C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC7C;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAK/C,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;6EAId,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"Card.vue.d.ts","sourceRoot":"","sources":["../../src/components/Card.vue"],"names":[],"mappings":"AA6HA,OAAO,EAAyB,KAAK,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAKxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAgM3C,QAAA,IAAI,QAAQ,IAAU,EAAE,QAAQ,IAAW,EAAE,QAAQ,IAAW,EAAE,QAAQ,IAAY,CAAE;AACxF,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,KAAK,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC3C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,GAC7C;IAAE,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAK/C,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;6EAId,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/components/CheckBox.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"CheckBox.vue.d.ts","sourceRoot":"","sources":["../../src/components/CheckBox.vue"],"names":[],"mappings":"AAwLA,OAAO,EAKL,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,iBAAiB,CAAA;AAIxB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAI/C,KAAK,WAAW,GAAG,gBAAgB,CAAC;AAyFpC,KAAK,gBAAgB,GAAG;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAmBF,KAAK,iBAAiB,GAAG,WAAW,GAAG,gBAAgB,CAAC;AAoIxD,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAO/C,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;6EAId,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"CheckBox.vue.d.ts","sourceRoot":"","sources":["../../src/components/CheckBox.vue"],"names":[],"mappings":"AAgLA,OAAO,EAKL,KAAK,UAAU,EACf,KAAK,SAAS,EACf,MAAM,iBAAiB,CAAA;AAIxB,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAA;AAI/C,KAAK,WAAW,GAAG,gBAAgB,CAAC;AAiFpC,KAAK,gBAAgB,GAAG;IACxB,UAAU,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;AAmBF,KAAK,iBAAiB,GAAG,WAAW,GAAG,gBAAgB,CAAC;AAoIxD,QAAA,IAAI,OAAO,IAAW,CAAE;AACxB,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,CAAC;AAO/C,QAAA,MAAM,UAAU;;;;;;;;;;;;;;;;;;;6EAId,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/components/ContextMenu.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ContextMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/ContextMenu.vue"],"names":[],"mappings":"AA0RA,OAAO,KAAK,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAiYtE,QAAA,MAAM,YAAY;;;;;;;;;;;;;;6EAIhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}
+{"version":3,"file":"ContextMenu.vue.d.ts","sourceRoot":"","sources":["../../src/components/ContextMenu.vue"],"names":[],"mappings":"AA0RA,OAAO,KAAK,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AA8XtE,QAAA,MAAM,YAAY;;;;;;;;;;;;;;6EAIhB,CAAC;wBACkB,OAAO,YAAY;AAAxC,wBAAyC"}

package/dist/components/Popover.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Popover.vue.d.ts","sourceRoot":"","sources":["../../src/components/Popover.vue"],"names":[],"mappings":"AAuJA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AA6M9C,QAAA,IAAI,OAAO,IAAU,EAAE,QAAQ,IAAY,CAAE;AAC7C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAShD,QAAA,MAAM,UAAU;;;;;;;;;;6EAId,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"Popover.vue.d.ts","sourceRoot":"","sources":["../../src/components/Popover.vue"],"names":[],"mappings":"AAuJA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AA2M9C,QAAA,IAAI,OAAO,IAAU,EAAE,QAAQ,IAAY,CAAE;AAC7C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAShD,QAAA,MAAM,UAAU;;;;;;;;;;6EAId,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/components/Tooltip.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.vue.d.ts","sourceRoot":"","sources":["../../src/components/Tooltip.vue"],"names":[],"mappings":"AAsIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AA0L9C,QAAA,IAAI,OAAO,IAAU,EAAE,QAAQ,IAAY,CAAE;AAC7C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAShD,QAAA,MAAM,UAAU;;;;;;;;;6EAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}
+{"version":3,"file":"Tooltip.vue.d.ts","sourceRoot":"","sources":["../../src/components/Tooltip.vue"],"names":[],"mappings":"AAsIA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,SAAS,CAAA;AAwL9C,QAAA,IAAI,OAAO,IAAU,EAAE,QAAQ,IAAY,CAAE;AAC7C,KAAK,WAAW,GAAG,EAAE,GACnB;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,OAAO,KAAK,GAAG,CAAA;CAAE,GAC5C;IAAE,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,QAAQ,KAAK,GAAG,CAAA;CAAE,CAAC;AAShD,QAAA,MAAM,UAAU;;;;;;;;;6EAGd,CAAC;AACH,QAAA,MAAM,YAAY,EAAS,eAAe,CAAC,OAAO,UAAU,EAAE,WAAW,CAAC,CAAC;wBACtD,OAAO,YAAY;AAAxC,wBAAyC;AAWzC,KAAK,eAAe,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IAChC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KACV,CAAA;CACD,CAAC"}

package/dist/index.js

@@ -419,7 +419,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				role: e.role,
 				"aria-modal": "true",
 				"aria-label": e.ariaLabel || "对话框",
-				class: y(P(q)("kun-modal-panel bg-content1/85 scrollbar-hide shadow-kun-lg relative mx-auto min-w-80 border p-6 backdrop-blur-[var(--kun-background-blur)]", p.value, h.value, u.value, e.innerClassName)),
+				class: y(P(q)("kun-modal-panel bg-content1/85 scrollbar-hide shadow-kun-lg relative mx-auto min-w-80 p-6 backdrop-blur-[var(--kun-background-blur)]", p.value, h.value, u.value, e.innerClassName)),
 				onClick: r[1] ||= K(() => {}, ["stop"])
 			}, [k(t.$slots, "default", {}, void 0, !0), e.isShowCloseButton ? (w(), s($, {
 				key: 0,
@@ -442,7 +442,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 			_: 3
 		})]));
 	}
-}), [["__scopeId", "data-v-856c1b6e"]]), Kt = { class: "max-w-80" }, qt = { class: "space-y-2" }, Jt = {
+}), [["__scopeId", "data-v-f47724a6"]]), Kt = { class: "max-w-80" }, qt = { class: "space-y-2" }, Jt = {
 	key: 0,
 	class: "text-lg font-semibold"
 }, Yt = {
@@ -698,7 +698,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				placeholder: e.placeholder,
 				disabled: e.disabled,
 				autocomplete: "off",
-				class: P(q)("block w-full border transition-[color,box-shadow]", g.value, P(ce)[e.size], e.clearable && p.value ? "pr-9" : "", C.value ? P(q)("border-danger-300", P(Y).danger) : P(q)("border-kun", P(Y)[e.color]), e.disabled && "bg-default-100 cursor-not-allowed"),
+				class: P(q)("block w-full bg-content1 shadow-kun-sm transition-[color,box-shadow]", g.value, P(ce)[e.size], e.clearable && p.value ? "pr-9" : "", C.value ? P(q)("ring-2 ring-danger/60", P(Y).danger) : P(Y)[e.color], e.disabled && "cursor-not-allowed opacity-60"),
 				onInput: te,
 				onFocus: W,
 				onKeydown: ne,
@@ -733,7 +733,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 					ref_key: "dropdownRef",
 					ref: N,
 					style: b([P(I), { transformOrigin: P(R) }]),
-					class: y(P(q)("bg-content1 border-kun z-kun-popover flex flex-col overflow-hidden border p-1 shadow-kun-md", g.value))
+					class: y(P(q)("bg-content1 z-kun-popover flex flex-col overflow-hidden p-1 shadow-kun-md", g.value))
 				}, [u("ul", {
 					ref_key: "listRef",
 					ref: F,
@@ -1112,7 +1112,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 		},
 		bordered: {
 			type: Boolean,
-			default: !0
+			default: !1
 		},
 		className: { default: "" },
 		contentClass: { default: "" },
@@ -1128,7 +1128,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 		let n = e, r = t, i = ct(), { ripples: a, onClick: d } = Ct(), p = o(() => !!n.href || n.clickable), m = o(() => n.href ? i.linkComponent : n.clickable ? "button" : "div"), h = o(() => n.href ? typeof i.linkComponent == "string" ? { href: n.href } : { to: n.href } : n.clickable ? { type: "button" } : {}), g = (e) => {
 			p.value && d(e), r("click", e);
 		}, v = {
-			background: "bg-background",
+			background: "bg-content1",
 			default: "bg-default-100/30",
 			primary: "bg-primary-100/30 border-primary-300",
 			secondary: "bg-secondary-100/30 border-secondary-300",
@@ -1138,7 +1138,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 			info: "bg-info-100/30 border-info-300"
 		}, b = Q(() => n.rounded), x = o(() => X[b.value]);
 		return (t, r) => (w(), s(A(m.value), _(h.value, {
-			class: P(q)("relative flex flex-col gap-3 p-3 backdrop-blur-[var(--kun-background-blur)] transition-all duration-kun-fast", e.isHoverable && "hover:bg-default-100", e.bordered && "border-kun border", p.value && "cursor-pointer overflow-hidden active:scale-[0.97] text-left", e.isTransparent ? "backdrop-blur-none" : v[n.color], x.value, e.className),
+			class: P(q)("relative flex flex-col gap-3 p-3 backdrop-blur-[var(--kun-background-blur)] transition-all duration-kun-fast", !e.isTransparent && "shadow-kun-sm", e.isHoverable && "hover:bg-content2", e.bordered && "border-kun border", p.value && "cursor-pointer overflow-hidden active:scale-[0.97] text-left", e.isTransparent ? "backdrop-blur-none" : v[n.color], x.value, e.className),
 			onClick: g
 		}), {
 			default: U(() => [
@@ -1261,7 +1261,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				type: "button",
 				"aria-label": `跳到第 ${e} 张`,
 				"aria-current": a.value === e - 1 ? "true" : void 0,
-				class: y(P(q)("h-2 rounded-full transition-all", a.value === e - 1 ? "bg-primary dark:bg-primary-400 w-5" : "bg-default-300 hover:bg-default-400 w-2")),
+				class: y(P(q)("h-2 rounded-full transition-all", a.value === e - 1 ? "bg-primary w-5" : "bg-default-300 hover:bg-default-400 w-2")),
 				onClick: (t) => _(e - 1)
 			}, null, 10, Rn))), 128))])) : c("", !0)
 		], 42, Pn));
@@ -1340,22 +1340,22 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 			let t = e.target.checked;
 			a.value = t, s("change", t);
 		}, h = {
-			default: "border-default-300 checked:bg-default dark:checked:bg-default-400 checked:border-default hover:border-default",
-			primary: "border-primary-300 checked:bg-primary dark:checked:bg-primary-400 checked:border-primary hover:border-primary",
-			secondary: "border-secondary-300 checked:bg-secondary dark:checked:bg-secondary-300 checked:border-secondary hover:border-secondary",
-			success: "border-success-300 checked:bg-success-600 dark:checked:bg-success-400 checked:border-success hover:border-success",
-			warning: "border-warning-300 checked:bg-warning dark:checked:bg-warning-400 checked:border-warning hover:border-warning",
-			danger: "border-danger-300 checked:bg-danger dark:checked:bg-danger-400 checked:border-danger hover:border-danger",
-			info: "border-info-300 checked:bg-info-600 dark:checked:bg-info-300 checked:border-info hover:border-info"
+			default: "border-default-300 checked:bg-default checked:border-default hover:border-default",
+			primary: "border-primary-300 checked:bg-primary checked:border-primary hover:border-primary",
+			secondary: "border-secondary-300 checked:bg-secondary checked:border-secondary hover:border-secondary",
+			success: "border-success-300 checked:bg-success checked:border-success hover:border-success",
+			warning: "border-warning-300 checked:bg-warning checked:border-warning hover:border-warning",
+			danger: "border-danger-300 checked:bg-danger checked:border-danger hover:border-danger",
+			info: "border-info-300 checked:bg-info checked:border-info hover:border-info"
 		}, g = {
-			default: "bg-default dark:bg-default-400 border-default",
-			primary: "bg-primary dark:bg-primary-400 border-primary",
-			secondary: "bg-secondary dark:bg-secondary-300 border-secondary",
-			success: "bg-success-600 dark:bg-success-400 border-success",
-			warning: "bg-warning dark:bg-warning-400 border-warning",
-			danger: "bg-danger dark:bg-danger-400 border-danger",
-			info: "bg-info-600 dark:bg-info-300 border-info"
-		}, _ = o(() => he[n.color]), v = o(() => _.value === "text-black" ? "bg-black" : "bg-white");
+			default: "bg-default border-default",
+			primary: "bg-primary border-primary",
+			secondary: "bg-secondary border-secondary",
+			success: "bg-success border-success",
+			warning: "bg-warning border-warning",
+			danger: "bg-danger border-danger",
+			info: "bg-info border-info"
+		}, _ = o(() => he[n.color]);
 		return (t, o) => (w(), l("div", null, [u("div", { class: y(P(q)("flex cursor-pointer items-center", r.value.gap, e.className)) }, [
 			u("div", Vn, [
 				u("input", {
@@ -1375,7 +1375,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 					name: "lucide:check",
 					class: y(r.value.check)
 				}, null, 8, ["class"])], 2), [[B, !e.indeterminate]]),
-				W(u("div", Un, [u("span", { class: y(["h-0.5 rounded-full", [i[n.size], v.value]]) }, null, 2)], 512), [[B, e.indeterminate]])
+				W(u("div", Un, [u("span", { class: y(["h-0.5 rounded-full bg-current", [i[n.size], _.value]]) }, null, 2)], 512), [[B, e.indeterminate]])
 			]),
 			k(t.$slots, "default"),
 			e.label ? (w(), l("label", {
@@ -1546,9 +1546,9 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 			height: "1.85rem",
 			padding: "0",
 			cursor: "pointer",
-			color: "hsl(var(--foreground))",
-			background: "hsl(var(--content1))",
-			border: "1px solid var(--color-kun-border, hsla(var(--foreground), 0.14))",
+			color: "oklch(var(--foreground))",
+			background: "oklch(var(--content1))",
+			border: "1px solid var(--color-kun-border, oklch(var(--foreground) / 0.14))",
 			borderRadius: "0.5rem",
 			opacity: "0.75",
 			transition: "opacity 0.15s, color 0.15s"
@@ -1567,8 +1567,8 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 		if (!t) return;
 		let n = (t.querySelector("code") ?? t).textContent ?? "";
 		navigator.clipboard.writeText(n).then(() => {
-			e.classList.add("copied"), e.classList.contains("kun-prose-copy") ? (e.replaceChildren(Er(Tr)), e.style.color = "hsl(var(--success-500))", setTimeout(() => {
-				e.replaceChildren(Er(wr)), e.style.color = "hsl(var(--foreground))", e.classList.remove("copied");
+			e.classList.add("copied"), e.classList.contains("kun-prose-copy") ? (e.replaceChildren(Er(Tr)), e.style.color = "oklch(var(--success-500))", setTimeout(() => {
+				e.replaceChildren(Er(wr)), e.style.color = "oklch(var(--foreground))", e.classList.remove("copied");
 			}, 2e3)) : setTimeout(() => e.classList.remove("copied"), 3e3);
 		}).catch((e) => {
 			console.error("复制失败:", e);
@@ -2205,7 +2205,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				role: "menu",
 				"aria-orientation": "vertical",
 				tabindex: "-1",
-				class: "border-kun bg-background/95 fixed z-kun-popover rounded-kun-lg border p-1 text-sm shadow-kun-md outline-none backdrop-blur",
+				class: "bg-content1 fixed z-kun-popover rounded-kun-lg p-1 text-sm shadow-kun-md outline-none",
 				style: b(z.value),
 				onClick: a[0] ||= K(() => {}, ["stop"]),
 				onKeydown: G
@@ -2415,7 +2415,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 			u("div", ii, [u("button", {
 				type: "button",
 				disabled: e.disabled,
-				class: y(P(q)("flex w-full cursor-pointer items-center justify-between text-left transition-[color,box-shadow]", P(ce)[a.size], m.value, P(Y)[e.color], "border-kun border", e.disabled && "bg-default-100 cursor-not-allowed")),
+				class: y(P(q)("flex w-full cursor-pointer items-center justify-between text-left transition-[color,box-shadow]", P(ce)[a.size], m.value, P(Y)[e.color], "bg-content1 shadow-kun-sm", e.disabled && "cursor-not-allowed opacity-60")),
 				onClick: le
 			}, [u("span", { class: y(["block truncate", { "text-default-400": !se.value }]) }, j(se.value || e.placeholder), 3), u("div", oi, [e.clearable && se.value ? (w(), l("button", {
 				key: 0,
@@ -2441,7 +2441,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 					key: 0,
 					ref_key: "dropdownRef",
 					ref: x,
-					class: y(P(q)("bg-content1 border-kun z-kun-popover border p-3 shadow-kun-md", m.value)),
+					class: y(P(q)("bg-content1 z-kun-popover p-3 shadow-kun-md", m.value)),
 					style: b([P(C), {
 						minWidth: "260px",
 						transformOrigin: P(E)
@@ -2500,7 +2500,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 						role: "gridcell"
 					}, [u("button", {
 						disabled: t.isDisabled,
-						class: y(P(q)(P(q)("flex h-8 w-8 items-center justify-center rounded-full text-sm transition-colors", P(Y)[e.color]), !t.isCurrentMonth && "text-default-400", t.isToday && "border-primary bg-primary/20 border", !t.isSelected && !t.isDisabled && "hover:bg-default/20", t.isDisabled && "cursor-not-allowed opacity-50", t.isSelected && "bg-primary dark:bg-primary-400 hover:bg-primary/90 text-white", (t.isInRange || fe(t.date)) && !t.isSelected && "bg-primary/10 rounded-none", t.isRangeStart && "rounded-r-none", t.isRangeEnd && "rounded-l-none")),
+						class: y(P(q)(P(q)("flex h-8 w-8 items-center justify-center rounded-full text-sm transition-colors", P(Y)[e.color]), !t.isCurrentMonth && "text-default-400", t.isToday && "border-primary bg-primary/20 border", !t.isSelected && !t.isDisabled && "hover:bg-default/20", t.isDisabled && "cursor-not-allowed opacity-50", t.isSelected && "bg-primary text-primary-foreground hover:bg-primary/90", (t.isInRange || fe(t.date)) && !t.isSelected && "bg-primary/10 rounded-none", t.isRangeStart && "rounded-r-none", t.isRangeEnd && "rounded-l-none")),
 						"aria-label": t.date.toDateString(),
 						"aria-selected": t.isSelected,
 						tabindex: t.date.toDateString() === ie.value.toDateString() ? 0 : -1,
@@ -2802,7 +2802,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				role: "menu",
 				"aria-orientation": "vertical",
 				tabindex: "-1",
-				class: y(P(q)("border-kun bg-background/95 z-kun-popover rounded-kun-lg border p-1 text-sm shadow-kun-md outline-none backdrop-blur", e.menuClass)),
+				class: y(P(q)("bg-content1 z-kun-popover rounded-kun-lg p-1 text-sm shadow-kun-md outline-none", e.menuClass)),
 				style: b([P(S), {
 					minWidth: `${e.minWidth}px`,
 					transformOrigin: P(C)
@@ -2946,7 +2946,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				class: "bg-default-800/70 dark:bg-background/70 absolute inset-0 transition-opacity",
 				onClick: ce
 			}), u("div", {
-				class: y(P(q)("bg-content1 flex flex-col border shadow-kun-lg", M.value, e.innerClassName, e.size === "full" ? m.value : "")),
+				class: y(P(q)("bg-content1 flex flex-col shadow-kun-lg", M.value, e.innerClassName, e.size === "full" ? m.value : "")),
 				onClick: r[0] ||= K(() => {}, ["stop"])
 			}, [
 				e.title || t.$slots.header || e.isShowCloseButton ? (w(), l("header", Ni, [u("div", Pi, [e.title ? (w(), l("h2", {
@@ -2973,7 +2973,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 			_: 3
 		}, 8, ["name"])]));
 	}
-}), [["__scopeId", "data-v-d875426c"]]), zi = {
+}), [["__scopeId", "data-v-2c7f907c"]]), zi = {
 	key: 0,
 	class: "grid grid-rows-[1fr] opacity-100"
 }, Bi = { class: "min-h-0 overflow-hidden" }, Vi = /*#__PURE__*/ dt(/* @__PURE__ */ p({
@@ -3386,7 +3386,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 					required: e.required,
 					"aria-invalid": s.value || void 0,
 					"aria-describedby": a.value || e.error ? `${P(F)}-desc` : void 0,
-					class: P(q)("block w-full border transition-[color,box-shadow] duration-kun-fast ease-kun-standard", E.value, I.value, t.$slots.prefix && "pl-10", C.value, e.disabled && "bg-default-100 cursor-not-allowed", s.value ? P(q)("border-danger-300", P(Y).danger) : P(q)("border-kun", P(Y)[e.color]), e.className),
+					class: P(q)("block w-full bg-content1 shadow-kun-sm transition-[color,box-shadow] duration-kun-fast ease-kun-standard", E.value, I.value, t.$slots.prefix && "pl-10", C.value, e.disabled && "cursor-not-allowed opacity-60", s.value ? P(q)("ring-2 ring-danger/60", P(Y).danger) : P(Y)[e.color], e.className),
 					onInput: z,
 					onBlur: B,
 					onFocus: V
@@ -4077,7 +4077,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				for: P(m),
 				class: "text-default-700 mb-1 block text-sm font-medium"
 			}, [d(j(e.label) + " ", 1), e.required ? (w(), l("span", ao, "*")) : c("", !0)], 8, io)) : c("", !0),
-			u("div", { class: y(P(q)("flex w-full items-stretch overflow-hidden border transition-[color,box-shadow]", p.value, v.value.text, h.value ? P(q)("border-danger-300", P(ue).danger) : P(q)("border-kun", P(ue)[e.color]), e.disabled && "bg-default-100 cursor-not-allowed")) }, [
+			u("div", { class: y(P(q)("bg-content1 shadow-kun-sm flex w-full items-stretch overflow-hidden transition-[color,box-shadow]", p.value, v.value.text, h.value ? P(q)("ring-2 ring-danger/60", P(ue).danger) : P(ue)[e.color], e.disabled && "cursor-not-allowed opacity-60")) }, [
 				e.controls ? (w(), l("button", {
 					key: 0,
 					type: "button",
@@ -4267,7 +4267,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				disabled: e.isLoading,
 				min: "1",
 				max: e.totalPage,
-				class: y(P(q)(P(q)("border-kun w-24 rounded-kun-md border px-2 py-1 text-sm transition-[color,box-shadow]", P(Y).default), e.isLoading && "cursor-not-allowed opacity-50")),
+				class: y(P(q)(P(q)("bg-content1 shadow-kun-sm w-24 rounded-kun-md px-2 py-1 text-sm transition-[color,box-shadow]", P(Y).default), e.isLoading && "cursor-not-allowed opacity-50")),
 				onKeyup: G(h, ["enter"])
 			}, null, 42, So), [[z, a.value]]),
 			f($, {
@@ -4380,7 +4380,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 			placeholder: e.placeholder,
 			"aria-label": `${e.ariaLabel} 第 ${n + 1} 位`,
 			"aria-invalid": e.isInvalid || void 0,
-			class: y(P(q)("bg-content1 text-foreground border text-center font-medium tabular-nums transition-[color,box-shadow] outline-none", u.value, p[e.size], e.isInvalid ? P(q)("border-danger-300", P(Y).danger) : P(q)("border-kun", P(Y)[e.color]), e.disabled && "bg-default-100 cursor-not-allowed opacity-60")),
+			class: y(P(q)("bg-content1 shadow-kun-sm text-foreground text-center font-medium tabular-nums transition-[color,box-shadow] outline-none", u.value, p[e.size], e.isInvalid ? P(q)("ring-2 ring-danger/60", P(Y).danger) : P(Y)[e.color], e.disabled && "cursor-not-allowed opacity-60")),
 			onInput: (e) => x(n, e),
 			onKeydown: (e) => C(n, e),
 			onPaste: (e) => T(n, e),
@@ -4456,14 +4456,14 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				role: "dialog",
 				tabindex: "-1",
 				"aria-label": e.ariaLabel || "popover",
-				class: y(P(q)("bg-content1 border-kun z-kun-popover border shadow-kun-md focus:outline-none", d.value, e.innerClass)),
+				class: y(P(q)("bg-content1 z-kun-popover shadow-kun-md focus:outline-none", d.value, e.innerClass)),
 				style: b([P(_), { transformOrigin: P(x) }]),
 				onKeydown: r[0] ||= G((e) => A(), ["escape"])
 			}, [k(t.$slots, "default"), e.showArrow ? (w(), l("div", {
 				key: 0,
 				ref_key: "arrowRef",
 				ref: S,
-				class: "bg-content1 border-kun size-2 rotate-45 border",
+				class: "bg-content1 size-2 rotate-45",
 				style: b(P(C))
 			}, null, 4)) : c("", !0)], 46, Ao)) : c("", !0)]),
 			_: 3
@@ -5000,7 +5000,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				"aria-controls": _.value,
 				"aria-activedescendant": x.value ? ee.value : void 0,
 				"aria-disabled": e.disabled || void 0,
-				class: y(P(q)("flex w-full cursor-pointer items-center justify-between gap-2 text-left transition-[color,box-shadow]", P(ce)[a.size], p.value, "border", e.error ? P(q)("border-danger-300", P(Y).danger) : P(q)("border-kun", P(Y)[e.color]), e.disabled && "bg-default-100 cursor-not-allowed")),
+				class: y(P(q)("flex w-full cursor-pointer items-center justify-between gap-2 text-left transition-[color,box-shadow]", P(ce)[a.size], p.value, "bg-content1 shadow-kun-sm", e.error ? P(q)("ring-2 ring-danger/60", P(Y).danger) : P(Y)[e.color], e.disabled && "cursor-not-allowed opacity-60")),
 				onClick: re,
 				onKeydown: he
 			}, [
@@ -5061,7 +5061,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 					ref_key: "dropdownRef",
 					ref: E,
 					style: b([P(M), { transformOrigin: P(N) }]),
-					class: y(P(q)("bg-content1 border-kun z-kun-popover flex flex-col overflow-hidden border p-1 shadow-kun-md", p.value))
+					class: y(P(q)("bg-content1 z-kun-popover flex flex-col overflow-hidden p-1 shadow-kun-md", p.value))
 				}, [e.searchable ? (w(), l("div", ss, [W(u("input", {
 					ref_key: "searchRef",
 					ref: A,
@@ -5072,7 +5072,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 					"aria-controls": _.value,
 					"aria-expanded": x.value,
 					"aria-activedescendant": ee.value,
-					class: y(P(q)("border-kun w-full rounded-kun-sm border px-2.5 py-1.5 text-sm", P(Y)[e.color])),
+					class: y(P(q)("bg-content1 shadow-kun-sm w-full rounded-kun-sm px-2.5 py-1.5 text-sm", P(Y)[e.color])),
 					onKeydown: he
 				}, null, 42, cs), [[z, S.value]])])) : c("", !0), u("ul", {
 					ref_key: "listRef",
@@ -5570,7 +5570,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 			}, null, 40, Ms),
 			u("div", Ns, [u("div", { class: y(["rounded-full transition-colors duration-kun-fast ease-kun-standard peer-focus-visible:ring-2 peer-focus-visible:ring-primary/50", [
 				a.value.track,
-				n.value ? "bg-primary-500 dark:bg-primary-400" : "bg-default-500",
+				n.value ? "bg-primary" : "bg-default-500",
 				e.disabled ? "opacity-50" : "",
 				n.value && e.disabled ? "bg-primary-300" : ""
 			]]) }, null, 2), u("div", { class: y(P(q)("absolute top-0.5 left-0.5 transform rounded-full bg-white transition-transform duration-kun-fast ease-kun-emphasized", a.value.thumb, n.value ? a.value.translate : "translate-x-0")) }, null, 2)]),
@@ -5964,7 +5964,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 		},
 		color: { default: "primary" },
 		size: { default: "md" },
-		variant: { default: "bordered" },
+		variant: { default: "flat" },
 		disabled: {
 			type: Boolean,
 			default: !1
@@ -6091,7 +6091,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 			md: "text-sm",
 			lg: "text-base",
 			xl: "text-lg"
-		}, te = o(() => q("flex flex-wrap items-center transition-shadow", a.value, G[r.size], ee[r.size], J[r.size], "border border-transparent", r.variant === "bordered" && !r.error && "border-kun", r.variant === "flat" && "bg-content2", r.error ? ue.danger : ue[r.color], r.error && "border-danger", r.disabled && "opacity-50 cursor-not-allowed bg-default-100", r.readonly && "cursor-default", r.className)), ne = o(() => q("inline-flex items-center gap-1 rounded-full font-medium whitespace-nowrap select-none", _e("flat", r.color), se[r.size], Y[r.color])), re = o(() => d.value.length >= r.maxTags);
+		}, te = o(() => q("flex flex-wrap items-center transition-shadow", a.value, G[r.size], ee[r.size], J[r.size], "border border-transparent", r.variant === "bordered" && !r.error && "border-kun", r.variant === "flat" && "bg-content1 shadow-kun-sm", r.error ? ue.danger : ue[r.color], r.error && "border-danger", r.disabled && "opacity-50 cursor-not-allowed bg-default-100", r.readonly && "cursor-default", r.className)), ne = o(() => q("inline-flex items-center gap-1 rounded-full font-medium whitespace-nowrap select-none", _e("flat", r.color), se[r.size], Y[r.color])), re = o(() => d.value.length >= r.maxTags);
 		return (n, r) => (w(), l("div", Ks, [
 			e.label ? (w(), l("label", {
 				key: 0,
@@ -6300,7 +6300,7 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				minlength: e.minlength,
 				rows: e.rows,
 				autofocus: e.autofocus,
-				class: y(P(q)("scrollbar-hide w-full border transition-[color,box-shadow] duration-kun-fast ease-kun-standard", P(ce)[r.size], a.value, e.error ? P(q)("border-danger-300", P(Y).danger) : P(q)("border-kun", P(Y)[e.color]), e.disabled ? "text-default-500 cursor-not-allowed shadow-none" : "", e.resize === "none" ? "resize-none" : e.resize === "vertical" ? "resize-y" : e.resize === "horizontal" ? "resize-x" : "resize")),
+				class: y(P(q)("scrollbar-hide w-full bg-content1 shadow-kun-sm transition-[color,box-shadow] duration-kun-fast ease-kun-standard", P(ce)[r.size], a.value, e.error ? P(q)("ring-2 ring-danger/60", P(Y).danger) : P(Y)[e.color], e.disabled ? "text-default-500 cursor-not-allowed opacity-60 shadow-none" : "", e.resize === "none" ? "resize-none" : e.resize === "vertical" ? "resize-y" : e.resize === "horizontal" ? "resize-x" : "resize")),
 				onInput: g,
 				onBlur: n[1] ||= (e) => h("blur", e),
 				onFocus: n[2] ||= (e) => h("focus", e)
@@ -6406,13 +6406,13 @@ var tt = Symbol("kun-accordion"), nt = /* @__PURE__ */ p({
 				ref: p,
 				id: P(h),
 				role: "tooltip",
-				class: y(P(q)("bg-content1 border-kun z-kun-popover max-w-xs border px-3 py-2 text-sm font-medium shadow-kun-sm", a.value, e.hideOnMobile && "hidden sm:block")),
+				class: y(P(q)("bg-content1 z-kun-popover max-w-xs px-3 py-2 text-sm font-medium shadow-kun-md", a.value, e.hideOnMobile && "hidden sm:block")),
 				style: b(P(v))
 			}, [k(t.$slots, "content", {}, () => [d(j(e.text), 1)]), e.showArrow ? (w(), l("div", {
 				key: 0,
 				ref_key: "arrowRef",
 				ref: x,
-				class: "bg-content1 border-kun absolute size-2 rotate-45 border",
+				class: "bg-content1 absolute size-2 rotate-45",
 				style: b(P(S))
 			}, null, 4)) : c("", !0)], 14, bc)) : c("", !0)]),
 			_: 3

package/dist/prose.css

@@ -11,9 +11,9 @@
  * want beautiful defaults opt in here.
  *
  * Token-driven, so it adapts to light/dark automatically. The theme stores
- * colours as comma HSL *channels* (`--foreground: 202, 24%, 9%`), so alpha uses
- * legacy `hsla(var(--x), a)` — NOT `hsl(var(--x) / a)`. `--color-kun-border` is
- * already a full neutral `hsl()` colour. Neutral foreground/content tokens drive
+ * colours as OKLCH *channels* (`--foreground: 0.2057 0.0132 233.66`), so wrap in
+ * `oklch(var(--x))` and alpha uses `oklch(var(--x) / a)`. `--color-kun-border`
+ * is already a full neutral colour. Neutral foreground/content tokens drive
  * body + chrome; `--primary-*` only links and the blockquote rule.
  *
  * Pass `compact` to KunContent (or add `.kun-prose-compact`) for a tighter
@@ -25,7 +25,7 @@
   margin-inline: auto;
   font-size: 1.0625rem; /* 17px — editorial body */
   line-height: 1.8; /* generous leading, kind to CJK */
-  color: hsl(var(--foreground));
+  color: oklch(var(--foreground));
   text-wrap: pretty;
   overflow-wrap: break-word;
 }
@@ -48,7 +48,7 @@
 .kun-prose h4,
 .kun-prose h5,
 .kun-prose h6 {
-  color: hsl(var(--foreground));
+  color: oklch(var(--foreground));
   line-height: 1.3;
   text-wrap: balance;
   scroll-margin-top: 5rem;
@@ -85,7 +85,7 @@
 .kun-prose h6 {
   font-size: 0.9em;
   font-weight: 600;
-  color: hsla(var(--foreground), 0.65);
+  color: oklch(var(--foreground) / 0.65);
   margin: 1.5em 0 0.4em;
 }
 
@@ -93,14 +93,14 @@
 .kun-prose strong,
 .kun-prose b {
   font-weight: 650;
-  color: hsl(var(--foreground));
+  color: oklch(var(--foreground));
 }
 .kun-prose em,
 .kun-prose i {
   font-style: italic;
 }
 .kun-prose a {
-  color: hsl(var(--primary-600));
+  color: oklch(var(--primary-600));
   font-weight: 500;
   text-decoration: underline;
   text-decoration-thickness: 1px;
@@ -108,11 +108,11 @@
   transition: color 0.15s var(--ease-kun-standard, ease);
 }
 .kun-prose a:hover {
-  color: hsl(var(--primary-500));
+  color: oklch(var(--primary-500));
 }
 .kun-prose mark {
-  background: hsla(var(--warning-300, 45, 93%, 64%), 0.55);
-  color: hsl(var(--foreground));
+  background: oklch(var(--warning-300) / 0.55);
+  color: oklch(var(--foreground));
   padding: 0.05em 0.25em;
   border-radius: 0.25em;
 }
@@ -134,7 +134,7 @@
   padding-left: 0.25em;
 }
 .kun-prose li::marker {
-  color: hsla(var(--foreground), 0.45);
+  color: oklch(var(--foreground) / 0.45);
 }
 .kun-prose ul ul,
 .kun-prose ul ol,
@@ -150,8 +150,8 @@
 .kun-prose blockquote {
   margin: 1.6em 0;
   padding: 0.2em 0 0.2em 1.1em;
-  border-left: 3px solid hsl(var(--primary-400));
-  color: hsla(var(--foreground), 0.72);
+  border-left: 3px solid oklch(var(--primary-400));
+  color: oklch(var(--foreground) / 0.72);
   font-style: normal;
 }
 .kun-prose blockquote p {
@@ -163,8 +163,8 @@
   font-family:
     ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
   font-size: 0.875em;
-  background: hsl(var(--content2));
-  border: 1px solid var(--color-kun-border, hsla(var(--foreground), 0.12));
+  background: oklch(var(--content2));
+  border: 1px solid var(--color-kun-border, oklch(var(--foreground) / 0.12));
   border-radius: 0.375em;
   padding: 0.12em 0.4em;
 }
@@ -172,8 +172,8 @@
   position: relative; /* anchors the injected copy button */
   margin: 1.5em 0;
   padding: 1em 1.15em;
-  background: hsl(var(--content2));
-  border: 1px solid var(--color-kun-border, hsla(var(--foreground), 0.12));
+  background: oklch(var(--content2));
+  border: 1px solid var(--color-kun-border, oklch(var(--foreground) / 0.12));
   border-radius: 0.75rem;
   overflow-x: auto;
   font-size: 0.9em;
@@ -199,11 +199,11 @@
   text-align: left;
   font-weight: 650;
   padding: 0.6em 0.85em;
-  border-bottom: 2px solid var(--color-kun-border, hsla(var(--foreground), 0.16));
+  border-bottom: 2px solid var(--color-kun-border, oklch(var(--foreground) / 0.16));
 }
 .kun-prose tbody td {
   padding: 0.6em 0.85em;
-  border-bottom: 1px solid var(--color-kun-border, hsla(var(--foreground), 0.1));
+  border-bottom: 1px solid var(--color-kun-border, oklch(var(--foreground) / 0.1));
 }
 .kun-prose tbody tr:last-child td {
   border-bottom: 0;
@@ -212,7 +212,7 @@
 /* Rule + media */
 .kun-prose hr {
   border: 0;
-  border-top: 1px solid var(--color-kun-border, hsla(var(--foreground), 0.12));
+  border-top: 1px solid var(--color-kun-border, oklch(var(--foreground) / 0.12));
   margin: 3em 0;
 }
 .kun-prose img,
@@ -229,9 +229,9 @@
   font-size: 0.8em;
   padding: 0.15em 0.45em;
   border-radius: 0.375em;
-  background: hsl(var(--content2));
-  border: 1px solid var(--color-kun-border, hsla(var(--foreground), 0.14));
-  box-shadow: 0 1px 0 hsla(var(--foreground), 0.12);
+  background: oklch(var(--content2));
+  border: 1px solid var(--color-kun-border, oklch(var(--foreground) / 0.14));
+  box-shadow: 0 1px 0 oklch(var(--foreground) / 0.12);
 }
 
 /* ── Compact density (comment / reply streams) ───────────────────────────────

package/dist/style.css

@@ -1,2 +1,2 @@
-[data-v-44cd432d] *{color:inherit}.ripple[data-v-c00f084d]{animation:ripple-animation-c00f084d .6s var(--ease-kun-out);transform:scale(0)}@keyframes ripple-animation-c00f084d{to{opacity:0;transform:scale(2)}}.kun-modal-enter-active[data-v-856c1b6e]{transition:opacity var(--kun-dur-base) var(--ease-kun-out)}.kun-modal-leave-active[data-v-856c1b6e]{transition:opacity var(--kun-dur-exit) var(--ease-kun-in)}.kun-modal-enter-from[data-v-856c1b6e],.kun-modal-leave-to[data-v-856c1b6e]{opacity:0}.kun-modal-enter-active .kun-modal-panel[data-v-856c1b6e]{transition:transform var(--kun-dur-base) var(--ease-kun-out)}.kun-modal-leave-active .kun-modal-panel[data-v-856c1b6e]{transition:transform var(--kun-dur-exit) var(--ease-kun-in)}.kun-modal-enter-from .kun-modal-panel[data-v-856c1b6e],.kun-modal-leave-to .kun-modal-panel[data-v-856c1b6e]{transform:translateY(8px)scale(.96)}.kun-lightbox-image[data-v-81a536ec]{view-transition-name:kun-lightbox-image}.kun-lightbox-dialog[data-v-81a536ec]::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#1f2937cc}.slide-next-enter-active[data-v-81a536ec],.slide-next-leave-active[data-v-81a536ec],.slide-prev-enter-active[data-v-81a536ec],.slide-prev-leave-active[data-v-81a536ec]{transition:transform .35s cubic-bezier(.4,0,.2,1),opacity .35s cubic-bezier(.4,0,.2,1)}.slide-next-enter-from[data-v-81a536ec]{opacity:0;transform:translate(100%)}.slide-next-leave-to[data-v-81a536ec],.slide-prev-enter-from[data-v-81a536ec]{opacity:0;transform:translate(-100%)}.slide-prev-leave-to[data-v-81a536ec]{opacity:0;transform:translate(100%)}.kun-prose[data-v-46502ad7] img{cursor:zoom-in}.kun-prose[data-v-46502ad7] .kun-spoiler{vertical-align:middle;transition:color var(--kun-dur-base) var(--ease-kun-standard);display:inline-block;position:relative;overflow:hidden}.kun-prose[data-v-46502ad7] div.kun-spoiler{width:fit-content;display:block}.kun-prose[data-v-46502ad7] .kun-spoiler-hidden{cursor:pointer;-webkit-user-select:none;user-select:none;background-color:#9696962e;color:#0000!important}.kun-prose[data-v-46502ad7] .kun-spoiler-hidden>:not(.kun-spoiler-canvas){visibility:hidden}.kun-prose[data-v-46502ad7] .kun-spoiler-hidden:hover{background-color:#96969642}.kun-prose[data-v-46502ad7] .kun-spoiler-hidden.kun-spoiler-live,.kun-prose[data-v-46502ad7] .kun-spoiler-hidden.kun-spoiler-live:hover{background-color:#0000}.kun-drawer-left-enter-active[data-v-d875426c],.kun-drawer-right-enter-active[data-v-d875426c],.kun-drawer-top-enter-active[data-v-d875426c],.kun-drawer-bottom-enter-active[data-v-d875426c]{transition:opacity var(--kun-dur-base) var(--ease-kun-out)}.kun-drawer-left-leave-active[data-v-d875426c],.kun-drawer-right-leave-active[data-v-d875426c],.kun-drawer-top-leave-active[data-v-d875426c],.kun-drawer-bottom-leave-active[data-v-d875426c]{transition:opacity var(--kun-dur-exit) var(--ease-kun-in)}.kun-drawer-left-enter-active>div[data-v-d875426c]:last-child,.kun-drawer-right-enter-active>div[data-v-d875426c]:last-child,.kun-drawer-top-enter-active>div[data-v-d875426c]:last-child,.kun-drawer-bottom-enter-active>div[data-v-d875426c]:last-child{transition:transform var(--kun-dur-base) var(--ease-kun-emphasized)}.kun-drawer-left-leave-active>div[data-v-d875426c]:last-child,.kun-drawer-right-leave-active>div[data-v-d875426c]:last-child,.kun-drawer-top-leave-active>div[data-v-d875426c]:last-child,.kun-drawer-bottom-leave-active>div[data-v-d875426c]:last-child{transition:transform var(--kun-dur-exit) var(--ease-kun-in)}.kun-drawer-left-enter-from[data-v-d875426c],.kun-drawer-left-leave-to[data-v-d875426c]{opacity:0}.kun-drawer-left-enter-from>div[data-v-d875426c]:last-child,.kun-drawer-left-leave-to>div[data-v-d875426c]:last-child{transform:translate(-100%)}.kun-drawer-right-enter-from[data-v-d875426c],.kun-drawer-right-leave-to[data-v-d875426c]{opacity:0}.kun-drawer-right-enter-from>div[data-v-d875426c]:last-child,.kun-drawer-right-leave-to>div[data-v-d875426c]:last-child{transform:translate(100%)}.kun-drawer-top-enter-from[data-v-d875426c],.kun-drawer-top-leave-to[data-v-d875426c]{opacity:0}.kun-drawer-top-enter-from>div[data-v-d875426c]:last-child,.kun-drawer-top-leave-to>div[data-v-d875426c]:last-child{transform:translateY(-100%)}.kun-drawer-bottom-enter-from[data-v-d875426c],.kun-drawer-bottom-leave-to[data-v-d875426c]{opacity:0}.kun-drawer-bottom-enter-from>div[data-v-d875426c]:last-child,.kun-drawer-bottom-leave-to>div[data-v-d875426c]:last-child{transform:translateY(100%)}.kun-fade-expand[data-v-b563c3ba]{transition:grid-template-rows var(--kun-dur-slow) var(--ease-kun-standard), opacity var(--kun-dur-slow) var(--ease-kun-standard)}.kun-fade-collapsed[data-v-b563c3ba]{opacity:0;grid-template-rows:0fr!important}.loli[data-v-c4847e0a]{filter:drop-shadow(2px 4px 3px var(--color-primary-300))}.loli span[data-v-c4847e0a]{clip-path:polygon(10% 0%,90% 0%,100% 50%,90% 100%,10% 100%,0 50%)}.info[data-v-c4847e0a],.info[data-v-c22df434]{color:var(--color-white);text-shadow:0 1px var(--color-foreground), 1px 0 var(--color-foreground), -1px 0 var(--color-foreground), 0 -1px var(--color-foreground), 1px 2px var(--color-foreground)}[data-v-a80e8a61] *{color:inherit}@keyframes shrink-a80e8a61{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.progress-bar[data-v-a80e8a61]{animation:shrink-a80e8a61 var(--v665a68f1) linear forwards;animation-play-state:running}.message-list-move[data-v-2c1073e3]{transition:transform var(--kun-dur-base) var(--ease-kun-emphasized)}.message-list-enter-active[data-v-2c1073e3]{transition:opacity var(--kun-dur-slow) var(--ease-kun-out), transform var(--kun-dur-slow) var(--ease-kun-out)}.message-list-leave-active[data-v-2c1073e3]{transition:opacity var(--kun-dur-base) var(--ease-kun-in), transform var(--kun-dur-base) var(--ease-kun-in);width:100%;position:absolute}.message-list-enter-from[data-v-2c1073e3],.message-list-leave-to[data-v-2c1073e3]{opacity:0;transform:scale(.8)}[class*=top-] .message-list-enter-from[data-v-2c1073e3],[class*=top-] .message-list-leave-to[data-v-2c1073e3]{transform:translateY(-30px)scale(.8)}[class*=bottom-] .message-list-enter-from[data-v-2c1073e3],[class*=bottom-] .message-list-leave-to[data-v-2c1073e3]{transform:translateY(30px)scale(.8)}@keyframes progress-stripes-698d88e3{0%{background-position:1rem 0}to{background-position:0 0}}@keyframes kun-progress-indeterminate{0%{transform:translate(-150%)}to{transform:translate(350%)}}[data-kun-tab-hidden][data-v-ccf67b4b]{content-visibility:hidden}.kun-text-block[data-v-e9ad81ae]{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}.kun-timeline>li:last-child .kun-tl-line{display:none}.kun-timeline>li:last-child .kun-tl-content{padding-bottom:0}.vue-advanced-cropper{text-align:center;-webkit-user-select:none;user-select:none;direction:ltr;max-width:100%;max-height:100%;position:relative}.vue-advanced-cropper__stretcher{pointer-events:none;max-width:100%;max-height:100%;position:relative}.vue-advanced-cropper__image{-webkit-user-select:none;user-select:none;transform-origin:50%;position:absolute;max-width:none!important}.vue-advanced-cropper__background,.vue-advanced-cropper__foreground{opacity:1;background:#000;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.vue-advanced-cropper__boundaries{opacity:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.vue-advanced-cropper__cropper-wrapper{width:100%;height:100%}.vue-advanced-cropper__image-wrapper{width:100%;height:100%;position:absolute;overflow:hidden}.vue-advanced-cropper__stencil-wrapper{position:absolute}.vue-simple-handler{background:#fff;width:10px;height:10px;display:block}.vue-handler-wrapper{width:30px;height:30px;position:absolute;transform:translate(-50%,-50%)}.vue-handler-wrapper__draggable{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.vue-handler-wrapper--west-north{cursor:nw-resize}.vue-handler-wrapper--north{cursor:n-resize}.vue-handler-wrapper--east-north{cursor:ne-resize}.vue-handler-wrapper--east{cursor:e-resize}.vue-handler-wrapper--east-south{cursor:se-resize}.vue-handler-wrapper--south{cursor:s-resize}.vue-handler-wrapper--west-south{cursor:sw-resize}.vue-handler-wrapper--west{cursor:w-resize}.vue-handler-wrapper--disabled{cursor:auto}.vue-line-wrapper{background:0 0;justify-content:center;align-items:center;display:flex;position:absolute}.vue-line-wrapper--north,.vue-line-wrapper--south{width:100%;height:12px;left:0;transform:translateY(-50%)}.vue-line-wrapper--north{cursor:n-resize;top:0}.vue-line-wrapper--south{cursor:s-resize;top:100%}.vue-line-wrapper--east,.vue-line-wrapper--west{width:12px;height:100%;top:0;transform:translate(-50%)}.vue-line-wrapper--east{cursor:e-resize;left:100%}.vue-line-wrapper--west{cursor:w-resize;left:0}.vue-line-wrapper--disabled{cursor:auto}.vue-bounding-box{width:100%;height:100%;position:relative}.vue-bounding-box__handler{position:absolute}.vue-bounding-box__handler--west-north{top:0;left:0}.vue-bounding-box__handler--north{top:0;left:50%}.vue-bounding-box__handler--east-north{top:0;left:100%}.vue-bounding-box__handler--east{top:50%;left:100%}.vue-bounding-box__handler--east-south{top:100%;left:100%}.vue-bounding-box__handler--south{top:100%;left:50%}.vue-bounding-box__handler--west-south{top:100%;left:0}.vue-bounding-box__handler--west{top:50%;left:0}.vue-draggable-area{position:relative}.vue-preview-result{box-sizing:border-box;width:100%;height:100%;position:absolute;overflow:hidden}.vue-preview-result__wrapper{position:absolute}.vue-preview-result__image{pointer-events:none;-webkit-user-select:none;user-select:none;transform-origin:50%;position:relative;max-width:none!important}.vue-rectangle-stencil{box-sizing:border-box;width:100%;height:100%;position:absolute}.vue-rectangle-stencil__preview{width:100%;height:100%;position:absolute}.vue-rectangle-stencil--movable{cursor:move}.vue-circle-stencil{box-sizing:content-box;cursor:move;width:100%;height:100%;position:absolute}.vue-circle-stencil__preview{border-radius:50%;width:100%;height:100%;position:absolute}.vue-circle-stencil--movable{cursor:move}.vue-preview{box-sizing:border-box;position:relative;overflow:hidden}.vue-preview--fill,.vue-preview__wrapper{width:100%;height:100%;position:absolute}.vue-preview__image{pointer-events:none;-webkit-user-select:none;user-select:none;transform-origin:50%;position:absolute;max-width:none!important}.vue-simple-line{background:0 0;border:0 solid #ffffff4d;transition:border .5s}.vue-simple-line--south,.vue-simple-line--north{width:100%;height:0}.vue-simple-line--east,.vue-simple-line--west{width:0;height:100%}.vue-simple-line--east{border-right-width:1px}.vue-simple-line--west{border-left-width:1px}.vue-simple-line--south{border-bottom-width:1px}.vue-simple-line--north{border-top-width:1px}.vue-simple-line--hover{opacity:1;border-color:#fff}.vue-advanced-cropper__foreground{opacity:.7}.vue-circle-stencil__preview:after,.vue-circle-stencil__preview:before,.vue-rectangle-stencil__preview:after,.vue-rectangle-stencil__preview:before{content:"";opacity:0;pointer-events:none;z-index:1;transition:opacity .25s;position:absolute}.vue-circle-stencil__preview:after,.vue-rectangle-stencil__preview:after{border-left:1px solid #fff;border-right:1px solid #fff;width:33%;height:100%;top:0;left:50%;transform:translate(-50%)}.vue-circle-stencil__preview:before,.vue-rectangle-stencil__preview:before{border-top:1px solid #fff;border-bottom:1px solid #fff;width:100%;height:33%;top:50%;left:0;transform:translateY(-50%)}.vue-circle-stencil--moving .vue-rectangle-stencil__preview:after,.vue-circle-stencil--moving .vue-rectangle-stencil__preview:before,.vue-circle-stencil--moving .vue-circle-stencil__preview:after,.vue-circle-stencil--moving .vue-circle-stencil__preview:before,.vue-circle-stencil--resizing .vue-rectangle-stencil__preview:after,.vue-circle-stencil--resizing .vue-rectangle-stencil__preview:before,.vue-circle-stencil--resizing .vue-circle-stencil__preview:after,.vue-circle-stencil--resizing .vue-circle-stencil__preview:before,.vue-rectangle-stencil--moving .vue-rectangle-stencil__preview:after,.vue-rectangle-stencil--moving .vue-rectangle-stencil__preview:before,.vue-rectangle-stencil--moving .vue-circle-stencil__preview:after,.vue-rectangle-stencil--moving .vue-circle-stencil__preview:before,.vue-rectangle-stencil--resizing .vue-rectangle-stencil__preview:after,.vue-rectangle-stencil--resizing .vue-rectangle-stencil__preview:before,.vue-rectangle-stencil--resizing .vue-circle-stencil__preview:after,.vue-rectangle-stencil--resizing .vue-circle-stencil__preview:before{opacity:.7}.vue-simple-line{border-color:#fffc}.vue-simple-handler-wrapper{width:24px;height:24px}.vue-simple-handler-wrapper--west-north{transform:translate(0)}.vue-simple-handler-wrapper--east-south{transform:translate(-100%,-100%)}.vue-simple-handler-wrapper--west-south{transform:translateY(-100%)}.vue-simple-handler-wrapper--east-north{transform:translate(-100%)}.vue-simple-handler{opacity:0;background:#fff;border:none;flex-shrink:0;width:4px;height:4px;transition:opacity .5s;display:block;position:relative;top:auto;left:auto}.vue-simple-handler--west-north,.vue-simple-handler--east-south,.vue-simple-handler--west-south,.vue-simple-handler--east-north{opacity:.7;background:0 0;width:16px;height:16px;display:block}.vue-simple-handler--west-north{border-top:2px solid #fff;border-left:2px solid #fff}.vue-simple-handler--east-south{border-bottom:2px solid #fff;border-right:2px solid #fff}.vue-simple-handler--west-south{border-bottom:2px solid #fff;border-left:2px solid #fff}.vue-simple-handler--east-north{border-top:2px solid #fff;border-right:2px solid #fff}.vue-simple-handler--hover{opacity:1}.vue-circle-stencil__preview{border:2px solid #fffc}.vue-circle-stencil .vue-simple-line{border-color:#ffffff4d}.vue-circle-stencil .vue-simple-handler--west-north,.vue-circle-stencil .vue-simple-handler--east-south,.vue-circle-stencil .vue-simple-handler--west-south,.vue-circle-stencil .vue-simple-handler--east-north{opacity:.4}.vue-circle-stencil .vue-simple-handler--hover{opacity:1}
+[data-v-44cd432d] *{color:inherit}.ripple[data-v-c00f084d]{animation:ripple-animation-c00f084d .6s var(--ease-kun-out);transform:scale(0)}@keyframes ripple-animation-c00f084d{to{opacity:0;transform:scale(2)}}.kun-modal-enter-active[data-v-f47724a6]{transition:opacity var(--kun-dur-base) var(--ease-kun-out)}.kun-modal-leave-active[data-v-f47724a6]{transition:opacity var(--kun-dur-exit) var(--ease-kun-in)}.kun-modal-enter-from[data-v-f47724a6],.kun-modal-leave-to[data-v-f47724a6]{opacity:0}.kun-modal-enter-active .kun-modal-panel[data-v-f47724a6]{transition:transform var(--kun-dur-base) var(--ease-kun-out)}.kun-modal-leave-active .kun-modal-panel[data-v-f47724a6]{transition:transform var(--kun-dur-exit) var(--ease-kun-in)}.kun-modal-enter-from .kun-modal-panel[data-v-f47724a6],.kun-modal-leave-to .kun-modal-panel[data-v-f47724a6]{transform:translateY(8px)scale(.96)}.kun-lightbox-image[data-v-81a536ec]{view-transition-name:kun-lightbox-image}.kun-lightbox-dialog[data-v-81a536ec]::backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#1f2937cc}.slide-next-enter-active[data-v-81a536ec],.slide-next-leave-active[data-v-81a536ec],.slide-prev-enter-active[data-v-81a536ec],.slide-prev-leave-active[data-v-81a536ec]{transition:transform .35s cubic-bezier(.4,0,.2,1),opacity .35s cubic-bezier(.4,0,.2,1)}.slide-next-enter-from[data-v-81a536ec]{opacity:0;transform:translate(100%)}.slide-next-leave-to[data-v-81a536ec],.slide-prev-enter-from[data-v-81a536ec]{opacity:0;transform:translate(-100%)}.slide-prev-leave-to[data-v-81a536ec]{opacity:0;transform:translate(100%)}.kun-prose[data-v-46502ad7] img{cursor:zoom-in}.kun-prose[data-v-46502ad7] .kun-spoiler{vertical-align:middle;transition:color var(--kun-dur-base) var(--ease-kun-standard);display:inline-block;position:relative;overflow:hidden}.kun-prose[data-v-46502ad7] div.kun-spoiler{width:fit-content;display:block}.kun-prose[data-v-46502ad7] .kun-spoiler-hidden{cursor:pointer;-webkit-user-select:none;user-select:none;background-color:#9696962e;color:#0000!important}.kun-prose[data-v-46502ad7] .kun-spoiler-hidden>:not(.kun-spoiler-canvas){visibility:hidden}.kun-prose[data-v-46502ad7] .kun-spoiler-hidden:hover{background-color:#96969642}.kun-prose[data-v-46502ad7] .kun-spoiler-hidden.kun-spoiler-live,.kun-prose[data-v-46502ad7] .kun-spoiler-hidden.kun-spoiler-live:hover{background-color:#0000}.kun-drawer-left-enter-active[data-v-2c7f907c],.kun-drawer-right-enter-active[data-v-2c7f907c],.kun-drawer-top-enter-active[data-v-2c7f907c],.kun-drawer-bottom-enter-active[data-v-2c7f907c]{transition:opacity var(--kun-dur-base) var(--ease-kun-out)}.kun-drawer-left-leave-active[data-v-2c7f907c],.kun-drawer-right-leave-active[data-v-2c7f907c],.kun-drawer-top-leave-active[data-v-2c7f907c],.kun-drawer-bottom-leave-active[data-v-2c7f907c]{transition:opacity var(--kun-dur-exit) var(--ease-kun-in)}.kun-drawer-left-enter-active>div[data-v-2c7f907c]:last-child,.kun-drawer-right-enter-active>div[data-v-2c7f907c]:last-child,.kun-drawer-top-enter-active>div[data-v-2c7f907c]:last-child,.kun-drawer-bottom-enter-active>div[data-v-2c7f907c]:last-child{transition:transform var(--kun-dur-base) var(--ease-kun-emphasized)}.kun-drawer-left-leave-active>div[data-v-2c7f907c]:last-child,.kun-drawer-right-leave-active>div[data-v-2c7f907c]:last-child,.kun-drawer-top-leave-active>div[data-v-2c7f907c]:last-child,.kun-drawer-bottom-leave-active>div[data-v-2c7f907c]:last-child{transition:transform var(--kun-dur-exit) var(--ease-kun-in)}.kun-drawer-left-enter-from[data-v-2c7f907c],.kun-drawer-left-leave-to[data-v-2c7f907c]{opacity:0}.kun-drawer-left-enter-from>div[data-v-2c7f907c]:last-child,.kun-drawer-left-leave-to>div[data-v-2c7f907c]:last-child{transform:translate(-100%)}.kun-drawer-right-enter-from[data-v-2c7f907c],.kun-drawer-right-leave-to[data-v-2c7f907c]{opacity:0}.kun-drawer-right-enter-from>div[data-v-2c7f907c]:last-child,.kun-drawer-right-leave-to>div[data-v-2c7f907c]:last-child{transform:translate(100%)}.kun-drawer-top-enter-from[data-v-2c7f907c],.kun-drawer-top-leave-to[data-v-2c7f907c]{opacity:0}.kun-drawer-top-enter-from>div[data-v-2c7f907c]:last-child,.kun-drawer-top-leave-to>div[data-v-2c7f907c]:last-child{transform:translateY(-100%)}.kun-drawer-bottom-enter-from[data-v-2c7f907c],.kun-drawer-bottom-leave-to[data-v-2c7f907c]{opacity:0}.kun-drawer-bottom-enter-from>div[data-v-2c7f907c]:last-child,.kun-drawer-bottom-leave-to>div[data-v-2c7f907c]:last-child{transform:translateY(100%)}.kun-fade-expand[data-v-b563c3ba]{transition:grid-template-rows var(--kun-dur-slow) var(--ease-kun-standard), opacity var(--kun-dur-slow) var(--ease-kun-standard)}.kun-fade-collapsed[data-v-b563c3ba]{opacity:0;grid-template-rows:0fr!important}.loli[data-v-c4847e0a]{filter:drop-shadow(2px 4px 3px var(--color-primary-300))}.loli span[data-v-c4847e0a]{clip-path:polygon(10% 0%,90% 0%,100% 50%,90% 100%,10% 100%,0 50%)}.info[data-v-c4847e0a],.info[data-v-c22df434]{color:var(--color-white);text-shadow:0 1px var(--color-foreground), 1px 0 var(--color-foreground), -1px 0 var(--color-foreground), 0 -1px var(--color-foreground), 1px 2px var(--color-foreground)}[data-v-a80e8a61] *{color:inherit}@keyframes shrink-a80e8a61{0%{transform:scaleX(1)}to{transform:scaleX(0)}}.progress-bar[data-v-a80e8a61]{animation:shrink-a80e8a61 var(--v665a68f1) linear forwards;animation-play-state:running}.message-list-move[data-v-2c1073e3]{transition:transform var(--kun-dur-base) var(--ease-kun-emphasized)}.message-list-enter-active[data-v-2c1073e3]{transition:opacity var(--kun-dur-slow) var(--ease-kun-out), transform var(--kun-dur-slow) var(--ease-kun-out)}.message-list-leave-active[data-v-2c1073e3]{transition:opacity var(--kun-dur-base) var(--ease-kun-in), transform var(--kun-dur-base) var(--ease-kun-in);width:100%;position:absolute}.message-list-enter-from[data-v-2c1073e3],.message-list-leave-to[data-v-2c1073e3]{opacity:0;transform:scale(.8)}[class*=top-] .message-list-enter-from[data-v-2c1073e3],[class*=top-] .message-list-leave-to[data-v-2c1073e3]{transform:translateY(-30px)scale(.8)}[class*=bottom-] .message-list-enter-from[data-v-2c1073e3],[class*=bottom-] .message-list-leave-to[data-v-2c1073e3]{transform:translateY(30px)scale(.8)}@keyframes progress-stripes-698d88e3{0%{background-position:1rem 0}to{background-position:0 0}}@keyframes kun-progress-indeterminate{0%{transform:translate(-150%)}to{transform:translate(350%)}}[data-kun-tab-hidden][data-v-ccf67b4b]{content-visibility:hidden}.kun-text-block[data-v-e9ad81ae]{white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word}.kun-timeline>li:last-child .kun-tl-line{display:none}.kun-timeline>li:last-child .kun-tl-content{padding-bottom:0}.vue-advanced-cropper{text-align:center;-webkit-user-select:none;user-select:none;direction:ltr;max-width:100%;max-height:100%;position:relative}.vue-advanced-cropper__stretcher{pointer-events:none;max-width:100%;max-height:100%;position:relative}.vue-advanced-cropper__image{-webkit-user-select:none;user-select:none;transform-origin:50%;position:absolute;max-width:none!important}.vue-advanced-cropper__background,.vue-advanced-cropper__foreground{opacity:1;background:#000;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.vue-advanced-cropper__boundaries{opacity:1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.vue-advanced-cropper__cropper-wrapper{width:100%;height:100%}.vue-advanced-cropper__image-wrapper{width:100%;height:100%;position:absolute;overflow:hidden}.vue-advanced-cropper__stencil-wrapper{position:absolute}.vue-simple-handler{background:#fff;width:10px;height:10px;display:block}.vue-handler-wrapper{width:30px;height:30px;position:absolute;transform:translate(-50%,-50%)}.vue-handler-wrapper__draggable{justify-content:center;align-items:center;width:100%;height:100%;display:flex}.vue-handler-wrapper--west-north{cursor:nw-resize}.vue-handler-wrapper--north{cursor:n-resize}.vue-handler-wrapper--east-north{cursor:ne-resize}.vue-handler-wrapper--east{cursor:e-resize}.vue-handler-wrapper--east-south{cursor:se-resize}.vue-handler-wrapper--south{cursor:s-resize}.vue-handler-wrapper--west-south{cursor:sw-resize}.vue-handler-wrapper--west{cursor:w-resize}.vue-handler-wrapper--disabled{cursor:auto}.vue-line-wrapper{background:0 0;justify-content:center;align-items:center;display:flex;position:absolute}.vue-line-wrapper--north,.vue-line-wrapper--south{width:100%;height:12px;left:0;transform:translateY(-50%)}.vue-line-wrapper--north{cursor:n-resize;top:0}.vue-line-wrapper--south{cursor:s-resize;top:100%}.vue-line-wrapper--east,.vue-line-wrapper--west{width:12px;height:100%;top:0;transform:translate(-50%)}.vue-line-wrapper--east{cursor:e-resize;left:100%}.vue-line-wrapper--west{cursor:w-resize;left:0}.vue-line-wrapper--disabled{cursor:auto}.vue-bounding-box{width:100%;height:100%;position:relative}.vue-bounding-box__handler{position:absolute}.vue-bounding-box__handler--west-north{top:0;left:0}.vue-bounding-box__handler--north{top:0;left:50%}.vue-bounding-box__handler--east-north{top:0;left:100%}.vue-bounding-box__handler--east{top:50%;left:100%}.vue-bounding-box__handler--east-south{top:100%;left:100%}.vue-bounding-box__handler--south{top:100%;left:50%}.vue-bounding-box__handler--west-south{top:100%;left:0}.vue-bounding-box__handler--west{top:50%;left:0}.vue-draggable-area{position:relative}.vue-preview-result{box-sizing:border-box;width:100%;height:100%;position:absolute;overflow:hidden}.vue-preview-result__wrapper{position:absolute}.vue-preview-result__image{pointer-events:none;-webkit-user-select:none;user-select:none;transform-origin:50%;position:relative;max-width:none!important}.vue-rectangle-stencil{box-sizing:border-box;width:100%;height:100%;position:absolute}.vue-rectangle-stencil__preview{width:100%;height:100%;position:absolute}.vue-rectangle-stencil--movable{cursor:move}.vue-circle-stencil{box-sizing:content-box;cursor:move;width:100%;height:100%;position:absolute}.vue-circle-stencil__preview{border-radius:50%;width:100%;height:100%;position:absolute}.vue-circle-stencil--movable{cursor:move}.vue-preview{box-sizing:border-box;position:relative;overflow:hidden}.vue-preview--fill,.vue-preview__wrapper{width:100%;height:100%;position:absolute}.vue-preview__image{pointer-events:none;-webkit-user-select:none;user-select:none;transform-origin:50%;position:absolute;max-width:none!important}.vue-simple-line{background:0 0;border:0 solid #ffffff4d;transition:border .5s}.vue-simple-line--south,.vue-simple-line--north{width:100%;height:0}.vue-simple-line--east,.vue-simple-line--west{width:0;height:100%}.vue-simple-line--east{border-right-width:1px}.vue-simple-line--west{border-left-width:1px}.vue-simple-line--south{border-bottom-width:1px}.vue-simple-line--north{border-top-width:1px}.vue-simple-line--hover{opacity:1;border-color:#fff}.vue-advanced-cropper__foreground{opacity:.7}.vue-circle-stencil__preview:after,.vue-circle-stencil__preview:before,.vue-rectangle-stencil__preview:after,.vue-rectangle-stencil__preview:before{content:"";opacity:0;pointer-events:none;z-index:1;transition:opacity .25s;position:absolute}.vue-circle-stencil__preview:after,.vue-rectangle-stencil__preview:after{border-left:1px solid #fff;border-right:1px solid #fff;width:33%;height:100%;top:0;left:50%;transform:translate(-50%)}.vue-circle-stencil__preview:before,.vue-rectangle-stencil__preview:before{border-top:1px solid #fff;border-bottom:1px solid #fff;width:100%;height:33%;top:50%;left:0;transform:translateY(-50%)}.vue-circle-stencil--moving .vue-rectangle-stencil__preview:after,.vue-circle-stencil--moving .vue-rectangle-stencil__preview:before,.vue-circle-stencil--moving .vue-circle-stencil__preview:after,.vue-circle-stencil--moving .vue-circle-stencil__preview:before,.vue-circle-stencil--resizing .vue-rectangle-stencil__preview:after,.vue-circle-stencil--resizing .vue-rectangle-stencil__preview:before,.vue-circle-stencil--resizing .vue-circle-stencil__preview:after,.vue-circle-stencil--resizing .vue-circle-stencil__preview:before,.vue-rectangle-stencil--moving .vue-rectangle-stencil__preview:after,.vue-rectangle-stencil--moving .vue-rectangle-stencil__preview:before,.vue-rectangle-stencil--moving .vue-circle-stencil__preview:after,.vue-rectangle-stencil--moving .vue-circle-stencil__preview:before,.vue-rectangle-stencil--resizing .vue-rectangle-stencil__preview:after,.vue-rectangle-stencil--resizing .vue-rectangle-stencil__preview:before,.vue-rectangle-stencil--resizing .vue-circle-stencil__preview:after,.vue-rectangle-stencil--resizing .vue-circle-stencil__preview:before{opacity:.7}.vue-simple-line{border-color:#fffc}.vue-simple-handler-wrapper{width:24px;height:24px}.vue-simple-handler-wrapper--west-north{transform:translate(0)}.vue-simple-handler-wrapper--east-south{transform:translate(-100%,-100%)}.vue-simple-handler-wrapper--west-south{transform:translateY(-100%)}.vue-simple-handler-wrapper--east-north{transform:translate(-100%)}.vue-simple-handler{opacity:0;background:#fff;border:none;flex-shrink:0;width:4px;height:4px;transition:opacity .5s;display:block;position:relative;top:auto;left:auto}.vue-simple-handler--west-north,.vue-simple-handler--east-south,.vue-simple-handler--west-south,.vue-simple-handler--east-north{opacity:.7;background:0 0;width:16px;height:16px;display:block}.vue-simple-handler--west-north{border-top:2px solid #fff;border-left:2px solid #fff}.vue-simple-handler--east-south{border-bottom:2px solid #fff;border-right:2px solid #fff}.vue-simple-handler--west-south{border-bottom:2px solid #fff;border-left:2px solid #fff}.vue-simple-handler--east-north{border-top:2px solid #fff;border-right:2px solid #fff}.vue-simple-handler--hover{opacity:1}.vue-circle-stencil__preview{border:2px solid #fffc}.vue-circle-stencil .vue-simple-line{border-color:#ffffff4d}.vue-circle-stencil .vue-simple-handler--west-north,.vue-circle-stencil .vue-simple-handler--east-south,.vue-circle-stencil .vue-simple-handler--west-south,.vue-circle-stencil .vue-simple-handler--east-north{opacity:.4}.vue-circle-stencil .vue-simple-handler--hover{opacity:1}
 /*$vite$:1*/

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kungal/ui-vue",
-  "version": "1.6.3",
+  "version": "1.8.0",
   "description": "KunUI Vue 3 component layer — Nuxt-decoupled. Works in any Vue app; pairs with @kungal/ui-nuxt for Nuxt sugar.",
   "type": "module",
   "keywords": [
@@ -50,7 +50,7 @@
     "date-fns": "^4.1.0",
     "focus-trap": "^8.2.1",
     "vue-advanced-cropper": "^2.8.9",
-    "@kungal/ui-core": "1.6.3"
+    "@kungal/ui-core": "1.8.0"
   },
   "peerDependencies": {
     "vue": "^3.5.0"
@@ -62,7 +62,7 @@
     "vite": "^8.0.16",
     "vue": "^3.5.35",
     "vue-tsc": "^3.3.3",
-    "@kungal/ui-tokens": "1.6.3"
+    "@kungal/ui-tokens": "1.8.0"
   },
   "scripts": {
     "build": "vite build && cp src/prose.css dist/prose.css && vue-tsc -p tsconfig.build.json",