.vwsm-user-connect {
	--vwsm-bg: #ffffff;
	--vwsm-surface: #f6f7f7;
	--vwsm-text: #1d2327;
	--vwsm-muted: #50575e;
	--vwsm-border: #dcdcde;
	--vwsm-row-border: #f0f0f1;
	--vwsm-accent: #2271b1;
	--vwsm-accent-contrast: #ffffff;
	--vwsm-info-bg: #f0f6fc;
	--vwsm-info-border: #72aee6;
	--vwsm-success-bg: #edfaef;
	--vwsm-success-border: #00a32a;
	--vwsm-error-bg: #fcf0f1;
	--vwsm-error-border: #d63638;
}
html[data-theme="dark"] .vwsm-user-connect.vwsm-fanspaysite {
	--vwsm-bg: var(--background-color, #161a1f);
	--vwsm-surface: rgba(255, 255, 255, 0.07);
	--vwsm-text: var(--text-color, #f5f8fb);
	--vwsm-muted: rgba(245, 248, 251, 0.86);
	--vwsm-border: rgba(255, 255, 255, 0.2);
	--vwsm-row-border: rgba(255, 255, 255, 0.12);
	--vwsm-accent: var(--link-color, #6cb9ff);
	--vwsm-accent-contrast: #0f1419;
	--vwsm-info-bg: rgba(108, 185, 255, 0.17);
	--vwsm-info-border: var(--link-color, #6cb9ff);
	--vwsm-success-bg: rgba(56, 199, 129, 0.2);
	--vwsm-success-border: #38c781;
	--vwsm-error-bg: rgba(255, 97, 97, 0.18);
	--vwsm-error-border: #ff6161;
}
html[data-theme="light"] .vwsm-user-connect.vwsm-fanspaysite {
	--vwsm-bg: var(--background-color, #ffffff);
	--vwsm-surface: rgba(0, 0, 0, 0.03);
	--vwsm-text: var(--text-color, #1d2327);
	--vwsm-muted: var(--text-color, #50575e);
	--vwsm-border: rgba(0, 0, 0, 0.16);
	--vwsm-row-border: rgba(0, 0, 0, 0.1);
	--vwsm-accent: var(--link-color, #2271b1);
	--vwsm-accent-contrast: #ffffff;
	--vwsm-info-bg: rgba(34, 113, 177, 0.1);
	--vwsm-info-border: var(--link-color, #2271b1);
	--vwsm-success-bg: rgba(0, 163, 42, 0.1);
	--vwsm-success-border: #00a32a;
	--vwsm-error-bg: rgba(214, 54, 56, 0.1);
	--vwsm-error-border: #d63638;
}
.vwsm-user-connect,
.vwsm-user-connect p,
.vwsm-user-connect li,
.vwsm-user-connect label,
.vwsm-user-connect td,
.vwsm-user-connect th,
.vwsm-user-connect h2,
.vwsm-user-connect h3,
.vwsm-user-connect h4 {
	color: var(--vwsm-text);
}
.vwsm-user-connect .description {
	color: var(--vwsm-muted);
}
.vwsm-user-connect .notice {
	margin: 0 0 1rem;
	padding: .8rem 1rem;
	border-radius: 6px;
	background: var(--vwsm-info-bg);
	border-left: 4px solid var(--vwsm-info-border);
}
.vwsm-user-connect .notice.notice-success {
	background: var(--vwsm-success-bg);
	border-left-color: var(--vwsm-success-border);
}
.vwsm-user-connect .notice.notice-error {
	background: var(--vwsm-error-bg);
	border-left-color: var(--vwsm-error-border);
}
.vwsm-user-connect .notice p {
	margin: 0;
}
.vwsm-card {
	margin: 0 0 1rem;
	padding: 1.25rem;
	border: 1px solid var(--vwsm-border);
	border-radius: 8px;
	background: var(--vwsm-bg);
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03);
}
.vwsm-heading {
	margin: 0 0 .75rem;
	font-size: 1.25rem;
	line-height: 1.3;
}
.vwsm-tab-row {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin: 1rem 0;
}
.vwsm-tab-button {
	border: 1px solid var(--vwsm-border);
	border-radius: 999px;
	background: var(--vwsm-surface);
	color: var(--vwsm-text);
	padding: .55rem .9rem;
	font: inherit;
	cursor: pointer;
}
.vwsm-tab-button.is-active {
	background: var(--vwsm-accent);
	border-color: var(--vwsm-accent);
	color: var(--vwsm-accent-contrast);
}
.vwsm-tab-panel {
	display: none;
	padding-top: .25rem;
}
.vwsm-tab-panel.is-active {
	display: block;
}
.vwsm-steps {
	margin: 0 0 1rem 1.25rem;
}
.vwsm-steps li {
	margin-bottom: .55rem;
}
.vwsm-code-row label {
	display: block;
	margin-bottom: .45rem;
	font-weight: 600;
}
.vwsm-code-area {
	width: 100%;
	max-width: 100%;
	min-height: 3.25rem;
	padding: .75rem;
	border: 1px solid var(--vwsm-border);
	border-radius: 6px;
	background: var(--vwsm-surface);
	color: var(--vwsm-text);
	font: 13px/1.5 SFMono-Regular, Menlo, Monaco, Consolas, monospace;
	box-sizing: border-box;
	resize: vertical;
}
.vwsm-user-context-input {
	display: block;
	width: 100%;
	max-width: 100%;
	min-height: 9rem;
	padding: .75rem;
	border: 1px solid var(--vwsm-border);
	border-radius: 6px;
	background: var(--vwsm-bg);
	color: var(--vwsm-text);
	font: inherit;
	line-height: 1.5;
	box-sizing: border-box;
	resize: vertical;
}
.vwsm-user-connect .widefat {
	border-color: var(--vwsm-border);
	background: var(--vwsm-bg);
}
.vwsm-user-connect .widefat td,
.vwsm-user-connect .widefat th {
	border-bottom-color: var(--vwsm-row-border);
}
.vwsm-user-connect code {
	background: var(--vwsm-surface);
	color: var(--vwsm-text);
}
.vwsm-sample-prompts {
	margin: .5rem 0 0 1.25rem;
}
.vwsm-sample-prompts li {
	margin-bottom: .45rem;
}
.vwsm-info-message {
	padding: .85rem 1rem;
	border-left: 4px solid var(--vwsm-info-border);
	background: var(--vwsm-info-bg);
	border-radius: 4px;
}
