/* Fx2Fund public pages — shared polish layer.
   Loaded after style.css / theme.css (and after any inline page <style>) on:
   markets, education, contact, terms, privacy, refund, signin, signup,
   setup-username, subscribe, payment, 404.
   House style mirrors terminal.css / dashboard.css: ink panels, hairline
   rules, gold for primary action + focus, green/red only for state. */

:root {
	--pg-bg: #0a0f1c;
	--pg-bg-2: #111627;
	--pg-panel: #121828;
	--pg-panel-2: #161d30;
	--pg-line: rgba(255, 255, 255, 0.07);
	--pg-line-2: rgba(255, 255, 255, 0.12);
	--pg-gold: #FCB42D;
	--pg-gold-2: #ffd36b;
	--pg-gold-dim: rgba(252, 180, 45, 0.12);
	--pg-green: #3BD297;
	--pg-green-dim: rgba(59, 210, 151, 0.12);
	--pg-red: #ff5a6e;
	--pg-red-dim: rgba(255, 90, 110, 0.10);
	--pg-text: #fff;
	--pg-text-2: #d7dce8;
	--pg-muted: #8c95a8;
	--pg-r-md: 14px;
	--pg-r-lg: 18px;
	--pg-ease: cubic-bezier(0.2, 0.8, 0.2, 1);
	--pg-font: "Archivo", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--pg-mono: ui-monospace, "SF Mono", "Cascadia Mono", Menlo, Consolas, monospace;
	--pg-header-h: 40px;
}

/* ── Base ─────────────────────────────────────────────────────────────── */
/* NB: never wrap page content in a <header> element on these pages —
   js/site-header.js adopts the first <header> it finds as the site nav. */
:where(.pg-main, .contact-wrap, .legal-wrap, .nf), :where(.pg-main, .contact-wrap, .legal-wrap, .nf) *,
:where(.pg-main, .contact-wrap, .legal-wrap, .nf) *::before, :where(.pg-main, .contact-wrap, .legal-wrap, .nf) *::after { box-sizing: border-box; }
html { background: var(--pg-bg); }
body { background: var(--pg-bg); -webkit-font-smoothing: antialiased; }
.pg-num { font-variant-numeric: tabular-nums; }
:where(a, button, input, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--pg-gold);
	outline-offset: 2px;
}

/* ── Shared primitives ────────────────────────────────────────────────── */
.pg-eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	margin: 0 0 14px;
	font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
	color: var(--pg-gold);
}
.pg-eyebrow::before {
	content: ""; width: 6px; height: 6px; border-radius: 50%;
	background: var(--pg-gold); box-shadow: 0 0 0 4px var(--pg-gold-dim);
}
.pg-back {
	display: inline-flex; align-items: center; gap: 8px;
	min-height: 44px; margin: 0 0 12px -2px; padding: 0 2px;
	color: var(--pg-muted); font-size: 0.86rem; text-decoration: none;
	transition: color 0.2s;
}
.pg-back:hover { color: var(--pg-text-2); text-decoration: none; }
.pg-back i { font-size: 0.8em; transition: transform 0.2s var(--pg-ease); }
.pg-back:hover i { transform: translateX(-3px); }

.pg-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	min-height: 48px; padding: 0 22px;
	border-radius: 12px; border: 1px solid transparent;
	font-family: var(--pg-font); font-size: 0.95rem; font-weight: 700; letter-spacing: 0.01em;
	text-decoration: none; cursor: pointer; white-space: nowrap;
	transition: transform 0.2s var(--pg-ease), box-shadow 0.2s, background 0.2s, border-color 0.2s, color 0.2s;
}
.pg-btn:hover { text-decoration: none; }
.pg-btn--primary {
	background: linear-gradient(135deg, var(--pg-gold), var(--pg-gold-2));
	color: #0a0f1c !important;
	box-shadow: 0 10px 28px -12px rgba(252, 180, 45, 0.6);
}
.pg-btn--primary:hover { transform: translateY(-1px); box-shadow: 0 16px 36px -12px rgba(252, 180, 45, 0.7); }
.pg-btn--ghost {
	background: rgba(255, 255, 255, 0.03);
	border-color: var(--pg-line-2);
	color: var(--pg-text-2) !important;
}
.pg-btn--ghost:hover { border-color: rgba(252, 180, 45, 0.45); color: var(--pg-gold) !important; background: var(--pg-gold-dim); }
.pg-btn i { font-size: 0.85em; }

.pg-panel {
	background: linear-gradient(180deg, var(--pg-panel-2), var(--pg-panel));
	border: 1px solid var(--pg-line);
	border-radius: var(--pg-r-lg);
}

/* Content shell used by markets / education / 404 */
.pg-main {
	max-width: 1160px; margin: 0 auto;
	padding: clamp(24px, 4vw, 56px) 20px clamp(64px, 8vw, 104px);
	color: var(--pg-text-2); font-family: var(--pg-font);
}
.pg-hero { margin-bottom: clamp(32px, 5vw, 56px); max-width: 760px; }
.pg-title {
	margin: 0 0 16px;
	color: var(--pg-text); font-weight: 700;
	font-size: clamp(2rem, 1.35rem + 2.8vw, 3.4rem); line-height: 1.06; letter-spacing: -0.025em;
}
.pg-title em { font-style: normal; color: var(--pg-gold); }
.pg-lead { margin: 0; max-width: 62ch; color: var(--pg-muted); font-size: clamp(1rem, 0.95rem + 0.25vw, 1.12rem); line-height: 1.65; }
.pg-h2 {
	margin: 0 0 6px; color: var(--pg-text);
	font-size: clamp(1.35rem, 1.1rem + 1vw, 1.85rem); font-weight: 700; letter-spacing: -0.015em; line-height: 1.2;
}
.pg-sub { margin: 0 0 22px; color: var(--pg-muted); font-size: 0.95rem; line-height: 1.6; max-width: 60ch; }
.pg-section + .pg-section { margin-top: clamp(48px, 7vw, 88px); }

/* CTA band (markets, education) */
.pg-cta {
	position: relative; overflow: hidden;
	display: grid; gap: 20px; align-items: center;
	padding: clamp(24px, 4vw, 40px);
	background:
		radial-gradient(600px 220px at 100% 0%, rgba(252, 180, 45, 0.14), transparent 70%),
		linear-gradient(180deg, var(--pg-panel-2), var(--pg-panel));
	border: 1px solid rgba(252, 180, 45, 0.2);
	border-radius: var(--pg-r-lg);
}
.pg-cta h2, .pg-cta h3 { margin: 0 0 6px; color: var(--pg-text); font-size: clamp(1.3rem, 1.05rem + 1.1vw, 1.9rem); line-height: 1.2; letter-spacing: -0.015em; }
.pg-cta p { margin: 0; color: var(--pg-muted); font-size: 0.95rem; line-height: 1.6; max-width: 56ch; }
@media (min-width: 760px) { .pg-cta { grid-template-columns: 1fr auto; gap: 32px; } }
@media (max-width: 759px) { .pg-cta .pg-btn { width: 100%; } }

/* ── Markets ──────────────────────────────────────────────────────────── */
.mk-grid { display: grid; gap: clamp(32px, 4vw, 48px); }
@media (min-width: 960px) { .mk-grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: start; } }

.mk-table-wrap { overflow: hidden; }
.mk-table { width: 100%; border-collapse: collapse; font-size: 0.92rem; }
.mk-table th {
	padding: 14px 18px; text-align: left;
	font-size: 0.68rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
	color: var(--pg-muted); background: rgba(255, 255, 255, 0.02);
	border-bottom: 1px solid var(--pg-line);
}
.mk-table td { padding: 16px 18px; border-bottom: 1px solid var(--pg-line); vertical-align: middle; color: var(--pg-text-2); }
.mk-table tr:last-child td { border-bottom: 0; }
.mk-table tbody tr { transition: background 0.2s; }
.mk-table tbody tr:hover { background: rgba(255, 255, 255, 0.025); }
.mk-table .mk-name { color: var(--pg-text); font-weight: 600; line-height: 1.35; }
.mk-table .mk-name small { display: block; margin-top: 2px; color: var(--pg-muted); font-size: 0.78rem; font-weight: 400; }
.mk-lev { font-variant-numeric: tabular-nums; color: var(--pg-gold); font-weight: 700; white-space: nowrap; }
.mk-hours {
	display: inline-block; padding: 4px 10px; border-radius: 999px; white-space: nowrap;
	font-size: 0.76rem; font-weight: 600; font-variant-numeric: tabular-nums;
	color: var(--pg-text-2); background: rgba(255, 255, 255, 0.05); border: 1px solid var(--pg-line);
}
.mk-hours.is-247 { color: var(--pg-green); background: var(--pg-green-dim); border-color: rgba(59, 210, 151, 0.25); }
.mk-table th:nth-child(2), .mk-table td:nth-child(2),
.mk-table th:nth-child(3), .mk-table td:nth-child(3) { text-align: right; }
.mk-note { margin: 14px 2px 0; color: var(--pg-muted); font-size: 0.82rem; line-height: 1.6; }
.mk-link {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 6px;
	color: var(--pg-gold) !important; font-weight: 600; font-size: 0.9rem; text-decoration: none;
}
.mk-link:hover { color: var(--pg-gold-2) !important; text-decoration: none; }
.mk-link i { transition: transform 0.2s var(--pg-ease); }
.mk-link:hover i { transform: translateX(3px); }
@media (max-width: 479px) {
	.mk-table th, .mk-table td { padding: 13px 12px; }
	.mk-table { font-size: 0.86rem; }
}

.mk-features { list-style: none; margin: 0; padding: 0; display: grid; gap: 1px; background: var(--pg-line); border: 1px solid var(--pg-line); border-radius: var(--pg-r-lg); overflow: hidden; }
@media (min-width: 560px) { .mk-features { grid-template-columns: 1fr 1fr; } }
.mk-features li {
	display: flex; align-items: center; gap: 14px;
	padding: 18px 20px; min-height: 64px;
	background: var(--pg-panel); color: var(--pg-text-2); font-size: 0.94rem; line-height: 1.4;
}
.mk-features i {
	flex: 0 0 32px; width: 32px; height: 32px; border-radius: 9px;
	display: grid; place-items: center; font-size: 0.85rem;
	color: var(--pg-gold); background: var(--pg-gold-dim);
}

/* ── Education ────────────────────────────────────────────────────────── */
.ed-top { display: grid; gap: 24px; margin-bottom: clamp(40px, 6vw, 72px); }
@media (min-width: 960px) { .ed-top { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: end; gap: 48px; } }
.ed-path { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 24px; padding: 0; list-style: none; }
.ed-path li { display: inline-flex; align-items: center; gap: 8px; color: var(--pg-text-2); font-size: 0.85rem; font-weight: 600; }
@media (min-width: 480px) { .ed-path li + li::before { content: ""; width: 18px; height: 1px; background: var(--pg-line-2); margin-right: 2px; } }
@media (max-width: 479px) { .ed-path { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); } .ed-path span { width: 100%; justify-content: center; padding: 10px 6px; font-size: 0.8rem; } }
.ed-path span {
	display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 999px;
	background: rgba(255, 255, 255, 0.04); border: 1px solid var(--pg-line);
}
.ed-path span i { color: var(--pg-gold); font-size: 0.8rem; }
.ed-academy { padding: 28px; position: relative; overflow: hidden; }
.ed-academy::after {
	content: "\f501"; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free"; font-weight: 900;
	position: absolute; right: -8px; bottom: -22px; font-size: 7.5rem; line-height: 1;
	color: rgba(252, 180, 45, 0.06); pointer-events: none;
}
.ed-academy h2 { margin: 0 0 8px; color: var(--pg-text); font-size: 1.35rem; letter-spacing: -0.01em; }
.ed-academy p { margin: 0 0 22px; color: var(--pg-muted); font-size: 0.95rem; line-height: 1.6; max-width: 46ch; }

.ed-courses { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
@media (min-width: 900px) { .ed-courses { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ed-course {
	display: flex; flex-direction: column; gap: 12px; height: 100%;
	padding: 24px; position: relative;
	transition: border-color 0.25s, transform 0.25s var(--pg-ease);
}
.ed-course:hover { border-color: rgba(252, 180, 45, 0.3); transform: translateY(-2px); }
.ed-course-head { display: flex; align-items: center; gap: 14px; }
.ed-course-ico {
	flex: 0 0 44px; height: 44px; border-radius: 12px; display: grid; place-items: center;
	color: var(--pg-gold); background: var(--pg-gold-dim); border: 1px solid rgba(252, 180, 45, 0.2);
}
.ed-course-n { margin-left: auto; color: var(--pg-muted); font-size: 0.78rem; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: 0.08em; }
.ed-course h3 { margin: 4px 0 0; color: var(--pg-text); font-size: 1.15rem; letter-spacing: -0.01em; }
.ed-course p { margin: 0; color: var(--pg-muted); font-size: 0.93rem; line-height: 1.6; flex: 1; }
.ed-course .mk-link { margin-top: 0; }

.ed-res { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 18px; }
@media (min-width: 760px) { .ed-res { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.ed-res a {
	display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 16px;
	border-radius: var(--pg-r-md); border: 1px solid var(--pg-line);
	background: rgba(255, 255, 255, 0.025); color: var(--pg-text-2) !important;
	font-weight: 600; font-size: 0.9rem; text-decoration: none;
	transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.ed-res a i { color: var(--pg-muted); width: 16px; text-align: center; transition: color 0.2s; }
.ed-res a:hover { border-color: rgba(252, 180, 45, 0.35); background: var(--pg-gold-dim); color: var(--pg-text) !important; text-decoration: none; }
.ed-res a:hover i { color: var(--pg-gold); }

/* ── Contact ──────────────────────────────────────────────────────────── */
.contact-wrap {
	max-width: 1080px; margin: 0 auto;
	padding: clamp(24px, 4vw, 56px) 20px clamp(64px, 8vw, 104px);
	color: var(--pg-text-2); font-family: var(--pg-font);
}
.contact-wrap .pg-hero { margin-bottom: clamp(28px, 4vw, 44px); }
.contact-cards { display: grid; gap: 14px; }
@media (min-width: 760px) { .contact-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.contact-card {
	display: flex; flex-direction: column; padding: 24px; min-width: 0;
	color: inherit; text-decoration: none;
	transition: border-color 0.25s, transform 0.25s var(--pg-ease), box-shadow 0.25s;
}
.contact-card:hover { text-decoration: none; color: inherit; border-color: rgba(252, 180, 45, 0.32); transform: translateY(-2px); box-shadow: 0 24px 48px -28px rgba(0, 0, 0, 0.8); }
.contact-card-icon {
	width: 44px; height: 44px; border-radius: 12px; display: grid; place-items: center;
	margin-bottom: 18px; font-size: 1.05rem; border: 1px solid var(--pg-line);
}
.contact-card-icon.is-green { color: var(--pg-green); background: var(--pg-green-dim); border-color: rgba(59, 210, 151, 0.22); }
.contact-card-icon.is-blue { color: #5aa9e6; background: rgba(90, 169, 230, 0.1); border-color: rgba(90, 169, 230, 0.22); }
.contact-card-icon.is-gold { color: var(--pg-gold); background: var(--pg-gold-dim); border-color: rgba(252, 180, 45, 0.22); }
.contact-card h2 { margin: 0 0 6px; color: var(--pg-text); font-size: 1.12rem; font-weight: 700; letter-spacing: -0.01em; }
.contact-card p { margin: 0 0 18px; color: var(--pg-muted); font-size: 0.92rem; line-height: 1.6; flex: 1; }
.contact-card-cta {
	display: inline-flex; align-items: center; gap: 8px; min-height: 28px;
	color: var(--pg-gold); font-weight: 600; font-size: 0.92rem; overflow-wrap: anywhere;
}
.contact-card-cta i { font-size: 0.75rem; transition: transform 0.2s var(--pg-ease); }
.contact-card:hover .contact-card-cta i { transform: translateX(3px); }
.contact-info { margin-top: 14px; padding: clamp(22px, 3vw, 32px); }
.contact-info h2 { margin: 0 0 18px; color: var(--pg-text); font-size: 1.12rem; font-weight: 700; }
.contact-info dl { margin: 0; }
.contact-info dl > div { display: grid; gap: 4px; padding: 16px 0; border-top: 1px solid var(--pg-line); }
.contact-info dl > div:first-child { border-top: 0; padding-top: 0; }
.contact-info dl > div:last-child { padding-bottom: 0; }
@media (min-width: 760px) { .contact-info dl > div { grid-template-columns: 200px minmax(0, 1fr); gap: 24px; } }
.contact-info dt { color: var(--pg-text); font-weight: 700; font-size: 0.92rem; }
.contact-info dd { margin: 0; color: var(--pg-muted); font-size: 0.94rem; line-height: 1.65; max-width: 62ch; }
.contact-legal { display: flex; flex-wrap: wrap; gap: 4px 20px; }
.contact-legal a { display: inline-flex; align-items: center; min-height: 36px; color: var(--pg-gold); text-decoration: none; font-weight: 600; }
.contact-legal a:hover { color: var(--pg-gold-2); text-decoration: underline; text-underline-offset: 3px; }

/* ── Legal (terms, privacy, refund) ───────────────────────────────────── */
.legal-wrap {
	max-width: 1160px; margin: 0 auto;
	padding: clamp(24px, 4vw, 56px) 20px clamp(64px, 8vw, 104px);
	color: var(--pg-text-2); font-family: var(--pg-font);
}
.legal-wrap .legal-back {
	display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-bottom: 12px;
	color: var(--pg-muted); font-size: 0.86rem; text-decoration: none;
}
.legal-wrap .legal-back:hover { color: var(--pg-text-2); text-decoration: none; }
.legal-head { padding-bottom: clamp(24px, 4vw, 36px); margin-bottom: clamp(24px, 4vw, 40px); border-bottom: 1px solid var(--pg-line); }
.legal-head h1 {
	margin: 0 0 12px; color: var(--pg-text); font-weight: 700;
	font-size: clamp(2.1rem, 1.4rem + 3vw, 3.5rem); line-height: 1.04; letter-spacing: -0.03em;
}
.legal-updated { margin: 0; color: var(--pg-muted); font-size: 0.86rem; font-variant-numeric: tabular-nums; }
.legal-layout { display: block; }
@media (min-width: 1024px) {
	.legal-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 64px; align-items: start; }
}
.legal-toc { display: none; }
@media (min-width: 1024px) {
	.legal-toc {
		display: block; position: sticky; top: calc(var(--pg-header-h) + 28px);
		max-height: calc(100vh - var(--pg-header-h) - 56px); overflow-y: auto; scrollbar-width: thin;
	}
	.legal-toc-m { display: none; }
}
.legal-toc-title { margin: 0 0 12px; color: var(--pg-muted); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.legal-toc-list { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--pg-line); }
.legal-toc-list a {
	display: flex; gap: 10px; align-items: baseline;
	padding: 7px 0 7px 14px; margin-left: -1px; border-left: 1px solid transparent;
	color: var(--pg-muted) !important; font-size: 0.86rem; line-height: 1.4; text-decoration: none;
	transition: color 0.2s, border-color 0.2s;
}
.legal-toc-list a:hover { color: var(--pg-text) !important; border-left-color: var(--pg-gold); text-decoration: none; }
.legal-toc-n { flex: 0 0 18px; color: rgba(140, 149, 168, 0.6); font-size: 0.75rem; font-weight: 700; font-variant-numeric: tabular-nums; }

/* Mobile/tablet collapsible TOC */
.legal-toc-m {
	margin: 0 0 32px; border: 1px solid var(--pg-line); border-radius: var(--pg-r-md);
	background: var(--pg-panel);
}
.legal-toc-m summary {
	display: flex; align-items: center; justify-content: space-between;
	min-height: 52px; padding: 0 18px; cursor: pointer; list-style: none;
	color: var(--pg-text); font-weight: 600; font-size: 0.92rem;
}
.legal-toc-m summary::-webkit-details-marker { display: none; }
.legal-toc-m summary i { color: var(--pg-muted); font-size: 0.75rem; transition: transform 0.2s; }
.legal-toc-m[open] summary i { transform: rotate(180deg); }
.legal-toc-m .legal-toc-list { border-left: 0; padding: 4px 8px 12px; border-top: 1px solid var(--pg-line); }
.legal-toc-m .legal-toc-list a { padding: 11px 10px; min-height: 44px; align-items: center; border-left: 0; border-radius: 8px; }
.legal-toc-m .legal-toc-list a:hover { background: rgba(255, 255, 255, 0.03); }

.legal-body { max-width: 68ch; }
.legal-intro p { margin: 0 0 8px; color: var(--pg-text-2); font-size: clamp(1.02rem, 0.98rem + 0.2vw, 1.12rem); line-height: 1.7; }
.legal-sec { padding: clamp(28px, 4vw, 40px) 0 0; margin-top: clamp(28px, 4vw, 40px); border-top: 1px solid var(--pg-line); }
.legal-intro + .legal-sec { margin-top: clamp(28px, 4vw, 40px); }
.legal-body > .legal-sec:first-child { border-top: 0; margin-top: 0; padding-top: 0; }
.legal-sec h2 {
	margin: 0 0 16px; padding: 0; border: 0;
	color: var(--pg-text); font-size: clamp(1.2rem, 1.08rem + 0.5vw, 1.45rem); font-weight: 700; letter-spacing: -0.01em; line-height: 1.25;
	scroll-margin-top: calc(var(--pg-header-h) + 24px);
}
.legal-sec p, .legal-sec li { color: rgba(215, 220, 232, 0.82); font-size: 1rem; line-height: 1.75; }
.legal-sec p { margin: 0 0 14px; }
.legal-sec p:last-child { margin-bottom: 0; }
.legal-sec ul { margin: 0 0 16px; padding: 0; list-style: none; }
.legal-sec li { position: relative; padding-left: 22px; margin-bottom: 10px; }
.legal-sec li::before {
	content: ""; position: absolute; left: 4px; top: 0.72em;
	width: 6px; height: 6px; border-radius: 2px; background: var(--pg-gold); opacity: 0.8;
}
.legal-wrap strong { color: var(--pg-text); font-weight: 700; }
.legal-wrap a { color: var(--pg-gold); text-decoration: underline; text-decoration-color: rgba(252, 180, 45, 0.35); text-underline-offset: 3px; }
.legal-wrap a:hover { color: var(--pg-gold-2); text-decoration-color: currentColor; }
.legal-wrap a.legal-back, .legal-toc-list a { text-decoration: none; }
@media (max-width: 479px) {
	.legal-sec p, .legal-sec li { font-size: 0.97rem; line-height: 1.7; }
}

/* ── 404 ──────────────────────────────────────────────────────────────── */
.nf {
	min-height: calc(100vh - var(--pg-header-h));
	min-height: calc(100dvh - var(--pg-header-h));
	display: grid; place-items: center; padding: 48px 20px 72px;
	background:
		radial-gradient(700px 380px at 50% 0%, rgba(252, 180, 45, 0.08), transparent 70%),
		var(--pg-bg);
	font-family: var(--pg-font);
}
.nf-card { width: 100%; max-width: 560px; text-align: center; }
.nf-card .nf-code {
	margin: 0 0 8px; font-weight: 700; line-height: 0.9; letter-spacing: -0.05em;
	font-size: clamp(6rem, 4rem + 12vw, 10rem); font-variant-numeric: tabular-nums;
	background: linear-gradient(180deg, var(--pg-gold-2), var(--pg-gold) 60%, rgba(252, 180, 45, 0.35));
	-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.nf-card h1 { margin: 0 0 12px; color: var(--pg-text); font-size: clamp(1.5rem, 1.2rem + 1.4vw, 2.1rem); letter-spacing: -0.02em; line-height: 1.2; }
.nf-card p:not(.nf-code) { margin: 0 auto 28px; max-width: 42ch; color: var(--pg-muted); font-size: 1rem; line-height: 1.65; }
.nf-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }
@media (max-width: 479px) { .nf-actions .pg-btn { width: 100%; } }
.nf-spark { display: block; width: 100%; max-width: 360px; height: 48px; margin: 0 auto 28px; }
.nf-spark path { fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* ── Auth (signin / signup) ───────────────────────────────────────────── */
.auth-page { min-height: 100vh; min-height: 100dvh; height: auto !important; overflow: visible !important; }
@media (min-width: 960px) {
	.auth-page { height: 100vh !important; height: 100dvh !important; overflow: hidden !important; }
	.auth-form-panel { overflow-y: auto; }
}
.auth-form-panel { height: auto !important; overflow: visible; align-items: center; }
@media (max-width: 959px) {
	.auth-form-panel {
		align-items: flex-start !important;
		padding: 76px 20px 40px !important;
		background:
			radial-gradient(520px 260px at 50% -40px, rgba(252, 180, 45, 0.09), transparent 70%),
			var(--pg-bg) !important;
	}
	.auth-back { top: 16px !important; right: 12px !important; }
	.auth-logo { margin-bottom: 28px !important; }
}
.auth-back { min-height: 44px; padding: 0 8px; z-index: 5; }
.auth-form-wrap { max-width: 420px; }
.auth-heading { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2rem) !important; letter-spacing: -0.02em; line-height: 1.15; margin-bottom: 8px !important; }
.auth-subheading { color: var(--pg-muted) !important; font-size: 0.95rem !important; line-height: 1.55; margin-bottom: 28px !important; }
.auth-field { margin-bottom: 18px !important; }
.auth-label { font-size: 0.72rem !important; letter-spacing: 0.1em !important; color: var(--pg-muted) !important; margin-bottom: 8px !important; }
.auth-input {
	font-size: 16px !important;          /* ≥16px stops iOS focus-zoom */
	min-height: 52px; padding: 14px 16px 14px 46px !important;
	border-radius: 12px !important;
	background: rgba(255, 255, 255, 0.035) !important;
	border: 1px solid var(--pg-line-2) !important;
}
.auth-input:hover { border-color: rgba(255, 255, 255, 0.18) !important; }
.auth-input:focus {
	border-color: rgba(252, 180, 45, 0.6) !important;
	background: rgba(252, 180, 45, 0.04) !important;
	box-shadow: 0 0 0 4px rgba(252, 180, 45, 0.1) !important;
}
.auth-input-wrap i { left: 17px !important; font-size: 0.85rem !important; color: rgba(255, 255, 255, 0.28) !important; }
.auth-input-wrap:focus-within i { color: var(--pg-gold) !important; }
.auth-input::placeholder { color: rgba(255, 255, 255, 0.28) !important; }

.auth-meta { margin-bottom: 22px !important; gap: 12px; }
.auth-meta label { min-height: 44px; color: rgba(215, 220, 232, 0.7) !important; }
.auth-meta label input[type="checkbox"] { width: 18px !important; height: 18px !important; accent-color: var(--pg-gold) !important; }
.auth-meta a { display: inline-flex; align-items: center; min-height: 44px; color: var(--pg-gold) !important; }
.auth-meta a:hover { color: var(--pg-gold-2) !important; }

.auth-submit {
	min-height: 52px; border-radius: 12px !important;
	color: #0a0f1c !important; font-size: 1rem !important; font-weight: 700 !important;
	box-shadow: 0 12px 30px -14px rgba(252, 180, 45, 0.7);
}
.auth-submit:hover { box-shadow: 0 18px 38px -14px rgba(252, 180, 45, 0.8) !important; }
.auth-submit:disabled { opacity: 0.45 !important; box-shadow: none !important; }
.auth-submit:disabled::after { display: none; }

.auth-footer { margin-top: 22px !important; font-size: 0.92rem !important; }
.auth-footer a, .auth-resend { color: var(--pg-gold) !important; }
.auth-footer a { display: inline-block; padding: 10px 2px; }
.auth-footer a:hover, .auth-resend:hover { color: var(--pg-gold-2) !important; }
.auth-google-note { color: rgba(140, 149, 168, 0.85) !important; font-size: 0.8rem !important; margin-top: 16px !important; }
.auth-google-note a { color: var(--pg-text-2) !important; }

.auth-error {
	padding: 12px 14px 12px 40px !important; position: relative;
	background: var(--pg-red-dim) !important; border: 1px solid rgba(255, 90, 110, 0.28) !important;
	border-radius: 12px !important; color: #ffb3bd !important; font-size: 0.88rem !important; line-height: 1.5;
	margin-bottom: 18px !important;
}
.auth-error::before {
	content: "\f06a"; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free"; font-weight: 900;
	position: absolute; left: 15px; top: 12px; color: var(--pg-red);
}

/* Strength meter (signup) — on-brand colors */
.auth-strength-meta { color: var(--pg-muted); }

/* OTP */
.auth-otp-mailto {
	justify-content: flex-start !important; align-items: flex-start !important; text-align: left;
	padding: 14px 16px !important; border-radius: 12px !important; line-height: 1.45;
}
.auth-otp-mailto i { margin-top: 2px; }
.auth-otp-mailto span { min-width: 0; }
.auth-otp-mailto strong { display: block; word-break: normal !important; overflow-wrap: anywhere; }
.auth-otp-grid { gap: clamp(6px, 2vw, 10px) !important; margin: 4px 0 14px !important; }
.auth-otp-box {
	min-height: 48px; font-size: clamp(1.25rem, 1rem + 1.5vw, 1.6rem) !important;
	font-family: var(--pg-font) !important; font-variant-numeric: tabular-nums;
	border: 1px solid var(--pg-line-2) !important; border-radius: 12px !important;
	caret-color: var(--pg-gold);
}
.auth-otp-box:focus { border-color: var(--pg-gold) !important; }
.auth-otp-grid.error .auth-otp-box { border-color: rgba(255, 90, 110, 0.6) !important; background: var(--pg-red-dim) !important; }
.auth-countdown { margin: 4px 0 20px !important; color: var(--pg-muted) !important; flex-wrap: wrap; gap: 8px; }
.auth-countdown-time { font-variant-numeric: tabular-nums; color: var(--pg-text-2) !important; }
.auth-countdown-time.warn { color: var(--pg-gold) !important; }
.auth-countdown-time.expired { color: var(--pg-red) !important; }
.auth-resend { display: inline-flex; align-items: center; min-height: 44px; }
.auth-resend.disabled { color: rgba(255, 255, 255, 0.3) !important; }
.auth-back-step { min-height: 44px; margin-top: 10px !important; }

.auth-trust { flex-wrap: wrap; gap: 10px 20px !important; margin-top: 28px !important; padding-top: 22px !important; border-top-color: var(--pg-line) !important; }
.auth-trust-item { color: rgba(140, 149, 168, 0.7) !important; }
.auth-trust-item i { color: var(--pg-green) !important; }

/* Signup used a stray blue accent — bring it onto the brand palette */
.auth-step-num { background: var(--pg-gold-dim) !important; border-color: rgba(252, 180, 45, 0.25) !important; color: var(--pg-gold) !important; font-variant-numeric: tabular-nums; }
.auth-terms a { color: var(--pg-gold) !important; }
.auth-terms input[type="checkbox"] { accent-color: var(--pg-gold) !important; }
.auth-brand::before {
	background:
		radial-gradient(ellipse 600px 600px at 20% 80%, rgba(59, 210, 151, 0.07), transparent),
		radial-gradient(ellipse 520px 520px at 80% 15%, rgba(252, 180, 45, 0.08), transparent) !important;
}

/* ── Setup username ───────────────────────────────────────────────────── */
#su-username { font-size: max(16px, 1.1rem) !important; min-height: 56px; }
.su-footer-note { color: rgba(140, 149, 168, 0.8) !important; }
.su-hint { color: var(--pg-muted); }
@media (max-width: 480px) {
	.su-card { padding: 28px 20px 24px !important; }
	.su-permanent { display: flex !important; width: 100%; }
}

/* ── Subscribe (Add Funds) ────────────────────────────────────────────── */
.subscribe-wrap { max-width: 760px !important; padding: clamp(20px, 4vw, 48px) 20px clamp(56px, 8vw, 96px) !important; }
.subscribe-wrap .back-link { min-height: 44px; margin-bottom: 8px !important; }
.subscribe-header { text-align: left !important; margin-bottom: 24px !important; }
.subscribe-header h1 { font-size: clamp(2rem, 1.4rem + 2.6vw, 3rem) !important; letter-spacing: -0.025em; line-height: 1.06; margin-bottom: 10px !important; }
.subscribe-header p { color: var(--pg-muted) !important; font-size: 1rem !important; line-height: 1.6; }
#deadline-notice[style] {
	background: var(--pg-gold-dim) !important; border-color: rgba(252, 180, 45, 0.28) !important;
	border-radius: 12px !important; padding: 12px 16px !important; color: var(--pg-text-2) !important;
}
.balance-card {
	display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap;
	text-align: left !important; padding: 20px 22px !important; margin-bottom: 28px !important;
	background: linear-gradient(180deg, var(--pg-panel-2), var(--pg-panel)) !important;
	border: 1px solid var(--pg-line) !important; border-radius: var(--pg-r-lg) !important;
	-webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
.balance-card .balance-label { margin: 0 !important; font-size: 0.72rem !important; letter-spacing: 0.12em !important; }
.balance-card .balance-amount { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 2rem) !important; font-variant-numeric: tabular-nums; }
.balance-card .balance-signin { width: 100%; margin: 0 !important; text-align: center; padding: 4px 0; color: var(--pg-muted) !important; }
.balance-card .balance-signin i { display: inline-block !important; margin: 0 8px 0 0 !important; font-size: 1.15rem !important; vertical-align: -2px; }
.balance-card .balance-signin a { display: inline-block; padding: 8px 2px; }
.section-label {
	display: flex; align-items: center; justify-content: space-between;
	font-size: 0.72rem !important; font-weight: 700 !important; letter-spacing: 0.12em; text-transform: uppercase;
	color: var(--pg-muted) !important; margin: 0 0 12px !important;
}
.amount-chips { gap: 10px !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
@media (min-width: 560px) { .amount-chips { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }
.amount-chip {
	position: relative; min-height: 76px; padding: 14px 12px !important;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
	background: var(--pg-panel) !important; border: 1px solid var(--pg-line-2) !important; border-radius: var(--pg-r-md) !important;
	-webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	-webkit-tap-highlight-color: transparent; user-select: none;
	transition: border-color 0.2s, background 0.2s, transform 0.15s var(--pg-ease), box-shadow 0.2s !important;
}
.amount-chip:hover { border-color: rgba(252, 180, 45, 0.4) !important; background: rgba(252, 180, 45, 0.04) !important; }
.amount-chip:active { transform: scale(0.98); }
.amount-chip.selected {
	border-color: var(--pg-gold) !important; background: rgba(252, 180, 45, 0.09) !important;
	box-shadow: 0 0 0 3px rgba(252, 180, 45, 0.12) !important;
}
.amount-chip.selected::after {
	content: "\f00c"; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free"; font-weight: 900;
	position: absolute; top: 8px; right: 8px; width: 18px; height: 18px; border-radius: 50%;
	display: grid; place-items: center; font-size: 0.6rem; color: #0a0f1c; background: var(--pg-gold);
}
.amount-chip .chip-amount { font-size: clamp(1.15rem, 1.05rem + 0.4vw, 1.35rem) !important; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }
.amount-chip .chip-tokens { font-size: 0.76rem !important; margin-top: 3px !important; }
.custom-amount-wrap { margin: 14px 0 18px !important; }
.custom-amount-input {
	font-size: 16px !important; min-height: 54px; padding: 14px 16px 14px 34px !important;
	border: 1px solid var(--pg-line-2) !important; border-radius: var(--pg-r-md) !important; background: var(--pg-panel) !important;
	font-variant-numeric: tabular-nums;
}
.custom-amount-input:focus { border-color: rgba(252, 180, 45, 0.6) !important; box-shadow: 0 0 0 4px rgba(252, 180, 45, 0.1); }
.custom-amount-wrap .dollar-sign { left: 17px !important; color: var(--pg-muted) !important; }
.referral-toggle { min-height: 44px; margin-bottom: 6px !important; text-align: left; line-height: 1.4; font-size: 0.88rem !important; }
.referral-input-wrap { flex-wrap: nowrap; }
.referral-input { min-width: 0; font-size: 16px !important; min-height: 48px; border: 1px solid var(--pg-line-2) !important; border-radius: 12px !important; background: var(--pg-panel) !important; }
.referral-apply-btn { min-height: 48px; border-radius: 12px !important; }
.discount-display, #checkout-error { border-radius: 12px !important; }
.pay-section { margin-top: 4px !important; }
.pay-btn { min-height: 56px; border-radius: var(--pg-r-md) !important; font-size: 1rem !important; box-shadow: 0 14px 34px -16px rgba(252, 180, 45, 0.75); }
.pay-btn:disabled { opacity: 0.4 !important; box-shadow: none !important; }
.pay-coins { gap: 14px !important; margin-top: 18px !important; }
.pay-coins img { width: 24px !important; height: 24px !important; opacity: 0.7 !important; }
.security-note { color: rgba(140, 149, 168, 0.85) !important; margin-top: 12px !important; }
.status-banner { border-radius: var(--pg-r-lg) !important; }
@media (max-width: 380px) {
	.amount-chip { min-height: 70px; padding: 12px 8px !important; }
}

/* ── Payment (crypto checkout) ────────────────────────────────────────── */
body.pg-pay { padding: 16px 16px 32px; }
body.pg-pay.has-site-header { padding-top: calc(var(--pg-header-h) + 20px); }
@media (min-width: 701px) { body.pg-pay.has-site-header { padding-top: calc(var(--pg-header-h) + 32px); } }
.pay-back { min-height: 44px; margin-bottom: 8px !important; }
.pay-card {
	background: linear-gradient(180deg, var(--pg-panel-2), var(--pg-panel)) !important;
	border: 1px solid var(--pg-line) !important; border-radius: var(--pg-r-lg) !important;
	-webkit-backdrop-filter: none !important; backdrop-filter: none !important;
	box-shadow: 0 40px 100px -40px rgba(0, 0, 0, 0.7);
}
.pay-header {
	background: radial-gradient(500px 160px at 50% 0%, rgba(252, 180, 45, 0.12), transparent 75%) !important;
	border-bottom: 1px solid var(--pg-line) !important;
}
.pay-header-label { color: var(--pg-muted) !important; font-weight: 700; letter-spacing: 0.14em !important; }
.pay-header-amount { font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.pay-header-amount .pay-currency { color: var(--pg-muted) !important; }
.crypto-tab {
	min-height: 40px; padding: 8px 12px !important; border-radius: 10px !important;
	font-size: 0.78rem !important; color: rgba(215, 220, 232, 0.75) !important;
	border-color: var(--pg-line-2) !important; background: rgba(255, 255, 255, 0.025) !important;
}
.crypto-tab .tab-network { color: rgba(140, 149, 168, 0.8) !important; }
.crypto-tab.active { color: var(--pg-gold) !important; border-color: rgba(252, 180, 45, 0.5) !important; background: var(--pg-gold-dim) !important; }
.qr-frame { border-radius: 16px !important; padding: 12px !important; }
.qr-scan-label { color: var(--pg-muted) !important; font-weight: 700; letter-spacing: 0.14em !important; }
.field-label { color: var(--pg-muted) !important; font-weight: 700; letter-spacing: 0.12em !important; margin-bottom: 7px !important; }
.field-box { min-height: 56px; padding: 8px 8px 8px 14px !important; border-color: var(--pg-line-2) !important; background: rgba(255, 255, 255, 0.025) !important; }
.field-value { font-variant-numeric: tabular-nums; }
#wallet-address { font-family: var(--pg-mono) !important; font-size: 0.84rem !important; letter-spacing: 0.01em; line-height: 1.5 !important; color: var(--pg-text-2) !important; }
.copy-btn {
	width: 44px !important; height: 44px !important; border-radius: 10px !important;
	color: var(--pg-text-2) !important; background: rgba(255, 255, 255, 0.06) !important; font-size: 14px !important;
}
.copy-btn:hover { color: var(--pg-gold) !important; background: var(--pg-gold-dim) !important; }
.copy-btn.copied { color: var(--pg-green) !important; background: var(--pg-green-dim) !important; }
.timer-label { color: var(--pg-muted) !important; font-weight: 700; }
.timer-sublabel { color: rgba(140, 149, 168, 0.75) !important; font-size: 0.72rem !important; }
.timer-ring .ring-fg.urgent { stroke: var(--pg-red) !important; }
.status-bar { min-height: 48px; border-radius: 12px !important; }
.status-bar.expired, .status-bar.error { color: var(--pg-red) !important; background: var(--pg-red-dim) !important; border-color: rgba(255, 90, 110, 0.25) !important; }
.status-bar.expired .status-dot { background: var(--pg-red) !important; }
.pay-note { color: rgba(140, 149, 168, 0.85) !important; font-size: 0.76rem !important; line-height: 1.6 !important; }
.pay-note a { display: inline-block; padding: 8px 4px; color: var(--pg-gold) !important; font-weight: 600; }
.pay-footer { color: rgba(140, 149, 168, 0.7) !important; font-size: 0.72rem !important; border-top-color: var(--pg-line) !important; }
.expired-actions a { min-height: 48px; }
@media (max-width: 700px) {
	.crypto-tabs { gap: 6px !important; }
	.pay-left { gap: 18px !important; }
	.qr-frame img, .qr-loading { width: 196px !important; height: 196px !important; }
	.timer-row { justify-content: flex-start !important; }
}

/* ── Motion preferences ───────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
	.auth-orb, .auth-submit::after { animation: none !important; }
}
html { scroll-behavior: smooth; }