body.auth-page {
	background:
		radial-gradient(circle at top left, rgba(130, 235, 196, 0.18), transparent 30%),
		radial-gradient(circle at bottom right, rgba(255, 124, 164, 0.18), transparent 35%),
		linear-gradient(135deg, #10192f 0%, #172447 48%, #261b44 100%);
	color: rgba(255, 255, 255, 0.82);
	font-family: "Trebuchet MS", "Segoe UI", sans-serif;
	min-height: 100vh;
	overflow-x: hidden;
}

body.auth-page:before,
body.auth-page:after {
	content: '';
	position: fixed;
	pointer-events: none;
	inset: auto;
	border-radius: 50%;
	filter: blur(0.2em);
	opacity: 0.6;
}

body.auth-page:before {
	background: linear-gradient(135deg, rgba(123, 255, 214, 0.4), rgba(123, 255, 214, 0));
	height: 20rem;
	right: -4rem;
	top: 4rem;
	width: 20rem;
	animation: driftOne 14s ease-in-out infinite;
}

body.auth-page:after {
	background: linear-gradient(135deg, rgba(255, 141, 182, 0.3), rgba(255, 141, 182, 0));
	bottom: 2rem;
	height: 18rem;
	left: -3rem;
	width: 18rem;
	animation: driftTwo 16s ease-in-out infinite;
}

.auth-scene {
	align-items: center;
	display: flex;
	justify-content: center;
	min-height: 100vh;
	padding: 2rem;
	position: relative;
}

.auth-backdrop {
	inset: 0;
	overflow: hidden;
	position: fixed;
}

.auth-grid {
	background-image:
		linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
	background-size: 3rem 3rem;
	inset: 0;
	mask-image: linear-gradient(180deg, rgba(0, 0, 0, 0.65), transparent 85%);
	position: absolute;
}

.auth-orb {
	border-radius: 50%;
	filter: blur(3px);
	position: absolute;
}

.auth-orb.orb-one {
	background: radial-gradient(circle, rgba(71, 214, 176, 0.8) 0%, rgba(71, 214, 176, 0.1) 68%, transparent 75%);
	height: 16rem;
	left: 8%;
	top: 16%;
	width: 16rem;
	animation: floatOrb 15s ease-in-out infinite;
}

.auth-orb.orb-two {
	background: radial-gradient(circle, rgba(255, 112, 163, 0.7) 0%, rgba(255, 112, 163, 0.08) 68%, transparent 75%);
	height: 22rem;
	right: 12%;
	top: 18%;
	width: 22rem;
	animation: floatOrb 18s ease-in-out infinite reverse;
}

.auth-orb.orb-three {
	background: radial-gradient(circle, rgba(116, 164, 255, 0.7) 0%, rgba(116, 164, 255, 0.1) 68%, transparent 75%);
	bottom: 6%;
	height: 18rem;
	left: 38%;
	width: 18rem;
	animation: pulseOrb 12s ease-in-out infinite;
}

.auth-card {
	background: rgba(10, 16, 31, 0.72);
	backdrop-filter: blur(18px);
	border: 1px solid rgba(255, 255, 255, 0.14);
	border-radius: 1.6rem;
	box-shadow: 0 2rem 5rem rgba(8, 12, 24, 0.45);
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	max-width: 72rem;
	opacity: 0;
	overflow: hidden;
	transform: translateY(2rem) scale(0.98);
	transition: opacity 0.8s ease, transform 0.8s ease;
	width: min(100%, 72rem);
}

body.is-ready .auth-card {
	opacity: 1;
	transform: translateY(0) scale(1);
}

.auth-highlight,
.auth-form-shell {
	padding: 3.25rem;
	position: relative;
}

.auth-highlight {
	background:
		linear-gradient(160deg, rgba(79, 217, 176, 0.16), rgba(79, 217, 176, 0.02)),
		linear-gradient(180deg, rgba(255, 255, 255, 0.04), transparent 60%);
	border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.auth-home {
	border: 0;
	color: #ffffff;
	display: inline-block;
	font-size: 0.9rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	margin-bottom: 2.25rem;
	text-transform: uppercase;
}

.auth-badge {
	background: rgba(255, 255, 255, 0.08);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 999px;
	color: rgba(255, 255, 255, 0.88);
	display: inline-flex;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	margin-bottom: 1rem;
	padding: 0.5rem 0.9rem;
	text-transform: uppercase;
}

.auth-highlight h1 {
	font-size: clamp(2.2rem, 4vw, 3.6rem);
	line-height: 1.05;
	margin-bottom: 1rem;
	max-width: 12ch;
}

.auth-lead {
	color: rgba(255, 255, 255, 0.72);
	font-size: 1rem;
	margin-bottom: 2rem;
	max-width: 32rem;
}

.auth-floating-stat {
	background: rgba(255, 255, 255, 0.06);
	border: 1px solid rgba(255, 255, 255, 0.1);
	border-radius: 1.15rem;
	margin-bottom: 2rem;
	padding: 1.1rem 1.2rem;
}

.auth-floating-stat strong,
.auth-floating-stat span {
	display: block;
}

.auth-floating-stat strong {
	font-size: 0.8rem;
	letter-spacing: 0.12em;
	margin-bottom: 0.4rem;
	text-transform: uppercase;
}

.auth-rotating-text {
	color: #7af2ca;
	display: inline-block;
	font-size: 1.6rem;
	font-weight: 700;
	min-width: 7ch;
	opacity: 0.55;
	transform: translateY(0.25rem);
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.auth-rotating-text.is-visible,
.auth-rotating-text {
	opacity: 1;
	transform: translateY(0);
}

.auth-form-shell {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.auth-panel-header h2 {
	font-size: 1.9rem;
	margin-bottom: 0.35rem;
}

.auth-panel-header p {
	color: rgba(255, 255, 255, 0.62);
	font-size: 0.96rem;
	margin-bottom: 2rem;
}

.auth-form {
	display: grid;
	gap: 1rem;
}

.auth-field {
	display: grid;
	gap: 0.45rem;
}

.auth-field label {
	color: rgba(255, 255, 255, 0.84);
	font-size: 0.84rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.auth-field input,
.auth-field select {
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 0.95rem;
	color: #ffffff;
	font-size: 1rem;
	min-height: 3.5rem;
	padding: 0 1rem;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.auth-field input:focus,
.auth-field select:focus {
	border-color: rgba(122, 242, 202, 0.8);
	box-shadow: 0 0 0 0.25rem rgba(122, 242, 202, 0.12);
	transform: translateY(-1px);
}

.auth-field select {
	appearance: none;
	background-image:
		linear-gradient(45deg, transparent 50%, rgba(255, 255, 255, 0.76) 50%),
		linear-gradient(135deg, rgba(255, 255, 255, 0.76) 50%, transparent 50%);
	background-position:
		calc(100% - 1.4rem) calc(50% - 0.15rem),
		calc(100% - 1rem) calc(50% - 0.15rem);
	background-repeat: no-repeat;
	background-size: 0.42rem 0.42rem, 0.42rem 0.42rem;
	padding-right: 3rem;
}

.auth-field input:disabled,
.auth-field select:disabled,
.dashboard-form .auth-field textarea:disabled {
	cursor: not-allowed;
	opacity: 0.6;
	transform: none !important;
}

.auth-captcha {
	background: rgba(255, 255, 255, 0.04);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 1rem;
	display: grid;
	gap: 0.8rem;
	padding: 1rem;
}

.auth-captcha[hidden] {
	display: none !important;
}

.auth-captcha-copy {
	color: rgba(255, 255, 255, 0.72);
	font-size: 0.9rem;
	margin: 0;
}

.auth-captcha-widget {
	display: flex;
	justify-content: center;
	min-height: 78px;
	overflow-x: auto;
}

.auth-captcha-widget > div {
	margin: 0 auto;
}

.auth-submit {
	background: linear-gradient(135deg, #7af2ca 0%, #7d8cff 100%);
	border: 0;
	border-radius: 999px;
	color: #071120;
	font-size: 0.9rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	margin-top: 0.5rem;
	min-height: 3.6rem;
	text-transform: uppercase;
	transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
}

.auth-submit:hover,
.auth-submit:focus {
	box-shadow: 0 1rem 2rem rgba(125, 140, 255, 0.22);
	transform: translateY(-2px);
}

.auth-submit:disabled {
	cursor: default;
	opacity: 0.65;
	transform: none;
}

.auth-switch {
	color: rgba(255, 255, 255, 0.65);
	font-size: 0.95rem;
	margin: 1.5rem 0 0 0;
}

.auth-summary-title {
	color: rgba(255, 255, 255, 0.6);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	margin-bottom: 0.35rem;
	text-transform: uppercase;
}

[data-auth-summary] strong,
[data-auth-summary] span {
	display: block;
}

[data-auth-summary] span {
	color: rgba(255, 255, 255, 0.66);
	font-size: 0.95rem;
}

.auth-feedback {
	font-size: 0.92rem;
	margin: 0.25rem 0 0 0;
	min-height: 1.5rem;
}

.auth-feedback.is-success {
	color: #7af2ca;
}

.auth-feedback.is-error {
	color: #ff9eb6;
}

.auth-feedback.is-loading {
	color: #a9bcff;
}

.auth-modal {
	inset: 0;
	opacity: 0;
	pointer-events: none;
	position: fixed;
	transition: opacity 0.22s ease, visibility 0.22s ease;
	visibility: hidden;
	z-index: 10040;
}

.auth-modal[hidden] {
	display: none !important;
}

.auth-modal.is-visible {
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}

.auth-modal-backdrop {
	background: rgba(7, 11, 24, 0.52);
	backdrop-filter: blur(8px);
	inset: 0;
	position: absolute;
}

.auth-modal-card {
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.018)),
		linear-gradient(160deg, rgba(79, 217, 176, 0.12), rgba(79, 217, 176, 0.03) 52%, rgba(109, 126, 255, 0.04) 100%);
	background-color: rgba(10, 16, 31, 0.92);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 1.5rem;
	box-shadow: 0 2rem 4.5rem rgba(8, 12, 24, 0.4);
	left: 50%;
	max-width: min(92vw, 31rem);
	padding: 1.5rem 1.45rem 1.3rem;
	position: absolute;
	top: 50%;
	transform: translate(-50%, calc(-50% + 1rem)) scale(0.97);
	transition: transform 0.26s ease;
	width: 100%;
}

.auth-modal.is-visible .auth-modal-card {
	transform: translate(-50%, -50%) scale(1);
}

.auth-modal-icon {
	align-items: center;
	background: linear-gradient(135deg, rgba(122, 242, 202, 0.18), rgba(125, 140, 255, 0.12));
	border: 1px solid rgba(122, 242, 202, 0.22);
	border-radius: 50%;
	display: inline-flex;
	height: 3rem;
	justify-content: center;
	margin-bottom: 1rem;
	width: 3rem;
}

.auth-modal-icon span {
	color: #a0f3db;
	font-size: 1.15rem;
	font-weight: 700;
	line-height: 1;
}

.auth-modal-title {
	font-size: 1.45rem;
	margin-bottom: 0.6rem;
}

.auth-modal-copy {
	color: rgba(255, 255, 255, 0.74);
	font-size: 0.98rem;
	line-height: 1.6;
	margin-bottom: 0.85rem;
}

.auth-modal-feedback {
	font-size: 0.92rem;
	margin: 0 0 1rem 0;
	min-height: 1.4rem;
}

.auth-modal-feedback.is-success {
	color: #7af2ca;
}

.auth-modal-feedback.is-error {
	color: #ff9eb6;
}

.auth-modal-feedback.is-loading {
	color: #a9bcff;
}

.auth-modal-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.8rem;
}

.auth-modal-button,
.auth-modal-button.is-ghost {
	min-width: 12rem;
	text-align: center;
}

.auth-modal-button.is-ghost {
	background: rgba(255, 255, 255, 0.04) !important;
}

.auth-inline-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-top: 1rem;
}

.auth-inline-buttons .button,
.auth-inline-buttons .auth-logout-button {
	min-width: 9rem;
	text-align: center;
}

@keyframes floatOrb {
	0%,
	100% {
		transform: translate3d(0, 0, 0) scale(1);
	}

	50% {
		transform: translate3d(0, -1.5rem, 0) scale(1.06);
	}
}

@keyframes pulseOrb {
	0%,
	100% {
		transform: scale(1);
	}

	50% {
		transform: scale(1.12);
	}
}

@keyframes driftOne {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-1.5rem);
	}
}

@keyframes driftTwo {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(1.25rem);
	}
}

@media screen and (max-width: 980px) {
	.auth-card {
		grid-template-columns: 1fr;
	}

	.auth-highlight {
		border-right: 0;
		border-bottom: 1px solid rgba(255, 255, 255, 0.08);
	}
}

@media screen and (max-width: 736px) {
	.auth-scene {
		padding: 1rem;
	}

	.auth-highlight,
	.auth-form-shell {
		padding: 2rem 1.5rem;
	}

	.auth-highlight h1 {
		max-width: none;
	}

	.auth-inline-buttons .button,
	.auth-inline-buttons .auth-logout-button {
		min-width: 0;
		width: 100%;
	}

	.auth-modal-card {
		padding: 1.3rem 1.15rem 1.15rem;
	}

	.auth-modal-button,
	.auth-modal-button.is-ghost {
		min-width: 0;
		width: 100%;
	}
}

body.auth-page .account-dock {
	top: 1.25rem;
}

body.dashboard-page .auth-scene {
	align-items: flex-start;
	padding: 7rem 2rem 2.5rem;
}

.dashboard-shell {
	display: grid;
	gap: 1.5rem;
	position: relative;
	width: min(100%, 78rem);
	z-index: 1;
}

.dashboard-hero,
.dashboard-card {
	background: rgba(10, 16, 31, 0.74);
	backdrop-filter: blur(18px);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 1.6rem;
	box-shadow: 0 1.8rem 4rem rgba(8, 12, 24, 0.34);
	position: relative;
}

.dashboard-hero {
	overflow: hidden;
	padding: 2.4rem 2.5rem;
}

.dashboard-hero:before,
.dashboard-card:before {
	background: linear-gradient(145deg, rgba(255, 255, 255, 0.08), transparent 58%);
	content: '';
	inset: 0;
	pointer-events: none;
	position: absolute;
}

.dashboard-hero > *,
.dashboard-card > * {
	position: relative;
	z-index: 1;
}

.dashboard-hero h1 {
	font-size: clamp(2.4rem, 4vw, 3.8rem);
	line-height: 1.04;
	margin-bottom: 0.8rem;
	max-width: 12ch;
}

.dashboard-hero .auth-lead {
	margin-bottom: 1.35rem;
	max-width: 42rem;
}

.dashboard-hero-member {
	align-items: center;
	display: inline-grid;
	gap: 0.9rem;
	grid-template-columns: auto 1fr;
}

.dashboard-hero-member strong,
.dashboard-note strong,
.member-preview strong {
	color: #ffffff;
	display: block;
	font-size: 1rem;
	margin-bottom: 0.2rem;
}

.dashboard-hero-member span,
.dashboard-note p,
.member-preview span,
.member-card-copy span,
.member-card-copy small {
	color: rgba(255, 255, 255, 0.66);
	display: block;
}

.member-card-role {
	color: #9be8d0;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	margin-bottom: 0.35rem;
	text-transform: uppercase;
}

.dashboard-avatar,
.member-preview-avatar,
.member-card-avatar {
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 50%;
	display: block;
	object-fit: cover;
}

.dashboard-avatar {
	height: 4.8rem;
	width: 4.8rem;
}

.dashboard-grid {
	display: grid;
	gap: 1.5rem;
	grid-template-columns: minmax(0, 1.3fr) minmax(18rem, 0.85fr);
}

.dashboard-card {
	padding: 2rem;
}

.dashboard-card h2 {
	font-size: 1.45rem;
	margin-bottom: 1.1rem;
}

.dashboard-sidecard {
	display: grid;
	gap: 1rem;
}

.dashboard-form {
	margin: 0;
}

.dashboard-form .auth-field textarea {
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.12);
	border-radius: 0.95rem;
	color: #ffffff;
	font-size: 1rem;
	min-height: 8.4rem;
	padding: 0.95rem 1rem;
	resize: vertical;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.dashboard-form .auth-field textarea:focus {
	border-color: rgba(122, 242, 202, 0.8);
	box-shadow: 0 0 0 0.25rem rgba(122, 242, 202, 0.12);
	transform: translateY(-1px);
}

.dashboard-form-divider {
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	margin-top: 0.4rem;
	padding-top: 1.2rem;
}

.dashboard-form-divider h3 {
	font-size: 1rem;
	margin-bottom: 0.25rem;
}

.dashboard-form-divider p,
.dashboard-note p {
	font-size: 0.92rem;
	margin: 0;
}

.member-preview,
.dashboard-note {
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 1.2rem;
	padding: 1rem;
}

.member-preview {
	text-align: center;
}

.member-preview-avatar {
	height: 6rem;
	margin: 0 auto 0.85rem auto;
	width: 6rem;
}

.members-layout {
	grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
}

.member-search-form {
	align-items: end;
	display: grid;
	gap: 1rem;
	grid-template-columns: minmax(0, 1fr) auto;
	margin: 0;
}

.member-search-form .auth-submit {
	margin-top: 0;
	min-width: 10rem;
}

.members-results-card {
	min-height: 26rem;
}

.members-grid {
	display: grid;
	gap: 1rem;
}

.member-card {
	align-items: start;
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 1.2rem;
	display: grid;
	gap: 1rem;
	grid-template-columns: auto 1fr;
	padding: 1rem;
}

.member-card-empty {
	grid-template-columns: 1fr;
}

.member-card-avatar {
	height: 4rem;
	width: 4rem;
}

.member-card-copy strong {
	color: #ffffff;
	display: block;
	font-size: 1rem;
	margin-bottom: 0.2rem;
}

.member-card-bio {
	color: rgba(255, 255, 255, 0.74);
	font-size: 0.94rem;
	margin: 0.55rem 0 0.55rem 0;
}

.member-card-copy small {
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.member-card-action {
	margin-top: 0.8rem;
}

@media screen and (max-width: 980px) {
	body.dashboard-page .auth-scene {
		padding-top: 6rem;
	}

	.dashboard-grid,
	.members-layout {
		grid-template-columns: 1fr;
	}
}

@media screen and (max-width: 736px) {
	body.auth-page .account-dock {
		top: 1rem;
	}

	body.dashboard-page .auth-scene {
		padding: 5.75rem 1rem 1.5rem;
	}

	.dashboard-hero,
	.dashboard-card {
		border-radius: 1.25rem;
		padding: 1.45rem;
	}

	.member-search-form {
		grid-template-columns: 1fr;
	}

	.member-search-form .auth-submit {
		min-width: 0;
		width: 100%;
	}

	.member-card {
		grid-template-columns: 1fr;
	}

	.member-card-avatar {
		height: 4.6rem;
		width: 4.6rem;
	}
}

.offerwall-layout {
	align-items: start;
	grid-template-columns: minmax(0, 1.08fr) minmax(20rem, 0.92fr);
}

.offerwall-shell {
	gap: 1.5rem;
}

.offerwall-hero .auth-lead {
	max-width: 52rem;
}

.offerwall-section-head {
	align-items: end;
	display: flex;
	gap: 1rem;
	justify-content: space-between;
	margin-bottom: 1.15rem;
}

.offerwall-section-head h2 {
	margin-bottom: 0;
}

.offerwall-inline-note {
	color: rgba(255, 255, 255, 0.62);
	font-size: 0.9rem;
	margin: 0;
	text-align: right;
}

.offerwall-provider-grid {
	display: grid;
	gap: 1rem;
	grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr));
}

.offerwall-provider-card {
	--provider-accent: #7af2ca;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.025)),
		radial-gradient(circle at top right, color-mix(in srgb, var(--provider-accent) 20%, transparent), transparent 48%),
		rgba(11, 18, 35, 0.68);
	border: 1px solid rgba(255, 255, 255, 0.11);
	border-radius: 1.4rem;
	cursor: pointer;
	display: grid;
	gap: 0.9rem;
	min-height: 13rem;
	padding: 1.15rem;
	transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.offerwall-provider-card:hover,
.offerwall-provider-card:focus-within {
	border-color: rgba(122, 242, 202, 0.34);
	box-shadow: 0 1.2rem 2rem rgba(6, 10, 22, 0.3);
	transform: translateY(-2px);
}

.offerwall-provider-card.is-selected {
	border-color: color-mix(in srgb, var(--provider-accent) 56%, rgba(255, 255, 255, 0.16));
	box-shadow: 0 1.25rem 2.5rem rgba(8, 14, 28, 0.34);
}

.offerwall-provider-card h3 {
	font-size: 1.15rem;
	margin: 0;
}

.offerwall-provider-card p {
	color: rgba(255, 255, 255, 0.7);
	font-size: 0.94rem;
	margin: 0;
}

.offerwall-provider-topline,
.offerwall-provider-meta {
	align-items: center;
	display: flex;
	gap: 0.75rem;
	justify-content: space-between;
}

.offerwall-provider-mark,
.offerwall-detail-mark {
	align-items: center;
	background: color-mix(in srgb, var(--provider-accent) 22%, rgba(255, 255, 255, 0.06));
	border: 1px solid color-mix(in srgb, var(--provider-accent) 34%, rgba(255, 255, 255, 0.08));
	border-radius: 999px;
	color: #ffffff;
	display: inline-flex;
	font-size: 0.96rem;
	font-weight: 800;
	height: 2.5rem;
	justify-content: center;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	width: 2.5rem;
}

.offerwall-provider-status {
	border-radius: 999px;
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	padding: 0.38rem 0.7rem;
	text-transform: uppercase;
}

.offerwall-provider-status.is-ready {
	background: rgba(122, 242, 202, 0.12);
	color: #87f1d3;
}

.offerwall-provider-status.is-pending {
	background: rgba(255, 201, 108, 0.1);
	color: #ffd783;
}

.offerwall-provider-meta span,
.offerwall-reward-date,
.offerwall-reward-side span {
	color: rgba(255, 255, 255, 0.58);
	font-size: 0.84rem;
}

.offerwall-detail-card,
.offerwall-history-card {
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.04), rgba(255, 255, 255, 0.02)),
		rgba(9, 15, 30, 0.68);
}

.offerwall-detail-shell {
	--provider-accent: #7af2ca;
	display: grid;
	gap: 1.15rem;
}

.offerwall-detail-copy h3 {
	font-size: 1.6rem;
	margin-bottom: 0.45rem;
}

.offerwall-detail-copy p,
.offerwall-guidance p,
.offerwall-setup-hint p,
.offerwall-pending-note {
	color: rgba(255, 255, 255, 0.72);
	margin: 0;
}

.offerwall-detail-stats {
	display: grid;
	gap: 0.9rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.offerwall-stat-chip {
	background: rgba(255, 255, 255, 0.05);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 1rem;
	padding: 0.95rem 1rem;
}

.offerwall-stat-chip strong {
	color: rgba(255, 255, 255, 0.6);
	display: block;
	font-size: 0.72rem;
	letter-spacing: 0.1em;
	margin-bottom: 0.25rem;
	text-transform: uppercase;
}

.offerwall-stat-chip span {
	color: #ffffff;
	display: block;
	font-size: 0.96rem;
	font-weight: 700;
}

.offerwall-detail-actions {
	margin-top: 0.1rem;
}

.offerwall-launch-link {
	align-items: center;
	display: inline-flex;
	justify-content: center;
	text-decoration: none;
}

.offerwall-setup-hint,
.offerwall-pending-note {
	background: rgba(255, 184, 108, 0.08);
	border: 1px solid rgba(255, 208, 134, 0.12);
	border-radius: 1rem;
	padding: 0.95rem 1rem;
}

.offerwall-setup-hint strong {
	color: #ffffff;
	display: block;
	font-size: 0.82rem;
	letter-spacing: 0.08em;
	margin-bottom: 0.35rem;
	text-transform: uppercase;
}

.offerwall-guidance {
	margin-top: 0.15rem;
}

.offerwall-reward-list {
	display: grid;
	gap: 0.9rem;
}

.offerwall-reward-item {
	--provider-accent: #7af2ca;
	align-items: center;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.045), rgba(255, 255, 255, 0.022)),
		radial-gradient(circle at right center, color-mix(in srgb, var(--provider-accent) 12%, transparent), transparent 42%),
		rgba(10, 17, 32, 0.65);
	border: 1px solid rgba(255, 255, 255, 0.08);
	border-radius: 1.1rem;
	display: grid;
	gap: 0.8rem;
	grid-template-columns: minmax(0, 1fr) auto;
	padding: 0.95rem 1rem;
}

.offerwall-reward-provider {
	color: color-mix(in srgb, var(--provider-accent) 72%, #ffffff);
	display: block;
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	margin-bottom: 0.2rem;
	text-transform: uppercase;
}

.offerwall-reward-main strong,
.offerwall-reward-side strong {
	color: #ffffff;
	display: block;
}

.offerwall-reward-main strong {
	font-size: 1.05rem;
	margin-bottom: 0.22rem;
}

.offerwall-reward-side {
	min-width: 7.2rem;
	text-align: right;
}

.offerwall-empty {
	background: rgba(255, 255, 255, 0.04);
	border: 1px dashed rgba(255, 255, 255, 0.14);
	border-radius: 1.2rem;
	color: rgba(255, 255, 255, 0.64);
	padding: 1.25rem;
}

@media screen and (max-width: 1080px) {
	.offerwall-layout {
		grid-template-columns: 1fr;
	}

	.offerwall-detail-stats {
		grid-template-columns: 1fr;
	}
}

@media screen and (max-width: 736px) {
	.offerwall-section-head {
		align-items: start;
		flex-direction: column;
	}

	.offerwall-inline-note,
	.offerwall-reward-side {
		text-align: left;
	}

	.offerwall-reward-item {
		grid-template-columns: 1fr;
	}

	.offerwall-provider-grid {
		grid-template-columns: 1fr;
	}
}