@zhang_jifan/fanui 2.1.0

package/dist/modules/fanui-choice.css

@@ -0,0 +1,539 @@
+/* fanUI v2.1.0 · module: choice（独立产物，自带令牌） */
+.fanui-select, .fanui-select-multiple {
+  display: block;
+  width: 100%;
+  min-height: 36px;
+  padding: 6.5px 14px;
+  font-family: inherit;
+  font-size: 14px;
+  line-height: 1.5;
+  color: var(--fanui-color-text);
+  background-color: var(--fanui-color-surface);
+  border: 1px solid var(--fanui-color-border);
+  border-radius: 6px;
+  box-sizing: border-box;
+  appearance: none;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  background-clip: padding-box;
+  transition: border-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s;
+}
+.fanui-select::placeholder, .fanui-select-multiple::placeholder {
+  color: var(--fanui-color-text-subtle);
+  opacity: 1;
+}
+.fanui-select::-webkit-input-placeholder, .fanui-select-multiple::-webkit-input-placeholder {
+  color: var(--fanui-color-text-subtle);
+  opacity: 1;
+}
+.fanui-select::-moz-placeholder, .fanui-select-multiple::-moz-placeholder {
+  color: var(--fanui-color-text-subtle);
+  opacity: 1;
+}
+.fanui-select:-ms-input-placeholder, .fanui-select-multiple:-ms-input-placeholder {
+  color: var(--fanui-color-text-subtle);
+  opacity: 1;
+}
+.fanui-select:hover:not(:disabled):not(.is-disabled), .fanui-select-multiple:hover:not(:disabled):not(.is-disabled) {
+  border-color: var(--fanui-color-border-strong);
+}
+.fanui-select:focus, .fanui-select-multiple:focus, .fanui-select:focus-visible, .fanui-select-multiple:focus-visible {
+  border-color: var(--fanui-primary);
+  outline: 0;
+  box-shadow: 0 0 0 var(--fanui-focus-ring-offset, 1px) var(--fanui-color-surface, #fff), 0 0 0 calc(var(--fanui-focus-ring-offset, 1px) + var(--fanui-focus-ring-width, 3px)) var(--fanui-focus-ring-color, rgba(14, 116, 144, 0.3));
+}
+@media (forced-colors: active) {
+  .fanui-select:focus, .fanui-select-multiple:focus, .fanui-select:focus-visible, .fanui-select-multiple:focus-visible {
+    outline: 2px solid transparent;
+    outline-offset: 2px;
+  }
+}
+.fanui-select:disabled, .fanui-select-multiple:disabled, .fanui-select.is-disabled, .is-disabled.fanui-select-multiple {
+  background-color: var(--fanui-color-disabled-bg);
+  color: var(--fanui-color-disabled-text);
+  cursor: not-allowed;
+  resize: none;
+}
+.fanui-select[readonly], [readonly].fanui-select-multiple {
+  background-color: var(--fanui-color-surface-sunken);
+}
+.fanui-select, .fanui-select-multiple {
+  padding-inline-end: 32px;
+  cursor: pointer;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 10px center;
+  background-size: 16px;
+  appearance: none;
+  -webkit-appearance: none;
+}
+.fanui-select[multiple], [multiple].fanui-select-multiple, .fanui-select[size]:not([size="1"]), [size].fanui-select-multiple:not([size="1"]) {
+  padding-inline-end: var(--fanui-control-px, 14px);
+  background-image: none;
+  height: auto;
+  min-height: 88px;
+}
+.fanui-select::-ms-expand, .fanui-select-multiple::-ms-expand {
+  display: none;
+}
+.fanui-select:disabled, .fanui-select-multiple:disabled {
+  cursor: not-allowed;
+}
+
+.fanui-select-multiple {
+  min-height: 96px;
+  padding: 6px;
+}
+.fanui-select-multiple option {
+  padding: 4px 8px;
+  border-radius: var(--fanui-radius-sm);
+}
+.fanui-select-multiple option:checked {
+  background-color: var(--fanui-primary);
+  color: var(--fanui-primary-fg);
+}
+
+.fanui-select-wrap {
+  position: relative;
+  display: block;
+}
+.fanui-select-wrap__prefix {
+  position: absolute;
+  top: 50%;
+  left: 12px;
+  transform: translateY(-50%);
+  color: var(--fanui-color-text-subtle);
+  pointer-events: none;
+}
+.fanui-select-wrap .fanui-select, .fanui-select-wrap .fanui-select-multiple {
+  padding-inline-start: 36px;
+}
+
+.fanui-checkbox,
+.fanui-radio {
+  display: inline-flex;
+  align-items: flex-start;
+  gap: 8px;
+  position: relative;
+  font-size: var(--fanui-font-size-base);
+  line-height: 1.5;
+  color: var(--fanui-color-text);
+  cursor: pointer;
+  user-select: none;
+}
+.fanui-checkbox__input,
+.fanui-radio__input {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+}
+.fanui-checkbox__input:focus-visible + .fanui-checkbox__box, .fanui-checkbox__input:focus-visible + .fanui-radio__box,
+.fanui-radio__input:focus-visible + .fanui-checkbox__box,
+.fanui-radio__input:focus-visible + .fanui-radio__box {
+  outline: 0;
+  box-shadow: 0 0 0 var(--fanui-focus-ring-offset, 1px) var(--fanui-color-surface, #fff), 0 0 0 calc(var(--fanui-focus-ring-offset, 1px) + var(--fanui-focus-ring-width, 3px)) var(--fanui-focus-ring-color, rgba(14, 116, 144, 0.3));
+}
+@media (forced-colors: active) {
+  .fanui-checkbox__input:focus-visible + .fanui-checkbox__box, .fanui-checkbox__input:focus-visible + .fanui-radio__box,
+  .fanui-radio__input:focus-visible + .fanui-checkbox__box,
+  .fanui-radio__input:focus-visible + .fanui-radio__box {
+    outline: 2px solid transparent;
+    outline-offset: 2px;
+  }
+}
+.fanui-checkbox__label,
+.fanui-radio__label {
+  flex: 1 1 auto;
+  min-width: 0;
+}
+.fanui-checkbox__desc,
+.fanui-radio__desc {
+  display: block;
+  margin-top: 2px;
+  font-size: var(--fanui-font-size-sm);
+  color: var(--fanui-color-text-muted);
+}
+.fanui-checkbox.is-disabled, .fanui-checkbox__input:disabled ~ .fanui-checkbox__label,
+.fanui-radio.is-disabled,
+.fanui-checkbox__input:disabled ~ .fanui-radio__label,
+.fanui-radio__input:disabled ~ .fanui-checkbox__label,
+.fanui-radio__input:disabled ~ .fanui-radio__label {
+  color: var(--fanui-color-disabled-text);
+  cursor: not-allowed;
+}
+.fanui-checkbox__input:disabled + .fanui-checkbox__box, .fanui-checkbox__input:disabled + .fanui-radio__box,
+.fanui-radio__input:disabled + .fanui-checkbox__box,
+.fanui-radio__input:disabled + .fanui-radio__box {
+  background-color: var(--fanui-color-disabled-bg);
+  border-color: var(--fanui-color-border);
+  cursor: not-allowed;
+}
+.fanui-checkbox__input:disabled + .fanui-checkbox__box::after, .fanui-checkbox__input:disabled + .fanui-radio__box::after,
+.fanui-radio__input:disabled + .fanui-checkbox__box::after,
+.fanui-radio__input:disabled + .fanui-radio__box::after {
+  opacity: 0.45;
+}
+
+.fanui-checkbox__box {
+  position: relative;
+  flex: 0 0 auto;
+  width: 16px;
+  height: 16px;
+  margin-top: 3px;
+  background-color: var(--fanui-color-surface);
+  border: 1px solid var(--fanui-color-border-strong);
+  border-radius: var(--fanui-radius-sm);
+  box-sizing: border-box;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, border-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s;
+}
+.fanui-checkbox__box::after {
+  content: "";
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 4px;
+  height: 8px;
+  margin: -5px 0 0 -2px;
+  border: solid var(--fanui-color-text-inverse);
+  border-width: 0 2px 2px 0;
+  transform: rotate(45deg) scale(0.6);
+  opacity: 0;
+  transition: opacity 150ms cubic-bezier(0.34, 1.56, 0.64, 1) 0s, transform 150ms cubic-bezier(0.34, 1.56, 0.64, 1) 0s;
+}
+
+.fanui-checkbox:hover .fanui-checkbox__box {
+  border-color: var(--fanui-primary);
+}
+
+.fanui-checkbox__input:checked + .fanui-checkbox__box,
+.fanui-checkbox.is-checked .fanui-checkbox__box {
+  background-color: var(--fanui-primary);
+  border-color: var(--fanui-primary);
+}
+.fanui-checkbox__input:checked + .fanui-checkbox__box::after,
+.fanui-checkbox.is-checked .fanui-checkbox__box::after {
+  opacity: 1;
+  transform: rotate(45deg) scale(1);
+}
+
+.fanui-checkbox__input:indeterminate + .fanui-checkbox__box {
+  background-color: var(--fanui-primary);
+  border-color: var(--fanui-primary);
+}
+.fanui-checkbox__input:indeterminate + .fanui-checkbox__box::after {
+  width: 8px;
+  height: 0;
+  margin: -1px 0 0 -4px;
+  border-width: 0 0 2px 0;
+  transform: none;
+  opacity: 1;
+}
+
+.fanui-radio__box {
+  position: relative;
+  flex: 0 0 auto;
+  width: 16px;
+  height: 16px;
+  margin-top: 3px;
+  background-color: var(--fanui-color-surface);
+  border: 1px solid var(--fanui-color-border-strong);
+  border-radius: 50%;
+  box-sizing: border-box;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, border-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s;
+}
+.fanui-radio__box::after {
+  content: "";
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 6px;
+  height: 6px;
+  margin: -3px 0 0 -3px;
+  background-color: var(--fanui-color-text-inverse);
+  border-radius: 50%;
+  transform: scale(0);
+  opacity: 0;
+  transition: opacity 150ms cubic-bezier(0.34, 1.56, 0.64, 1) 0s, transform 150ms cubic-bezier(0.34, 1.56, 0.64, 1) 0s;
+}
+.fanui-radio:hover .fanui-radio__box {
+  border-color: var(--fanui-primary);
+}
+.fanui-radio__input:checked + .fanui-radio__box, .fanui-radio.is-checked .fanui-radio__box {
+  background-color: var(--fanui-primary);
+  border-color: var(--fanui-primary);
+}
+.fanui-radio__input:checked + .fanui-radio__box::after, .fanui-radio.is-checked .fanui-radio__box::after {
+  opacity: 1;
+  transform: scale(1);
+}
+
+.fanui-checkbox--sm .fanui-checkbox__box,
+.fanui-checkbox--sm .fanui-radio__box,
+.fanui-radio--sm .fanui-checkbox__box,
+.fanui-radio--sm .fanui-radio__box {
+  width: 14px;
+  height: 14px;
+}
+
+.fanui-checkbox--lg,
+.fanui-radio--lg {
+  font-size: var(--fanui-font-size-md);
+}
+.fanui-checkbox--lg .fanui-checkbox__box,
+.fanui-checkbox--lg .fanui-radio__box,
+.fanui-radio--lg .fanui-checkbox__box,
+.fanui-radio--lg .fanui-radio__box {
+  width: 20px;
+  height: 20px;
+  border-radius: var(--fanui-radius-base);
+}
+.fanui-checkbox--lg .fanui-radio__box,
+.fanui-radio--lg .fanui-radio__box {
+  border-radius: 50%;
+}
+.fanui-checkbox--lg .fanui-radio__box::after,
+.fanui-radio--lg .fanui-radio__box::after {
+  width: 8px;
+  height: 8px;
+  margin: -4px 0 0 -4px;
+}
+.fanui-checkbox--lg .fanui-checkbox__box::after,
+.fanui-radio--lg .fanui-checkbox__box::after {
+  width: 5px;
+  height: 10px;
+  margin: -6px 0 0 -2.5px;
+}
+
+.fanui-checkbox--card,
+.fanui-radio--card {
+  display: flex;
+  align-items: flex-start;
+  gap: var(--fanui-space-3);
+  padding: var(--fanui-space-3) var(--fanui-space-4);
+  border: 1px solid var(--fanui-color-border);
+  border-radius: var(--fanui-radius-md);
+  transition: border-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s;
+}
+.fanui-checkbox--card:hover,
+.fanui-radio--card:hover {
+  border-color: var(--fanui-color-border-strong);
+  background-color: var(--fanui-color-hover);
+}
+.fanui-checkbox--card:has(.fanui-checkbox__input:checked), .fanui-checkbox--card:has(.fanui-radio__input:checked), .fanui-checkbox--card.is-checked,
+.fanui-radio--card:has(.fanui-checkbox__input:checked),
+.fanui-radio--card:has(.fanui-radio__input:checked),
+.fanui-radio--card.is-checked {
+  border-color: var(--fanui-primary);
+  background-color: var(--fanui-primary-soft);
+}
+
+.fanui-checkbox--button,
+.fanui-radio--button {
+  padding: 6px 14px;
+  border: 1px solid var(--fanui-color-border);
+  border-radius: var(--fanui-radius-base);
+  font-size: var(--fanui-font-size-sm);
+  transition: border-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s;
+}
+.fanui-checkbox--button .fanui-checkbox__box,
+.fanui-checkbox--button .fanui-radio__box,
+.fanui-radio--button .fanui-checkbox__box,
+.fanui-radio--button .fanui-radio__box {
+  display: none;
+}
+.fanui-checkbox--button:has(.fanui-checkbox__input:checked), .fanui-checkbox--button:has(.fanui-radio__input:checked),
+.fanui-radio--button:has(.fanui-checkbox__input:checked),
+.fanui-radio--button:has(.fanui-radio__input:checked) {
+  border-color: var(--fanui-primary);
+  background-color: var(--fanui-primary);
+  color: var(--fanui-primary-fg);
+}
+
+.fanui-choice-group {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--fanui-space-4);
+}
+.fanui-choice-group--vertical {
+  flex-direction: column;
+  gap: var(--fanui-space-3);
+}
+.fanui-choice-group--tight {
+  gap: var(--fanui-space-2);
+}
+
+.fanui-segmented {
+  display: inline-flex;
+  padding: 2px;
+  background-color: var(--fanui-color-surface-sunken);
+  border: 1px solid var(--fanui-color-border);
+  border-radius: var(--fanui-radius-md);
+  gap: 2px;
+}
+.fanui-segmented__item {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: 6px;
+  padding: 6px 14px;
+  font-size: var(--fanui-font-size-sm);
+  font-weight: 500;
+  color: var(--fanui-color-text-muted);
+  border-radius: var(--fanui-radius-base);
+  cursor: pointer;
+  white-space: nowrap;
+  transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, color 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s, box-shadow 150ms cubic-bezier(0.4, 0, 0.2, 1) 0s;
+}
+.fanui-segmented__item input {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+}
+.fanui-segmented__item:hover {
+  color: var(--fanui-color-text);
+}
+.fanui-segmented__item:has(input:checked), .fanui-segmented__item.is-active, .fanui-segmented__item[aria-selected=true] {
+  color: var(--fanui-color-text-strong);
+  background-color: var(--fanui-color-surface);
+  box-shadow: var(--fanui-shadow-xs);
+}
+
+.fanui-switch {
+  --fanui-switch-w: 40px;
+  --fanui-switch-h: 22px;
+  --fanui-switch-travel: calc(var(--fanui-switch-w) - var(--fanui-switch-h));
+  display: inline-flex;
+  align-items: center;
+  gap: 10px;
+  cursor: pointer;
+  user-select: none;
+}
+.fanui-switch__input {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+}
+.fanui-switch__track {
+  position: relative;
+  flex: 0 0 auto;
+  width: var(--fanui-switch-w);
+  height: var(--fanui-switch-h);
+  background-color: var(--fanui-color-border-strong);
+  border: 1px solid transparent;
+  border-radius: 9999px;
+  box-sizing: border-box;
+  transition: background-color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0s, border-color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0s;
+}
+.fanui-switch__thumb {
+  position: absolute;
+  top: 2px;
+  left: 2px;
+  width: calc(var(--fanui-switch-h) - 4px);
+  height: calc(var(--fanui-switch-h) - 4px);
+  background-color: #ffffff;
+  border-radius: 50%;
+  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.3);
+  transition: transform 200ms cubic-bezier(0.34, 1.56, 0.64, 1) 0s;
+}
+.fanui-switch__label {
+  font-size: var(--fanui-font-size-base);
+}
+.fanui-switch__input:checked ~ .fanui-switch__track, .fanui-switch.is-checked .fanui-switch__track {
+  background-color: var(--fanui-primary);
+  border-color: var(--fanui-primary);
+}
+.fanui-switch__input:checked ~ .fanui-switch__track .fanui-switch__thumb, .fanui-switch.is-checked .fanui-switch__track .fanui-switch__thumb {
+  transform: translateX(var(--fanui-switch-travel));
+}
+.fanui-switch__input:focus-visible ~ .fanui-switch__track {
+  outline: 0;
+  box-shadow: 0 0 0 var(--fanui-focus-ring-offset, 1px) var(--fanui-color-surface, #fff), 0 0 0 calc(var(--fanui-focus-ring-offset, 1px) + var(--fanui-focus-ring-width, 3px)) var(--fanui-focus-ring-color, rgba(14, 116, 144, 0.3));
+}
+@media (forced-colors: active) {
+  .fanui-switch__input:focus-visible ~ .fanui-switch__track {
+    outline: 2px solid transparent;
+    outline-offset: 2px;
+  }
+}
+.fanui-switch__input:disabled ~ .fanui-switch__track {
+  opacity: 0.5;
+  cursor: not-allowed;
+}
+.fanui-switch--primary {
+  --fanui-switch-checked: var(--fanui-primary, #0e7490);
+}
+.fanui-switch--primary .fanui-switch__input:checked ~ .fanui-switch__track, .fanui-switch--primary.is-checked .fanui-switch__track {
+  background-color: var(--fanui-primary, #0e7490);
+  border-color: var(--fanui-primary, #0e7490);
+}
+.fanui-switch--accent {
+  --fanui-switch-checked: var(--fanui-accent, #7c3aed);
+}
+.fanui-switch--accent .fanui-switch__input:checked ~ .fanui-switch__track, .fanui-switch--accent.is-checked .fanui-switch__track {
+  background-color: var(--fanui-accent, #7c3aed);
+  border-color: var(--fanui-accent, #7c3aed);
+}
+.fanui-switch--success {
+  --fanui-switch-checked: var(--fanui-success, #047857);
+}
+.fanui-switch--success .fanui-switch__input:checked ~ .fanui-switch__track, .fanui-switch--success.is-checked .fanui-switch__track {
+  background-color: var(--fanui-success, #047857);
+  border-color: var(--fanui-success, #047857);
+}
+.fanui-switch--warning {
+  --fanui-switch-checked: var(--fanui-warning, #b45309);
+}
+.fanui-switch--warning .fanui-switch__input:checked ~ .fanui-switch__track, .fanui-switch--warning.is-checked .fanui-switch__track {
+  background-color: var(--fanui-warning, #b45309);
+  border-color: var(--fanui-warning, #b45309);
+}
+.fanui-switch--danger {
+  --fanui-switch-checked: var(--fanui-danger, #b91c1c);
+}
+.fanui-switch--danger .fanui-switch__input:checked ~ .fanui-switch__track, .fanui-switch--danger.is-checked .fanui-switch__track {
+  background-color: var(--fanui-danger, #b91c1c);
+  border-color: var(--fanui-danger, #b91c1c);
+}
+.fanui-switch--info {
+  --fanui-switch-checked: var(--fanui-info, #0369a1);
+}
+.fanui-switch--info .fanui-switch__input:checked ~ .fanui-switch__track, .fanui-switch--info.is-checked .fanui-switch__track {
+  background-color: var(--fanui-info, #0369a1);
+  border-color: var(--fanui-info, #0369a1);
+}
+.fanui-switch--sm {
+  --fanui-switch-w: 32px;
+  --fanui-switch-h: 18px;
+}
+.fanui-switch--lg {
+  --fanui-switch-w: 52px;
+  --fanui-switch-h: 28px;
+}
+.fanui-switch--loading .fanui-switch__thumb::after {
+  content: "";
+  position: absolute;
+  inset: 3px;
+  border: 2px solid var(--fanui-color-text-subtle);
+  border-top-color: transparent;
+  border-radius: 50%;
+  animation: fanui-spin 700ms linear infinite;
+}

package/dist/modules/fanui-choice.min.css

@@ -0,0 +1,83 @@
+.fanui-select,.fanui-select-multiple{display:block;width:100%;min-height:36px;padding:6.5px 14px;font-family:inherit;font-size:14px;line-height:1.5;color:var(--fanui-color-text);background-color:var(--fanui-color-surface);border:1px solid var(--fanui-color-border);border-radius:6px;box-sizing:border-box;appearance:none;-webkit-appearance:none;-moz-appearance:none;background-clip:padding-box;transition:border-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,box-shadow 150ms cubic-bezier(0.4,0,0.2,1) 0s,background-color 150ms cubic-bezier(0.4,0,0.2,1) 0s}
+.fanui-select::placeholder,.fanui-select-multiple::placeholder{color:var(--fanui-color-text-subtle);opacity:1}
+.fanui-select::-webkit-input-placeholder,.fanui-select-multiple::-webkit-input-placeholder{color:var(--fanui-color-text-subtle);opacity:1}
+.fanui-select::-moz-placeholder,.fanui-select-multiple::-moz-placeholder{color:var(--fanui-color-text-subtle);opacity:1}
+.fanui-select:-ms-input-placeholder,.fanui-select-multiple:-ms-input-placeholder{color:var(--fanui-color-text-subtle);opacity:1}
+.fanui-select:hover:not(:disabled):not(.is-disabled),.fanui-select-multiple:hover:not(:disabled):not(.is-disabled){border-color:var(--fanui-color-border-strong)}
+.fanui-select:focus,.fanui-select-multiple:focus,.fanui-select:focus-visible,.fanui-select-multiple:focus-visible{border-color:var(--fanui-primary);outline:0;box-shadow:0 0 0 var(--fanui-focus-ring-offset,1px) var(--fanui-color-surface,#fff),0 0 0 calc(var(--fanui-focus-ring-offset,1px) + var(--fanui-focus-ring-width,3px)) var(--fanui-focus-ring-color,rgba(14,116,144,0.3))}@media (forced-colors:active){.fanui-select:focus,.fanui-select-multiple:focus,.fanui-select:focus-visible,.fanui-select-multiple:focus-visible{outline:2px solid transparent;outline-offset:2px}}
+.fanui-select:disabled,.fanui-select-multiple:disabled,.fanui-select.is-disabled,.is-disabled.fanui-select-multiple{background-color:var(--fanui-color-disabled-bg);color:var(--fanui-color-disabled-text);cursor:not-allowed;resize:none}
+.fanui-select[readonly],[readonly].fanui-select-multiple{background-color:var(--fanui-color-surface-sunken)}
+.fanui-select,.fanui-select-multiple{padding-inline-end:32px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;background-size:16px;appearance:none;-webkit-appearance:none}
+.fanui-select[multiple],[multiple].fanui-select-multiple,.fanui-select[size]:not([size="1"]),[size].fanui-select-multiple:not([size="1"]){padding-inline-end:var(--fanui-control-px,14px);background-image:none;height:auto;min-height:88px}
+.fanui-select::-ms-expand,.fanui-select-multiple::-ms-expand{display:none}
+.fanui-select:disabled,.fanui-select-multiple:disabled{cursor:not-allowed}
+.fanui-select-multiple{min-height:96px;padding:6px}
+.fanui-select-multiple option{padding:4px 8px;border-radius:var(--fanui-radius-sm)}
+.fanui-select-multiple option:checked{background-color:var(--fanui-primary);color:var(--fanui-primary-fg)}
+.fanui-select-wrap{position:relative;display:block}
+.fanui-select-wrap__prefix{position:absolute;top:50%;left:12px;transform:translateY(-50%);color:var(--fanui-color-text-subtle);pointer-events:none}
+.fanui-select-wrap .fanui-select,.fanui-select-wrap .fanui-select-multiple{padding-inline-start:36px}
+.fanui-checkbox,.fanui-radio{display:inline-flex;align-items:flex-start;gap:8px;position:relative;font-size:var(--fanui-font-size-base);line-height:1.5;color:var(--fanui-color-text);cursor:pointer;user-select:none}
+.fanui-checkbox__input,.fanui-radio__input{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0,0,0,0) !important;white-space:nowrap !important;border:0 !important}
+.fanui-checkbox__input:focus-visible + .fanui-checkbox__box,.fanui-checkbox__input:focus-visible + .fanui-radio__box,.fanui-radio__input:focus-visible + .fanui-checkbox__box,.fanui-radio__input:focus-visible + .fanui-radio__box{outline:0;box-shadow:0 0 0 var(--fanui-focus-ring-offset,1px) var(--fanui-color-surface,#fff),0 0 0 calc(var(--fanui-focus-ring-offset,1px) + var(--fanui-focus-ring-width,3px)) var(--fanui-focus-ring-color,rgba(14,116,144,0.3))}@media (forced-colors:active){.fanui-checkbox__input:focus-visible + .fanui-checkbox__box,.fanui-checkbox__input:focus-visible + .fanui-radio__box,.fanui-radio__input:focus-visible + .fanui-checkbox__box,.fanui-radio__input:focus-visible + .fanui-radio__box{outline:2px solid transparent;outline-offset:2px}}
+.fanui-checkbox__label,.fanui-radio__label{flex:1 1 auto;min-width:0}
+.fanui-checkbox__desc,.fanui-radio__desc{display:block;margin-top:2px;font-size:var(--fanui-font-size-sm);color:var(--fanui-color-text-muted)}
+.fanui-checkbox.is-disabled,.fanui-checkbox__input:disabled~.fanui-checkbox__label,.fanui-radio.is-disabled,.fanui-checkbox__input:disabled~.fanui-radio__label,.fanui-radio__input:disabled~.fanui-checkbox__label,.fanui-radio__input:disabled~.fanui-radio__label{color:var(--fanui-color-disabled-text);cursor:not-allowed}
+.fanui-checkbox__input:disabled + .fanui-checkbox__box,.fanui-checkbox__input:disabled + .fanui-radio__box,.fanui-radio__input:disabled + .fanui-checkbox__box,.fanui-radio__input:disabled + .fanui-radio__box{background-color:var(--fanui-color-disabled-bg);border-color:var(--fanui-color-border);cursor:not-allowed}
+.fanui-checkbox__input:disabled + .fanui-checkbox__box::after,.fanui-checkbox__input:disabled + .fanui-radio__box::after,.fanui-radio__input:disabled + .fanui-checkbox__box::after,.fanui-radio__input:disabled + .fanui-radio__box::after{opacity:0.45}
+.fanui-checkbox__box{position:relative;flex:0 0 auto;width:16px;height:16px;margin-top:3px;background-color:var(--fanui-color-surface);border:1px solid var(--fanui-color-border-strong);border-radius:var(--fanui-radius-sm);box-sizing:border-box;transition:background-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,border-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,box-shadow 150ms cubic-bezier(0.4,0,0.2,1) 0s}
+.fanui-checkbox__box::after{content:"";position:absolute;top:50%;left:50%;width:4px;height:8px;margin:-5px 0 0 -2px;border:solid var(--fanui-color-text-inverse);border-width:0 2px 2px 0;transform:rotate(45deg) scale(0.6);opacity:0;transition:opacity 150ms cubic-bezier(0.34,1.56,0.64,1) 0s,transform 150ms cubic-bezier(0.34,1.56,0.64,1) 0s}
+.fanui-checkbox:hover .fanui-checkbox__box{border-color:var(--fanui-primary)}
+.fanui-checkbox__input:checked + .fanui-checkbox__box,.fanui-checkbox.is-checked .fanui-checkbox__box{background-color:var(--fanui-primary);border-color:var(--fanui-primary)}
+.fanui-checkbox__input:checked + .fanui-checkbox__box::after,.fanui-checkbox.is-checked .fanui-checkbox__box::after{opacity:1;transform:rotate(45deg) scale(1)}
+.fanui-checkbox__input:indeterminate + .fanui-checkbox__box{background-color:var(--fanui-primary);border-color:var(--fanui-primary)}
+.fanui-checkbox__input:indeterminate + .fanui-checkbox__box::after{width:8px;height:0;margin:-1px 0 0 -4px;border-width:0 0 2px 0;transform:none;opacity:1}
+.fanui-radio__box{position:relative;flex:0 0 auto;width:16px;height:16px;margin-top:3px;background-color:var(--fanui-color-surface);border:1px solid var(--fanui-color-border-strong);border-radius:50%;box-sizing:border-box;transition:background-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,border-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,box-shadow 150ms cubic-bezier(0.4,0,0.2,1) 0s}
+.fanui-radio__box::after{content:"";position:absolute;top:50%;left:50%;width:6px;height:6px;margin:-3px 0 0 -3px;background-color:var(--fanui-color-text-inverse);border-radius:50%;transform:scale(0);opacity:0;transition:opacity 150ms cubic-bezier(0.34,1.56,0.64,1) 0s,transform 150ms cubic-bezier(0.34,1.56,0.64,1) 0s}
+.fanui-radio:hover .fanui-radio__box{border-color:var(--fanui-primary)}
+.fanui-radio__input:checked + .fanui-radio__box,.fanui-radio.is-checked .fanui-radio__box{background-color:var(--fanui-primary);border-color:var(--fanui-primary)}
+.fanui-radio__input:checked + .fanui-radio__box::after,.fanui-radio.is-checked .fanui-radio__box::after{opacity:1;transform:scale(1)}
+.fanui-checkbox--sm .fanui-checkbox__box,.fanui-checkbox--sm .fanui-radio__box,.fanui-radio--sm .fanui-checkbox__box,.fanui-radio--sm .fanui-radio__box{width:14px;height:14px}
+.fanui-checkbox--lg,.fanui-radio--lg{font-size:var(--fanui-font-size-md)}
+.fanui-checkbox--lg .fanui-checkbox__box,.fanui-checkbox--lg .fanui-radio__box,.fanui-radio--lg .fanui-checkbox__box,.fanui-radio--lg .fanui-radio__box{width:20px;height:20px;border-radius:var(--fanui-radius-base)}
+.fanui-checkbox--lg .fanui-radio__box,.fanui-radio--lg .fanui-radio__box{border-radius:50%}
+.fanui-checkbox--lg .fanui-radio__box::after,.fanui-radio--lg .fanui-radio__box::after{width:8px;height:8px;margin:-4px 0 0 -4px}
+.fanui-checkbox--lg .fanui-checkbox__box::after,.fanui-radio--lg .fanui-checkbox__box::after{width:5px;height:10px;margin:-6px 0 0 -2.5px}
+.fanui-checkbox--card,.fanui-radio--card{display:flex;align-items:flex-start;gap:var(--fanui-space-3);padding:var(--fanui-space-3) var(--fanui-space-4);border:1px solid var(--fanui-color-border);border-radius:var(--fanui-radius-md);transition:border-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,background-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,box-shadow 150ms cubic-bezier(0.4,0,0.2,1) 0s}
+.fanui-checkbox--card:hover,.fanui-radio--card:hover{border-color:var(--fanui-color-border-strong);background-color:var(--fanui-color-hover)}
+.fanui-checkbox--card:has(.fanui-checkbox__input:checked),.fanui-checkbox--card:has(.fanui-radio__input:checked),.fanui-checkbox--card.is-checked,.fanui-radio--card:has(.fanui-checkbox__input:checked),.fanui-radio--card:has(.fanui-radio__input:checked),.fanui-radio--card.is-checked{border-color:var(--fanui-primary);background-color:var(--fanui-primary-soft)}
+.fanui-checkbox--button,.fanui-radio--button{padding:6px 14px;border:1px solid var(--fanui-color-border);border-radius:var(--fanui-radius-base);font-size:var(--fanui-font-size-sm);transition:border-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,background-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,color 150ms cubic-bezier(0.4,0,0.2,1) 0s}
+.fanui-checkbox--button .fanui-checkbox__box,.fanui-checkbox--button .fanui-radio__box,.fanui-radio--button .fanui-checkbox__box,.fanui-radio--button .fanui-radio__box{display:none}
+.fanui-checkbox--button:has(.fanui-checkbox__input:checked),.fanui-checkbox--button:has(.fanui-radio__input:checked),.fanui-radio--button:has(.fanui-checkbox__input:checked),.fanui-radio--button:has(.fanui-radio__input:checked){border-color:var(--fanui-primary);background-color:var(--fanui-primary);color:var(--fanui-primary-fg)}
+.fanui-choice-group{display:flex;flex-wrap:wrap;gap:var(--fanui-space-4)}
+.fanui-choice-group--vertical{flex-direction:column;gap:var(--fanui-space-3)}
+.fanui-choice-group--tight{gap:var(--fanui-space-2)}
+.fanui-segmented{display:inline-flex;padding:2px;background-color:var(--fanui-color-surface-sunken);border:1px solid var(--fanui-color-border);border-radius:var(--fanui-radius-md);gap:2px}
+.fanui-segmented__item{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 14px;font-size:var(--fanui-font-size-sm);font-weight:500;color:var(--fanui-color-text-muted);border-radius:var(--fanui-radius-base);cursor:pointer;white-space:nowrap;transition:background-color 150ms cubic-bezier(0.4,0,0.2,1) 0s,color 150ms cubic-bezier(0.4,0,0.2,1) 0s,box-shadow 150ms cubic-bezier(0.4,0,0.2,1) 0s}
+.fanui-segmented__item input{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0,0,0,0) !important;white-space:nowrap !important;border:0 !important}
+.fanui-segmented__item:hover{color:var(--fanui-color-text)}
+.fanui-segmented__item:has(input:checked),.fanui-segmented__item.is-active,.fanui-segmented__item[aria-selected=true]{color:var(--fanui-color-text-strong);background-color:var(--fanui-color-surface);box-shadow:var(--fanui-shadow-xs)}
+.fanui-switch{--fanui-switch-w:40px;--fanui-switch-h:22px;--fanui-switch-travel:calc(var(--fanui-switch-w) - var(--fanui-switch-h));display:inline-flex;align-items:center;gap:10px;cursor:pointer;user-select:none}
+.fanui-switch__input{position:absolute !important;width:1px !important;height:1px !important;padding:0 !important;margin:-1px !important;overflow:hidden !important;clip:rect(0,0,0,0) !important;white-space:nowrap !important;border:0 !important}
+.fanui-switch__track{position:relative;flex:0 0 auto;width:var(--fanui-switch-w);height:var(--fanui-switch-h);background-color:var(--fanui-color-border-strong);border:1px solid transparent;border-radius:9999px;box-sizing:border-box;transition:background-color 200ms cubic-bezier(0.4,0,0.2,1) 0s,border-color 200ms cubic-bezier(0.4,0,0.2,1) 0s}
+.fanui-switch__thumb{position:absolute;top:2px;left:2px;width:calc(var(--fanui-switch-h) - 4px);height:calc(var(--fanui-switch-h) - 4px);background-color:#ffffff;border-radius:50%;box-shadow:0 1px 3px rgba(15,23,42,0.3);transition:transform 200ms cubic-bezier(0.34,1.56,0.64,1) 0s}
+.fanui-switch__label{font-size:var(--fanui-font-size-base)}
+.fanui-switch__input:checked~.fanui-switch__track,.fanui-switch.is-checked .fanui-switch__track{background-color:var(--fanui-primary);border-color:var(--fanui-primary)}
+.fanui-switch__input:checked~.fanui-switch__track .fanui-switch__thumb,.fanui-switch.is-checked .fanui-switch__track .fanui-switch__thumb{transform:translateX(var(--fanui-switch-travel))}
+.fanui-switch__input:focus-visible~.fanui-switch__track{outline:0;box-shadow:0 0 0 var(--fanui-focus-ring-offset,1px) var(--fanui-color-surface,#fff),0 0 0 calc(var(--fanui-focus-ring-offset,1px) + var(--fanui-focus-ring-width,3px)) var(--fanui-focus-ring-color,rgba(14,116,144,0.3))}@media (forced-colors:active){.fanui-switch__input:focus-visible~.fanui-switch__track{outline:2px solid transparent;outline-offset:2px}}
+.fanui-switch__input:disabled~.fanui-switch__track{opacity:0.5;cursor:not-allowed}
+.fanui-switch--primary{--fanui-switch-checked:var(--fanui-primary,#0e7490)}
+.fanui-switch--primary .fanui-switch__input:checked~.fanui-switch__track,.fanui-switch--primary.is-checked .fanui-switch__track{background-color:var(--fanui-primary,#0e7490);border-color:var(--fanui-primary,#0e7490)}
+.fanui-switch--accent{--fanui-switch-checked:var(--fanui-accent,#7c3aed)}
+.fanui-switch--accent .fanui-switch__input:checked~.fanui-switch__track,.fanui-switch--accent.is-checked .fanui-switch__track{background-color:var(--fanui-accent,#7c3aed);border-color:var(--fanui-accent,#7c3aed)}
+.fanui-switch--success{--fanui-switch-checked:var(--fanui-success,#047857)}
+.fanui-switch--success .fanui-switch__input:checked~.fanui-switch__track,.fanui-switch--success.is-checked .fanui-switch__track{background-color:var(--fanui-success,#047857);border-color:var(--fanui-success,#047857)}
+.fanui-switch--warning{--fanui-switch-checked:var(--fanui-warning,#b45309)}
+.fanui-switch--warning .fanui-switch__input:checked~.fanui-switch__track,.fanui-switch--warning.is-checked .fanui-switch__track{background-color:var(--fanui-warning,#b45309);border-color:var(--fanui-warning,#b45309)}
+.fanui-switch--danger{--fanui-switch-checked:var(--fanui-danger,#b91c1c)}
+.fanui-switch--danger .fanui-switch__input:checked~.fanui-switch__track,.fanui-switch--danger.is-checked .fanui-switch__track{background-color:var(--fanui-danger,#b91c1c);border-color:var(--fanui-danger,#b91c1c)}
+.fanui-switch--info{--fanui-switch-checked:var(--fanui-info,#0369a1)}
+.fanui-switch--info .fanui-switch__input:checked~.fanui-switch__track,.fanui-switch--info.is-checked .fanui-switch__track{background-color:var(--fanui-info,#0369a1);border-color:var(--fanui-info,#0369a1)}
+.fanui-switch--sm{--fanui-switch-w:32px;--fanui-switch-h:18px}
+.fanui-switch--lg{--fanui-switch-w:52px;--fanui-switch-h:28px}
+.fanui-switch--loading .fanui-switch__thumb::after{content:"";position:absolute;inset:3px;border:2px solid var(--fanui-color-text-subtle);border-top-color:transparent;border-radius:50%;animation:fanui-spin 700ms linear infinite}