@fangxinyan/lumina 0.6.17 → 0.7.0

package/dist/styles.css

@@ -126,6 +126,15 @@
   --dur: 220ms;
   --dur-slow: 360ms;
 }
+/* 尊重系统的减少动态效果偏好，同时保持组件状态切换事件可完成。 */
+@media (prefers-reduced-motion: reduce) {
+  :root,
+  [data-theme] {
+    --dur-fast: 0.01ms;
+    --dur: 0.01ms;
+    --dur-slow: 0.01ms;
+  }
+}
 /* Explicit light reset for scoped ThemeProvider instances.
    :root already has these defaults, but nested [data-theme="light"] must not
    inherit a dark or custom parent surface. */
@@ -259,8 +268,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
 @keyframes fadeIn { from { opacity: 0; } }
 @keyframes menuIn { from { opacity: 0; transform: translateY(-4px); } }
 /* Components — order mirrors the original monolithic components.css section order. */
+.named-icon.spinning > svg {
+  animation: spin 0.9s linear infinite;
+}
+svg[data-lumina-icon-color],
+.named-icon[data-lumina-icon-color] {
+  color: var(--lmn-icon-fg, var(--fg));
+}
+@media (prefers-reduced-motion: reduce) {
+  .named-icon.spinning > svg { animation: none; }
+}
 /* ============ Button ============ */
 .btn {
+  --button-bg: var(--lmn-button-bg, var(--bg));
   display: inline-flex;
   align-items: center;
   justify-content: center;
@@ -272,9 +292,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-size: var(--fs-md);
   font-weight: 500;
   font-family: inherit;
-  color: var(--fg);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  color: var(--lmn-button-fg, var(--fg));
+  background: var(--button-bg);
+  box-shadow: var(--lmn-button-neu-shadow-control, var(--neu-shadow-control));
   cursor: pointer;
   user-select: none;
   white-space: nowrap;
@@ -305,40 +325,42 @@ input, textarea, select { font-family: inherit; color: inherit; }
   overflow: visible;
 }
 .btn.primary {
-  color: var(--accent-ink);
-  background: color-mix(in oklch, var(--accent-soft) 62%, var(--bg));
+  --button-bg: color-mix(in oklch, var(--lmn-button-accent-soft, var(--accent-soft)) 62%, var(--lmn-button-bg, var(--bg)));
+  color: var(--lmn-button-accent-ink, var(--accent-ink));
+  background: var(--button-bg);
   font-weight: 600;
 }
 .btn.ghost {
   background: transparent;
   box-shadow: none;
-  color: var(--fg-muted);
+  color: var(--lmn-button-fg-muted, var(--fg-muted));
 }
-.btn.danger { color: var(--danger); }
+.btn.danger { color: var(--lmn-button-danger, var(--danger)); }
 .btn:hover {
-  box-shadow: var(--neu-shadow-panel);
+  background: var(--lmn-button-hover-background, var(--button-bg));
+  box-shadow: var(--lmn-button-neu-shadow-panel, var(--neu-shadow-panel));
 }
 .btn.ghost:hover {
-  background: var(--bg);
+  background: var(--lmn-button-hover-background, var(--lmn-button-bg, var(--bg)));
   border-color: transparent;
-  box-shadow: var(--neu-shadow-subtle);
-  color: var(--fg);
+  box-shadow: var(--lmn-button-neu-shadow-subtle, var(--neu-shadow-subtle));
+  color: var(--lmn-button-fg, var(--fg));
 }
 .btn.danger:hover {
-  color: var(--danger);
+  color: var(--lmn-button-danger, var(--danger));
 }
 .btn:active,
 .btn.pressed {
-  box-shadow: var(--neu-shadow-inset-strong);
+  box-shadow: var(--lmn-button-neu-shadow-inset-strong, var(--neu-shadow-inset-strong));
 }
 .btn.ghost:active,
 .btn.ghost.pressed {
-  background: var(--bg);
-  color: var(--fg);
+  background: var(--lmn-button-bg, var(--bg));
+  color: var(--lmn-button-fg, var(--fg));
 }
 .btn.danger:active,
 .btn.danger.pressed {
-  color: var(--danger);
+  color: var(--lmn-button-danger, var(--danger));
 }
 .btn.icon { width: var(--ctrl-h); padding: 0; }
 .btn.sm { height: var(--ctrl-h-sm); padding: 0 var(--ctrl-pad-x-sm); font-size: var(--fs-sm); border-radius: var(--r-sm); }
@@ -347,17 +369,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .btn.lg.icon { width: var(--ctrl-h-lg); padding: 0; }
 .btn.block { width: 100%; flex-shrink: 1; }
 .btn[disabled], .btn.disabled, .btn:disabled {
-  color: var(--fg-subtle);
+  color: var(--lmn-button-fg-subtle, var(--fg-subtle));
   cursor: not-allowed;
   border-color: transparent;
-  box-shadow: var(--neu-shadow-subtle);
+  box-shadow: var(--lmn-button-neu-shadow-subtle, var(--neu-shadow-subtle));
   transform: none;
 }
 .btn[disabled]:hover, .btn:disabled:hover, .btn.disabled:hover {
-  color: var(--fg-subtle);
-  background: var(--bg);
+  color: var(--lmn-button-fg-subtle, var(--fg-subtle));
+  background: var(--lmn-button-bg, var(--bg));
   border-color: transparent;
-  box-shadow: var(--neu-shadow-subtle);
+  box-shadow: var(--lmn-button-neu-shadow-subtle, var(--neu-shadow-subtle));
   transform: none;
 }
 .btn.loading { cursor: wait; }
@@ -369,6 +391,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   animation: spin 0.8s linear infinite;
   display: inline-block;
 }
+@media (prefers-reduced-motion: reduce) {
+  .btn .spinner { animation: none; }
+}
 /* ============ Input ============ */
 .input-shell {
   display: inline-flex;
@@ -378,7 +403,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .input-count {
   font-size: var(--fs-xs);
-  color: var(--fg-subtle);
+  color: var(--lmn-input-fg-subtle, var(--fg-subtle));
   font-variant-numeric: tabular-nums;
   text-align: right;
 }
@@ -390,19 +415,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
   height: var(--ctrl-h);
   padding: 0 var(--ctrl-pad-x);
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-input-bg, var(--bg));
+  box-shadow: var(--lmn-input-neu-shadow-inset, var(--neu-shadow-inset));
   transition: box-shadow var(--dur) var(--ease);
   gap: 8px;
 }
 .input-wrap.sm { height: var(--field-h-sm); padding: 0 var(--ctrl-pad-x-sm); border-radius: var(--r-sm); gap: 6px; }
 .input-wrap.lg { height: var(--field-h-lg); padding: 0 var(--ctrl-pad-x); border-radius: var(--r-lg); gap: 10px; }
-.input-wrap:focus-within { box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-glow); }
-.input-wrap.invalid { box-shadow: var(--neu-shadow-inset), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent); }
+.input-wrap:focus-within { box-shadow: var(--lmn-input-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px var(--lmn-input-accent-glow, var(--accent-glow)); }
+.input-wrap.invalid { box-shadow: var(--lmn-input-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px color-mix(in oklch, var(--lmn-input-danger, var(--danger)) 30%, transparent); }
 .input-wrap.disabled { opacity: 0.6; cursor: not-allowed; }
 .input-wrap .lead,
 .input-wrap .trail {
-  color: var(--fg-subtle);
+  color: var(--lmn-input-fg-subtle, var(--fg-subtle));
   flex-shrink: 0;
   display: inline-flex;
   align-items: center;
@@ -418,13 +443,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .input-wrap .lead.interactive,
 .input-wrap .trail.interactive { cursor: pointer; pointer-events: auto; }
-.input-wrap .trail:hover { color: var(--fg); }
+.input-wrap .trail:hover { color: var(--lmn-input-fg, var(--fg)); }
 .input-wrap .lead:not(.interactive),
 .input-wrap .trail:not(.interactive) { pointer-events: none; }
 .input-wrap .input-affix {
   display: inline-flex;
   align-items: center;
-  color: var(--fg-muted);
+  color: var(--lmn-input-fg-muted, var(--fg-muted));
   font-size: var(--fs-md);
   white-space: nowrap;
   user-select: none;
@@ -439,20 +464,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 18px;
   height: 18px;
   border-radius: 999px;
-  color: var(--fg-subtle);
+  color: var(--lmn-input-fg-subtle, var(--fg-subtle));
   background: transparent;
   cursor: pointer;
   flex-shrink: 0;
   transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
 }
 .input-wrap .input-clear:hover {
-  color: var(--fg);
-  background: var(--bg-sunken);
+  color: var(--lmn-input-fg, var(--fg));
+  background: var(--lmn-input-bg-sunken, var(--bg-sunken));
 }
 .input-password-toggle {
   border: none;
   background: transparent;
-  color: var(--fg-subtle);
+  color: var(--lmn-input-fg-subtle, var(--fg-subtle));
   padding: 0;
   display: inline-flex;
   align-items: center;
@@ -461,7 +486,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-family: inherit;
   flex-shrink: 0;
 }
-.input-password-toggle:hover { color: var(--fg); }
+.input-password-toggle:hover { color: var(--lmn-input-fg, var(--fg)); }
 .input-wrap > .input {
   flex: 1;
   min-width: 0;
@@ -471,15 +496,105 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border: none;
   background: transparent;
   box-shadow: none;
-  color: var(--fg);
+  color: var(--lmn-input-fg, var(--fg));
   font-size: var(--fs-md);
   font-family: inherit;
   outline: none;
 }
 .input-wrap.sm > .input { font-size: var(--fs-sm); }
 .input-wrap.lg > .input { font-size: var(--fs-lg); }
-.input-wrap > .input::placeholder { color: var(--fg-subtle); }
+.input-wrap > .input::placeholder { color: var(--lmn-input-fg-subtle, var(--fg-subtle)); }
 .input-wrap.disabled > .input { cursor: not-allowed; }
+/* ============ InputNumber ============ */
+.ipn-steppers {
+  display: inline-flex;
+  flex-direction: column;
+  align-self: stretch;
+  margin: 4px -6px 4px 6px;
+  width: 16px;
+  border-left: 1px solid var(--lmn-input-divider, var(--divider));
+  overflow: hidden;
+  border-top-right-radius: calc(var(--r-md) - 4px);
+  border-bottom-right-radius: calc(var(--r-md) - 4px);
+}
+.input-wrap.sm .ipn-steppers { margin: 3px -4px 3px 6px; width: 14px; }
+.input-wrap.lg .ipn-steppers { margin: 5px -6px 5px 8px; width: 18px; }
+.ipn-step {
+  flex: 1;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0;
+  border: none;
+  background: transparent;
+  color: var(--lmn-input-fg-subtle, var(--fg-subtle));
+  cursor: pointer;
+  transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
+}
+.ipn-step.up:not(.down) { border-bottom: 1px solid var(--lmn-input-divider, var(--divider)); }
+.ipn-step.up            { border-bottom: 1px solid var(--lmn-input-divider, var(--divider)); }
+.ipn-step:hover:not(:disabled) {
+  color: var(--lmn-input-accent-ink, var(--accent-ink));
+  background: var(--lmn-input-bg-sunken, var(--bg-sunken));
+}
+.ipn-step:active:not(:disabled) {
+  color: var(--lmn-input-accent, var(--accent));
+}
+.ipn-step:disabled {
+  cursor: not-allowed;
+  opacity: 0.35;
+}
+/* ============ AutoComplete ============ */
+.autocomplete {
+  display: inline-block;
+  width: 100%;
+  position: relative;
+}
+.autocomplete-panel {
+  z-index: 1500;
+  background: var(--lmn-auto-complete-bg, var(--bg));
+  border-radius: var(--r-md);
+  box-shadow: var(--lmn-auto-complete-neu-shadow-float, var(--neu-shadow-float));
+  padding: 6px;
+  max-height: 280px;
+  overflow-y: auto;
+  animation: menuIn var(--dur) var(--ease);
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+}
+.autocomplete-item {
+  display: flex;
+  align-items: center;
+  width: 100%;
+  padding: 8px 10px;
+  border: none;
+  background: transparent;
+  box-shadow: none;
+  color: var(--lmn-auto-complete-fg, var(--fg));
+  font: inherit;
+  font-size: 13px;
+  text-align: left;
+  border-radius: var(--r-sm);
+  cursor: pointer;
+  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
+    box-shadow var(--dur-fast) var(--ease);
+}
+.autocomplete-item:disabled {
+  color: var(--lmn-auto-complete-fg-subtle, var(--fg-subtle));
+  cursor: not-allowed;
+}
+.autocomplete-item.active:not(:disabled) {
+  background: var(--lmn-auto-complete-bg, var(--bg));
+  color: var(--lmn-auto-complete-accent-ink, var(--accent-ink));
+  box-shadow: var(--lmn-auto-complete-neu-shadow-inset, var(--neu-shadow-inset));
+}
+.autocomplete-empty {
+  padding: 16px 12px;
+  text-align: center;
+  color: var(--lmn-auto-complete-fg-subtle, var(--fg-subtle));
+  font-size: 13px;
+}
 /* ============ Textarea ============ */
 .textarea-shell {
   display: inline-flex;
@@ -489,7 +604,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .textarea-count {
   font-size: 11px;
-  color: var(--fg-subtle);
+  color: var(--lmn-textarea-fg-subtle, var(--fg-subtle));
   font-variant-numeric: tabular-nums;
   text-align: right;
 }
@@ -504,14 +619,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 18px;
   height: 18px;
   border-radius: 999px;
-  color: var(--fg-subtle);
+  color: var(--lmn-textarea-fg-subtle, var(--fg-subtle));
   background: transparent;
   cursor: pointer;
   transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease);
 }
 .textarea-wrap .textarea-clear:hover {
-  color: var(--fg);
-  background: var(--bg-sunken);
+  color: var(--lmn-textarea-fg, var(--fg));
+  background: var(--lmn-textarea-bg-sunken, var(--bg-sunken));
 }
 .textarea {
   width: 100%;
@@ -519,9 +634,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   padding: 12px 14px;
   border: none;
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
-  color: var(--fg);
+  background: var(--lmn-textarea-bg, var(--bg));
+  box-shadow: var(--lmn-textarea-neu-shadow-inset, var(--neu-shadow-inset));
+  color: var(--lmn-textarea-fg, var(--fg));
   font-size: 13px;
   font-family: inherit;
   line-height: 1.55;
@@ -529,9 +644,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   outline: none;
   transition: box-shadow var(--dur) var(--ease);
 }
-.textarea:focus { box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-glow); }
-.textarea.invalid { box-shadow: var(--neu-shadow-inset), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent); }
-.textarea::placeholder { color: var(--fg-subtle); }
+.textarea:focus { box-shadow: var(--lmn-textarea-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px var(--lmn-textarea-accent-glow, var(--accent-glow)); }
+.textarea.invalid { box-shadow: var(--lmn-textarea-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px color-mix(in oklch, var(--lmn-textarea-danger, var(--danger)) 30%, transparent); }
+.textarea::placeholder { color: var(--lmn-textarea-fg-subtle, var(--fg-subtle)); }
 /* ============ Switch ============ */
 .switch {
   --w: 46px;
@@ -540,11 +655,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
   align-items: center;
   gap: 10px;
   font-size: 13px;
-  color: var(--fg);
+  color: var(--lmn-switch-fg, var(--fg));
   cursor: pointer;
   user-select: none;
 }
 .switch.disabled { opacity: 0.5; cursor: not-allowed; }
+.switch-native {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  opacity: 0;
+  pointer-events: none;
+}
+.switch:focus-within .switch-track { outline: 2px solid var(--lmn-switch-accent, var(--accent)); outline-offset: 2px; }
 .switch-track {
   position: relative;
   width: var(--w);
@@ -552,8 +675,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border: none;
   padding: 0;
   border-radius: 999px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-switch-bg, var(--bg));
+  box-shadow: var(--lmn-switch-neu-shadow-inset, var(--neu-shadow-inset));
   cursor: inherit;
   flex-shrink: 0;
   transition: all var(--dur) var(--ease);
@@ -571,15 +694,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: calc(var(--h) - 6px);
   height: calc(var(--h) - 6px);
   border-radius: 999px;
-  background: var(--bg-raised);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-switch-bg-raised, var(--bg-raised));
+  box-shadow: var(--lmn-switch-neu-shadow-control, var(--neu-shadow-control));
   transition: all var(--dur) var(--ease);
   z-index: 1;
 }
 .switch.on .switch-thumb {
   transform: translateX(calc(var(--w) - var(--h)));
-  background: var(--accent);
-  box-shadow: 0 2px 8px var(--accent-glow), 0 0 0 1px color-mix(in oklch, var(--accent) 40%, transparent);
+  background: var(--lmn-switch-accent, var(--accent));
+  box-shadow: 0 2px 8px var(--lmn-switch-accent-glow, var(--accent-glow)), 0 0 0 1px color-mix(in oklch, var(--lmn-switch-accent, var(--accent)) 40%, transparent);
 }
 /* Inline content (checkedChildren / unCheckedChildren) */
 .switch-inner {
@@ -617,7 +740,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .switch-inner-off {
   right: 8px;
   left: calc(var(--h) - 2px);
-  color: var(--fg-muted);
+  color: var(--lmn-switch-fg-muted, var(--fg-muted));
   opacity: 1;
   transform: translateX(0);
 }
@@ -633,37 +756,45 @@ input, textarea, select { font-family: inherit; color: inherit; }
   cursor: pointer;
   user-select: none;
   font-size: 13px;
-  color: var(--fg);
+  color: var(--lmn-checkbox-fg, var(--fg));
 }
 .checkbox.disabled { opacity: 0.5; cursor: not-allowed; }
+.checkbox-native {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  opacity: 0;
+  pointer-events: none;
+}
+.checkbox:focus-within .checkbox-box { outline: 2px solid var(--lmn-checkbox-accent, var(--accent)); outline-offset: 2px; }
 .checkbox-box {
   width: 20px; height: 20px;
   border: none;
   padding: 0;
   border-radius: 7px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-checkbox-bg, var(--bg));
+  box-shadow: var(--lmn-checkbox-neu-shadow-inset, var(--neu-shadow-inset));
   display: grid;
   place-items: center;
   flex-shrink: 0;
   cursor: inherit;
-  color: var(--bg);
+  color: var(--lmn-checkbox-bg, var(--bg));
   transition: all var(--dur) var(--ease);
 }
 .checkbox-box svg { opacity: 0; transform: scale(0.6); transition: all var(--dur) var(--ease); }
 .checkbox.checked .checkbox-box {
-  background: var(--accent);
-  box-shadow: var(--neu-shadow-control), 0 2px 8px var(--accent-glow);
+  background: var(--lmn-checkbox-accent, var(--accent));
+  box-shadow: var(--lmn-checkbox-neu-shadow-control, var(--neu-shadow-control)), 0 2px 8px var(--lmn-checkbox-accent-glow, var(--accent-glow));
 }
 .checkbox.checked .checkbox-box svg { opacity: 1; transform: scale(1); }
 .checkbox.indeterminate .checkbox-box {
-  background: var(--accent);
-  box-shadow: var(--neu-shadow-control), 0 2px 8px var(--accent-glow);
+  background: var(--lmn-checkbox-accent, var(--accent));
+  box-shadow: var(--lmn-checkbox-neu-shadow-control, var(--neu-shadow-control)), 0 2px 8px var(--lmn-checkbox-accent-glow, var(--accent-glow));
 }
 .checkbox.indeterminate .checkbox-box::after {
   content: "";
   width: 10px; height: 2px;
-  background: var(--bg);
+  background: var(--lmn-checkbox-bg, var(--bg));
   border-radius: 2px;
 }
 .checkbox.indeterminate .checkbox-box svg { display: none; }
@@ -675,24 +806,32 @@ input, textarea, select { font-family: inherit; color: inherit; }
   cursor: pointer;
   user-select: none;
   font-size: 13px;
-  color: var(--fg);
+  color: var(--lmn-radio-fg, var(--fg));
 }
 .radio.disabled { opacity: 0.5; cursor: not-allowed; }
+.radio-native {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  opacity: 0;
+  pointer-events: none;
+}
+.radio:focus-within .radio-dot { outline: 2px solid var(--lmn-radio-accent, var(--accent)); outline-offset: 2px; }
 .radio-dot {
   width: 20px; height: 20px;
   border: none;
   padding: 0;
   border-radius: 999px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-radio-bg, var(--bg));
+  box-shadow: var(--lmn-radio-neu-shadow-inset, var(--neu-shadow-inset));
   cursor: inherit;
   position: relative;
   flex-shrink: 0;
   transition: all var(--dur) var(--ease);
 }
 .radio.checked .radio-dot {
-  background: var(--accent);
-  box-shadow: var(--neu-shadow-control), 0 2px 8px var(--accent-glow);
+  background: var(--lmn-radio-accent, var(--accent));
+  box-shadow: var(--lmn-radio-neu-shadow-control, var(--neu-shadow-control)), 0 2px 8px var(--lmn-radio-accent-glow, var(--accent-glow));
 }
 .radio.checked .radio-dot::after {
   content: "";
@@ -701,7 +840,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   transform: translate(-50%, -50%);
   width: 8px; height: 8px;
   border-radius: 999px;
-  background: var(--bg);
+  background: var(--lmn-radio-bg, var(--bg));
 }
 .radio-group { display: flex; gap: 14px; }
 .radio-group.vertical { flex-direction: column; gap: 10px; }
@@ -711,8 +850,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   display: inline-flex;
   padding: 4px;
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-radio-bg, var(--bg));
+  box-shadow: var(--lmn-radio-neu-shadow-inset, var(--neu-shadow-inset));
   gap: 2px;
   flex-wrap: nowrap;
 }
@@ -722,14 +861,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
   height: 32px;
   padding: 6px 14px;
   border-radius: calc(var(--r-md) - 4px);
-  color: var(--fg-muted);
+  color: var(--lmn-radio-fg-muted, var(--fg-muted));
   font-size: 12px;
   gap: 6px;
   transition: all var(--dur-fast) var(--ease);
 }
-.radio-group.segmented .radio:hover { color: var(--fg); }
+.radio-group.segmented .radio:hover { color: var(--lmn-radio-fg, var(--fg)); }
 .radio-group.segmented .radio.checked {
-  color: var(--accent-ink);
+  color: var(--lmn-radio-accent-ink, var(--accent-ink));
   font-weight: 600;
 }
 .radio-group.segmented .radio-dot { display: none; }
@@ -743,8 +882,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   bottom: 4px;
   left: 0;
   border-radius: calc(var(--r-md) - 4px);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-radio-bg, var(--bg));
+  box-shadow: var(--lmn-radio-neu-shadow-control, var(--neu-shadow-control));
   pointer-events: none;
   transition:
     transform var(--dur-slow) var(--ease),
@@ -782,16 +921,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 100%;
   height: 10px;
   border-radius: 999px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-slider-bg, var(--bg));
+  box-shadow: var(--lmn-slider-neu-shadow-inset, var(--neu-shadow-inset));
   touch-action: none;
   z-index: 1;
 }
 .slider-fill {
   position: absolute;
   top: 0; bottom: 0;
-  background: linear-gradient(90deg, color-mix(in oklch, var(--accent) 70%, white), var(--accent));
-  box-shadow: 0 0 12px var(--accent-glow);
+  background: linear-gradient(90deg, color-mix(in oklch, var(--lmn-slider-accent, var(--accent)) 70%, white), var(--lmn-slider-accent, var(--accent)));
+  box-shadow: 0 0 12px var(--lmn-slider-accent-glow, var(--accent-glow));
   border-radius: 999px;
   transition: left var(--dur-fast) var(--ease), right var(--dur-fast) var(--ease);
   pointer-events: none;
@@ -801,8 +940,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   top: 50%;
   width: 22px; height: 22px;
   border-radius: 999px;
-  background: var(--bg-raised);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-slider-bg-raised, var(--bg-raised));
+  box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control));
   transform: translate(-50%, -50%);
   transition: all var(--dur-fast) var(--ease);
   display: grid; place-items: center;
@@ -814,29 +953,29 @@ input, textarea, select { font-family: inherit; color: inherit; }
   content: "";
   width: 6px; height: 6px;
   border-radius: 999px;
-  background: var(--slider-thumb-color, var(--accent));
+  background: var(--slider-thumb-color, var(--lmn-slider-accent, var(--accent)));
 }
 .slider-thumb:focus-visible {
-  box-shadow: var(--neu-shadow-control), 0 0 0 3px var(--accent-glow);
+  box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 3px var(--lmn-slider-accent-glow, var(--accent-glow));
 }
 .slider:hover .slider-thumb { transform: translate(-50%, -50%) scale(1.08); }
 .slider-value {
   font-family: var(--font-mono);
   font-size: 12px;
-  color: var(--accent-ink);
+  color: var(--lmn-slider-accent-ink, var(--accent-ink));
   flex-shrink: 0;
   white-space: nowrap;
 }
 /* Tone variants */
-.slider.success .slider-thumb { --slider-thumb-color: var(--success); }
-.slider.success .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--success) 70%, white), var(--success)); box-shadow: 0 0 10px color-mix(in oklch, var(--success) 35%, transparent); }
-.slider.success .slider-thumb:focus-visible { box-shadow: var(--neu-shadow-control), 0 0 0 3px color-mix(in oklch, var(--success) 35%, transparent); }
-.slider.warning .slider-thumb { --slider-thumb-color: var(--warning); }
-.slider.warning .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--warning) 70%, white), var(--warning)); box-shadow: 0 0 10px color-mix(in oklch, var(--warning) 35%, transparent); }
-.slider.warning .slider-thumb:focus-visible { box-shadow: var(--neu-shadow-control), 0 0 0 3px color-mix(in oklch, var(--warning) 35%, transparent); }
-.slider.danger .slider-thumb { --slider-thumb-color: var(--danger); }
-.slider.danger  .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--danger) 70%, white), var(--danger));  box-shadow: 0 0 10px color-mix(in oklch, var(--danger) 35%, transparent); }
-.slider.danger  .slider-thumb:focus-visible { box-shadow: var(--neu-shadow-control), 0 0 0 3px color-mix(in oklch, var(--danger) 35%, transparent); }
+.slider.success .slider-thumb { --slider-thumb-color: var(--lmn-slider-success, var(--success)); }
+.slider.success .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--lmn-slider-success, var(--success)) 70%, white), var(--lmn-slider-success, var(--success))); box-shadow: 0 0 10px color-mix(in oklch, var(--lmn-slider-success, var(--success)) 35%, transparent); }
+.slider.success .slider-thumb:focus-visible { box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 3px color-mix(in oklch, var(--lmn-slider-success, var(--success)) 35%, transparent); }
+.slider.warning .slider-thumb { --slider-thumb-color: var(--lmn-slider-warning, var(--warning)); }
+.slider.warning .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--lmn-slider-warning, var(--warning)) 70%, white), var(--lmn-slider-warning, var(--warning))); box-shadow: 0 0 10px color-mix(in oklch, var(--lmn-slider-warning, var(--warning)) 35%, transparent); }
+.slider.warning .slider-thumb:focus-visible { box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 3px color-mix(in oklch, var(--lmn-slider-warning, var(--warning)) 35%, transparent); }
+.slider.danger .slider-thumb { --slider-thumb-color: var(--lmn-slider-danger, var(--danger)); }
+.slider.danger  .slider-fill { background: linear-gradient(90deg, color-mix(in oklch, var(--lmn-slider-danger, var(--danger)) 70%, white), var(--lmn-slider-danger, var(--danger)));  box-shadow: 0 0 10px color-mix(in oklch, var(--lmn-slider-danger, var(--danger)) 35%, transparent); }
+.slider.danger  .slider-thumb:focus-visible { box-shadow: var(--lmn-slider-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 3px color-mix(in oklch, var(--lmn-slider-danger, var(--danger)) 35%, transparent); }
 /* Marks */
 .slider-marks {
   position: absolute;
@@ -846,6 +985,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
   pointer-events: none;
 }
 .slider-mark {
+  border: 0;
+  padding: 0;
+  background: transparent;
+  font: inherit;
   position: absolute;
   transform: translateX(-50%);
   display: inline-flex;
@@ -854,33 +997,47 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 4px;
   pointer-events: auto;
   cursor: pointer;
-  color: var(--fg-subtle);
+  color: var(--lmn-slider-fg-subtle, var(--fg-subtle));
   font-size: 11px;
   user-select: none;
 }
 .slider-mark-dot {
   width: 6px; height: 6px;
   border-radius: 999px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-slider-bg, var(--bg));
+  box-shadow: var(--lmn-slider-neu-shadow-inset, var(--neu-shadow-inset));
   position: absolute;
   top: -12px;
   left: 50%;
   transform: translateX(-50%);
   z-index: 1;
 }
-.slider-mark.active .slider-mark-dot { background: var(--accent); box-shadow: 0 0 6px var(--accent-glow); }
-.slider.success .slider-mark.active .slider-mark-dot { background: var(--success); box-shadow: 0 0 6px color-mix(in oklch, var(--success) 35%, transparent); }
-.slider.warning .slider-mark.active .slider-mark-dot { background: var(--warning); box-shadow: 0 0 6px color-mix(in oklch, var(--warning) 35%, transparent); }
-.slider.danger  .slider-mark.active .slider-mark-dot { background: var(--danger);  box-shadow: 0 0 6px color-mix(in oklch, var(--danger) 35%, transparent); }
+.slider-mark.active .slider-mark-dot { background: var(--lmn-slider-accent, var(--accent)); box-shadow: 0 0 6px var(--lmn-slider-accent-glow, var(--accent-glow)); }
+.slider.success .slider-mark.active .slider-mark-dot { background: var(--lmn-slider-success, var(--success)); box-shadow: 0 0 6px color-mix(in oklch, var(--lmn-slider-success, var(--success)) 35%, transparent); }
+.slider.warning .slider-mark.active .slider-mark-dot { background: var(--lmn-slider-warning, var(--warning)); box-shadow: 0 0 6px color-mix(in oklch, var(--lmn-slider-warning, var(--warning)) 35%, transparent); }
+.slider.danger  .slider-mark.active .slider-mark-dot { background: var(--lmn-slider-danger, var(--danger));  box-shadow: 0 0 6px color-mix(in oklch, var(--lmn-slider-danger, var(--danger)) 35%, transparent); }
 .slider-mark-label { white-space: nowrap; }
-.slider-mark.active .slider-mark-label { color: var(--accent-ink); font-weight: 500; }
-.slider-mark:hover .slider-mark-label { color: var(--fg); }
+.slider-mark.edge-start {
+  transform: none;
+  align-items: flex-start;
+}
+.slider-mark.edge-start .slider-mark-dot {
+  left: 0;
+}
+.slider-mark.edge-end {
+  transform: translateX(-100%);
+  align-items: flex-end;
+}
+.slider-mark.edge-end .slider-mark-dot {
+  left: 100%;
+}
+.slider-mark.active .slider-mark-label { color: var(--lmn-slider-accent-ink, var(--accent-ink)); font-weight: 500; }
+.slider-mark:hover .slider-mark-label { color: var(--lmn-slider-fg, var(--fg)); }
 .slider.disabled .slider-mark { pointer-events: none; }
 /* ============ Progress ============ */
 .progress {
-  --progress-fill: var(--accent);
-  --progress-fill-glow: var(--accent-glow);
+  --progress-fill: var(--lmn-progress-accent, var(--accent));
+  --progress-fill-glow: var(--lmn-progress-accent-glow, var(--accent-glow));
   --progress-inset: 2px;
   width: 100%;
   display: flex;
@@ -890,22 +1047,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .progress.sm { --progress-inset: 1px; }
 .progress.lg { --progress-inset: 2px; }
 .progress.success {
-  --progress-fill: var(--success);
-  --progress-fill-glow: color-mix(in oklch, var(--success) 35%, transparent);
+  --progress-fill: var(--lmn-progress-success, var(--success));
+  --progress-fill-glow: color-mix(in oklch, var(--lmn-progress-success, var(--success)) 35%, transparent);
 }
 .progress.warning {
-  --progress-fill: var(--warning);
-  --progress-fill-glow: color-mix(in oklch, var(--warning) 35%, transparent);
+  --progress-fill: var(--lmn-progress-warning, var(--warning));
+  --progress-fill-glow: color-mix(in oklch, var(--lmn-progress-warning, var(--warning)) 35%, transparent);
 }
 .progress.danger {
-  --progress-fill: var(--danger);
-  --progress-fill-glow: color-mix(in oklch, var(--danger) 35%, transparent);
+  --progress-fill: var(--lmn-progress-danger, var(--danger));
+  --progress-fill-glow: color-mix(in oklch, var(--lmn-progress-danger, var(--danger)) 35%, transparent);
 }
 .progress-label {
   display: flex;
   justify-content: space-between;
   font-size: 12px;
-  color: var(--fg-muted);
+  color: var(--lmn-progress-fg-muted, var(--fg-muted));
 }
 .progress-label .v { font-family: var(--font-mono); }
 .progress-track {
@@ -916,10 +1073,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
   box-sizing: border-box;
   background: linear-gradient(
     180deg,
-    color-mix(in oklch, var(--bg) 88%, var(--shadow-light)),
-    color-mix(in oklch, var(--bg) 92%, var(--shadow-dark))
+    color-mix(in oklch, var(--lmn-progress-bg, var(--bg)) 88%, var(--lmn-progress-shadow-light, var(--shadow-light))),
+    color-mix(in oklch, var(--lmn-progress-bg, var(--bg)) 92%, var(--lmn-progress-shadow-dark, var(--shadow-dark)))
   );
-  box-shadow: var(--neu-shadow-inset);
+  box-shadow: var(--lmn-progress-neu-shadow-inset, var(--neu-shadow-inset));
   overflow: hidden;
   position: relative;
 }
@@ -931,15 +1088,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: inherit;
   background: linear-gradient(
     180deg,
-    color-mix(in oklch, var(--progress-fill) 68%, var(--shadow-light)) 0%,
+    color-mix(in oklch, var(--progress-fill) 68%, var(--lmn-progress-shadow-light, var(--shadow-light))) 0%,
     var(--progress-fill) 55%,
-    color-mix(in oklch, var(--progress-fill) 84%, var(--shadow-dark)) 100%
+    color-mix(in oklch, var(--progress-fill) 84%, var(--lmn-progress-shadow-dark, var(--shadow-dark))) 100%
   );
   box-shadow:
-    inset 1px 1px 2px color-mix(in oklch, var(--progress-fill) 18%, var(--shadow-dark)),
-    inset -1px -1px 2px color-mix(in oklch, var(--progress-fill) 14%, var(--shadow-light)),
-    1px 1px 4px color-mix(in oklch, var(--progress-fill) 16%, var(--shadow-dark)),
-    -1px -1px 4px color-mix(in oklch, var(--progress-fill) 10%, var(--shadow-light)),
+    inset 1px 1px 2px color-mix(in oklch, var(--progress-fill) 18%, var(--lmn-progress-shadow-dark, var(--shadow-dark))),
+    inset -1px -1px 2px color-mix(in oklch, var(--progress-fill) 14%, var(--lmn-progress-shadow-light, var(--shadow-light))),
+    1px 1px 4px color-mix(in oklch, var(--progress-fill) 16%, var(--lmn-progress-shadow-dark, var(--shadow-dark))),
+    -1px -1px 4px color-mix(in oklch, var(--progress-fill) 10%, var(--lmn-progress-shadow-light, var(--shadow-light))),
     0 0 10px var(--progress-fill-glow);
   transition: width var(--dur-slow) var(--ease), box-shadow var(--dur) var(--ease);
   overflow: hidden;
@@ -951,12 +1108,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: inherit;
   background: linear-gradient(
     180deg,
-    color-mix(in oklch, var(--shadow-light) 72%, transparent) 0%,
-    color-mix(in oklch, var(--shadow-light) 28%, transparent) 38%,
+    color-mix(in oklch, var(--lmn-progress-shadow-light, var(--shadow-light)) 72%, transparent) 0%,
+    color-mix(in oklch, var(--lmn-progress-shadow-light, var(--shadow-light)) 28%, transparent) 38%,
     transparent 70%
   );
   pointer-events: none;
 }
+.progress.indeterminate .progress-bar {
+  animation: progress-indeterminate 1.4s var(--ease) infinite;
+}
+@keyframes progress-indeterminate {
+  from { transform: translateX(-120%); }
+  to { transform: translateX(320%); }
+}
+@media (prefers-reduced-motion: reduce) {
+  .progress.indeterminate .progress-bar { animation: none; }
+}
 /* ============ Tag ============ */
 .tag {
   display: inline-flex;
@@ -967,20 +1134,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: var(--r-pill);
   font-size: 11px;
   font-weight: 500;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
-  color: var(--fg-muted);
-}
-.tag.accent  { color: var(--accent-ink); }
-.tag.info    { color: var(--info); }
-.tag.success { color: var(--success); }
-.tag.warning { color: var(--warning); }
-.tag.danger  { color: var(--danger); }
-.tag.solid          { background: var(--accent); color: var(--bg); box-shadow: 0 2px 6px var(--accent-glow); }
-.tag.solid.info     { background: var(--info);    color: var(--bg); box-shadow: 0 2px 6px color-mix(in oklch, var(--info) 35%, transparent); }
-.tag.solid.success  { background: var(--success); color: var(--bg); box-shadow: 0 2px 6px color-mix(in oklch, var(--success) 35%, transparent); }
-.tag.solid.warning  { background: var(--warning); color: var(--bg); box-shadow: 0 2px 6px color-mix(in oklch, var(--warning) 35%, transparent); }
-.tag.solid.danger   { background: var(--danger);  color: var(--bg); box-shadow: 0 2px 6px color-mix(in oklch, var(--danger) 35%, transparent); }
+  background: var(--lmn-tag-bg, var(--bg));
+  box-shadow: var(--lmn-tag-neu-shadow-subtle, var(--neu-shadow-subtle));
+  color: var(--lmn-tag-fg-muted, var(--fg-muted));
+}
+.tag.accent  { color: var(--lmn-tag-accent-ink, var(--accent-ink)); }
+.tag.info    { color: var(--lmn-tag-info, var(--info)); }
+.tag.success { color: var(--lmn-tag-success, var(--success)); }
+.tag.warning { color: var(--lmn-tag-warning, var(--warning)); }
+.tag.danger  { color: var(--lmn-tag-danger, var(--danger)); }
+.tag.solid          { background: var(--lmn-tag-accent, var(--accent)); color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px var(--lmn-tag-accent-glow, var(--accent-glow)); }
+.tag.solid.info     { background: var(--lmn-tag-info, var(--info));    color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px color-mix(in oklch, var(--lmn-tag-info, var(--info)) 35%, transparent); }
+.tag.solid.success  { background: var(--lmn-tag-success, var(--success)); color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px color-mix(in oklch, var(--lmn-tag-success, var(--success)) 35%, transparent); }
+.tag.solid.warning  { background: var(--lmn-tag-warning, var(--warning)); color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px color-mix(in oklch, var(--lmn-tag-warning, var(--warning)) 35%, transparent); }
+.tag.solid.danger   { background: var(--lmn-tag-danger, var(--danger));  color: var(--lmn-tag-bg, var(--bg)); box-shadow: 0 2px 6px color-mix(in oklch, var(--lmn-tag-danger, var(--danger)) 35%, transparent); }
 .tag.borderless { background: transparent; box-shadow: none; }
 .tag .dot { width: 6px; height: 6px; border-radius: 999px; background: currentColor; }
 .tag .tag-ico {
@@ -997,8 +1164,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   height: 1em;
   object-fit: contain;
 }
-.tag .x { cursor: pointer; color: var(--fg-subtle); margin-left: 2px; display: inline-flex; }
-.tag .x:hover { color: var(--fg); }
+.tag .x { cursor: pointer; color: var(--lmn-tag-fg-subtle, var(--fg-subtle)); margin-left: 2px; display: inline-flex; }
+.tag .x:hover { color: var(--lmn-tag-fg, var(--fg)); }
 /* ============ Badge ============ */
 .badge {
   display: inline-flex;
@@ -1008,17 +1175,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: 999px;
   font-size: 10px;
   font-weight: 700;
-  background: var(--danger);
-  color: var(--bg);
-  box-shadow: 0 1px 4px color-mix(in oklch, var(--shadow-dark) 35%, transparent);
+  background: var(--lmn-badge-danger, var(--danger));
+  color: var(--lmn-badge-bg, var(--bg));
+  box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-shadow-dark, var(--shadow-dark)) 35%, transparent);
   font-variant-numeric: tabular-nums;
 }
 .badge.dot { min-width: 10px; height: 10px; padding: 0; }
-.badge.accent  { background: var(--accent);  box-shadow: 0 1px 4px var(--accent-glow); }
-.badge.info    { background: var(--info);    box-shadow: 0 1px 4px color-mix(in oklch, var(--info) 35%, transparent); }
-.badge.success { background: var(--success); box-shadow: 0 1px 4px color-mix(in oklch, var(--success) 35%, transparent); }
-.badge.warning { background: var(--warning); box-shadow: 0 1px 4px color-mix(in oklch, var(--warning) 35%, transparent); }
-.badge.neutral { background: var(--fg-muted); box-shadow: 0 1px 4px color-mix(in oklch, var(--shadow-dark) 35%, transparent); }
+.badge.accent  { background: var(--lmn-badge-accent, var(--accent));  box-shadow: 0 1px 4px var(--lmn-badge-accent-glow, var(--accent-glow)); }
+.badge.info    { background: var(--lmn-badge-info, var(--info));    box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-info, var(--info)) 35%, transparent); }
+.badge.success { background: var(--lmn-badge-success, var(--success)); box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-success, var(--success)) 35%, transparent); }
+.badge.warning { background: var(--lmn-badge-warning, var(--warning)); box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-warning, var(--warning)) 35%, transparent); }
+.badge.neutral { background: var(--lmn-badge-fg-muted, var(--fg-muted)); box-shadow: 0 1px 4px color-mix(in oklch, var(--lmn-badge-shadow-dark, var(--shadow-dark)) 35%, transparent); }
 .badge-wrap { position: relative; display: inline-block; }
 .badge-wrap > .badge { position: absolute; top: -4px; right: -4px; }
 /* ============ Avatar ============ */
@@ -1026,11 +1193,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
   --size: 40px;
   width: var(--size); height: var(--size);
   border-radius: 999px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-avatar-bg, var(--bg));
+  box-shadow: var(--lmn-avatar-neu-shadow-control, var(--neu-shadow-control));
   display: grid; place-items: center;
   overflow: hidden;
-  color: var(--accent-ink);
+  color: var(--lmn-avatar-accent-ink, var(--accent-ink));
   font-weight: 600;
   font-size: calc(var(--size) / 2.6);
   position: relative;
@@ -1050,23 +1217,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 25%; height: 25%;
   min-width: 8px; min-height: 8px;
   border-radius: 999px;
-  background: var(--success);
-  box-shadow: 0 0 0 2px var(--bg);
+  background: var(--lmn-avatar-success, var(--success));
+  box-shadow: 0 0 0 2px var(--lmn-avatar-bg, var(--bg));
+}
+.avatar-status.online  { background: var(--lmn-avatar-success, var(--success)); }
+.avatar-status.busy    { background: var(--lmn-avatar-danger, var(--danger)); }
+.avatar-status.away    { background: var(--lmn-avatar-warning, var(--warning)); }
+.avatar-status.offline { background: var(--lmn-avatar-fg-subtle, var(--fg-subtle)); }
+.avatar-status-label {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
 }
-.avatar-status.online  { background: var(--success); }
-.avatar-status.busy    { background: var(--danger); }
-.avatar-status.away    { background: var(--warning); }
-.avatar-status.offline { background: var(--fg-subtle); }
 .avatar-group { display: inline-flex; }
-.avatar-group .avatar { border: 3px solid var(--bg); box-sizing: content-box; }
+.avatar-group .avatar { border: 3px solid var(--lmn-avatar-bg, var(--bg)); box-sizing: content-box; }
 .avatar-group .avatar + .avatar { margin-left: -12px; }
 /* ============ Divider ============ */
 .divider {
   height: 1px;
-  background: var(--divider);
+  background: var(--lmn-divider-divider, var(--divider));
   margin: var(--gap-4) 0;
   border-radius: 999px;
-  box-shadow: 0 1px 0 var(--shadow-light);
+  box-shadow: 0 1px 0 var(--lmn-divider-shadow-light, var(--shadow-light));
 }
 .divider.vertical {
   width: 1px;
@@ -1077,7 +1252,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .divider.sunken {
   background: transparent;
   height: 2px;
-  box-shadow: var(--neu-shadow-inset);
+  box-shadow: var(--lmn-divider-neu-shadow-inset, var(--neu-shadow-inset));
 }
 .divider.sunken.vertical {
   width: 2px;
@@ -1085,33 +1260,33 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .divider.sunken:has(.divider-label) { background: transparent; box-shadow: none; }
 .divider.sunken:has(.divider-label)::before,
-.divider.sunken:has(.divider-label)::after { height: 2px; background: transparent; box-shadow: var(--neu-shadow-inset); }
+.divider.sunken:has(.divider-label)::after { height: 2px; background: transparent; box-shadow: var(--lmn-divider-neu-shadow-inset, var(--neu-shadow-inset)); }
 /* ---- Dashed variant ---- */
 .divider.dashed {
   background: transparent;
   box-shadow: none;
-  border-top: 1px dashed var(--divider);
+  border-top: 1px dashed var(--lmn-divider-divider, var(--divider));
   border-radius: 0;
   height: 0;
 }
 .divider.dashed.vertical {
   width: 0;
   border-top: none;
-  border-left: 1px dashed var(--divider);
+  border-left: 1px dashed var(--lmn-divider-divider, var(--divider));
 }
 .divider.dashed:has(.divider-label) { border-top: none; }
 .divider.dashed:has(.divider-label)::before,
 .divider.dashed:has(.divider-label)::after {
   background: transparent;
   box-shadow: none;
-  border-top: 1px dashed var(--divider);
+  border-top: 1px dashed var(--lmn-divider-divider, var(--divider));
   height: 0;
   border-radius: 0;
 }
 .divider-label {
   display: flex; align-items: center; gap: 12px;
   height: auto; background: transparent; box-shadow: none;
-  font-size: 11px; color: var(--fg-subtle);
+  font-size: 11px; color: var(--lmn-divider-fg-subtle, var(--fg-subtle));
   text-transform: uppercase; letter-spacing: 0.1em;
 }
 .divider:has(.divider-label) {
@@ -1127,9 +1302,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   content: "";
   flex: 1;
   height: 1px;
-  background: var(--divider);
+  background: var(--lmn-divider-divider, var(--divider));
   border-radius: 999px;
-  box-shadow: 0 1px 0 var(--shadow-light);
+  box-shadow: 0 1px 0 var(--lmn-divider-shadow-light, var(--shadow-light));
 }
 /* ---- Label orientation ---- */
 .divider.orient-left::before { flex: 0 0 var(--gap-4); }
@@ -1139,12 +1314,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
 /* center is default (both flex: 1) */
 /* ============ Card ============ */
 .card {
-  --card-bg: var(--bg);
-  --card-loading-bg: color-mix(in srgb, var(--bg) 72%, var(--bg-sunken));
+  --card-bg: var(--lmn-card-bg, var(--bg));
+  --card-loading-bg: color-mix(in srgb, var(--lmn-card-bg, var(--bg)) 72%, var(--lmn-card-bg-sunken, var(--bg-sunken)));
   background: var(--card-bg);
+  color: var(--lmn-card-fg, var(--fg));
   border-radius: var(--r-lg);
-  box-shadow: var(--neu-shadow-panel);
+  box-shadow: var(--lmn-card-neu-shadow-panel, var(--neu-shadow-panel));
   padding: var(--gap-5);
+  position: relative;
 }
 .card.fill {
   display: flex;
@@ -1152,34 +1329,52 @@ input, textarea, select { font-family: inherit; color: inherit; }
   min-height: 0;
   height: 100%;
 }
-.card.flat   { box-shadow: var(--neu-shadow-subtle); }
-.card.sunken { box-shadow: var(--neu-shadow-inset-strong); }
+.card.flat   { box-shadow: var(--lmn-card-neu-shadow-subtle, var(--neu-shadow-subtle)); }
+.card.sunken { box-shadow: var(--lmn-card-neu-shadow-inset-strong, var(--neu-shadow-inset-strong)); }
 .card.pad-none { padding: 0; }
 .card.pad-sm   { padding: var(--gap-3); }
 .card.pad-lg   { padding: var(--gap-6); }
 .card.hoverable {
-  cursor: pointer;
   transition: box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease);
 }
+.card.interactive { cursor: pointer; }
+.card.interactive.disabled { cursor: not-allowed; opacity: 0.68; }
 .card.hoverable:hover {
   transform: translateY(-3px);
-  box-shadow: var(--neu-shadow-lift);
+  box-shadow: var(--lmn-card-neu-shadow-lift, var(--neu-shadow-lift));
+}
+.card.hoverable.flat:hover { box-shadow: var(--lmn-card-neu-shadow-control, var(--neu-shadow-control)); }
+.card.hoverable.sunken:hover { box-shadow: var(--lmn-card-neu-shadow-panel, var(--neu-shadow-panel)); }
+.card-interactive-control.btn {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  min-width: 0;
+  padding: 0;
+  margin: -1px;
+  border-radius: inherit;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  clip-path: inset(50%);
+  white-space: nowrap;
+}
+.card:has(> .card-interactive-control:focus-visible) {
+  box-shadow: var(--lmn-card-neu-shadow-panel, var(--neu-shadow-panel)), 0 0 0 2px var(--lmn-card-accent-glow, var(--accent-glow));
 }
-.card.hoverable.flat:hover { box-shadow: var(--neu-shadow-control); }
-.card.hoverable.sunken:hover { box-shadow: var(--neu-shadow-panel); }
 .card-head {
   display: flex; align-items: flex-start; justify-content: space-between;
   gap: var(--gap-3); margin-bottom: var(--gap-4);
 }
 .card-titles { display: flex; flex-direction: column; gap: 2px; }
 .card-title { font-size: 15px; font-weight: 600; }
-.card-desc  { font-size: 12px; color: var(--fg-muted); }
+.card-desc  { font-size: 12px; color: var(--lmn-card-fg-muted, var(--fg-muted)); }
 .card-actions { display: flex; gap: 6px; }
 .card-body {
   font-size: 13px;
   min-width: 0;
   position: relative;
 }
+.card-body-content { display: contents; }
 .card-body.body-stack {
   display: flex;
   flex-direction: column;
@@ -1206,9 +1401,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   place-items: center;
   background: var(--card-loading-bg);
   box-shadow:
-    inset calc(var(--shadow-inset-offset) * 0.45) calc(var(--shadow-inset-offset) * 0.45) calc(var(--shadow-inset-blur) * 0.45) color-mix(in oklch, var(--shadow-dark) 55%, transparent),
-    inset calc(var(--shadow-inset-offset) * -0.45) calc(var(--shadow-inset-offset) * -0.45) calc(var(--shadow-inset-blur) * 0.45) color-mix(in oklch, var(--shadow-light) 72%, transparent);
-  color: var(--fg-muted);
+    inset calc(var(--lmn-card-shadow-inset-offset, var(--shadow-inset-offset)) * 0.45) calc(var(--lmn-card-shadow-inset-offset, var(--shadow-inset-offset)) * 0.45) calc(var(--lmn-card-shadow-inset-blur, var(--shadow-inset-blur)) * 0.45) color-mix(in oklch, var(--lmn-card-shadow-dark, var(--shadow-dark)) 55%, transparent),
+    inset calc(var(--lmn-card-shadow-inset-offset, var(--shadow-inset-offset)) * -0.45) calc(var(--lmn-card-shadow-inset-offset, var(--shadow-inset-offset)) * -0.45) calc(var(--lmn-card-shadow-inset-blur, var(--shadow-inset-blur)) * 0.45) color-mix(in oklch, var(--lmn-card-shadow-light, var(--shadow-light)) 72%, transparent);
+  color: var(--lmn-card-fg-muted, var(--fg-muted));
   z-index: 1;
 }
 /* ============ Surface ============ */
@@ -1216,21 +1411,21 @@ input, textarea, select { font-family: inherit; color: inherit; }
   position: relative;
   box-sizing: border-box;
   min-width: 0;
-  color: var(--fg);
-  background: var(--bg);
+  color: var(--lmn-surface-fg, var(--fg));
+  background: var(--lmn-surface-bg, var(--bg));
   border-radius: var(--r-lg);
 }
-.surface.tone-raised { background: var(--bg-raised); }
-.surface.tone-sunken { background: var(--bg-sunken); }
+.surface.tone-raised { background: var(--lmn-surface-bg-raised, var(--bg-raised)); }
+.surface.tone-sunken { background: var(--lmn-surface-bg-sunken, var(--bg-sunken)); }
 .surface.tone-accent {
-  color: var(--accent-ink);
-  background: var(--accent-soft);
+  color: var(--lmn-surface-accent-ink, var(--accent-ink));
+  background: var(--lmn-surface-accent-soft, var(--accent-soft));
 }
 .surface.plain { box-shadow: none; }
-.surface.raised { box-shadow: var(--neu-shadow-panel); }
-.surface.sunken { box-shadow: var(--neu-shadow-inset-strong); }
-.surface.floating { box-shadow: var(--neu-shadow-float); }
-.surface.bordered { border: 1px solid var(--border); }
+.surface.raised { box-shadow: var(--lmn-surface-neu-shadow-panel, var(--neu-shadow-panel)); }
+.surface.sunken { box-shadow: var(--lmn-surface-neu-shadow-inset-strong, var(--neu-shadow-inset-strong)); }
+.surface.floating { box-shadow: var(--lmn-surface-neu-shadow-float, var(--neu-shadow-float)); }
+.surface.bordered { border: 1px solid var(--lmn-surface-border, var(--border)); }
 .surface.pad-none { padding: 0; }
 .surface.pad-sm { padding: var(--gap-3); }
 .surface.pad-md { padding: var(--gap-5); }
@@ -1253,8 +1448,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   display: inline-flex;
   padding: 5px;
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-tabs-bg, var(--bg));
+  box-shadow: var(--lmn-tabs-neu-shadow-inset, var(--neu-shadow-inset));
   gap: 2px;
   align-self: flex-start;
 }
@@ -1266,18 +1461,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-size: 12px;
   font-weight: 500;
   font-family: inherit;
-  color: var(--fg-muted);
+  color: var(--lmn-tabs-fg-muted, var(--fg-muted));
   cursor: pointer;
   display: inline-flex;
   align-items: center;
   gap: 6px;
   transition: all var(--dur-fast) var(--ease);
 }
-.tabs-nav .tab:hover { color: var(--fg); }
+.tabs-nav .tab:hover { color: var(--lmn-tabs-fg, var(--fg)); }
 .tabs-nav .tab.active {
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  color: var(--lmn-tabs-accent-ink, var(--accent-ink));
+  background: var(--lmn-tabs-bg, var(--bg));
+  box-shadow: var(--lmn-tabs-neu-shadow-control, var(--neu-shadow-control));
   font-weight: 600;
 }
 .tabs-nav .tab[disabled] { opacity: 0.4; cursor: not-allowed; }
@@ -1287,7 +1482,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   background: transparent;
   box-shadow: none;
   border-radius: 0;
-  border-bottom: 1px solid var(--divider);
+  border-bottom: 1px solid var(--lmn-tabs-divider, var(--divider));
   align-self: stretch;
 }
 .tabs.line .tabs-nav .tab,
@@ -1302,8 +1497,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .tabs.line .tabs-nav .tab.active::after,
 .tabs.underline .tabs-nav .tab.active::after {
   content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
-  background: var(--accent); border-radius: 999px;
-  box-shadow: 0 0 8px var(--accent-glow);
+  background: var(--lmn-tabs-accent, var(--accent)); border-radius: 999px;
+  box-shadow: 0 0 8px var(--lmn-tabs-accent-glow, var(--accent-glow));
 }
 /* Centered nav — works for pill / segmented (self-align) and line (flex-center) */
 .tabs.centered .tabs-nav { align-self: center; }
@@ -1315,9 +1510,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
 /* ============ Collapse ============ */
 .collapse { display: flex; flex-direction: column; gap: 10px; }
 .collapse-item {
-  background: var(--bg);
+  background: var(--lmn-collapse-bg, var(--bg));
   border-radius: var(--r-md);
-  box-shadow: var(--neu-shadow-control);
+  box-shadow: var(--lmn-collapse-neu-shadow-control, var(--neu-shadow-control));
   overflow: hidden;
 }
 .collapse.ghost .collapse-item {
@@ -1338,7 +1533,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-size: 13px;
   font-weight: 500;
   font-family: inherit;
-  color: var(--fg);
+  color: var(--lmn-collapse-fg, var(--fg));
   text-align: left;
 }
 .collapse.small .collapse-head { padding: 10px 14px; font-size: 12px; }
@@ -1349,7 +1544,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   max-height: 0;
   overflow: hidden;
   transition: max-height var(--dur) var(--ease);
-  color: var(--fg-muted);
+  color: var(--lmn-collapse-fg-muted, var(--fg-muted));
   font-size: 13px;
 }
 .collapse-body-inner { padding: 0 18px 16px; }
@@ -1357,14 +1552,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .collapse.large .collapse-body-inner { padding: 0 22px 20px; }
 .collapse-chev {
   transition: transform var(--dur) var(--ease), color var(--dur) var(--ease);
-  color: var(--fg-subtle);
+  color: var(--lmn-collapse-fg-subtle, var(--fg-subtle));
   display: inline-flex;
   border-radius: var(--r-xs);
   padding: 2px;
 }
+button.collapse-chev {
+  border: 0;
+  background: transparent;
+  font: inherit;
+}
 .collapse-chev.clickable { cursor: pointer; }
-.collapse-chev.clickable:hover { color: var(--fg); background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
-.collapse-item.open .collapse-chev { transform: rotate(180deg); color: var(--accent); }
+.collapse-chev.clickable:hover { color: var(--lmn-collapse-fg, var(--fg)); background: var(--lmn-collapse-bg, var(--bg)); box-shadow: var(--lmn-collapse-neu-shadow-subtle, var(--neu-shadow-subtle)); }
+.collapse-item.open .collapse-chev { transform: rotate(180deg); color: var(--lmn-collapse-accent, var(--accent)); }
 /* ============ Select ============ */
 .select {
   position: relative;
@@ -1380,14 +1580,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
   padding: 0 36px 0 var(--ctrl-pad-x);
   border: none;
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-select-bg, var(--bg));
+  box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control));
   display: inline-flex;
   align-items: center;
   gap: 8px;
   font-size: var(--fs-md);
   font-family: inherit;
-  color: var(--fg);
+  color: var(--lmn-select-fg, var(--fg));
   cursor: pointer;
   transition: all var(--dur-fast) var(--ease);
   position: relative;
@@ -1431,25 +1631,25 @@ input, textarea, select { font-family: inherit; color: inherit; }
   height: 18px;
 }
 .select.invalid .select-trigger {
-  box-shadow: var(--neu-shadow-control), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
+  box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control)), 0 0 0 2px color-mix(in oklch, var(--lmn-select-danger, var(--danger)) 30%, transparent);
 }
 .select.invalid.open .select-trigger {
-  box-shadow: var(--neu-shadow-inset), 0 0 0 2px color-mix(in oklch, var(--danger) 30%, transparent);
+  box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px color-mix(in oklch, var(--lmn-select-danger, var(--danger)) 30%, transparent);
 }
 .select.sm .select-trigger { height: var(--ctrl-h-sm); padding: 0 32px 0 var(--ctrl-pad-x-sm); font-size: var(--fs-sm); border-radius: var(--r-sm); }
 .select.lg .select-trigger { height: var(--field-h-lg); padding: 0 36px 0 var(--ctrl-pad-x); font-size: var(--fs-lg); border-radius: var(--r-lg); }
-.select-trigger:hover { color: var(--accent-ink); }
-.select.open .select-trigger { box-shadow: var(--neu-shadow-inset); color: var(--accent-ink); }
-.select-trigger .placeholder { color: var(--fg-subtle); }
+.select-trigger:hover { color: var(--lmn-select-accent-ink, var(--accent-ink)); }
+.select.open .select-trigger { box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset)); color: var(--lmn-select-accent-ink, var(--accent-ink)); }
+.select-trigger .placeholder { color: var(--lmn-select-fg-subtle, var(--fg-subtle)); }
 .select-caret {
   position: absolute;
   right: 12px; top: 50%;
   transform: translateY(-50%);
-  color: var(--fg-subtle);
+  color: var(--lmn-select-fg-subtle, var(--fg-subtle));
   transition: transform var(--dur) var(--ease);
   flex-shrink: 0;
 }
-.select.open .select-caret { transform: translateY(-50%) rotate(180deg); color: var(--accent); }
+.select.open .select-caret { transform: translateY(-50%) rotate(180deg); color: var(--lmn-select-accent, var(--accent)); }
 /* Multi-select trigger: variable height, tags inside, vertically centered */
 .select.multi .select-trigger {
   height: auto;
@@ -1486,25 +1686,28 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 20px;
   height: 20px;
   border-radius: 999px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-select-bg, var(--bg));
+  border: none;
+  padding: 0;
+  font: inherit;
+  box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control));
   display: inline-grid;
   place-items: center;
   cursor: pointer;
-  color: var(--fg-subtle);
+  color: var(--lmn-select-fg-subtle, var(--fg-subtle));
   opacity: 0;
   transition: all var(--dur-fast) var(--ease);
   z-index: 1;
 }
 .select:hover .select-clear { opacity: 1; }
-.select-clear:hover { color: var(--accent-ink); box-shadow: var(--neu-shadow-inset); }
+.select-clear:hover { color: var(--lmn-select-accent-ink, var(--accent-ink)); box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset)); }
 /* Multi-select menu: leading checkbox per item */
 .menu-check {
   width: 16px;
   height: 16px;
   border-radius: 5px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-select-bg, var(--bg));
+  box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset));
   display: inline-grid;
   place-items: center;
   flex-shrink: 0;
@@ -1512,15 +1715,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
   transition: all var(--dur-fast) var(--ease);
 }
 .menu-check.on {
-  background: var(--accent);
-  box-shadow: var(--neu-shadow-control), 0 1px 4px var(--accent-glow);
+  background: var(--lmn-select-accent, var(--accent));
+  box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control)), 0 1px 4px var(--lmn-select-accent-glow, var(--accent-glow));
 }
 /* Menu search — flush with menu, single subtle separator (no nested frame) */
 .menu-search {
   display: block;
   padding: 4px 2px 8px;
   margin: -2px -2px 4px;
-  border-bottom: 1px solid var(--divider);
+  border-bottom: 1px solid var(--lmn-select-divider, var(--divider));
 }
 .menu-search .input-wrap { width: 100%; }
 /* Menu state (loading / empty) */
@@ -1532,28 +1735,38 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 10px;
   padding: 26px 12px;
   font-size: var(--fs-sm);
-  color: var(--fg-muted);
+  color: var(--lmn-select-fg-muted, var(--fg-muted));
 }
 .menu-state .menu-state-ico {
   width: 40px;
   height: 40px;
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-select-bg, var(--bg));
+  box-shadow: var(--lmn-select-neu-shadow-inset, var(--neu-shadow-inset));
   display: grid;
   place-items: center;
-  color: var(--fg-subtle);
+  color: var(--lmn-select-fg-subtle, var(--fg-subtle));
 }
 .menu-state .menu-state-ico .spinner {
   width: 16px;
   height: 16px;
   display: inline-block;
   border-radius: 999px;
-  border: 2px solid var(--accent);
-  border-color: var(--accent);
+  border: 2px solid var(--lmn-select-accent, var(--accent));
+  border-color: var(--lmn-select-accent, var(--accent));
   border-right-color: transparent;
   animation: spin 0.8s linear infinite;
 }
+.select-value-custom {
+  overflow: hidden;
+}
+.select-value-custom > * {
+  min-width: 0;
+  max-width: 100%;
+}
+@media (prefers-reduced-motion: reduce) {
+  .menu-state .menu-state-ico .spinner { animation: none; }
+}
 /* Option body — supports description line under label */
 .menu-item-body {
   flex: 1;
@@ -1563,6 +1776,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
   min-width: 0;
   text-align: left;
 }
+.menu-item-custom {
+  flex: 1;
+  min-width: 0;
+  text-align: left;
+}
 .menu-item-label {
   white-space: nowrap;
   overflow: hidden;
@@ -1570,31 +1788,36 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .menu-item-desc {
   font-size: var(--fs-xs);
-  color: var(--fg-subtle);
+  color: var(--lmn-select-fg-subtle, var(--fg-subtle));
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
 }
-.menu-item.active .menu-item-desc { color: color-mix(in oklch, var(--accent-ink) 70%, var(--fg-subtle)); }
+.menu-item.active .menu-item-desc { color: color-mix(in oklch, var(--lmn-select-accent-ink, var(--accent-ink)) 70%, var(--lmn-select-fg-subtle, var(--fg-subtle))); }
 /* Keyboard / hover highlight — soft raised pill */
 .menu-item.highlight:not([disabled]) {
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
-  color: var(--accent-ink);
+  background: var(--lmn-select-bg, var(--bg));
+  box-shadow: var(--lmn-select-neu-shadow-control, var(--neu-shadow-control));
+  color: var(--lmn-select-accent-ink, var(--accent-ink));
 }
 .menu-item[disabled] {
   opacity: 0.45;
   cursor: not-allowed;
 }
 .menu {
-  background: var(--bg);
+  background: var(--lmn-select-bg, var(--bg));
   border-radius: var(--r-md);
-  box-shadow: var(--neu-shadow-float);
+  box-shadow: var(--lmn-select-neu-shadow-float, var(--neu-shadow-float));
   padding: 6px;
   min-width: 180px;
+  max-width: calc(100vw - 16px);
   z-index: 1000;
   animation: menuIn var(--dur) var(--ease);
-  max-height: 260px;
+  overflow: hidden;
+}
+.menu-options {
+  display: flex;
+  flex-direction: column;
   overflow-y: auto;
 }
 .menu-item {
@@ -1602,7 +1825,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: var(--r-sm);
   font-size: var(--fs-md);
   cursor: pointer;
-  color: var(--fg);
+  color: var(--lmn-select-fg, var(--fg));
   display: flex;
   align-items: center;
   gap: 10px;
@@ -1613,20 +1836,83 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 100%;
   text-align: left;
 }
-.menu-item:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); color: var(--accent-ink); }
-.menu-item.active { color: var(--accent-ink); font-weight: 500; }
-.menu-item .tick { margin-left: auto; color: var(--accent); opacity: 0; }
+.menu-item:hover { background: var(--lmn-select-bg, var(--bg)); box-shadow: var(--lmn-select-neu-shadow-subtle, var(--neu-shadow-subtle)); color: var(--lmn-select-accent-ink, var(--accent-ink)); }
+.menu-item.active { color: var(--lmn-select-accent-ink, var(--accent-ink)); font-weight: 500; }
+.menu-item .tick { margin-left: auto; color: var(--lmn-select-accent, var(--accent)); opacity: 0; }
 .menu-item.active .tick { opacity: 1; }
-.menu-item.danger { color: var(--danger); }
-.menu-separator { height: 1px; background: var(--divider); margin: 6px 4px; }
+.menu-item.danger { color: var(--lmn-select-danger, var(--danger)); }
+.menu-separator { height: 1px; background: var(--lmn-select-divider, var(--divider)); margin: 6px 4px; }
 .menu-group-label {
   font-size: 10px;
   font-weight: 600;
   text-transform: uppercase;
   letter-spacing: 0.08em;
-  color: var(--fg-subtle);
+  color: var(--lmn-select-fg-subtle, var(--fg-subtle));
   padding: 8px 12px 4px;
 }
+/* ============ Form ============ */
+.lumina-form { display: flex; flex-direction: column; gap: 18px; }
+.lumina-form.layout-inline {
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  gap: 12px;
+}
+.lumina-form.layout-inline .form-item { flex: 0 0 auto; }
+.form-item {
+  display: flex;
+  flex-direction: column;
+  gap: 6px;
+  min-width: 0;
+}
+.lumina-form.layout-horizontal .form-item {
+  flex-direction: row;
+  align-items: flex-start;
+  gap: 12px;
+}
+.lumina-form.layout-horizontal .form-item-label {
+  flex: 0 0 auto;
+  min-width: 96px;
+  padding-top: 10px;
+  text-align: right;
+}
+.lumina-form.layout-horizontal .form-item-control { flex: 1; min-width: 0; }
+.form-item-label {
+  font-size: 13px;
+  font-weight: 500;
+  color: var(--lmn-form-fg, var(--fg));
+  padding-left: 2px;
+  display: inline-flex;
+  align-items: center;
+  gap: 4px;
+}
+.form-item-required {
+  color: var(--lmn-form-danger, var(--danger));
+  font-weight: 600;
+  margin-right: 2px;
+}
+.form-item-control { min-width: 0; }
+.form-item-error {
+  font-size: 12px;
+  color: var(--lmn-form-danger, var(--danger));
+  padding-left: 2px;
+  animation: fadeIn var(--dur-fast) var(--ease);
+}
+.form-item-help {
+  font-size: 12px;
+  color: var(--lmn-form-fg-subtle, var(--fg-subtle));
+  padding-left: 2px;
+}
+.form-item-extra {
+  font-size: 11.5px;
+  color: var(--lmn-form-fg-subtle, var(--fg-subtle));
+  padding-left: 2px;
+  opacity: 0.85;
+}
+.form-item.has-error .input-wrap,
+.form-item.has-error .select-trigger {
+  box-shadow: var(--lmn-form-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px color-mix(in oklch, var(--lmn-form-danger, var(--danger)) 30%, transparent);
+}
 /* ============ Modal ============ */
 .modal-overlay {
   position: fixed;
@@ -1642,15 +1928,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
   display: none;
 }
 .modal {
-  background: var(--bg);
+  background: var(--lmn-modal-bg, var(--bg));
   border-radius: var(--r-xl);
-  box-shadow: var(--neu-shadow-float);
+  box-shadow: var(--lmn-modal-neu-shadow-float, var(--neu-shadow-float));
   padding: var(--gap-6);
   width: min(480px, 92vw);
   animation: modalIn var(--dur-slow) var(--ease);
   max-height: 86vh;
   display: flex;
   flex-direction: column;
+  --overlay-shadow-safe-area: calc(var(--lmn-modal-shadow-offset, var(--shadow-offset)) + var(--lmn-modal-shadow-blur, var(--shadow-blur)));
 }
 @keyframes modalIn {
   from { opacity: 0; transform: translateY(8px) scale(0.97); }
@@ -1660,7 +1947,6 @@ input, textarea, select { font-family: inherit; color: inherit; }
   align-items: flex-start;
   justify-content: space-between;
   gap: var(--gap-3);
-  margin-bottom: var(--gap-3);
 }
 .modal-titles {
   display: flex;
@@ -1668,20 +1954,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 4px;
 }
 .modal-title { font-size: 17px; font-weight: 600; }
-.modal-desc  { font-size: 13px; color: var(--fg-muted); }
+.modal-desc  { font-size: 13px; color: var(--lmn-modal-fg-muted, var(--fg-muted)); }
 .modal-body {
-  padding: var(--gap-3) 0;
-  color: var(--fg-muted);
+  min-width: 0;
+  min-height: 0;
+  margin-inline: calc(var(--gap-6) * -1);
+  padding: var(--overlay-shadow-safe-area);
+  color: var(--lmn-modal-fg-muted, var(--fg-muted));
   font-size: 13px;
   line-height: 1.6;
   flex: 1;
   overflow-y: auto;
 }
+.modal-body:first-child {
+  margin-top: calc(var(--gap-6) * -1);
+}
+.modal-body:last-child {
+  margin-bottom: calc(var(--gap-6) * -1);
+}
+.modal-body.inset-none {
+  padding: 0;
+}
 .modal-foot {
   display: flex;
   gap: 10px;
   justify-content: flex-end;
-  margin-top: var(--gap-4);
 }
 .modal-close {
   width: 28px; height: 28px;
@@ -1690,14 +1987,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: var(--r-sm);
   display: grid;
   place-items: center;
-  color: var(--fg-subtle);
+  color: var(--lmn-modal-fg-subtle, var(--fg-subtle));
   cursor: pointer;
   transition: all var(--dur-fast) var(--ease);
 }
 .modal-close:hover {
-  color: var(--fg);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  color: var(--lmn-modal-fg, var(--fg));
+  background: var(--lmn-modal-bg, var(--bg));
+  box-shadow: var(--lmn-modal-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .modal-static-body {
   display: flex;
@@ -1711,16 +2008,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
   display: inline-grid;
   place-items: center;
   flex-shrink: 0;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
-  color: var(--accent);
+  background: var(--lmn-modal-bg, var(--bg));
+  box-shadow: var(--lmn-modal-neu-shadow-inset, var(--neu-shadow-inset));
+  color: var(--lmn-modal-accent, var(--accent));
 }
-.modal-static-icon.success { color: var(--success); }
-.modal-static-icon.warning { color: var(--warning); }
-.modal-static-icon.error { color: var(--danger); }
+.modal-static-icon.success { color: var(--lmn-modal-success, var(--success)); }
+.modal-static-icon.warning { color: var(--lmn-modal-warning, var(--warning)); }
+.modal-static-icon.error { color: var(--lmn-modal-danger, var(--danger)); }
 .modal-static-content {
   min-width: 0;
-  color: var(--fg-muted);
+  color: var(--lmn-modal-fg-muted, var(--fg-muted));
 }
 /* ============ Drawer ============ */
 .drawer-overlay {
@@ -1736,15 +2033,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .drawer {
   position: fixed;
-  background: var(--bg);
+  background: var(--lmn-drawer-bg, var(--bg));
   padding: var(--gap-5);
   z-index: 151;
-  overflow-y: auto;
+  overflow: hidden;
   display: flex;
   flex-direction: column;
-  --drawer-shadow-offset: calc(var(--shadow-offset) * 4 * var(--shadow-float-scale));
-  --drawer-shadow-blur: calc(var(--shadow-blur) * 3.75 * var(--shadow-float-scale));
-  --drawer-shadow-spread: calc(var(--shadow-offset) * -3.3 * var(--shadow-float-scale));
+  --overlay-shadow-safe-area: calc(var(--lmn-drawer-shadow-offset, var(--shadow-offset)) + var(--lmn-drawer-shadow-blur, var(--shadow-blur)));
+  --drawer-shadow-offset: calc(var(--lmn-drawer-shadow-offset, var(--shadow-offset)) * 4 * var(--shadow-float-scale));
+  --drawer-shadow-blur: calc(var(--lmn-drawer-shadow-blur, var(--shadow-blur)) * 3.75 * var(--shadow-float-scale));
+  --drawer-shadow-spread: calc(var(--lmn-drawer-shadow-offset, var(--shadow-offset)) * -3.3 * var(--shadow-float-scale));
 }
 .drawer.hidden {
   display: none;
@@ -1753,25 +2051,25 @@ input, textarea, select { font-family: inherit; color: inherit; }
   top: 0; right: 0; bottom: 0;
   width: min(420px, 92vw);
   animation: drawerInRight var(--dur-slow) var(--ease);
-  box-shadow: calc(var(--drawer-shadow-offset) * -1) 0 var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--shadow-dark);
+  box-shadow: calc(var(--drawer-shadow-offset) * -1) 0 var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
 }
 .drawer.left {
   top: 0; left: 0; bottom: 0;
   width: min(420px, 92vw);
   animation: drawerInLeft var(--dur-slow) var(--ease);
-  box-shadow: var(--drawer-shadow-offset) 0 var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--shadow-dark);
+  box-shadow: var(--drawer-shadow-offset) 0 var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
 }
 .drawer.top {
   top: 0; left: 0; right: 0;
   height: min(320px, 80vh);
   animation: drawerInTop var(--dur-slow) var(--ease);
-  box-shadow: 0 var(--drawer-shadow-offset) var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--shadow-dark);
+  box-shadow: 0 var(--drawer-shadow-offset) var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
 }
 .drawer.bottom {
   bottom: 0; left: 0; right: 0;
   height: min(320px, 80vh);
   animation: drawerInBottom var(--dur-slow) var(--ease);
-  box-shadow: 0 calc(var(--drawer-shadow-offset) * -1) var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--shadow-dark);
+  box-shadow: 0 calc(var(--drawer-shadow-offset) * -1) var(--drawer-shadow-blur) var(--drawer-shadow-spread) var(--lmn-drawer-shadow-dark, var(--shadow-dark));
 }
 @keyframes drawerInRight  { from { transform: translateX( 20px); opacity: 0; } }
 @keyframes drawerInLeft   { from { transform: translateX(-20px); opacity: 0; } }
@@ -1782,9 +2080,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   align-items: center;
   justify-content: space-between;
   gap: var(--gap-3);
-  margin-bottom: var(--gap-4);
   padding-bottom: var(--gap-4);
-  border-bottom: 1px solid var(--divider);
+  border-bottom: 1px solid var(--lmn-drawer-divider, var(--divider));
 }
 .drawer-head-right {
   display: inline-flex;
@@ -1802,25 +2099,38 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: var(--r-sm);
   display: grid;
   place-items: center;
-  color: var(--fg-subtle);
+  color: var(--lmn-drawer-fg-subtle, var(--fg-subtle));
   cursor: pointer;
   transition: all var(--dur-fast) var(--ease);
 }
 .drawer-close:hover {
-  color: var(--fg);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  color: var(--lmn-drawer-fg, var(--fg));
+  background: var(--lmn-drawer-bg, var(--bg));
+  box-shadow: var(--lmn-drawer-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .drawer-body {
   flex: 1;
+  min-width: 0;
+  min-height: 0;
+  margin-inline: calc(var(--gap-5) * -1);
+  padding: var(--overlay-shadow-safe-area);
+  overflow: auto;
+}
+.drawer-body:first-child {
+  margin-top: calc(var(--gap-5) * -1);
+}
+.drawer-body:last-child {
+  margin-bottom: calc(var(--gap-5) * -1);
+}
+.drawer-body.inset-none {
+  padding: 0;
 }
 .drawer-foot {
   display: flex;
   gap: 10px;
   justify-content: flex-end;
-  margin-top: var(--gap-4);
   padding-top: var(--gap-4);
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-drawer-divider, var(--divider));
 }
 /* ============ Tooltip ============ */
 .tip-anchor {
@@ -1831,14 +2141,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .tip {
   display: block;
   box-sizing: border-box;
-  background: var(--bg-sunken);
-  color: var(--fg);
+  background: var(--lmn-tooltip-bg-sunken, var(--bg-sunken));
+  color: var(--lmn-tooltip-fg, var(--fg));
   padding: 6px 10px;
   border-radius: var(--r-sm);
   font-size: 11px;
   font-weight: 500;
   white-space: nowrap;
-  box-shadow: var(--neu-shadow-control);
+  box-shadow: var(--lmn-tooltip-neu-shadow-control, var(--neu-shadow-control));
   pointer-events: auto;
   animation: fadeIn var(--dur) var(--ease);
   z-index: 1000;
@@ -1858,50 +2168,49 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .message-container.bottom-left  { bottom: 20px; left: 20px; }
 .message-container.top-center   { top: 56px; left: 50%; transform: translateX(-50%); align-items: center; }
 .message {
-  background: var(--bg);
+  background: var(--lmn-message-bg, var(--bg));
   border-radius: var(--r-md);
-  box-shadow: var(--neu-shadow-float);
+  box-shadow: var(--lmn-message-neu-shadow-float, var(--neu-shadow-float));
   padding: 12px 16px;
   min-width: 240px;
   display: flex; align-items: center; gap: 10px;
   font-size: 13px;
   pointer-events: auto;
   animation: messageIn var(--dur-slow) var(--ease);
-  border-left: 3px solid var(--accent);
-}
-.message.success { border-color: var(--success); }
-.message.warning { border-color: var(--warning); }
-.message.error   { border-color: var(--danger); }
-.message .message-icon { color: var(--accent); flex-shrink: 0; }
-.message.success .message-icon { color: var(--success); }
-.message.warning .message-icon { color: var(--warning); }
-.message.error   .message-icon { color: var(--danger); }
+  border-left: 3px solid var(--lmn-message-accent, var(--accent));
+}
+.message.success { border-color: var(--lmn-message-success, var(--success)); }
+.message.warning { border-color: var(--lmn-message-warning, var(--warning)); }
+.message.error   { border-color: var(--lmn-message-danger, var(--danger)); }
+.message .message-icon { color: var(--lmn-message-accent, var(--accent)); flex-shrink: 0; }
+.message.success .message-icon { color: var(--lmn-message-success, var(--success)); }
+.message.warning .message-icon { color: var(--lmn-message-warning, var(--warning)); }
+.message.error   .message-icon { color: var(--lmn-message-danger, var(--danger)); }
 .message-body { flex: 1; min-width: 0; }
 .message-title { font-weight: 600; margin-bottom: 2px; }
-.message-content { color: var(--fg-muted); font-size: 12px; }
+.message-content { color: var(--lmn-message-fg-muted, var(--fg-muted)); font-size: 12px; }
 .message-close {
   background: transparent; border: none;
-  color: var(--fg-subtle); cursor: pointer;
+  color: var(--lmn-message-fg-subtle, var(--fg-subtle)); cursor: pointer;
   padding: 0 2px; font-family: inherit;
 }
-.message-close:hover { color: var(--fg); }
+.message-close:hover { color: var(--lmn-message-fg, var(--fg)); }
 .message.leaving { animation: messageOut var(--dur) var(--ease) forwards; }
 @keyframes messageIn  { from { opacity: 0; transform: translateX(20px); } }
 @keyframes messageOut { to   { opacity: 0; transform: translateX(20px); } }
 /* ============ Popover ============ */
 .popover {
   z-index: 1000;
-  background: var(--bg);
+  background: var(--lmn-popover-bg, var(--bg));
   border-radius: var(--r-md);
   min-width: 220px;
-  box-shadow: var(--neu-shadow-float);
+  box-shadow: var(--lmn-popover-neu-shadow-float, var(--neu-shadow-float));
   position: relative;
 }
 /*
  * Direction-aware entrance.
- * We animate `opacity` + `translate` (the standalone property, NOT `transform`)
- * so we don't clobber the inline `transform: translateX(-50%)` that useFloating
- * applies for cross-axis centering.
+ * We animate `opacity` + `translate` so positioning stays independent from
+ * the coordinates calculated by useFloating.
  */
 .popover-bottom { animation: popoverInDown var(--dur) var(--ease); }
 .popover-top    { animation: popoverInUp   var(--dur) var(--ease); }
@@ -1922,13 +2231,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .popover-title {
   font-weight: 600;
   font-size: 14px;
-  color: var(--fg);
+  color: var(--lmn-popover-fg, var(--fg));
 }
 .popover-close {
   all: unset;
   cursor: pointer;
   font-size: 16px;
-  color: var(--fg-muted);
+  color: var(--lmn-popover-fg-muted, var(--fg-muted));
   line-height: 1;
   padding: 2px 4px;
   border-radius: var(--r-xs);
@@ -1936,7 +2245,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   margin-left: auto;
 }
 .popover-close:hover {
-  color: var(--fg);
+  color: var(--lmn-popover-fg, var(--fg));
 }
 /* ---- Body ---- */
 .popover-body {
@@ -1950,8 +2259,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   position: absolute;
   width: 10px;
   height: 10px;
-  background: var(--bg);
-  box-shadow: 2px 2px 4px rgba(163, 177, 198, 0.2);
+  background: var(--lmn-popover-bg, var(--bg));
+  box-shadow: 2px 2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
   transform: rotate(45deg);
   pointer-events: none;
 }
@@ -1959,40 +2268,238 @@ input, textarea, select { font-family: inherit; color: inherit; }
   top: -5px;
   left: 50%;
   margin-left: -5px;
-  box-shadow: -2px -2px 4px rgba(163, 177, 198, 0.2);
+  box-shadow: -2px -2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
 }
 .popover-arrow-top {
   bottom: -5px;
   left: 50%;
   margin-left: -5px;
-  box-shadow: 2px 2px 4px rgba(163, 177, 198, 0.2);
+  box-shadow: 2px 2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
 }
 .popover-arrow-left {
   right: -5px;
   top: 50%;
   margin-top: -5px;
-  box-shadow: 2px -2px 4px rgba(163, 177, 198, 0.2);
+  box-shadow: 2px -2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
 }
 .popover-arrow-right {
   left: -5px;
   top: 50%;
   margin-top: -5px;
-  box-shadow: -2px 2px 4px rgba(163, 177, 198, 0.2);
+  box-shadow: -2px 2px 4px color-mix(in oklch, var(--lmn-popover-shadow-dark, var(--shadow-dark)) 36%, transparent);
 }
-/* ============ Alert ============ */
-.alert {
-  display: flex;
-  gap: 12px;
-  align-items: flex-start;
-  padding: 14px 16px;
+/* ============ ContextMenu ============ */
+.context-menu {
+  z-index: 5000;
+  padding: 6px;
+  background: var(--lmn-context-menu-bg, var(--bg));
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
-  position: relative;
+  box-shadow: var(--lmn-context-menu-neu-shadow-float, var(--neu-shadow-float));
+  border: 1px solid var(--lmn-context-menu-divider, var(--divider));
+  display: flex;
+  flex-direction: column;
+  gap: 1px;
+  animation: menuIn var(--dur-fast) var(--ease);
+  max-height: calc(100vh - 24px);
+  overflow-y: auto;
 }
-.alert-ico {
-  width: 20px; height: 20px;
-  display: grid; place-items: center;
+.context-menu-item {
+  display: grid;
+  grid-template-columns: 18px 1fr auto;
+  align-items: center;
+  gap: 8px;
+  padding: 6px 10px;
+  min-height: 28px;
+  border: none;
+  background: transparent;
+  box-shadow: none;
+  font: inherit;
+  font-size: 13px;
+  color: var(--lmn-context-menu-fg, var(--fg));
+  text-align: left;
+  border-radius: var(--r-sm);
+  cursor: pointer;
+  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
+    box-shadow var(--dur-fast) var(--ease);
+}
+.context-menu-item:disabled { color: var(--lmn-context-menu-fg-subtle, var(--fg-subtle)); cursor: not-allowed; }
+.context-menu-item.active:not(:disabled) {
+  background: var(--lmn-context-menu-bg, var(--bg));
+  color: var(--lmn-context-menu-accent-ink, var(--accent-ink));
+  box-shadow: var(--lmn-context-menu-neu-shadow-inset, var(--neu-shadow-inset));
+}
+.context-menu-item.danger { color: var(--lmn-context-menu-danger, var(--danger)); }
+.context-menu-item.danger.active:not(:disabled) {
+  background: var(--lmn-context-menu-bg, var(--bg));
+  color: var(--lmn-context-menu-danger, var(--danger));
+  box-shadow: var(--lmn-context-menu-neu-shadow-inset, var(--neu-shadow-inset));
+}
+.context-menu-icon {
+  display: inline-flex;
+  justify-content: center;
+  align-items: center;
+  color: var(--lmn-context-menu-fg-muted, var(--fg-muted));
+}
+.context-menu-item.active:not(:disabled) .context-menu-icon { color: inherit; }
+.context-menu-item.danger .context-menu-icon { color: var(--lmn-context-menu-danger, var(--danger)); }
+.context-menu-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.context-menu-shortcut {
+  font-family: var(--font-mono);
+  font-size: 11px;
+  color: var(--lmn-context-menu-fg-subtle, var(--fg-subtle));
+  padding-left: 12px;
+}
+.context-menu-item.active:not(:disabled) .context-menu-shortcut { color: inherit; opacity: 0.8; }
+.context-menu-divider {
+  height: 1px;
+  background: var(--lmn-context-menu-divider, var(--divider));
+  margin: 4px 4px;
+}
+/* ============ CommandPalette ============ */
+.cmdp-overlay {
+  position: fixed;
+  inset: 0;
+  z-index: 4000;
+  background: var(--mask-bg);
+  display: flex;
+  justify-content: center;
+  align-items: flex-start;
+  padding-top: 14vh;
+  animation: fadeIn var(--dur-fast) var(--ease);
+}
+.cmdp-panel {
+  width: min(560px, calc(100vw - 48px));
+  max-height: 60vh;
+  background: var(--lmn-command-palette-bg, var(--bg));
+  border-radius: var(--r-lg);
+  box-shadow: var(--lmn-command-palette-neu-shadow-float, var(--neu-shadow-float));
+  border: 1px solid var(--lmn-command-palette-divider, var(--divider));
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
+  animation: cmdpIn var(--dur) var(--ease);
+}
+@keyframes cmdpIn {
+  from { opacity: 0; transform: translateY(-12px) scale(0.98); }
+  to   { opacity: 1; transform: translateY(0) scale(1); }
+}
+.cmdp-search {
+  padding: 12px 12px 10px;
+}
+.cmdp-list {
+  overflow-y: auto;
+  padding: 6px;
+  flex: 1;
+  min-height: 60px;
+}
+.cmdp-group + .cmdp-group { margin-top: 4px; }
+.cmdp-group-head {
+  font-size: 11px;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
+  padding: 8px 10px 4px;
+  font-weight: 600;
+}
+.cmdp-item {
+  display: grid;
+  grid-template-columns: 20px 1fr auto;
+  align-items: center;
+  gap: 10px;
+  width: 100%;
+  padding: 9px 10px;
+  border: none;
+  background: transparent;
+  box-shadow: none;
+  color: var(--lmn-command-palette-fg, var(--fg));
+  font: inherit;
+  font-size: 13px;
+  text-align: left;
+  border-radius: var(--r-sm);
+  cursor: pointer;
+  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease),
+    box-shadow var(--dur-fast) var(--ease);
+}
+.cmdp-item:disabled { color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle)); cursor: not-allowed; }
+.cmdp-item.active:not(:disabled) {
+  background: var(--lmn-command-palette-bg, var(--bg));
+  color: var(--lmn-command-palette-accent-ink, var(--accent-ink));
+  box-shadow: var(--lmn-command-palette-neu-shadow-inset, var(--neu-shadow-inset));
+}
+.cmdp-icon {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  color: var(--lmn-command-palette-fg-muted, var(--fg-muted));
+}
+.cmdp-item.active:not(:disabled) .cmdp-icon { color: inherit; }
+.cmdp-labels { display: flex; flex-direction: column; min-width: 0; }
+.cmdp-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.cmdp-desc {
+  font-size: 11.5px;
+  color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.cmdp-item.active:not(:disabled) .cmdp-desc { color: inherit; opacity: 0.75; }
+.cmdp-shortcut {
+  font-family: var(--font-mono);
+  font-size: 11px;
+  color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
+}
+.cmdp-item.active:not(:disabled) .cmdp-shortcut { color: inherit; opacity: 0.8; }
+.cmdp-empty {
+  padding: 28px 16px;
+  text-align: center;
+  color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
+  font-size: 13px;
+}
+.cmdp-footer {
+  display: flex;
+  gap: 16px;
+  padding: 8px 14px;
+  border-top: 1px solid var(--lmn-command-palette-divider, var(--divider));
+  background: var(--lmn-command-palette-bg-sunken, var(--bg-sunken));
+  font-size: 11.5px;
+  color: var(--lmn-command-palette-fg-subtle, var(--fg-subtle));
+}
+.cmdp-footer span { display: inline-flex; align-items: center; gap: 4px; }
+.cmdp-kbd {
+  display: inline-grid;
+  place-items: center;
+  min-width: 18px;
+  height: 18px;
+  padding: 0 5px;
+  border-radius: 5px;
+  background: var(--lmn-command-palette-bg, var(--bg));
+  box-shadow: var(--lmn-command-palette-neu-shadow-subtle, var(--neu-shadow-subtle));
+  font-family: var(--font-mono);
+  font-size: 10.5px;
+  color: var(--lmn-command-palette-fg-muted, var(--fg-muted));
+}
+/* ============ Alert ============ */
+.alert {
+  display: flex;
+  gap: 12px;
+  align-items: flex-start;
+  padding: 14px 16px;
+  border-radius: var(--r-md);
+  background: var(--lmn-alert-bg, var(--bg));
+  box-shadow: var(--lmn-alert-neu-shadow-inset, var(--neu-shadow-inset));
+  position: relative;
+}
+.alert-ico {
+  width: 20px; height: 20px;
+  display: grid; place-items: center;
   flex-shrink: 0;
   margin-top: 1px;
   line-height: 0;
@@ -2003,13 +2510,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
   height: 16px;
   object-fit: contain;
 }
-.alert.info    .alert-ico { color: var(--info); }
-.alert.success .alert-ico { color: var(--success); }
-.alert.warning .alert-ico { color: var(--warning); }
-.alert.danger  .alert-ico { color: var(--danger); }
+.alert.info    .alert-ico { color: var(--lmn-alert-info, var(--info)); }
+.alert.success .alert-ico { color: var(--lmn-alert-success, var(--success)); }
+.alert.warning .alert-ico { color: var(--lmn-alert-warning, var(--warning)); }
+.alert.danger  .alert-ico { color: var(--lmn-alert-danger, var(--danger)); }
 .alert-body  { flex: 1; min-width: 0; }
 .alert-title { font-size: 13px; font-weight: 600; margin-bottom: 3px; line-height: 1.4; }
-.alert-desc  { font-size: 12px; color: var(--fg-muted); line-height: 1.55; }
+.alert-desc  { font-size: 12px; color: var(--lmn-alert-fg-muted, var(--fg-muted)); line-height: 1.55; }
 .alert.no-title { align-items: center; }
 .alert.no-title .alert-ico { margin-top: 0; }
 .alert.no-icon { gap: 0; }
@@ -2025,16 +2532,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
   position: absolute; top: 10px; right: 10px;
   width: 22px; height: 22px; border-radius: 7px;
   display: grid; place-items: center;
-  color: var(--fg-subtle);
+  color: var(--lmn-alert-fg-subtle, var(--fg-subtle));
   cursor: pointer;
   border: none; background: transparent;
 }
-.alert-close:hover { color: var(--fg); background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
+.alert-close:hover { color: var(--lmn-alert-fg, var(--fg)); background: var(--lmn-alert-bg, var(--bg)); box-shadow: var(--lmn-alert-neu-shadow-subtle, var(--neu-shadow-subtle)); }
 /* ============ Table ============ */
 .table-wrap {
   border-radius: var(--r-lg);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-table-bg, var(--bg));
+  box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
   overflow: auto;
 }
 /* When scroll=y is on, the wrap itself becomes the scroll region. */
@@ -2049,51 +2556,64 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .table th {
   text-align: left;
   padding: 14px 18px;
-  background: var(--bg);
+  background: var(--lmn-table-bg, var(--bg));
   font-size: 11px;
   font-weight: 700;
   letter-spacing: 0.08em;
   text-transform: uppercase;
-  color: var(--fg-subtle);
-  border-bottom: 1px solid var(--divider);
+  color: var(--lmn-table-fg-subtle, var(--fg-subtle));
+  border-bottom: 1px solid var(--lmn-table-divider, var(--divider));
   position: sticky; top: 0;
   z-index: 1;
 }
 /* When the wrap is the scroll container (scroll.y), position:sticky on th needs
    top:0 relative to the wrap — browsers already handle that. Adding a stronger
    bg so content under the header doesn't bleed through. */
-.table.sticky-head th { background: var(--bg); }
-.table th.sortable { cursor: pointer; user-select: none; }
-.table th.sortable:hover { color: var(--fg); }
+.table.sticky-head th { background: var(--lmn-table-bg, var(--bg)); }
+.table th.sortable { user-select: none; }
+.table th.sortable:hover { color: var(--lmn-table-fg, var(--fg)); }
+.table-sort-trigger.btn {
+  height: auto;
+  min-height: 24px;
+  padding: 2px 4px;
+  color: inherit;
+  font: inherit;
+  letter-spacing: inherit;
+  text-transform: inherit;
+}
 .table th .th-label { vertical-align: middle; }
 .table th .sort-ind {
   display: inline-flex;
   width: 16px; height: 16px;
   border-radius: 6px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  background: var(--lmn-table-bg, var(--bg));
+  box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle));
   align-items: center; justify-content: center;
   margin-left: 6px;
-  color: var(--fg-subtle);
+  color: var(--lmn-table-fg-subtle, var(--fg-subtle));
   vertical-align: middle;
 }
-.table th.sorted .sort-ind { color: var(--accent); box-shadow: var(--neu-shadow-inset); }
+.table th.sorted .sort-ind { color: var(--lmn-table-accent, var(--accent)); box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
 .table td {
   padding: 12px 18px;
-  border-bottom: 1px solid var(--divider);
+  border-bottom: 1px solid var(--lmn-table-divider, var(--divider));
   vertical-align: middle;
 }
-.table.hoverable tbody tr:hover td { background: color-mix(in oklch, var(--accent-soft) 40%, transparent); }
+.table.hoverable tbody tr:hover td { background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 40%, transparent); }
 .table tbody tr.clickable { cursor: pointer; }
-.table tbody tr.selected td { background: color-mix(in oklch, var(--accent-soft) 80%, transparent); color: var(--accent-ink); }
+.table tbody tr.clickable:focus-visible td {
+  background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 55%, transparent);
+  box-shadow: inset 0 0 0 2px var(--lmn-table-accent-glow, var(--accent-glow));
+}
+.table tbody tr.selected td { background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 80%, transparent); color: var(--lmn-table-accent-ink, var(--accent-ink)); }
 .table tbody tr:last-child td { border-bottom: none; }
 .table.striped tbody tr:nth-child(even) td {
-  background: color-mix(in oklch, var(--bg-sunken) 40%, transparent);
+  background: color-mix(in oklch, var(--lmn-table-bg-sunken, var(--bg-sunken)) 40%, transparent);
 }
 /* Embossed: each row sits on the surface */
 .table.embossed { border-spacing: 0; }
 .table.embossed tbody td {
-  background: var(--bg);
+  background: var(--lmn-table-bg, var(--bg));
 }
 /* Card-row variant: each row is its own raised pill */
 .table.cards {
@@ -2113,8 +2633,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   inset: 0;
   z-index: -1;
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-table-bg, var(--bg));
+  box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control));
   pointer-events: none;
   transition: box-shadow var(--dur-fast) var(--ease), transform var(--dur-fast) var(--ease);
 }
@@ -2142,38 +2662,38 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .table.cards.hoverable tbody tr:hover {
   transform: translateY(-1px);
 }
-.table.cards.hoverable tbody tr:hover .card-row-surface { box-shadow: var(--neu-shadow-panel); }
+.table.cards.hoverable tbody tr:hover .card-row-surface { box-shadow: var(--lmn-table-neu-shadow-panel, var(--neu-shadow-panel)); }
 .table.cards.hoverable tbody tr:hover td { background: transparent; }
 .table .row-check { width: 44px; }
 .table .row-check .checkbox { display: inline-flex; }
 .table .row-expand { width: 40px; text-align: center; }
-.table-empty { padding: 60px 20px; text-align: center; color: var(--fg-muted); }
+.table-empty { padding: 60px 20px; text-align: center; color: var(--lmn-table-fg-muted, var(--fg-muted)); }
 /* Expand button */
 .expand-btn {
   width: 22px; height: 22px;
   border: none;
   border-radius: var(--r-sm);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
-  color: var(--fg-subtle);
+  background: var(--lmn-table-bg, var(--bg));
+  box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle));
+  color: var(--lmn-table-fg-subtle, var(--fg-subtle));
   display: inline-flex; align-items: center; justify-content: center;
   cursor: pointer;
   transition: transform var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
 }
-.expand-btn:hover { color: var(--accent-ink); box-shadow: var(--neu-shadow-control); }
-.expand-btn.open { transform: rotate(90deg); color: var(--accent-ink); box-shadow: var(--neu-shadow-inset); }
+.expand-btn:hover { color: var(--lmn-table-accent-ink, var(--accent-ink)); box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control)); }
+.expand-btn.open { transform: rotate(90deg); color: var(--lmn-table-accent-ink, var(--accent-ink)); box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
 /* Expanded row panel */
 .table tbody tr.expanded-row td {
   padding: 14px 18px;
-  border-bottom: 1px solid var(--divider);
-  background: color-mix(in oklch, var(--bg-sunken) 25%, transparent);
+  border-bottom: 1px solid var(--lmn-table-divider, var(--divider));
+  background: color-mix(in oklch, var(--lmn-table-bg-sunken, var(--bg-sunken)) 25%, transparent);
 }
 .expanded-panel {
   padding: 14px 16px;
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
-  color: var(--fg);
+  background: var(--lmn-table-bg, var(--bg));
+  box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
+  color: var(--lmn-table-fg, var(--fg));
   font-size: 13px;
 }
 /* Radio-style row selector */
@@ -2182,30 +2702,30 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: 50%;
   border: none;
   padding: 0;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-table-bg, var(--bg));
+  box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
   display: inline-flex; align-items: center; justify-content: center;
   cursor: pointer;
   transition: box-shadow var(--dur-fast) var(--ease);
 }
 .table .row-check .radio-dot:disabled { opacity: 0.5; cursor: not-allowed; }
 .table .row-check .radio-dot.checked {
-  box-shadow: var(--neu-shadow-control);
+  box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control));
 }
 .table .row-check .radio-dot.checked::after {
   content: "";
   width: 8px; height: 8px;
   border-radius: 50%;
-  background: var(--accent);
+  background: var(--lmn-table-accent, var(--accent));
 }
 /* Filter button on header */
 .table th.filterable .filter-ind {
   display: inline-flex;
   width: 18px; height: 18px;
   border-radius: 5px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
-  color: var(--fg-subtle);
+  background: var(--lmn-table-bg, var(--bg));
+  box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle));
+  color: var(--lmn-table-fg-subtle, var(--fg-subtle));
   align-items: center; justify-content: center;
   margin-left: 6px;
   cursor: pointer;
@@ -2214,19 +2734,19 @@ input, textarea, select { font-family: inherit; color: inherit; }
   padding: 0;
   transition: color var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
 }
-.table th.filterable .filter-ind:hover { color: var(--fg); }
+.table th.filterable .filter-ind:hover { color: var(--lmn-table-fg, var(--fg)); }
 .table th.filterable .filter-ind.active {
-  color: var(--accent-ink);
-  box-shadow: var(--neu-shadow-inset);
+  color: var(--lmn-table-accent-ink, var(--accent-ink));
+  box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset));
 }
 /* Filter popover panel (portaled to body) */
 .table-filter-panel {
   z-index: 1001;
   min-width: 200px;
   max-width: 260px;
-  background: var(--bg);
+  background: var(--lmn-table-bg, var(--bg));
   border-radius: var(--r-md);
-  box-shadow: var(--neu-shadow-float);
+  box-shadow: var(--lmn-table-neu-shadow-float, var(--neu-shadow-float));
   padding: 10px;
   animation: menuIn var(--dur) var(--ease);
 }
@@ -2245,12 +2765,12 @@ input, textarea, select { font-family: inherit; color: inherit; }
   padding: 6px 8px;
   border-radius: var(--r-sm);
   font-size: 13px;
-  color: var(--fg);
+  color: var(--lmn-table-fg, var(--fg));
   cursor: pointer;
   transition: background var(--dur-fast) var(--ease);
 }
 .table-filter-item:hover {
-  background: color-mix(in oklch, var(--accent-soft) 40%, transparent);
+  background: color-mix(in oklch, var(--lmn-table-accent-soft, var(--accent-soft)) 40%, transparent);
 }
 .table-filter-actions {
   display: flex;
@@ -2258,24 +2778,35 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 6px;
   margin-top: 6px;
   padding-top: 8px;
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-table-divider, var(--divider));
 }
 .table-filter-actions .tf-btn {
   border: none;
   padding: 6px 12px;
   border-radius: var(--r-sm);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-table-bg, var(--bg));
+  box-shadow: var(--lmn-table-neu-shadow-control, var(--neu-shadow-control));
   font-size: 12px;
   font-family: inherit;
-  color: var(--fg);
+  color: var(--lmn-table-fg, var(--fg));
   cursor: pointer;
   transition: box-shadow var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
 }
-.table-filter-actions .tf-btn:hover { box-shadow: var(--neu-shadow-inset); }
-.table-filter-actions .tf-btn.primary { color: var(--accent-ink); font-weight: 600; }
-.table-filter-actions .tf-btn.ghost { color: var(--fg-muted); box-shadow: var(--neu-shadow-subtle); }
-.table-filter-actions .tf-btn.ghost:hover { box-shadow: var(--neu-shadow-inset); }
+.table-filter-actions .tf-btn:hover { box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
+.table-filter-actions .tf-btn.primary { color: var(--lmn-table-accent-ink, var(--accent-ink)); font-weight: 600; }
+.table-filter-actions .tf-btn.ghost { color: var(--lmn-table-fg-muted, var(--fg-muted)); box-shadow: var(--lmn-table-neu-shadow-subtle, var(--neu-shadow-subtle)); }
+.table-filter-actions .tf-btn.ghost:hover { box-shadow: var(--lmn-table-neu-shadow-inset, var(--neu-shadow-inset)); }
+.table-sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
 /* Built-in pagination bar */
 .table-pagination {
   margin-top: 12px;
@@ -2283,8 +2814,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
 /* ============ TablePro ============ */
 .table-card {
   border-radius: var(--r-lg);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-table-pro-bg, var(--bg));
+  box-shadow: var(--lmn-table-pro-neu-shadow-control, var(--neu-shadow-control));
   overflow: hidden;
 }
 .table-card .table-wrap { background: transparent; box-shadow: none; border-radius: 0; }
@@ -2292,7 +2823,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .table-card .table-pagination {
   margin-top: 0;
   padding: 6px 16px;
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-table-pro-divider, var(--divider));
   background: transparent;
 }
 .table-toolbar {
@@ -2300,7 +2831,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   align-items: center;
   gap: var(--gap-3);
   padding: 14px 16px;
-  border-bottom: 1px solid var(--divider);
+  border-bottom: 1px solid var(--lmn-table-pro-divider, var(--divider));
 }
 .table-toolbar .table-title {
   font-size: 14px;
@@ -2322,7 +2853,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .table-footer {
   padding: 10px 16px;
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-table-pro-divider, var(--divider));
   background: transparent;
 }
 /* ============ Pagination ============ */
@@ -2332,7 +2863,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   justify-content: space-between;
   padding: 12px 14px;
   font-size: 12px;
-  color: var(--fg-muted);
+  color: var(--lmn-pagination-fg-muted, var(--fg-muted));
   gap: 12px;
   flex-wrap: wrap;
 }
@@ -2342,24 +2873,24 @@ input, textarea, select { font-family: inherit; color: inherit; }
   padding: 0 10px;
   border: none;
   border-radius: var(--r-sm);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-pagination-bg, var(--bg));
+  box-shadow: var(--lmn-pagination-neu-shadow-control, var(--neu-shadow-control));
   display: inline-flex; align-items: center; justify-content: center;
   cursor: pointer;
   font-size: 12px;
   font-family: inherit;
   font-variant-numeric: tabular-nums;
-  color: var(--fg);
+  color: var(--lmn-pagination-fg, var(--fg));
   transition: all var(--dur-fast) var(--ease);
 }
-.pagination .pg:hover { color: var(--accent-ink); }
+.pagination .pg:hover { color: var(--lmn-pagination-accent-ink, var(--accent-ink)); }
 .pagination .pg.active {
-  box-shadow: var(--neu-shadow-inset);
-  color: var(--accent-ink);
+  box-shadow: var(--lmn-pagination-neu-shadow-inset, var(--neu-shadow-inset));
+  color: var(--lmn-pagination-accent-ink, var(--accent-ink));
   font-weight: 700;
 }
-.pagination .pg.disabled { color: var(--fg-subtle); cursor: not-allowed; box-shadow: var(--neu-shadow-subtle); }
-.pagination .ellipsis { padding: 0 4px; color: var(--fg-subtle); }
+.pagination .pg.disabled { color: var(--lmn-pagination-fg-subtle, var(--fg-subtle)); cursor: not-allowed; box-shadow: var(--lmn-pagination-neu-shadow-subtle, var(--neu-shadow-subtle)); }
+.pagination .ellipsis { padding: 0 4px; color: var(--lmn-pagination-fg-subtle, var(--fg-subtle)); }
 /* size changer — compact Select inline with the page buttons */
 .pagination .pg-size-changer { margin-left: 8px; min-width: 108px; }
 /* quick jumper */
@@ -2368,36 +2899,37 @@ input, textarea, select { font-family: inherit; color: inherit; }
   align-items: center;
   gap: 6px;
   margin-left: 8px;
-  color: var(--fg-muted);
+  color: var(--lmn-pagination-fg-muted, var(--fg-muted));
   font-size: 12px;
 }
-.pagination .pg-jumper-label { color: var(--fg-muted); }
+.pagination .pg-jumper-label { color: var(--lmn-pagination-fg-muted, var(--fg-muted)); }
 .pagination .pg-jumper-input {
-  width: 44px;
-  height: 28px;
-  padding: 0 8px;
-  border: none;
-  border-radius: var(--r-sm);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
-  color: var(--fg);
-  font-family: inherit;
-  font-size: 12px;
+  width: 52px;
+}
+.pagination .pg-jumper-input .input {
   font-variant-numeric: tabular-nums;
   text-align: center;
-  outline: none;
-  transition: box-shadow var(--dur-fast) var(--ease);
 }
-.pagination .pg-jumper-input:focus-visible {
-  box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-glow);
+@media (max-width: 480px) {
+  .pagination {
+    align-items: flex-start;
+    padding-inline: 8px;
+  }
+  .pagination .pg-controls {
+    flex-wrap: wrap;
+  }
+  .pagination .pg-size-changer,
+  .pagination .pg-jumper {
+    margin-left: 0;
+  }
 }
 /* ============ List ============ */
 .list {
   display: flex;
   flex-direction: column;
-  background: var(--bg);
+  background: var(--lmn-list-bg, var(--bg));
   border-radius: var(--r-lg);
-  box-shadow: var(--neu-shadow-inset);
+  box-shadow: var(--lmn-list-neu-shadow-inset, var(--neu-shadow-inset));
   padding: 8px;
 }
 .list-item {
@@ -2408,15 +2940,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: var(--r-sm);
   transition: all var(--dur-fast) var(--ease);
 }
+.list-item-trigger {
+  display: flex;
+  align-items: center;
+  gap: 12px;
+  flex: 1;
+  min-width: 0;
+}
+button.list-item-trigger {
+  border: 0;
+  padding: 0;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  text-align: left;
+  cursor: pointer;
+}
 .list-item.clickable { cursor: pointer; }
-.list-item.clickable:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
-.list-item.selected { box-shadow: var(--neu-shadow-control); background: var(--bg); }
-.list.with-dividers .list-item + .list-item { border-top: 1px solid var(--divider); border-radius: 0; }
+.list-item.clickable:hover { background: var(--lmn-list-bg, var(--bg)); box-shadow: var(--lmn-list-neu-shadow-subtle, var(--neu-shadow-subtle)); }
+.list-item.selected { box-shadow: var(--lmn-list-neu-shadow-control, var(--neu-shadow-control)); background: var(--lmn-list-bg, var(--bg)); }
+.list.with-dividers .list-item + .list-item { border-top: 1px solid var(--lmn-list-divider, var(--divider)); border-radius: 0; }
 .list-item-meta { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
 .list-item-title { font-size: 13px; font-weight: 500; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
-.list-item-desc  { font-size: 12px; color: var(--fg-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
+.list-item-desc  { font-size: 12px; color: var(--lmn-list-fg-muted, var(--fg-muted)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
 .list-item-actions { display: flex; gap: 6px; align-items: center; flex-shrink: 0; }
-.list-item-avatar { display: inline-flex; align-items: center; justify-content: center; color: var(--fg-muted); flex-shrink: 0; }
+.list-item-avatar { display: inline-flex; align-items: center; justify-content: center; color: var(--lmn-list-fg-muted, var(--fg-muted)); flex-shrink: 0; }
 /* ============ Spin ============ */
 .spin {
   width: 14px;
@@ -2427,17 +2975,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
   animation: spin 0.8s linear infinite;
   display: inline-block;
 }
-.spin.accent  { color: var(--accent); }
-.spin.success { color: var(--success); }
-.spin.warning { color: var(--warning); }
-.spin.danger  { color: var(--danger); }
+.spin.accent  { color: var(--lmn-spin-accent, var(--accent)); }
+.spin.success { color: var(--lmn-spin-success, var(--success)); }
+.spin.warning { color: var(--lmn-spin-warning, var(--warning)); }
+.spin.danger  { color: var(--lmn-spin-danger, var(--danger)); }
 .spin.ring {
   position: relative;
   display: inline-block;
   border: none;
   border-radius: 50%;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-spin-bg, var(--bg));
+  box-shadow: var(--lmn-spin-neu-shadow-inset, var(--neu-shadow-inset));
   animation: none;
 }
 .spin.ring::before {
@@ -2479,9 +3027,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   height: 0.4em;
   border-radius: 999px;
   background: radial-gradient(circle at 32% 28%,
-    color-mix(in oklch, currentColor 40%, var(--bg)),
+    color-mix(in oklch, currentColor 40%, var(--lmn-spin-bg, var(--bg))),
     currentColor 62%,
-    color-mix(in oklch, currentColor 82%, var(--fg)) 100%);
+    color-mix(in oklch, currentColor 82%, var(--lmn-spin-fg, var(--fg))) 100%);
   box-shadow:
     0 0.06em 0.14em color-mix(in oklch, currentColor 45%, transparent),
     0 0 0.35em color-mix(in oklch, currentColor 50%, transparent);
@@ -2498,15 +3046,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
   display: inline-flex;
   align-items: center;
   gap: 8px;
-  color: var(--fg-muted);
+  color: var(--lmn-spin-fg-muted, var(--fg-muted));
 }
 .spin-label { font-size: 12px; }
+@media (prefers-reduced-motion: reduce) {
+  .spin,
+  .spin.ring::before,
+  .spin.dots i { animation: none; }
+}
 /* ============ Empty ============ */
 .empty {
   padding: 60px 20px;
   display: grid; place-items: center;
   gap: 12px;
-  color: var(--fg-muted);
+  color: var(--lmn-empty-fg-muted, var(--fg-muted));
   text-align: center;
 }
 .empty.sm { padding: 28px 16px; gap: 8px; }
@@ -2521,25 +3074,25 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .empty-ico {
   width: 56px; height: 56px;
   border-radius: var(--r-lg);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-empty-bg, var(--bg));
+  box-shadow: var(--lmn-empty-neu-shadow-inset, var(--neu-shadow-inset));
   display: grid; place-items: center;
-  color: var(--fg-subtle);
+  color: var(--lmn-empty-fg-subtle, var(--fg-subtle));
 }
-.empty-title { font-size: 14px; font-weight: 600; color: var(--fg); }
+.empty-title { font-size: 14px; font-weight: 600; color: var(--lmn-empty-fg, var(--fg)); }
 .empty-desc  { font-size: 12px; }
 .empty-action { margin-top: 8px; }
 /* ============ Skeleton ============ */
 .skeleton {
   display: block;
-  background: color-mix(in oklch, var(--accent-soft) 55%, var(--bg-sunken));
+  background: color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 55%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken)));
   border-radius: var(--r-sm);
 }
 .skeleton.wave {
   background: linear-gradient(90deg,
-    color-mix(in oklch, var(--accent-soft) 35%, var(--bg-sunken)),
-    color-mix(in oklch, var(--accent-soft) 75%, var(--bg-sunken)),
-    color-mix(in oklch, var(--accent-soft) 35%, var(--bg-sunken)));
+    color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 35%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken))),
+    color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 75%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken))),
+    color-mix(in oklch, var(--lmn-skeleton-accent-soft, var(--accent-soft)) 35%, var(--lmn-skeleton-bg-sunken, var(--bg-sunken))));
   background-size: 200% 100%;
   animation: skel-wave 1.4s ease-in-out infinite;
 }
@@ -2568,6 +3121,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .skeleton-box .skeleton-row {
   display: block;
 }
+@media (prefers-reduced-motion: reduce) {
+  .skeleton.wave,
+  .skeleton.pulse { animation: none; }
+}
 /* ============ DatePicker ============ */
 .date-picker {
   position: relative;
@@ -2586,7 +3143,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 100%;
 }
 .date-picker.open .input-wrap {
-  box-shadow: var(--neu-shadow-inset);
+  box-shadow: var(--lmn-date-picker-neu-shadow-inset, var(--neu-shadow-inset));
 }
 .date-picker-panel {
   position: fixed;
@@ -2594,8 +3151,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 344px;
   padding: var(--gap-3);
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-float);
+  background: var(--lmn-date-picker-bg, var(--bg));
+  box-shadow: var(--lmn-date-picker-neu-shadow-float, var(--neu-shadow-float));
   animation: menuIn var(--dur) var(--ease);
 }
 .date-picker-panel .calendar {
@@ -2613,7 +3170,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: var(--gap-2);
   margin-top: var(--gap-3);
   padding-top: var(--gap-3);
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-date-picker-divider, var(--divider));
 }
 .date-picker-footer-spacer {
   flex: 1;
@@ -2637,7 +3194,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 100%;
 }
 .date-time-picker.open .input-wrap {
-  box-shadow: var(--neu-shadow-inset);
+  box-shadow: var(--lmn-date-time-picker-neu-shadow-inset, var(--neu-shadow-inset));
 }
 .date-time-picker-panel {
   position: fixed;
@@ -2645,10 +3202,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 476px;
   padding: var(--gap-2) var(--gap-3);
   border-radius: var(--r-md);
-  background: var(--bg);
+  background: var(--lmn-date-time-picker-bg, var(--bg));
   box-shadow:
-    0 calc(var(--shadow-offset) * 1.1) calc(var(--shadow-blur) * 1.3) color-mix(in oklch, var(--shadow-dark) 72%, transparent),
-    inset 0 0 0 1px var(--divider);
+    0 calc(var(--lmn-date-time-picker-shadow-offset, var(--shadow-offset)) * 1.1) calc(var(--lmn-date-time-picker-shadow-blur, var(--shadow-blur)) * 1.3) color-mix(in oklch, var(--lmn-date-time-picker-shadow-dark, var(--shadow-dark)) 72%, transparent),
+    inset 0 0 0 1px var(--lmn-date-time-picker-divider, var(--divider));
   animation: menuIn var(--dur) var(--ease);
 }
 .date-time-picker-body {
@@ -2706,8 +3263,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   grid-template-columns: repeat(3, minmax(0, 1fr));
   padding: 8px;
   border-radius: var(--r-sm);
-  background: var(--bg);
-  box-shadow: inset 0 0 0 1px var(--divider);
+  background: var(--lmn-date-time-picker-bg, var(--bg));
+  box-shadow: inset 0 0 0 1px var(--lmn-date-time-picker-divider, var(--divider));
   overflow: hidden;
 }
 .date-time-picker-panel.without-second .date-time-picker-time-columns {
@@ -2717,7 +3274,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   min-width: 0;
 }
 .date-time-picker-time-column + .date-time-picker-time-column {
-  border-left: 1px solid var(--divider);
+  border-left: 1px solid var(--lmn-date-time-picker-divider, var(--divider));
 }
 .date-time-picker-time-label {
   height: 20px;
@@ -2725,7 +3282,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   place-items: center;
   font-size: var(--fs-xs);
   font-weight: 700;
-  color: var(--fg-muted);
+  color: var(--lmn-date-time-picker-fg-muted, var(--fg-muted));
 }
 .date-time-picker-time-list {
   display: flex;
@@ -2750,7 +3307,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border: none;
   border-radius: 7px;
   background: transparent;
-  color: var(--fg);
+  color: var(--lmn-date-time-picker-fg, var(--fg));
   cursor: pointer;
   font: 600 var(--fs-md) var(--font-mono);
   transition:
@@ -2759,17 +3316,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
     box-shadow var(--dur-fast) var(--ease);
 }
 .date-time-picker-time-option:hover:not(:disabled) {
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  color: var(--lmn-date-time-picker-accent-ink, var(--accent-ink));
+  background: var(--lmn-date-time-picker-bg, var(--bg));
+  box-shadow: var(--lmn-date-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .date-time-picker-time-option.selected {
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  color: var(--lmn-date-time-picker-accent-ink, var(--accent-ink));
+  background: var(--lmn-date-time-picker-bg, var(--bg));
+  box-shadow: var(--lmn-date-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .date-time-picker-time-option:disabled {
-  color: var(--fg-subtle);
+  color: var(--lmn-date-time-picker-fg-subtle, var(--fg-subtle));
   cursor: not-allowed;
   opacity: 0.45;
 }
@@ -2779,7 +3336,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: var(--gap-2);
   margin-top: var(--gap-2);
   padding-top: var(--gap-2);
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-date-time-picker-divider, var(--divider));
 }
 .date-time-picker-footer-spacer {
   flex: 1;
@@ -2813,10 +3370,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 /* ============ Calendar ============ */
 .calendar {
-  background: var(--bg);
+  background: var(--lmn-calendar-bg, var(--bg));
   border-radius: var(--r-lg);
   padding: var(--gap-4);
-  box-shadow: var(--neu-shadow-panel);
+  box-shadow: var(--lmn-calendar-neu-shadow-panel, var(--neu-shadow-panel));
   width: 320px;
 }
 .calendar-head {
@@ -2827,11 +3384,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-size: 14px; font-weight: 600;
   display: inline-flex; align-items: center; gap: 8px;
   cursor: pointer; padding: 6px 10px; border-radius: var(--r-sm);
-  border: none; background: transparent; color: var(--fg);
+  border: none; background: transparent; color: var(--lmn-calendar-fg, var(--fg));
   font-family: inherit;
   transition: all var(--dur-fast) var(--ease);
 }
-.calendar-title:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
+.calendar-title:hover { background: var(--lmn-calendar-bg, var(--bg)); box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle)); }
 .calendar-title.static {
   cursor: default;
 }
@@ -2849,7 +3406,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border-radius: var(--r-sm);
   padding: 6px 8px;
   background: transparent;
-  color: var(--fg);
+  color: var(--lmn-calendar-fg, var(--fg));
   cursor: pointer;
   font: 600 14px var(--font-sans);
   transition:
@@ -2858,9 +3415,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
     box-shadow var(--dur-fast) var(--ease);
 }
 .calendar-title-part:hover {
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  color: var(--lmn-calendar-accent-ink, var(--accent-ink));
+  background: var(--lmn-calendar-bg, var(--bg));
+  box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .calendar-grid {
   display: grid;
@@ -2871,7 +3428,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   text-align: center;
   font-size: 10px;
   font-weight: 600;
-  color: var(--fg-subtle);
+  color: var(--lmn-calendar-fg-subtle, var(--fg-subtle));
   text-transform: uppercase;
   letter-spacing: 0.06em;
   padding: 8px 0;
@@ -2881,7 +3438,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   aspect-ratio: 1;
   display: grid; place-items: center;
   font-size: 12px;
-  color: var(--fg);
+  color: var(--lmn-calendar-fg, var(--fg));
   border-radius: var(--r-sm);
   cursor: pointer;
   border: none;
@@ -2889,22 +3446,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-family: inherit;
   transition: all var(--dur-fast) var(--ease);
 }
-.calendar-cell.out { color: var(--fg-subtle); opacity: 0.5; }
-.calendar-cell:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
-.calendar-cell.today { font-weight: 700; color: var(--accent-ink); }
+.calendar-cell.out { color: var(--lmn-calendar-fg-subtle, var(--fg-subtle)); opacity: 0.5; }
+.calendar-cell:hover { background: var(--lmn-calendar-bg, var(--bg)); box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle)); }
+.calendar-cell.today { font-weight: 700; color: var(--lmn-calendar-accent-ink, var(--accent-ink)); }
 .calendar-cell.today::after {
   content: ""; position: absolute; bottom: 4px; left: 50%;
   width: 4px; height: 4px; border-radius: 999px;
-  background: var(--accent);
+  background: var(--lmn-calendar-accent, var(--accent));
   transform: translateX(-50%);
 }
 .calendar-cell.selected {
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
-  color: var(--accent-ink);
+  background: var(--lmn-calendar-bg, var(--bg));
+  box-shadow: var(--lmn-calendar-neu-shadow-inset, var(--neu-shadow-inset));
+  color: var(--lmn-calendar-accent-ink, var(--accent-ink));
   font-weight: 600;
 }
-.calendar-cell.disabled { color: var(--fg-subtle); opacity: 0.4; cursor: not-allowed; }
+.calendar-cell.disabled { color: var(--lmn-calendar-fg-subtle, var(--fg-subtle)); opacity: 0.4; cursor: not-allowed; }
 .calendar-cell.disabled:hover { background: transparent; box-shadow: none; }
 .calendar-select-grid {
   display: grid;
@@ -2918,7 +3475,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border: none;
   border-radius: var(--r-sm);
   background: transparent;
-  color: var(--fg);
+  color: var(--lmn-calendar-fg, var(--fg));
   cursor: pointer;
   font: 600 var(--fs-md) var(--font-mono);
   transition:
@@ -2927,17 +3484,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
     box-shadow var(--dur-fast) var(--ease);
 }
 .calendar-select-option:hover:not(:disabled) {
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  color: var(--lmn-calendar-accent-ink, var(--accent-ink));
+  background: var(--lmn-calendar-bg, var(--bg));
+  box-shadow: var(--lmn-calendar-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .calendar-select-option.selected {
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  color: var(--lmn-calendar-accent-ink, var(--accent-ink));
+  background: var(--lmn-calendar-bg, var(--bg));
+  box-shadow: var(--lmn-calendar-neu-shadow-inset, var(--neu-shadow-inset));
 }
 .calendar-select-option.disabled {
-  color: var(--fg-subtle);
+  color: var(--lmn-calendar-fg-subtle, var(--fg-subtle));
   cursor: not-allowed;
   opacity: 0.4;
 }
@@ -2959,7 +3516,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 100%;
 }
 .time-picker.open .input-wrap {
-  box-shadow: var(--neu-shadow-inset);
+  box-shadow: var(--lmn-time-picker-neu-shadow-inset, var(--neu-shadow-inset));
 }
 .time-picker-panel {
   position: fixed;
@@ -2967,10 +3524,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 300px;
   padding: 10px;
   border-radius: var(--r-md);
-  background: var(--bg);
+  background: var(--lmn-time-picker-bg, var(--bg));
   box-shadow:
-    0 calc(var(--shadow-offset) * 1.1) calc(var(--shadow-blur) * 1.3) color-mix(in oklch, var(--shadow-dark) 72%, transparent),
-    inset 0 0 0 1px var(--divider);
+    0 calc(var(--lmn-time-picker-shadow-offset, var(--shadow-offset)) * 1.1) calc(var(--lmn-time-picker-shadow-blur, var(--shadow-blur)) * 1.3) color-mix(in oklch, var(--lmn-time-picker-shadow-dark, var(--shadow-dark)) 72%, transparent),
+    inset 0 0 0 1px var(--lmn-time-picker-divider, var(--divider));
   animation: menuIn var(--dur) var(--ease);
 }
 .time-picker-panel.without-second {
@@ -2983,12 +3540,12 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 0;
   padding: 8px;
   border-radius: var(--r-sm);
-  background: var(--bg);
-  box-shadow: inset 0 0 0 1px var(--divider);
+  background: var(--lmn-time-picker-bg, var(--bg));
+  box-shadow: inset 0 0 0 1px var(--lmn-time-picker-divider, var(--divider));
   overflow: hidden;
 }
 .time-picker-column + .time-picker-column {
-  border-left: 1px solid var(--divider);
+  border-left: 1px solid var(--lmn-time-picker-divider, var(--divider));
 }
 .time-picker-panel.without-second .time-picker-columns {
   grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -3004,7 +3561,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   place-items: center;
   font-size: var(--fs-xs);
   font-weight: 700;
-  color: var(--fg-muted);
+  color: var(--lmn-time-picker-fg-muted, var(--fg-muted));
 }
 .time-picker-list {
   display: flex;
@@ -3034,7 +3591,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border: none;
   border-radius: 7px;
   background: transparent;
-  color: var(--fg);
+  color: var(--lmn-time-picker-fg, var(--fg));
   cursor: pointer;
   font: 600 var(--fs-md) var(--font-mono);
   transition:
@@ -3043,17 +3600,17 @@ input, textarea, select { font-family: inherit; color: inherit; }
     box-shadow var(--dur-fast) var(--ease);
 }
 .time-picker-option:hover:not(:disabled) {
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  color: var(--lmn-time-picker-accent-ink, var(--accent-ink));
+  background: var(--lmn-time-picker-bg, var(--bg));
+  box-shadow: var(--lmn-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .time-picker-option.selected {
-  background: var(--bg);
-  color: var(--accent-ink);
-  box-shadow: var(--neu-shadow-subtle);
+  background: var(--lmn-time-picker-bg, var(--bg));
+  color: var(--lmn-time-picker-accent-ink, var(--accent-ink));
+  box-shadow: var(--lmn-time-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .time-picker-option:disabled {
-  color: var(--fg-subtle);
+  color: var(--lmn-time-picker-fg-subtle, var(--fg-subtle));
   cursor: not-allowed;
   opacity: 0.45;
 }
@@ -3063,7 +3620,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 6px;
   margin-top: 8px;
   padding: 8px 0 0;
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-time-picker-divider, var(--divider));
 }
 .time-picker-footer-spacer {
   flex: 1;
@@ -3077,9 +3634,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   display: inline-block;
   position: relative;
   border-radius: var(--r-md);
-  background: var(--bg);
+  background: var(--lmn-image-bg, var(--bg));
   padding: 6px;
-  box-shadow: var(--neu-shadow-control);
+  box-shadow: var(--lmn-image-neu-shadow-control, var(--neu-shadow-control));
   overflow: hidden;
   line-height: 0;
 }
@@ -3099,8 +3656,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   position: relative;
   overflow: hidden;
   border-radius: calc(var(--r-md) - 4px);
-  box-shadow: var(--neu-shadow-inset);
-  background: var(--bg-sunken);
+  box-shadow: var(--lmn-image-neu-shadow-inset, var(--neu-shadow-inset));
+  background: var(--lmn-image-bg-sunken, var(--bg-sunken));
 }
 .n-image.raw .n-image-frame {
   border-radius: 0;
@@ -3123,11 +3680,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .n-image-placeholder {
   position: absolute; inset: 0;
   display: grid; place-items: center;
-  color: var(--fg-subtle);
+  color: var(--lmn-image-fg-subtle, var(--fg-subtle));
   background:
     repeating-linear-gradient(45deg,
       transparent 0 10px,
-      color-mix(in oklch, var(--fg-subtle) 8%, transparent) 10px 11px);
+      color-mix(in oklch, var(--lmn-image-fg-subtle, var(--fg-subtle)) 8%, transparent) 10px 11px);
   transition: opacity var(--dur) var(--ease);
 }
 .n-image-placeholder.loaded { opacity: 0; pointer-events: none; }
@@ -3147,7 +3704,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   transform: translateY(-4px);
   transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
 }
-.n-image:hover .image-actions { opacity: 1; transform: translateY(0); }
+.n-image:hover .image-actions,
+.n-image:focus-within .image-actions { opacity: 1; transform: translateY(0); }
 .image-actions .ia-btn {
   width: 26px;
   height: 26px;
@@ -3185,20 +3743,99 @@ input, textarea, select { font-family: inherit; color: inherit; }
   transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease);
   pointer-events: none;
 }
-.n-image:hover .image-hint { opacity: 1; transform: translateY(0); }
+.n-image:hover .image-hint,
+.n-image:focus-visible .image-hint { opacity: 1; transform: translateY(0); }
 .image-preview-overlay {
   position: fixed; inset: 0;
   background: var(--image-preview-mask-bg, var(--mask-bg));
   backdrop-filter: blur(16px);
   display: grid; place-items: center;
+  overflow: hidden;
+  padding: min(8vh, 72px) var(--gap-8) var(--gap-8);
   z-index: 500;
   animation: fadeIn var(--dur) var(--ease);
 }
-.image-preview-overlay img {
+.image-preview-overlay:focus {
+  outline: none;
+}
+.image-preview-toolbar {
+  --image-preview-toolbar-ink: color-mix(in oklch, var(--lmn-image-accent, var(--accent)) 42%, var(--lmn-image-fg-muted, var(--fg-muted)));
+  --image-preview-toolbar-ink-hover: color-mix(in oklch, var(--lmn-image-accent, var(--accent)) 48%, var(--lmn-image-fg, var(--fg)));
+  position: absolute;
+  top: var(--gap-5);
+  left: 50%;
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  gap: var(--gap-2);
+  max-width: min(calc(100vw - 32px), 720px);
+  padding: 6px;
+  overflow-x: auto;
+  color: var(--image-preview-toolbar-ink);
+  border: 1px solid color-mix(in oklch, var(--lmn-image-accent, var(--accent)) 14%, var(--lmn-image-border, var(--border)));
+  border-radius: var(--r-pill);
+  background: color-mix(in oklch, var(--lmn-image-bg-raised, var(--bg-raised)) 92%, var(--lmn-image-accent-soft, var(--accent-soft)));
+  box-shadow:
+    var(--lmn-image-neu-float, var(--neu-float)),
+    0 0 0 1px color-mix(in oklch, var(--lmn-image-accent-glow, var(--accent-glow)) 22%, transparent);
+  backdrop-filter: blur(18px) saturate(1.2);
+  transform: translateX(-50%);
+}
+.image-preview-toolbar .btn {
+  flex: 0 0 auto;
+}
+.image-preview-toolbar .btn.ghost {
+  color: var(--image-preview-toolbar-ink);
+}
+.image-preview-toolbar .btn.ghost:hover {
+  color: var(--image-preview-toolbar-ink-hover);
+  background: color-mix(in oklch, var(--lmn-image-accent-soft, var(--accent-soft)) 36%, var(--lmn-image-bg, var(--bg)));
+  box-shadow: var(--lmn-image-neu-shadow-subtle, var(--neu-shadow-subtle));
+}
+.image-preview-toolbar .btn.ghost:active,
+.image-preview-toolbar .btn.ghost.pressed {
+  color: var(--image-preview-toolbar-ink-hover);
+  background: color-mix(in oklch, var(--lmn-image-accent-soft, var(--accent-soft)) 48%, var(--lmn-image-bg, var(--bg)));
+  box-shadow: var(--lmn-image-neu-shadow-inset-strong, var(--neu-shadow-inset-strong));
+}
+.image-preview-scale {
+  min-width: 48px;
+  color: var(--image-preview-toolbar-ink);
+  font-family: var(--font-mono);
+  font-size: var(--fs-sm);
+  font-weight: 500;
+  line-height: 1;
+  text-align: center;
+}
+.image-preview-ratio {
+  min-width: 46px;
+  padding-inline: 10px;
+  font-family: var(--font-mono);
+}
+.image-preview-toolbar-slot {
+  display: inline-flex;
+  flex: 0 0 auto;
+  align-items: center;
+  gap: var(--gap-2);
+}
+.image-preview-img {
   max-width: 80vw;
   max-height: 80vh;
   border-radius: var(--r-lg);
-  box-shadow: var(--neu-shadow-float);
+  box-shadow: var(--lmn-image-neu-shadow-float, var(--neu-shadow-float));
+  transform-origin: center;
+  transition: transform var(--dur-fast) var(--ease);
+  user-select: none;
+  will-change: transform;
+}
+@media (max-width: 640px) {
+  .image-preview-overlay {
+    padding: 76px var(--gap-4) var(--gap-4);
+  }
+  .image-preview-toolbar {
+    top: var(--gap-4);
+    border-radius: var(--r-lg);
+  }
 }
 /* ============ SpriteImage / LayeredImage ============ */
 .n-sprite-image,
@@ -3206,9 +3843,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   display: inline-block;
   position: relative;
   border-radius: var(--r-sm);
-  background: var(--bg);
+  background: var(--lmn-image-bg, var(--bg));
   padding: 6px;
-  box-shadow: var(--neu-shadow-control);
+  box-shadow: var(--lmn-image-neu-shadow-control, var(--neu-shadow-control));
   overflow: hidden;
   line-height: 0;
 }
@@ -3229,8 +3866,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 100%;
   overflow: hidden;
   border-radius: var(--r-sm);
-  background: var(--bg-sunken);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-image-bg-sunken, var(--bg-sunken));
+  box-shadow: var(--lmn-image-neu-shadow-inset, var(--neu-shadow-inset));
 }
 .n-sprite-image.raw .n-sprite-image-frame,
 .n-layered-image.raw .n-layered-image-frame {
@@ -3267,8 +3904,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   height: var(--ctrl-h);
   padding: 0 36px 0 var(--ctrl-pad-x);
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-cascader-bg, var(--bg));
+  box-shadow: var(--lmn-cascader-neu-shadow-control, var(--neu-shadow-control));
   display: inline-flex;
   align-items: center;
   font-size: 13px;
@@ -3276,11 +3913,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
   cursor: pointer;
   position: relative;
   border: none;
-  color: var(--fg);
+  color: var(--lmn-cascader-fg, var(--fg));
   text-align: left;
 }
-.cascader-trigger.placeholder { color: var(--fg-subtle); }
-.cascader.open .cascader-trigger { box-shadow: var(--neu-shadow-inset); color: var(--accent-ink); }
+.cascader-trigger.placeholder { color: var(--lmn-cascader-fg-subtle, var(--fg-subtle)); }
+.cascader-value {
+  flex: 1;
+  min-width: 0;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.cascader.open .cascader-trigger { box-shadow: var(--lmn-cascader-neu-shadow-inset, var(--neu-shadow-inset)); color: var(--lmn-cascader-accent-ink, var(--accent-ink)); }
 .cascader-clear {
   position: absolute;
   right: 30px;
@@ -3289,25 +3933,27 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 20px;
   height: 20px;
   border-radius: 999px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-cascader-bg, var(--bg));
+  box-shadow: var(--lmn-cascader-neu-shadow-control, var(--neu-shadow-control));
   display: inline-grid;
   place-items: center;
-  color: var(--fg-subtle);
+  color: var(--lmn-cascader-fg-subtle, var(--fg-subtle));
   opacity: 0;
   transition: all var(--dur-fast) var(--ease);
 }
 .cascader:hover .cascader-clear { opacity: 1; }
-.cascader-clear:hover { color: var(--accent-ink); box-shadow: var(--neu-shadow-inset); }
+.cascader-clear:hover { color: var(--lmn-cascader-accent-ink, var(--accent-ink)); box-shadow: var(--lmn-cascader-neu-shadow-inset, var(--neu-shadow-inset)); }
 .cascader-panel {
   z-index: 1000;
   display: flex;
-  background: var(--bg);
+  background: var(--lmn-cascader-bg, var(--bg));
   border-radius: var(--r-md);
-  box-shadow: var(--neu-shadow-float);
+  box-shadow: var(--lmn-cascader-neu-shadow-float, var(--neu-shadow-float));
   padding: 6px;
   animation: menuIn var(--dur) var(--ease);
   gap: 4px;
+  max-width: calc(100vw - 16px);
+  overflow-x: auto;
 }
 .cascader-panel.with-search {
   flex-direction: column;
@@ -3319,20 +3965,20 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .cascader-search {
   padding: 4px 2px 8px;
-  border-bottom: 1px solid var(--divider);
+  border-bottom: 1px solid var(--lmn-cascader-divider, var(--divider));
 }
 .cascader-search-list {
   display: flex;
   flex-direction: column;
   gap: 4px;
-  max-height: 260px;
+  max-height: var(--cascader-list-height, 280px);
   overflow-y: auto;
   padding: 4px;
 }
 .cascader-search-item {
   border: none;
   background: transparent;
-  color: var(--fg);
+  color: var(--lmn-cascader-fg, var(--fg));
   border-radius: var(--r-sm);
   padding: 8px 10px;
   display: flex;
@@ -3344,26 +3990,26 @@ input, textarea, select { font-family: inherit; color: inherit; }
   cursor: pointer;
 }
 .cascader-search-item:hover {
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
-  color: var(--accent-ink);
+  background: var(--lmn-cascader-bg, var(--bg));
+  box-shadow: var(--lmn-cascader-neu-shadow-subtle, var(--neu-shadow-subtle));
+  color: var(--lmn-cascader-accent-ink, var(--accent-ink));
 }
-.cascader-path-sep { color: var(--fg-subtle); }
+.cascader-path-sep { color: var(--lmn-cascader-fg-subtle, var(--fg-subtle)); }
 .cascader-empty {
   padding: 24px 12px;
   text-align: center;
-  color: var(--fg-muted);
+  color: var(--lmn-cascader-fg-muted, var(--fg-muted));
   font-size: 12px;
 }
 .cascader-col {
   min-width: 160px;
-  max-height: 280px;
+  max-height: var(--cascader-list-height, 280px);
   overflow-y: auto;
   padding: 4px;
   border-radius: var(--r-sm);
 }
 .cascader-col + .cascader-col {
-  border-left: 1px solid var(--divider);
+  border-left: 1px solid var(--lmn-cascader-divider, var(--divider));
   margin-left: 2px;
   padding-left: 6px;
 }
@@ -3371,7 +4017,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   padding: 8px 10px;
   border-radius: var(--r-sm);
   font-size: 13px;
-  color: var(--fg);
+  color: var(--lmn-cascader-fg, var(--fg));
   cursor: pointer;
   display: flex;
   align-items: center;
@@ -3390,27 +4036,36 @@ input, textarea, select { font-family: inherit; color: inherit; }
   line-height: 0;
   flex-shrink: 0;
 }
+.cascader-panel.custom-options .cascader-col {
+  min-width: 240px;
+}
+.cascader-item-label,
+.cascader-item-custom {
+  flex: 1;
+  min-width: 0;
+  text-align: left;
+}
 .cascader-icon img {
   display: block;
   width: 15px;
   height: 15px;
   object-fit: contain;
 }
-.cascader-item:hover { background: var(--bg); box-shadow: var(--neu-shadow-subtle); color: var(--accent-ink); }
+.cascader-item:hover { background: var(--lmn-cascader-bg, var(--bg)); box-shadow: var(--lmn-cascader-neu-shadow-subtle, var(--neu-shadow-subtle)); color: var(--lmn-cascader-accent-ink, var(--accent-ink)); }
 .cascader-item.active {
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
-  color: var(--accent-ink);
+  background: var(--lmn-cascader-bg, var(--bg));
+  box-shadow: var(--lmn-cascader-neu-shadow-inset, var(--neu-shadow-inset));
+  color: var(--lmn-cascader-accent-ink, var(--accent-ink));
   font-weight: 500;
 }
-.cascader-item .chev { margin-left: auto; color: var(--fg-subtle); display: inline-flex; }
-.cascader-item.active .chev { color: var(--accent); }
+.cascader-item .chev { margin-left: auto; color: var(--lmn-cascader-fg-subtle, var(--fg-subtle)); display: inline-flex; }
+.cascader-item.active .chev { color: var(--lmn-cascader-accent, var(--accent)); }
 /* ============================================================================
  * Typography
  * ========================================================================== */
 .typo-root {
   font-family: var(--font-sans);
-  color: var(--fg);
+  color: var(--lmn-typography-fg, var(--fg));
   line-height: 1.7;
   font-size: 14px;
 }
@@ -3421,16 +4076,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .typo-root > .typo-title:first-child { margin-top: 0; }
 /* ---- Base ---- */
 .typo {
-  color: var(--fg);
+  color: var(--lmn-typography-fg, var(--fg));
   font-family: var(--font-sans);
   word-wrap: break-word;
 }
 /* Semantic colors */
-.typo.secondary { color: var(--fg-muted); }
-.typo.success   { color: var(--success); }
-.typo.warning   { color: var(--warning); }
-.typo.danger    { color: var(--danger); }
-.typo.disabled  { color: var(--fg-subtle); cursor: not-allowed; user-select: none; }
+.typo.secondary { color: var(--lmn-typography-fg-muted, var(--fg-muted)); }
+.typo.success   { color: var(--lmn-typography-success, var(--success)); }
+.typo.warning   { color: var(--lmn-typography-warning, var(--warning)); }
+.typo.danger    { color: var(--lmn-typography-danger, var(--danger)); }
+.typo.disabled  { color: var(--lmn-typography-fg-subtle, var(--fg-subtle)); cursor: not-allowed; user-select: none; }
 /* Decorations */
 .typo.strong    { font-weight: 600; }
 .typo.italic    { font-style: italic; }
@@ -3438,7 +4093,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .typo.del       { text-decoration: line-through; text-decoration-thickness: 1.5px; }
 /* mark / code / kbd render their own elements; we still color the shell */
 .typo mark {
-  background: color-mix(in oklch, var(--warning) 35%, transparent);
+  background: color-mix(in oklch, var(--lmn-typography-warning, var(--warning)) 33%, transparent);
   color: inherit;
   padding: 0 3px;
   border-radius: 3px;
@@ -3448,9 +4103,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-size: 0.88em;
   padding: 1px 6px;
   border-radius: 5px;
-  background: var(--bg-sunken);
-  box-shadow: var(--neu-shadow-inset);
-  color: var(--accent-ink);
+  background: var(--lmn-typography-bg-sunken, var(--bg-sunken));
+  box-shadow: var(--lmn-typography-neu-shadow-inset, var(--neu-shadow-inset));
+  color: var(--lmn-typography-accent-ink, var(--accent-ink));
   margin: 0 2px;
 }
 .typo kbd {
@@ -3458,10 +4113,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-size: 0.82em;
   padding: 1px 7px;
   border-radius: 5px;
-  background: var(--bg-raised);
-  box-shadow: var(--neu-shadow-subtle);
-  border: 1px solid var(--border);
-  color: var(--fg);
+  background: var(--lmn-typography-bg-raised, var(--bg-raised));
+  box-shadow: var(--lmn-typography-neu-shadow-subtle, var(--neu-shadow-subtle));
+  border: 1px solid var(--lmn-typography-border, var(--border));
+  color: var(--lmn-typography-fg, var(--fg));
   margin: 0 2px;
   line-height: 1.4;
   display: inline-block;
@@ -3473,7 +4128,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-weight: 700;
   letter-spacing: -0.01em;
   line-height: 1.25;
-  color: var(--fg);
+  color: var(--lmn-typography-fg, var(--fg));
   margin: 0;
 }
 .typo-title.h1 { font-size: 32px; letter-spacing: -0.02em; }
@@ -3487,13 +4142,22 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-size: 14px;
   line-height: 1.75;
   margin: 0;
-  color: var(--fg);
+  color: var(--lmn-typography-fg, var(--fg));
 }
 /* ---- Text ---- */
 .typo-text { font-size: inherit; line-height: inherit; }
 /* ---- Link ---- */
+.typo-link-group {
+  display: inline-flex;
+  align-items: center;
+  max-width: 100%;
+  vertical-align: baseline;
+}
+.typo-link-group > .typo-link { min-width: 0; }
+.typo-link-group > .typo-action,
+.typo-link-group > .typo-expand { flex: 0 0 auto; }
 .typo-link {
-  color: var(--accent-ink);
+  color: var(--lmn-typography-accent-ink, var(--accent-ink));
   text-decoration: none;
   transition: color var(--dur-fast) var(--ease), text-decoration-color var(--dur-fast) var(--ease);
   cursor: pointer;
@@ -3502,14 +4166,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
   align-items: center;
   gap: 3px;
 }
-.typo-link:hover { color: var(--accent); text-decoration: underline; }
+.typo-link:hover { color: var(--lmn-typography-accent, var(--accent)); text-decoration: underline; }
 .typo-link:focus-visible {
-  outline: 2px solid var(--accent-glow);
+  outline: 2px solid var(--lmn-typography-accent-glow, var(--accent-glow));
   outline-offset: 2px;
   border-radius: 2px;
 }
 .typo-link.disabled {
-  color: var(--fg-subtle);
+  color: var(--lmn-typography-fg-subtle, var(--fg-subtle));
   cursor: not-allowed;
   pointer-events: auto;
   text-decoration: none;
@@ -3532,26 +4196,31 @@ input, textarea, select { font-family: inherit; color: inherit; }
   margin-left: 5px;
   border-radius: 6px;
   cursor: pointer;
-  color: var(--fg-subtle);
+  color: var(--lmn-typography-fg-subtle, var(--fg-subtle));
   line-height: 1;
   transition: color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), box-shadow var(--dur-fast) var(--ease);
   vertical-align: -0.18em;
   user-select: none;
+  padding: 0;
+  border: none;
+  background: transparent;
+  font: inherit;
 }
 .typo-action > svg {
   display: block;
   flex-shrink: 0;
 }
 .typo-action:hover {
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  color: var(--lmn-typography-accent-ink, var(--accent-ink));
+  background: var(--lmn-typography-bg, var(--bg));
+  box-shadow: var(--lmn-typography-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .typo-action:focus-visible {
-  outline: 2px solid var(--accent-glow);
+  outline: 2px solid var(--lmn-typography-accent-glow, var(--accent-glow));
   outline-offset: 1px;
 }
-.typo-copy.copied { color: var(--success); }
+.typo-copy.copied { color: var(--lmn-typography-success, var(--success)); }
+.typo-copy.error { color: var(--lmn-typography-danger, var(--danger)); }
 /* Editable text trigger overlays */
 .typo-edit-text-trigger {
   cursor: text;
@@ -3560,14 +4229,32 @@ input, textarea, select { font-family: inherit; color: inherit; }
   padding: 0 2px;
   margin: 0 -2px;
 }
-.typo-edit-text-trigger:hover { background: color-mix(in oklch, var(--accent) 8%, transparent); }
+.typo-edit-text-trigger:hover { background: color-mix(in oklch, var(--lmn-typography-accent, var(--accent)) 8%, transparent); }
 /* ---- Editor (input / textarea) ---- */
 .typo.editing { display: block; }
+.typo-editor-wrap {
+  display: inline-flex;
+  align-items: center;
+  gap: var(--gap-1);
+  width: 100%;
+  max-width: 100%;
+}
+.typo-editor-wrap > .typo-editor { min-width: 0; }
+.typo-enter {
+  flex: 0 0 auto;
+  margin-left: 0;
+}
+.typo.typo-link-editor-shell {
+  display: inline-flex;
+  min-width: 0;
+  flex: 1 1 auto;
+}
+.typo.typo-link-editing-anchor { display: none; }
 .typo-editor {
   font: inherit;
   color: inherit;
-  background: var(--bg-sunken);
-  box-shadow: var(--neu-shadow-inset-strong);
+  background: var(--lmn-typography-bg-sunken, var(--bg-sunken));
+  box-shadow: var(--lmn-typography-neu-shadow-inset-strong, var(--neu-shadow-inset-strong));
   border: none;
   outline: none;
   width: 100%;
@@ -3582,7 +4269,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-family: inherit;
 }
 .typo-editor:focus {
-  box-shadow: var(--neu-shadow-inset-strong), 0 0 0 3px var(--accent-glow);
+  box-shadow: var(--lmn-typography-neu-shadow-inset-strong, var(--neu-shadow-inset-strong)), 0 0 0 3px var(--lmn-typography-accent-glow, var(--accent-glow));
 }
 /* ---- Ellipsis ---- */
 .typo.ellipsis {
@@ -3614,23 +4301,59 @@ input, textarea, select { font-family: inherit; color: inherit; }
   -webkit-box-orient: vertical;
   overflow: hidden;
 }
+/* 后缀与裁切正文分栏，确保后缀不进入 overflow / line-clamp 区域。 */
+.typo.ellipsis-with-suffix {
+  display: inline-flex;
+  align-items: flex-end;
+  max-width: 100%;
+  min-width: 0;
+  vertical-align: bottom;
+}
+.typo-paragraph.ellipsis-with-suffix,
+.typo-title.ellipsis-with-suffix {
+  display: flex;
+}
+.typo-ellipsis-content {
+  flex: 0 1 auto;
+  min-width: 0;
+  max-width: 100%;
+}
+.typo-ellipsis-content.ellipsis {
+  display: block;
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.typo-ellipsis-content.ellipsis-multi {
+  display: -webkit-box;
+  -webkit-box-orient: vertical;
+  overflow: hidden;
+}
 .typo-expand {
   margin-left: 4px;
-  color: var(--accent-ink);
+  color: var(--lmn-typography-accent-ink, var(--accent-ink));
   cursor: pointer;
   font-size: 0.92em;
   user-select: none;
+  padding: 0;
+  border: none;
+  background: transparent;
+  font: inherit;
+}
+.typo-expand:hover { color: var(--lmn-typography-accent, var(--accent)); text-decoration: underline; text-underline-offset: 3px; }
+.typo-suffix {
+  flex: none;
+  margin-left: 0.25em;
 }
-.typo-expand:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }
 .typo-ellipsis-tooltip {
   display: block;
   box-sizing: border-box;
   max-width: min(520px, calc(100vw - 32px));
   padding: 7px 10px;
   border-radius: var(--r-sm);
-  background: var(--bg-sunken);
-  color: var(--fg);
-  box-shadow: var(--neu-shadow-control);
+  background: var(--lmn-typography-bg-sunken, var(--bg-sunken));
+  color: var(--lmn-typography-fg, var(--fg));
+  box-shadow: var(--lmn-typography-neu-shadow-control, var(--neu-shadow-control));
   font-size: 12px;
   font-weight: 500;
   line-height: 1.55;
@@ -3646,11 +4369,6 @@ input, textarea, select { font-family: inherit; color: inherit; }
   animation: fadeIn var(--dur) var(--ease);
   z-index: 1000;
 }
-/* In dark mode, mark needs slightly higher contrast */
-[data-theme="dark"] .typo mark {
-  background: color-mix(in oklch, var(--warning) 30%, transparent);
-  color: var(--fg);
-}
 /* ============================================================================
  * Container & trigger
  * ========================================================================== */
@@ -3664,16 +4382,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 8px;
   padding: 4px;
   border: none;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  background: var(--lmn-color-picker-bg, var(--bg));
+  box-shadow: var(--lmn-color-picker-neu-shadow-subtle, var(--neu-shadow-subtle));
   border-radius: 10px;
   cursor: pointer;
   transition: box-shadow var(--dur) var(--ease);
-  color: var(--fg);
+  color: var(--lmn-color-picker-fg, var(--fg));
   font: inherit;
 }
 .cp-trigger:hover:not(:disabled) {
-  box-shadow: var(--neu-shadow-panel);
+  box-shadow: var(--lmn-color-picker-neu-shadow-panel, var(--neu-shadow-panel));
 }
 .cp-trigger:disabled {
   opacity: 0.5;
@@ -3690,12 +4408,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font: inherit;
 }
 .cp-custom-trigger:disabled { opacity: 0.5; cursor: not-allowed; }
+.cp-custom-trigger[aria-disabled="true"] { opacity: 0.5; cursor: not-allowed; }
 .cp-swatch {
   display: inline-block;
   width: 22px;
   height: 22px;
   border-radius: 6px;
-  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08), var(--neu-shadow-inset);
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent), var(--lmn-color-picker-neu-shadow-inset, var(--neu-shadow-inset));
   background-clip: padding-box;
 }
 .cp-trigger.sm .cp-swatch { width: 18px; height: 18px; border-radius: 5px; }
@@ -3708,7 +4427,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
 .cp-text {
   font-family: var(--font-mono);
   font-size: 12px;
-  color: var(--fg-muted);
+  color: var(--lmn-color-picker-fg-muted, var(--fg-muted));
   padding-right: 6px;
 }
 /* ============================================================================
@@ -3719,9 +4438,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   z-index: 1000;
   width: 232px;
   padding: 12px;
-  background: var(--bg);
+  background: var(--lmn-color-picker-bg, var(--bg));
   border-radius: var(--r-md);
-  box-shadow: var(--neu-shadow-float);
+  box-shadow: var(--lmn-color-picker-neu-shadow-float, var(--neu-shadow-float));
   display: flex;
   flex-direction: column;
   gap: 10px;
@@ -3744,6 +4463,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   cursor: crosshair;
   touch-action: none;
   user-select: none;
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent);
 }
 .cp-board-white,
 .cp-board-black {
@@ -3785,7 +4505,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
     hsl(300, 100%, 50%),
     hsl(360, 100%, 50%)
   );
-  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent);
   cursor: pointer;
   touch-action: none;
   user-select: none;
@@ -3816,16 +4536,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
   padding: 0 10px;
   border: none;
   outline: none;
-  background: var(--bg-sunken);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-color-picker-bg-sunken, var(--bg-sunken));
+  box-shadow: var(--lmn-color-picker-neu-shadow-inset, var(--neu-shadow-inset));
   border-radius: 7px;
   font-family: var(--font-mono);
   font-size: 12px;
-  color: var(--fg);
+  color: var(--lmn-color-picker-fg, var(--fg));
   text-transform: lowercase;
 }
 .cp-input:focus {
-  box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-soft);
+  box-shadow: var(--lmn-color-picker-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px var(--lmn-color-picker-accent-soft, var(--accent-soft));
 }
 .cp-presets {
   display: grid;
@@ -3839,30 +4559,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
   border: none;
   padding: 0;
   cursor: pointer;
-  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08);
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent);
   transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
 }
 .cp-preset:hover {
   transform: scale(1.1);
 }
 .cp-preset.active {
-  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.08), 0 0 0 2px var(--accent);
-}
-/* Dark mode tweaks */
-[data-theme="dark"] .cp-swatch {
-  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12), var(--neu-shadow-inset);
-}
-[data-theme="dark"] .cp-preset {
-  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1);
-}
-[data-theme="dark"] .cp-preset.active {
-  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1), 0 0 0 2px var(--accent);
-}
-[data-theme="dark"] .cp-board {
-  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
-}
-[data-theme="dark"] .cp-hue {
-  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
+  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--lmn-color-picker-fg, var(--fg)) 10%, transparent), 0 0 0 2px var(--lmn-color-picker-accent, var(--accent));
 }
 /* ============ TitleBar (Electron) ============ */
 .titlebar {
@@ -3871,15 +4575,16 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: var(--gap-3);
   padding: 0 var(--gap-3);
   height: 40px;
-  background: var(--bg);
+  background: var(--lmn-app-shell-bg, var(--bg));
   -webkit-app-region: drag;
   user-select: none;
-  border-bottom: 1px solid var(--divider);
+  border-bottom: 1px solid var(--lmn-app-shell-divider, var(--divider));
   position: relative;
   z-index: 5;
   overflow: visible;
 }
 .titlebar.windows { padding-right: 0; }
+.titlebar.no-drag { -webkit-app-region: no-drag; }
 .titlebar-title {
   display: inline-flex;
   align-items: center;
@@ -3907,8 +4612,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 13px; height: 13px;
   border: none; padding: 0;
   border-radius: 999px;
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-subtle);
+  background: var(--lmn-app-shell-bg, var(--bg));
+  box-shadow: var(--lmn-app-shell-neu-shadow-subtle, var(--neu-shadow-subtle));
   position: relative;
   cursor: pointer;
   transition: transform var(--dur-fast) var(--ease);
@@ -3917,13 +4622,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
   content: "";
   position: absolute; inset: 2px;
   border-radius: 999px;
-  background: var(--dot, var(--fg-subtle));
+  background: var(--dot, var(--lmn-app-shell-fg-subtle, var(--fg-subtle)));
   opacity: 0.85;
 }
 .win-controls.mac .win-btn.close    { --dot: #ff5f57; }
 .win-controls.mac .win-btn.minimize { --dot: #febc2e; }
 .win-controls.mac .win-btn.maximize { --dot: #28c840; }
 .win-controls.mac .win-btn:hover { transform: scale(1.08); }
+.win-controls .win-btn:disabled {
+  opacity: 0.45;
+  cursor: default;
+  pointer-events: none;
+}
 /* Windows controls */
 .win-controls.windows {
   display: inline-flex;
@@ -3938,7 +4648,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   padding: 0;
   border-radius: 8px;
   background: transparent;
-  color: var(--fg-muted);
+  color: var(--lmn-app-shell-fg-muted, var(--fg-muted));
   display: inline-grid;
   place-items: center;
   cursor: pointer;
@@ -3948,11 +4658,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
   overflow: visible;
 }
 .win-controls.windows .win-btn svg { display: block; flex-shrink: 0; }
-.win-controls.windows .win-btn:hover { background: var(--bg); box-shadow: var(--neu-shadow-inset); color: var(--fg); }
+.win-controls.windows .win-btn:hover { background: var(--lmn-app-shell-bg, var(--bg)); box-shadow: var(--lmn-app-shell-neu-shadow-inset, var(--neu-shadow-inset)); color: var(--lmn-app-shell-fg, var(--fg)); }
 .win-controls.windows .win-btn.close:hover {
-  background: var(--danger);
+  background: var(--lmn-app-shell-danger, var(--danger));
   color: white;
-  box-shadow: 2px 2px 4px color-mix(in oklch, var(--danger) 30%, var(--shadow-dark));
+  box-shadow: 2px 2px 4px color-mix(in oklch, var(--lmn-app-shell-danger, var(--danger)) 30%, var(--lmn-app-shell-shadow-dark, var(--shadow-dark)));
 }
 /* ============ Sidebar ============ */
 .sidebar {
@@ -3960,23 +4670,24 @@ input, textarea, select { font-family: inherit; color: inherit; }
   flex-direction: column;
   width: 220px;
   padding: 12px;
-  background: var(--bg);
-  border-right: 1px solid var(--divider);
+  background: var(--lmn-app-shell-bg, var(--bg));
+  border-right: 1px solid var(--lmn-app-shell-divider, var(--divider));
   flex-shrink: 0;
   overflow-y: auto;
   gap: 4px;
 }
 .sidebar.collapsed { width: 64px; }
-.sidebar-header { padding: 4px 8px 12px; border-bottom: 1px solid var(--divider); margin-bottom: 8px; }
-.sidebar-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--divider); }
+.sidebar-header { padding: 4px 8px 12px; border-bottom: 1px solid var(--lmn-app-shell-divider, var(--divider)); margin-bottom: 8px; }
+.sidebar-footer { margin-top: auto; padding-top: 12px; border-top: 1px solid var(--lmn-app-shell-divider, var(--divider)); }
 .sidebar-nav { display: flex; flex-direction: column; gap: 2px; }
+.sidebar-children { display: flex; flex-direction: column; gap: 2px; }
 .sidebar-item {
   display: flex; align-items: center; gap: 10px;
-  padding: 10px 12px;
+  padding: 10px 12px 10px calc(12px + var(--sidebar-indent, 0px));
   border: none;
   border-radius: var(--r-sm);
   background: transparent;
-  color: var(--fg-muted);
+  color: var(--lmn-app-shell-fg-muted, var(--fg-muted));
   font-size: 13px;
   font-family: inherit;
   text-align: left;
@@ -3984,11 +4695,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 100%;
   transition: all var(--dur-fast) var(--ease);
 }
-.sidebar-item:hover { color: var(--fg); background: var(--bg); box-shadow: var(--neu-shadow-subtle); }
+.sidebar-item:hover { color: var(--lmn-app-shell-fg, var(--fg)); background: var(--lmn-app-shell-bg, var(--bg)); box-shadow: var(--lmn-app-shell-neu-shadow-subtle, var(--neu-shadow-subtle)); }
 .sidebar-item.active {
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  color: var(--lmn-app-shell-accent-ink, var(--accent-ink));
+  background: var(--lmn-app-shell-bg, var(--bg));
+  box-shadow: var(--lmn-app-shell-neu-shadow-inset, var(--neu-shadow-inset));
   font-weight: 500;
 }
 .sidebar-icon { display: inline-flex; flex-shrink: 0; }
@@ -3997,18 +4708,29 @@ input, textarea, select { font-family: inherit; color: inherit; }
   font-size: 11px;
   padding: 1px 7px;
   border-radius: 999px;
-  background: var(--accent);
+  background: var(--lmn-app-shell-accent, var(--accent));
   color: white;
   font-weight: 600;
 }
+.sidebar-expand {
+  display: inline-flex;
+  flex-shrink: 0;
+  color: var(--lmn-app-shell-fg-subtle, var(--fg-subtle));
+  transition: transform var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
+}
+.sidebar-expand.open {
+  color: var(--lmn-app-shell-accent, var(--accent));
+  transform: rotate(180deg);
+}
 /* ============ AppShell ============ */
 .app-shell {
   display: flex;
   flex-direction: column;
   width: 100%;
   height: 100vh;
-  background: var(--bg);
-  color: var(--fg);
+  height: 100dvh;
+  background: var(--lmn-app-shell-bg, var(--bg));
+  color: var(--lmn-app-shell-fg, var(--fg));
   overflow: hidden;
   position: relative;
 }
@@ -4022,6 +4744,289 @@ input, textarea, select { font-family: inherit; color: inherit; }
   min-width: 0;
   overflow: auto;
 }
+@media (max-width: 720px) {
+  .titlebar-center {
+    position: static;
+    flex: 1;
+    min-width: 0;
+    justify-content: center;
+    overflow: hidden;
+    transform: none;
+  }
+  .titlebar-title,
+  .titlebar-center,
+  .titlebar-actions {
+    max-width: 34%;
+  }
+  .sidebar:not(.collapsed) { width: 180px; }
+}
+/* ============ Splitter ============ */
+.splitter {
+  display: flex;
+  width: 100%;
+  height: 100%;
+  min-width: 0;
+  min-height: 0;
+}
+.splitter.horizontal { flex-direction: row; }
+.splitter.vertical   { flex-direction: column; }
+.splitter.dragging   { cursor: col-resize; user-select: none; }
+.splitter.dragging.vertical { cursor: row-resize; }
+.splitter-panel {
+  min-width: 0;
+  min-height: 0;
+  overflow: auto;
+}
+.splitter-panel.first  { flex-shrink: 0; }
+.splitter-panel.second { flex: 1; }
+.splitter-handle {
+  flex-shrink: 0;
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background: transparent;
+  transition: background var(--dur-fast) var(--ease);
+  outline: none;
+}
+.splitter.horizontal > .splitter-handle {
+  width: 6px;
+  cursor: col-resize;
+}
+.splitter.vertical > .splitter-handle {
+  height: 6px;
+  cursor: row-resize;
+}
+.splitter-handle:hover,
+.splitter.dragging > .splitter-handle {
+  background: var(--lmn-splitter-accent-soft, var(--accent-soft));
+}
+.splitter-handle:focus-visible {
+  box-shadow: inset 0 0 0 2px var(--lmn-splitter-accent-glow, var(--accent-glow));
+  border-radius: var(--r-xs);
+}
+.splitter-handle-grip {
+  display: block;
+  background: var(--lmn-splitter-divider, var(--divider));
+  border-radius: 999px;
+  transition: background var(--dur-fast) var(--ease);
+}
+.splitter.horizontal > .splitter-handle > .splitter-handle-grip {
+  width: 2px;
+  height: 28px;
+}
+.splitter.vertical > .splitter-handle > .splitter-handle-grip {
+  width: 28px;
+  height: 2px;
+}
+.splitter-handle:hover > .splitter-handle-grip,
+.splitter.dragging > .splitter-handle > .splitter-handle-grip {
+  background: var(--lmn-splitter-accent, var(--accent));
+}
+/* ============ StatusBar ============ */
+.statusbar {
+  display: flex;
+  align-items: center;
+  position: relative;
+  height: 26px;
+  padding: 0 10px;
+  background: var(--lmn-status-bar-bg, var(--bg));
+  border-top: 1px solid var(--lmn-status-bar-divider, var(--divider));
+  color: var(--lmn-status-bar-fg-muted, var(--fg-muted));
+  font-size: 11.5px;
+  user-select: none;
+  flex-shrink: 0;
+  gap: 8px;
+}
+.statusbar-section {
+  display: inline-flex;
+  align-items: center;
+  gap: 2px;
+  min-width: 0;
+}
+.statusbar-section.left  { margin-right: auto; }
+.statusbar-section.right { margin-left: auto; }
+.statusbar-section.center {
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+}
+.statusbar-item {
+  display: inline-flex;
+  align-items: center;
+  gap: 5px;
+  height: 20px;
+  padding: 0 8px;
+  border: none;
+  background: transparent;
+  color: inherit;
+  font: inherit;
+  border-radius: var(--r-xs);
+  transition: background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
+  white-space: nowrap;
+}
+.statusbar-item.clickable { cursor: pointer; }
+.statusbar-item.clickable:hover { background: var(--lmn-status-bar-bg-sunken, var(--bg-sunken)); color: var(--lmn-status-bar-fg, var(--fg)); }
+.statusbar-item.tone-muted   { color: var(--lmn-status-bar-fg-subtle, var(--fg-subtle)); }
+.statusbar-item.tone-accent  { color: var(--lmn-status-bar-accent-ink, var(--accent-ink)); }
+.statusbar-item.tone-success { color: var(--lmn-status-bar-success, var(--success)); }
+.statusbar-item.tone-warning { color: var(--lmn-status-bar-warning, var(--warning)); }
+.statusbar-item.tone-danger  { color: var(--lmn-status-bar-danger, var(--danger)); }
+.statusbar-item-icon { display: inline-flex; flex-shrink: 0; }
+.statusbar-item-label { overflow: hidden; text-overflow: ellipsis; }
+@media (max-width: 640px) {
+  .statusbar-section.center {
+    position: static;
+    min-width: 0;
+    margin-inline: auto;
+    transform: none;
+  }
+  .statusbar-section.left,
+  .statusbar-section.right {
+    max-width: 38%;
+    overflow: hidden;
+  }
+}
+.timeline {
+  display: flex;
+  flex-direction: column;
+  font-size: 14px;
+  color: var(--lmn-timeline-fg, var(--fg));
+}
+/* ---- Item layout ---- */
+.timeline-item {
+  display: grid;
+  grid-template-columns: 1fr auto 1fr;
+  gap: 0 var(--gap-3);
+  min-height: 60px;
+  min-width: 0;
+  position: relative;
+}
+/* Left mode: label hidden, content on right */
+.timeline-left .timeline-item-label {
+  display: none;
+}
+.timeline-left .timeline-item {
+  grid-template-columns: auto 1fr;
+}
+/* Right mode: content on left, label hidden */
+.timeline-right .timeline-item-label {
+  display: none;
+}
+.timeline-right .timeline-item {
+  grid-template-columns: 1fr auto;
+  direction: rtl;
+}
+.timeline-right .timeline-item-content,
+.timeline-right .timeline-item-head {
+  direction: ltr;
+}
+/* Alternate mode */
+.timeline-alternate .timeline-item-left .timeline-item-label {
+  text-align: right;
+  color: var(--lmn-timeline-fg-muted, var(--fg-muted));
+}
+.timeline-alternate .timeline-item-left .timeline-item-content {
+  text-align: left;
+}
+.timeline-alternate .timeline-item-right .timeline-item-label {
+  text-align: left;
+}
+.timeline-alternate .timeline-item-right .timeline-item-content {
+  text-align: right;
+  color: var(--lmn-timeline-fg-muted, var(--fg-muted));
+}
+.timeline-alternate .timeline-item-right {
+  direction: rtl;
+}
+.timeline-alternate .timeline-item-right .timeline-item-head,
+.timeline-alternate .timeline-item-right .timeline-item-content,
+.timeline-alternate .timeline-item-right .timeline-item-label {
+  direction: ltr;
+}
+/* ---- Head (dot + tail) ---- */
+.timeline-item-head {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  position: relative;
+}
+.timeline-item-dot {
+  width: 12px;
+  height: 12px;
+  border-radius: var(--r-pill);
+  box-shadow: var(--lmn-timeline-neu-shadow-control, var(--neu-shadow-control));
+  flex-shrink: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  position: relative;
+  z-index: 1;
+  margin-top: var(--timeline-dot-offset, 4px);
+}
+.timeline-item-dot.accent { background: var(--lmn-timeline-accent, var(--accent)); }
+.timeline-item-dot.success { background: var(--lmn-timeline-success, var(--success)); }
+.timeline-item-dot.warning { background: var(--lmn-timeline-warning, var(--warning)); }
+.timeline-item-dot.danger { background: var(--lmn-timeline-danger, var(--danger)); }
+.timeline-item-dot.info { background: var(--lmn-timeline-info, var(--info)); }
+.timeline-item-dot.muted { background: var(--lmn-timeline-fg-subtle, var(--fg-subtle)); }
+/* Pending dot: clear default fill, Spin handles its own visuals */
+.timeline-item-dot.pending {
+  background: transparent;
+  box-shadow: none;
+  border: none;
+}
+.timeline-item-tail {
+  width: 2px;
+  flex: 1;
+  background: var(--lmn-timeline-divider, var(--divider));
+  margin-top: var(--gap-1);
+  margin-bottom: 0;
+  border-radius: 1px;
+}
+/* ---- Content ---- */
+.timeline-item-content {
+  padding-bottom: var(--gap-5);
+  line-height: 1.6;
+  min-width: var(--timeline-content-min-width, 0);
+}
+.timeline-item-last .timeline-item-content {
+  padding-bottom: 0;
+}
+.timeline-item-label {
+  padding-bottom: var(--gap-5);
+  line-height: 1.6;
+  color: var(--lmn-timeline-fg-muted, var(--fg-muted));
+  font-size: 13px;
+  min-width: 0;
+}
+/* ---- Pending animation ---- */
+.timeline-item-pending .timeline-item-content {
+  color: var(--lmn-timeline-fg-muted, var(--fg-muted));
+}
+/* When dot has custom content (Spin / Icon), expand to fit */
+.timeline-item-dot:has(> *) {
+  width: auto;
+  height: auto;
+  background: transparent !important;
+  box-shadow: none;
+  border-radius: 0;
+  border: none;
+}
+@media (max-width: 640px) {
+  .timeline-alternate .timeline-item {
+    grid-template-columns: auto minmax(0, 1fr);
+    direction: ltr;
+  }
+  .timeline-alternate .timeline-item-label {
+    display: none;
+  }
+  .timeline-alternate .timeline-item-head,
+  .timeline-alternate .timeline-item-content {
+    direction: ltr;
+    text-align: left;
+  }
+}
 /* ============ ThemePanel ============ */
 .theme-panel {
   width: min(100%, 340px);
@@ -4031,9 +5036,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   box-sizing: border-box;
   padding: var(--gap-4);
   border-radius: var(--r-xl);
-  color: var(--fg);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-lift);
+  color: var(--lmn-theme-panel-fg, var(--fg));
+  background: var(--lmn-theme-panel-bg, var(--bg));
+  box-shadow: var(--lmn-theme-panel-neu-shadow-lift, var(--neu-shadow-lift));
 }
 .theme-panel.compact {
   width: min(100%, 300px);
@@ -4050,13 +5055,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
   align-items: center;
   gap: 8px;
   min-width: 0;
-  color: var(--fg);
+  color: var(--lmn-theme-panel-fg, var(--fg));
   font-size: 14px;
   font-weight: 700;
 }
 .theme-panel-title svg {
   flex: 0 0 auto;
-  color: var(--accent);
+  color: var(--lmn-theme-panel-accent, var(--accent));
 }
 .theme-panel-title span {
   min-width: 0;
@@ -4066,14 +5071,14 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .theme-panel-desc {
   font-size: 12px;
-  color: var(--fg-muted);
+  color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
 }
 .theme-panel-row {
   display: flex;
   flex-direction: column;
   gap: 8px;
   padding-top: var(--gap-3);
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-theme-panel-divider, var(--divider));
 }
 .theme-panel-head + .theme-panel-row,
 .theme-panel-row:first-child {
@@ -4087,7 +5092,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 10px;
   font-size: 12px;
   font-weight: 600;
-  color: var(--fg);
+  color: var(--lmn-theme-panel-fg, var(--fg));
 }
 .theme-panel-label > span:last-child:not(:first-child) {
   min-width: 0;
@@ -4097,9 +5102,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   white-space: nowrap;
   padding: 2px 8px;
   border-radius: var(--r-pill);
-  color: var(--accent-ink);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  color: var(--lmn-theme-panel-accent-ink, var(--accent-ink));
+  background: var(--lmn-theme-panel-bg, var(--bg));
+  box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
   font-family: var(--font-mono);
   font-size: 11px;
   font-weight: 500;
@@ -4123,9 +5128,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   flex-direction: column;
   gap: 8px;
   padding: 9px;
-  color: var(--fg-muted);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
+  background: var(--lmn-theme-panel-bg, var(--bg));
+  box-shadow: var(--lmn-theme-panel-neu-shadow-control, var(--neu-shadow-control));
   text-align: left;
   white-space: normal;
   transition:
@@ -4134,18 +5139,18 @@ input, textarea, select { font-family: inherit; color: inherit; }
     transform var(--dur-fast) var(--ease);
 }
 .theme-panel .theme-panel-preset.btn:hover {
-  color: var(--fg);
-  box-shadow: var(--neu-shadow-panel);
+  color: var(--lmn-theme-panel-fg, var(--fg));
+  box-shadow: var(--lmn-theme-panel-neu-shadow-panel, var(--neu-shadow-panel));
   transform: translateY(-1px);
 }
 .theme-panel .theme-panel-preset.btn.active {
-  color: var(--accent-ink);
-  box-shadow: var(--neu-shadow-inset), 0 0 0 1px var(--accent-glow);
+  color: var(--lmn-theme-panel-accent-ink, var(--accent-ink));
+  box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 1px var(--lmn-theme-panel-accent-glow, var(--accent-glow));
   transform: none;
 }
 .theme-panel .theme-panel-preset.btn.active:hover {
-  color: var(--accent-ink);
-  box-shadow: var(--neu-shadow-inset), 0 0 0 1px var(--accent-glow);
+  color: var(--lmn-theme-panel-accent-ink, var(--accent-ink));
+  box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 1px var(--lmn-theme-panel-accent-glow, var(--accent-glow));
 }
 .theme-panel .theme-panel-preset-shell.deletable .theme-panel-preset.btn {
   padding-right: 28px;
@@ -4158,9 +5163,9 @@ input, textarea, select { font-family: inherit; color: inherit; }
   height: 22px;
   min-width: 22px;
   padding: 0;
-  color: var(--fg-subtle);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-control);
+  color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
+  background: var(--lmn-theme-panel-bg, var(--bg));
+  box-shadow: var(--lmn-theme-panel-neu-shadow-control, var(--neu-shadow-control));
   opacity: 0;
   transform: scale(0.92);
 }
@@ -4170,7 +5175,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   transform: scale(1);
 }
 .theme-panel .theme-panel-preset-delete.btn:hover {
-  box-shadow: var(--neu-shadow-inset);
+  box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
 }
 .theme-panel-preset-ink {
   display: grid;
@@ -4182,7 +5187,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   height: 18px;
   min-width: 0;
   border-radius: var(--r-pill);
-  box-shadow: inset 0 0 0 1px var(--divider);
+  box-shadow: inset 0 0 0 1px var(--lmn-theme-panel-divider, var(--divider));
 }
 .theme-panel-preset-copy {
   display: flex;
@@ -4205,7 +5210,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
-  color: var(--fg-subtle);
+  color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
   font-size: 10px;
   font-weight: 500;
 }
@@ -4221,10 +5226,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
   min-width: 28px;
   padding: 0;
   border-radius: var(--r-pill);
-  box-shadow: var(--neu-shadow-subtle);
+  box-shadow: var(--lmn-theme-panel-neu-shadow-subtle, var(--neu-shadow-subtle));
 }
 .theme-panel-swatch.active {
-  box-shadow: var(--neu-shadow-inset), 0 0 0 2px var(--accent-glow);
+  box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset)), 0 0 0 2px var(--lmn-theme-panel-accent-glow, var(--accent-glow));
 }
 .theme-panel .radio-group.segmented {
   width: 100%;
@@ -4238,8 +5243,8 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 10px;
   padding: 10px;
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-theme-panel-bg, var(--bg));
+  box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
 }
 .theme-panel-create-head {
   display: flex;
@@ -4254,13 +5259,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 2px;
 }
 .theme-panel-create-head span {
-  color: var(--fg);
+  color: var(--lmn-theme-panel-fg, var(--fg));
   font-size: 12px;
   font-weight: 700;
 }
 .theme-panel-create-head small {
   min-width: 0;
-  color: var(--fg-subtle);
+  color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
   font-family: var(--font-mono);
   font-size: 10px;
   overflow: hidden;
@@ -4272,7 +5277,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   display: flex;
   flex-direction: column;
   gap: 6px;
-  color: var(--fg-subtle);
+  color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
   font-family: var(--font-mono);
   font-size: 10px;
 }
@@ -4312,15 +5317,15 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 10px;
   padding: 10px;
   border-radius: var(--r-md);
-  background: var(--bg);
-  box-shadow: var(--neu-shadow-inset);
+  background: var(--lmn-theme-panel-bg, var(--bg));
+  box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset));
 }
 .theme-panel-advanced-actions {
   display: flex;
   flex-direction: column;
   gap: 8px;
   padding-top: 10px;
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-theme-panel-divider, var(--divider));
 }
 .theme-panel-save-as-field {
   display: grid;
@@ -4329,7 +5334,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   align-items: center;
 }
 .theme-panel-save-as-field > span {
-  color: var(--fg-muted);
+  color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
   font-size: 11px;
   font-weight: 800;
   white-space: nowrap;
@@ -4342,7 +5347,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .theme-panel-advanced-footer > span {
   min-width: 0;
-  color: var(--fg-subtle);
+  color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
   font-family: var(--font-mono);
   font-size: 10px;
   overflow: hidden;
@@ -4366,11 +5371,11 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 10px;
   padding: 7px 9px;
   border-radius: var(--preview-radius, var(--r-md));
-  color: var(--preview-fg, var(--fg));
-  background: var(--preview-bg, var(--bg));
+  color: var(--preview-fg, var(--lmn-theme-panel-fg, var(--fg)));
+  background: var(--preview-bg, var(--lmn-theme-panel-bg, var(--bg)));
   box-shadow:
-    calc(var(--shadow-offset) * 0.45 * var(--preview-shadow-scale, 1)) calc(var(--shadow-offset) * 0.45 * var(--preview-shadow-scale, 1)) calc(var(--shadow-blur) * 0.55 * var(--preview-shadow-scale, 1)) var(--preview-shadow-dark, var(--shadow-dark)),
-    calc(var(--shadow-offset) * -0.45 * var(--preview-shadow-scale, 1)) calc(var(--shadow-offset) * -0.45 * var(--preview-shadow-scale, 1)) calc(var(--shadow-blur) * 0.55 * var(--preview-shadow-scale, 1)) var(--preview-shadow-light, var(--shadow-light));
+    calc(var(--lmn-theme-panel-shadow-offset, var(--shadow-offset)) * 0.45 * var(--preview-shadow-scale, 1)) calc(var(--lmn-theme-panel-shadow-offset, var(--shadow-offset)) * 0.45 * var(--preview-shadow-scale, 1)) calc(var(--lmn-theme-panel-shadow-blur, var(--shadow-blur)) * 0.55 * var(--preview-shadow-scale, 1)) var(--preview-shadow-dark, var(--lmn-theme-panel-shadow-dark, var(--shadow-dark))),
+    calc(var(--lmn-theme-panel-shadow-offset, var(--shadow-offset)) * -0.45 * var(--preview-shadow-scale, 1)) calc(var(--lmn-theme-panel-shadow-offset, var(--shadow-offset)) * -0.45 * var(--preview-shadow-scale, 1)) calc(var(--lmn-theme-panel-shadow-blur, var(--shadow-blur)) * 0.55 * var(--preview-shadow-scale, 1)) var(--preview-shadow-light, var(--lmn-theme-panel-shadow-light, var(--shadow-light)));
   font-family: var(--preview-font, var(--font-sans));
   font-size: 12px;
   font-weight: 700;
@@ -4393,10 +5398,10 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 20px;
   height: 20px;
   border-radius: var(--r-pill);
-  background: var(--preview-accent, var(--accent));
+  background: var(--preview-accent, var(--lmn-theme-panel-accent, var(--accent)));
   box-shadow:
-    inset 1px 1px 2px color-mix(in oklch, var(--preview-accent, var(--accent)) 50%, white),
-    0 0 0 4px var(--preview-accent-glow, var(--accent-glow));
+    inset 1px 1px 2px color-mix(in oklch, var(--preview-accent, var(--lmn-theme-panel-accent, var(--accent))) 50%, white),
+    0 0 0 4px var(--preview-accent-glow, var(--lmn-theme-panel-accent-glow, var(--accent-glow)));
 }
 .theme-panel-create-actions {
   display: grid;
@@ -4414,7 +5419,7 @@ input, textarea, select { font-family: inherit; color: inherit; }
   flex-direction: column;
   gap: 8px;
   padding-top: 10px;
-  border-top: 1px solid var(--divider);
+  border-top: 1px solid var(--lmn-theme-panel-divider, var(--divider));
 }
 .theme-panel-advanced-section.compact {
   padding-top: 0;
@@ -4428,13 +5433,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
 }
 .theme-panel-advanced-title span {
   min-width: 0;
-  color: var(--fg);
+  color: var(--lmn-theme-panel-fg, var(--fg));
   font-size: 11px;
   font-weight: 700;
 }
 .theme-panel-advanced-title small {
   min-width: 0;
-  color: var(--fg-subtle);
+  color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
   font-family: var(--font-mono);
   font-size: 9px;
   overflow: hidden;
@@ -4460,13 +5465,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
   gap: 2px;
 }
 .theme-panel-token-label span {
-  color: var(--fg-muted);
+  color: var(--lmn-theme-panel-fg-muted, var(--fg-muted));
   font-size: 10px;
   font-weight: 650;
   white-space: nowrap;
 }
 .theme-panel-token-label code {
-  color: var(--fg-subtle);
+  color: var(--lmn-theme-panel-fg-subtle, var(--fg-subtle));
   font-family: var(--font-mono);
   font-size: 9px;
   overflow: hidden;
@@ -4505,13 +5510,13 @@ input, textarea, select { font-family: inherit; color: inherit; }
   width: 24px;
   height: 24px;
   border-radius: 7px;
-  box-shadow: var(--neu-shadow-inset), inset 0 0 0 1px var(--border);
+  box-shadow: var(--lmn-theme-panel-neu-shadow-inset, var(--neu-shadow-inset)), inset 0 0 0 1px var(--lmn-theme-panel-border, var(--border));
   transition:
     box-shadow var(--dur-fast) var(--ease),
     transform var(--dur-fast) var(--ease);
 }
 .theme-panel-token-picker .cp-custom-trigger:hover .theme-panel-token-swatch {
-  box-shadow: var(--neu-shadow-control), inset 0 0 0 1px var(--border);
+  box-shadow: var(--lmn-theme-panel-neu-shadow-control, var(--neu-shadow-control)), inset 0 0 0 1px var(--lmn-theme-panel-border, var(--border));
   transform: translateY(-1px);
 }
 .theme-panel-token-input .input-wrap,