:where(.tw-button, .button, button[type="submit"], input[type="submit"]) {
	min-height: var(--tw-control-height-md);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--tw-space-2);
	padding-inline: var(--tw-space-6);
	border: 1px solid var(--tw-color-brand);
	border-radius: var(--tw-radius-md);
	background: var(--tw-color-brand);
	color: var(--tw-color-on-brand);
	font-weight: 700;
	line-height: 1;
	text-decoration: none;
	box-shadow: var(--tw-shadow-sm);
	transition: color var(--tw-duration-normal) var(--tw-ease-standard), background-color var(--tw-duration-normal) var(--tw-ease-standard), border-color var(--tw-duration-normal) var(--tw-ease-standard), box-shadow var(--tw-duration-normal) var(--tw-ease-standard);
}
:where(.tw-button, .button, button[type="submit"], input[type="submit"]):hover { border-color: var(--tw-color-ink); background: var(--tw-color-ink); color: var(--tw-color-on-strong); box-shadow: var(--tw-shadow-md); }
.tw-button--secondary { border-color: var(--tw-color-border-strong); background: var(--tw-color-surface); color: var(--tw-color-ink); box-shadow: none; }
.tw-button--ghost { border-color: transparent; background: transparent; color: var(--tw-color-ink); box-shadow: none; }
.tw-button--danger { border-color: var(--tw-color-danger); background: var(--tw-color-danger); color: var(--tw-color-on-strong); }
.tw-button--sm { min-height: var(--tw-control-height-sm); padding-inline: var(--tw-space-4); font-size: var(--tw-font-size-sm); }
.tw-button--lg { min-height: var(--tw-control-height-lg); padding-inline: var(--tw-space-8); }
:where(.tw-button, .button, button, input, select, textarea):disabled, [aria-disabled="true"] { cursor: not-allowed; opacity: var(--tw-opacity-disabled); box-shadow: none; }
.tw-button.is-loading { color: transparent; pointer-events: none; position: relative; }
.tw-button.is-loading::after { position: absolute; width: 1.25rem; height: 1.25rem; border: 2px solid currentcolor; border-inline-start-color: transparent; border-radius: 50%; color: var(--tw-color-ink); animation: tw-spin .7s linear infinite; content: ""; }

.tw-field { display: grid; gap: var(--tw-space-2); }
.tw-label { color: var(--tw-color-ink); font-size: var(--tw-font-size-sm); font-weight: 600; }
.tw-help { color: var(--tw-color-text-muted); font-size: var(--tw-font-size-sm); }
:where(.tw-input, .tw-select, .tw-textarea, input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), select, textarea) { width: 100%; min-height: var(--tw-control-height-md); padding: var(--tw-space-3) var(--tw-space-4); border: 1px solid var(--tw-color-border-strong); border-radius: var(--tw-radius-md); background: var(--tw-color-surface); color: var(--tw-color-ink); transition: border-color var(--tw-duration-fast), box-shadow var(--tw-duration-fast); }
:where(.tw-input, .tw-select, .tw-textarea, input, select, textarea):focus { border-color: var(--tw-color-focus); box-shadow: 0 0 0 3px var(--tw-color-focus-ring); outline: 0; }
[aria-invalid="true"] { border-color: var(--tw-color-danger) !important; }
.tw-field__error { color: var(--tw-color-danger); font-size: var(--tw-font-size-sm); }
.tw-check { display: inline-flex; align-items: flex-start; gap: var(--tw-space-2); min-height: 44px; }
.tw-check input { width: 1.25rem; height: 1.25rem; margin-block-start: .2rem; accent-color: var(--tw-color-brand-hover); }

.tw-notice { display: flex; gap: var(--tw-space-3); padding: var(--tw-space-4); border: 1px solid var(--tw-color-border); border-inline-start-width: 4px; border-radius: var(--tw-radius-md); background: var(--tw-color-surface); }
.tw-notice--success { border-inline-start-color: var(--tw-color-success); background: var(--tw-color-success-soft); }
.tw-notice--warning { border-inline-start-color: var(--tw-color-warning); background: var(--tw-color-warning-soft); }
.tw-notice--danger { border-inline-start-color: var(--tw-color-danger); background: var(--tw-color-danger-soft); }
.tw-notice--info { border-inline-start-color: var(--tw-color-info); background: var(--tw-color-info-soft); }

.tw-card { padding: var(--tw-space-card); border: var(--tw-border-width) solid var(--tw-color-border); border-radius: var(--tw-radius-lg); background: var(--tw-color-surface); box-shadow: var(--tw-shadow-sm); }
.tw-modal[hidden] { display: none; }
.tw-modal { position: fixed; inset: 0; z-index: var(--tw-z-modal); display: grid; place-items: center; padding: var(--tw-gutter); }
.tw-modal__backdrop { position: absolute; inset: 0; background: var(--tw-color-overlay); }
.tw-modal__dialog { position: relative; width: min(100%, 32rem); max-height: min(85dvh, 48rem); overflow: auto; padding: var(--tw-space-6); border-radius: var(--tw-radius-xl); background: var(--tw-color-surface); box-shadow: var(--tw-shadow-lg); }
.tw-modal__close { position: absolute; inset-block-start: var(--tw-space-3); inset-inline-end: var(--tw-space-3); width: 44px; min-height: 44px; padding: 0; border-color: transparent; background: transparent; box-shadow: none; font-size: 1.5rem; }
body.tw-modal-open { overflow: hidden; }
.tw-spinner { width: 1.5rem; height: 1.5rem; border: 3px solid var(--tw-color-border); border-block-start-color: var(--tw-color-brand-hover); border-radius: 50%; animation: tw-spin .7s linear infinite; }
.tw-skeleton { min-height: 1rem; border-radius: var(--tw-radius-sm); background: linear-gradient(90deg, var(--tw-color-skeleton) 25%, var(--tw-color-skeleton-highlight) 50%, var(--tw-color-skeleton) 75%); background-size: 200% 100%; animation: tw-skeleton 1.4s ease infinite; }
.tw-demo-span-6 { grid-column: span 6; }
.tw-demo-span-all { grid-column: 1 / -1; }
.tw-demo-skeleton { width: min(100%, 24rem); margin-block-start: var(--tw-space-4); }

@keyframes tw-spin { to { transform: rotate(1turn); } }
@keyframes tw-skeleton { to { background-position: -200% 0; } }

@media (max-width: 479px) {
	.tw-button--block-mobile { width: 100%; }
	.tw-modal__dialog { padding: var(--tw-space-5); border-radius: var(--tw-radius-lg); }
}

@media (max-width: 767px) {
	.tw-demo-span-6, .tw-demo-span-all { grid-column: auto; }
}