/*
 * VALT — main.css
 * Design system: Navy (#3D3C56) + Gold (#E8C48B) + Ruda font
 * Replaces Elementor layout dependency.
 */

/* ─── Design Tokens ───────────────────────────────────────────────── */
/*
 * VALT Color System — WCAG AA compliant on navy backgrounds.
 *
 * Primary:    Gold spectrum for headings, accents, and interactive elements
 * Neutral:    Navy/brown spectrum for surfaces, text hierarchy
 * Semantic:   Coral (links/danger), Green (success/connected)
 *
 * All buttons use --valt-cream text for readability.
 */
:root {
	/* ── Gold spectrum ── */
	--valt-gold:       #E8C48B;   /* headings, accents, borders — 7.5:1 on navy */
	--valt-gold-dark:  #C9A66B;   /* primary button bg — warmer, better contrast base */
	--valt-gold-light: #F2D9A9;   /* hover highlights */
	--valt-cream:      #FFF8ED;   /* button text, bold text — 13:1 on navy, 6:1 on gold-dark */

	/* ── Neutral spectrum ── */
	--valt-navy:       #3D3C56;   /* body background */
	--valt-dark:       #2A2940;   /* cards, nav, elevated surfaces */
	--valt-darker:     #1E1D30;   /* deepest bg (modals, dropdowns) */
	--valt-brown:      #493D3C;   /* dark accent */
	--valt-mid:        #9B8E82;   /* muted text, labels — 4.5:1 on navy */
	--valt-tan:        #C5AD90;   /* body text — 6.2:1 on navy */

	/* ── Semantic ── */
	--valt-coral:      #D4A574;   /* warm link color — gold-adjacent, not red. 5.5:1 on navy */
	--valt-green:      #4ADE80;   /* success, connected states */
	--valt-red:        #E87C7C;   /* errors, danger buttons only — not used for links */

	/* ── Typography ── */
	--valt-font:       'Ruda', sans-serif;
	--valt-fs-hero:    clamp(2.5rem, 6vw, 3.5rem);
	--valt-fs-h1:      clamp(1.75rem, 4vw, 2.5rem);
	--valt-fs-h2:      clamp(1.35rem, 3vw, 1.75rem);
	--valt-fs-h3:      1.15rem;
	--valt-fs-body:    0.95rem;
	--valt-fs-small:   0.85rem;
	--valt-fs-xs:      0.75rem;

	/* ── Layout ── */
	--valt-radius:     12px;
	--valt-radius-sm:  8px;
	--valt-radius-lg:  16px;
	--valt-gap:        24px;
	--valt-container:  1200px;

	/* ── Shadows ── */
	--valt-shadow:     0 4px 20px rgba(0,0,0,0.25);
	--valt-shadow-lg:  0 8px 40px rgba(0,0,0,0.35);

	/* ── Borders ── */
	--valt-border:     1px solid rgba(232,196,139,0.12);
	--valt-border-hover: 1px solid rgba(232,196,139,0.3);
}

/* ─── Reset & Base ────────────────────────────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Ruda:wght@400;500;600;700&display=swap');

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

body {
	font-family: var(--valt-font);
	background: var(--valt-navy);
	color: var(--valt-gold);
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

a { color: var(--valt-coral); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--valt-gold); }

img { max-width: 100%; height: auto; display: block; }

h1, h2, h3, h4 { font-weight: 600; color: var(--valt-gold); line-height: 1.2; margin-bottom: 0.5em; }
h1 { font-size: var(--valt-fs-h1); }
h2 { font-size: var(--valt-fs-h2); margin-top: 2rem; }
h3 { font-size: var(--valt-fs-h3); }

p { color: var(--valt-tan); margin-bottom: 1em; }

/* ─── Container ───────────────────────────────────────────────────── */
.valt-container {
	max-width: var(--valt-container);
	margin: 0 auto;
	padding: 0 var(--valt-gap);
}

/* ─── Site wrapper ────────────────────────────────────────────────── */
.valt-site { min-height: 100vh; display: flex; flex-direction: column; }
.valt-main { flex: 1; padding: 3rem 0; }

/* ─── Navigation ──────────────────────────────────────────────────── */
.valt-nav {
	background: var(--valt-dark);
	border-bottom: 1px solid rgba(232,196,139,0.1);
	position: sticky;
	top: 0;
	z-index: 1000;
}
.valt-nav__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 64px;
}
.valt-nav__logo {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--valt-gold);
	font-weight: 700;
	font-size: 1.25rem;
	text-decoration: none;
}
.valt-nav__logo img { border-radius: 50%; }
.valt-nav__links {
	display: flex;
	align-items: center;
	gap: 1.5rem;
}
.valt-nav__links a {
	color: var(--valt-tan);
	font-size: 0.9rem;
	font-weight: 500;
	transition: color 0.2s;
}
.valt-nav__links a:hover { color: var(--valt-gold); }
.valt-nav__wallet { color: var(--valt-gold) !important; font-weight: 600; }
.valt-nav__toggle { display: none; background: none; border: none; cursor: pointer; padding: 8px; }
.valt-nav__toggle span {
	display: block; width: 24px; height: 2px; background: var(--valt-gold); margin: 5px 0; transition: 0.3s;
}

@media (max-width: 768px) {
	.valt-nav__toggle { display: block; }
	.valt-nav__links {
		display: none; flex-direction: column; position: absolute; top: 64px; left: 0; right: 0;
		background: var(--valt-dark); padding: 1rem var(--valt-gap); gap: 0.75rem;
		border-bottom: 1px solid rgba(232,196,139,0.1);
	}
	.valt-nav__links.is-open { display: flex; }
}

/* ─── Hero ────────────────────────────────────────────────────────── */
.valt-hero {
	position: relative;
	height: 70vh;
	min-height: 400px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background: var(--valt-dark);
}
.valt-hero__bg {
	position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0;
	background-size: cover; background-position: center;
}
.valt-hero__overlay {
	position: absolute; inset: 0; background: linear-gradient(180deg, rgba(61,60,86,0.4) 0%, rgba(42,41,64,0.9) 100%); z-index: 1;
}
.valt-hero__content {
	position: relative; z-index: 2; text-align: center; max-width: 640px; padding: var(--valt-gap);
}
.valt-hero__title {
	font-size: var(--valt-fs-hero); font-weight: 700; color: var(--valt-cream);
	text-shadow: 0 2px 30px rgba(0,0,0,0.6); letter-spacing: 0.04em;
}
.valt-hero__subtitle {
	font-size: 1.25rem; color: var(--valt-gold-light); margin-top: 0.5rem;
	text-shadow: 0 1px 10px rgba(0,0,0,0.4);
}
.valt-hero__cta {
	margin-top: 2rem;
}
.valt-hero__logo { margin-bottom: 1.5rem; }

.valt-hero__cta.valt-btn--primary {
	padding: 0.9rem 2.5rem; font-size: 1.05rem; border-radius: var(--valt-radius-lg);
	box-shadow: 0 4px 25px rgba(201,166,107,0.3);
}

@media (max-width: 640px) {
	.valt-hero { height: 50vh; min-height: 300px; }
}

/* ─── Buttons ─────────────────────────────────────────────────────── */
.valt-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
	padding: 0.7rem 1.6rem; border-radius: var(--valt-radius);
	font-family: var(--valt-font); font-weight: 600; font-size: var(--valt-fs-body);
	cursor: pointer; border: 2px solid transparent; transition: all 0.2s ease;
	text-align: center; text-decoration: none; line-height: 1.2;
	letter-spacing: 0.01em;
}
.valt-btn:hover { transform: translateY(-1px); box-shadow: var(--valt-shadow); }
.valt-btn:active { transform: translateY(0); }

/* Primary — dark gold bg, cream text. High contrast. */
.valt-btn--primary {
	background: var(--valt-gold-dark); color: var(--valt-cream);
	border-color: var(--valt-gold-dark);
}
.valt-btn--primary:hover {
	background: var(--valt-gold); color: var(--valt-darker);
	border-color: var(--valt-gold);
}
.valt-btn--primary .valt-icon { stroke: currentColor; }

/* Secondary — outlined gold. */
.valt-btn--secondary {
	background: transparent; color: var(--valt-gold);
	border-color: var(--valt-gold);
}
.valt-btn--secondary:hover {
	background: rgba(232,196,139,0.12); color: var(--valt-cream);
}

/* Ghost — minimal, for tertiary actions. */
.valt-btn--ghost {
	background: transparent; color: var(--valt-tan);
	border-color: transparent; padding: 0.5rem 1rem;
}
.valt-btn--ghost:hover { color: var(--valt-gold); background: rgba(232,196,139,0.06); }

/* Danger — coral. */
.valt-btn--danger {
	background: var(--valt-red); color: var(--valt-cream);
	border-color: var(--valt-red);
}
.valt-btn--danger:hover { background: #d06060; border-color: #d06060; }

/* Sizes */
.valt-btn--small { padding: 0.45rem 1rem; font-size: var(--valt-fs-small); border-radius: var(--valt-radius-sm); }
.valt-btn--large { padding: 0.9rem 2.2rem; font-size: 1.05rem; border-radius: var(--valt-radius-lg); }

/* ─── Tags & Badges ───────────────────────────────────────────────── */
.valt-tag {
	display: inline-block; padding: 0.25rem 0.7rem; border-radius: 20px;
	font-size: var(--valt-fs-xs); font-weight: 500;
	background: rgba(232,196,139,0.12); color: var(--valt-gold);
	border: var(--valt-border);
}
.valt-badge {
	display: inline-flex; align-items: center; gap: 0.3rem;
	padding: 0.3rem 0.8rem; border-radius: var(--valt-radius-sm);
	font-size: var(--valt-fs-xs); font-weight: 600; letter-spacing: 0.02em;
}
.valt-badge--grey   { background: rgba(155,142,130,0.15); color: var(--valt-mid); }
.valt-badge--amber  { background: rgba(232,196,139,0.2); color: var(--valt-gold); }
.valt-badge--gold   { background: var(--valt-gold-dark); color: var(--valt-cream); }
.valt-badge--level  { background: rgba(232,196,139,0.12); color: var(--valt-gold); }

/* ─── Forms ───────────────────────────────────────────────────────── */
.valt-form { max-width: 500px; }
.valt-form__group { margin-bottom: 1.25rem; }
.valt-form__label { display: block; font-size: var(--valt-fs-small); color: var(--valt-tan); margin-bottom: 0.4rem; font-weight: 500; }
.valt-form__input, .valt-form__textarea, .valt-form__select {
	width: 100%; padding: 0.7rem 1rem; border: var(--valt-border); border-radius: var(--valt-radius-sm);
	background: var(--valt-darker); color: var(--valt-cream); font-family: var(--valt-font); font-size: var(--valt-fs-body);
	transition: border-color 0.2s, box-shadow 0.2s;
}
.valt-form__input::placeholder, .valt-form__textarea::placeholder {
	color: var(--valt-mid); opacity: 0.7;
}
.valt-form__input:focus, .valt-form__textarea:focus, .valt-form__select:focus {
	outline: none; border-color: var(--valt-gold-dark);
	box-shadow: 0 0 0 3px rgba(201,166,107,0.15);
}
.valt-form__textarea { resize: vertical; }

/* ─── Notices ─────────────────────────────────────────────────────── */
.valt-notice { padding: 0.75rem 1rem; border-radius: var(--valt-radius); margin-bottom: 1rem; font-size: 0.9rem; }
.valt-notice--success { background: rgba(100,180,100,0.2); color: #8fc; border: 1px solid rgba(100,180,100,0.3); }
.valt-notice--error { background: rgba(232,124,124,0.12); color: var(--valt-red); border: 1px solid rgba(232,124,124,0.25); }

/* ─── Tables ──────────────────────────────────────────────────────── */
.valt-table { width: 100%; border-collapse: collapse; }
.valt-table th { text-align: left; padding: 0.6rem 0.8rem; font-size: 0.8rem; color: var(--valt-mid); border-bottom: 1px solid rgba(232,196,139,0.15); }
.valt-table td { padding: 0.6rem 0.8rem; border-bottom: 1px solid rgba(232,196,139,0.08); font-size: 0.9rem; color: var(--valt-tan); }
.valt-table tr:hover td { background: rgba(232,196,139,0.05); }

/* ─── Song Grid ───────────────────────────────────────────────────── */
.valt-song-grid {
	display: grid; gap: var(--valt-gap);
}
.valt-song-grid--cols-2 { grid-template-columns: repeat(2, 1fr); }
.valt-song-grid--cols-3 { grid-template-columns: repeat(3, 1fr); }
.valt-song-grid--cols-4 { grid-template-columns: repeat(4, 1fr); }

.valt-song-grid__item {
	display: block; background: var(--valt-dark); border-radius: var(--valt-radius);
	overflow: hidden; transition: transform 0.25s ease, box-shadow 0.25s ease; text-decoration: none;
	border: var(--valt-border);
}
.valt-song-grid__item:hover {
	transform: translateY(-4px); box-shadow: var(--valt-shadow-lg);
	border-color: rgba(232,196,139,0.2);
}
.valt-song-grid__art { position: relative; }
.valt-song-grid__art img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.valt-song-grid__owned {
	position: absolute; bottom: 8px; right: 8px;
	padding: 0.2rem 0.6rem; border-radius: var(--valt-radius-sm);
	background: var(--valt-gold-dark); color: var(--valt-cream);
	font-size: var(--valt-fs-xs); font-weight: 600;
	box-shadow: 0 2px 8px rgba(0,0,0,0.4);
}
.valt-song-grid__item--owned { border-color: rgba(201,166,107,0.3); }
.valt-song-grid__placeholder {
	width: 100%; aspect-ratio: 1; background: linear-gradient(135deg, var(--valt-navy), var(--valt-dark));
}
.valt-song-grid__info { padding: 0.75rem 1rem; }
.valt-song-grid__title { display: block; color: var(--valt-gold); font-size: 0.95rem; }
.valt-song-grid__artist { display: block; color: var(--valt-mid); font-size: 0.8rem; margin-top: 0.15rem; }
.valt-song-grid__meta { display: block; color: var(--valt-mid); font-size: 0.75rem; margin-top: 0.3rem; }

@media (max-width: 768px) {
	.valt-song-grid--cols-3, .valt-song-grid--cols-4 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 480px) {
	.valt-song-grid--cols-2, .valt-song-grid--cols-3, .valt-song-grid--cols-4 { grid-template-columns: 1fr; }
}

/* ─── Song Card (single) ─────────────────────────────────────────── */
.valt-song-card {
	background: var(--valt-dark); border-radius: var(--valt-radius); overflow: hidden;
	border: 1px solid rgba(232,196,139,0.1);
}
.valt-song-card__img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.valt-song-card__info { padding: 1rem; }
.valt-song-card__artist { color: var(--valt-mid); font-size: 0.9rem; }
.valt-song-card__actions { padding: 0 1rem 1rem; }

/* ─── Artist Hero ─────────────────────────────────────────────────── */
.valt-artist-hero {
	padding: 4rem 0; background-size: cover; background-position: center; background-color: var(--valt-dark);
}
.valt-artist-hero__inner { display: flex; align-items: center; gap: 2rem; }
.valt-artist-hero__photo {
	width: 180px; height: 180px; border-radius: 50%; object-fit: cover; border: 3px solid var(--valt-gold);
	flex-shrink: 0;
}
.valt-artist-hero__info { flex: 1; }
.valt-artist-hero__info h1 { color: var(--valt-cream); }
.valt-artist-hero__tags { display: flex; gap: 0.5rem; margin: 0.5rem 0; flex-wrap: wrap; }
.valt-artist-hero__bio { color: var(--valt-tan); max-width: 600px; }
.valt-artist-hero__actions { display: flex; align-items: center; gap: 1.5rem; margin-top: 1rem; flex-wrap: wrap; }
.valt-artist-hero__social { display: flex; gap: 1rem; }
.valt-artist-hero__social a {
	color: var(--valt-gold); font-weight: 600; font-size: 0.85rem;
	padding: 0.3rem 0.8rem; border: 1px solid var(--valt-gold); border-radius: 20px;
}
.valt-artist-hero__social a:hover { background: var(--valt-gold); color: var(--valt-brown); }

@media (max-width: 640px) {
	.valt-artist-hero__inner { flex-direction: column; text-align: center; }
	.valt-artist-hero__photo { width: 120px; height: 120px; }
	.valt-artist-hero__tags { justify-content: center; }
	.valt-artist-hero__social { justify-content: center; }
}

/* ─── Song Hero ───────────────────────────────────────────────────── */
.valt-song-hero {
	padding: 4rem 0; background-size: cover; background-position: center; background-color: var(--valt-dark);
}
.valt-song-hero__inner { display: flex; align-items: flex-start; gap: 2rem; }
.valt-song-hero__art {
	width: 250px; height: 250px; border-radius: var(--valt-radius); object-fit: cover; flex-shrink: 0;
	box-shadow: 0 8px 30px rgba(0,0,0,0.4);
}
.valt-song-hero__info { flex: 1; }
.valt-song-hero__info h1 { color: var(--valt-cream); }
.valt-song-hero__artist { font-size: 1.1rem; }
.valt-song-hero__artist a { color: var(--valt-coral); }
.valt-song-hero__meta { display: flex; gap: 1.5rem; color: var(--valt-mid); font-size: 0.9rem; margin: 0.75rem 0; flex-wrap: wrap; }
.valt-song-hero__meta a { color: var(--valt-coral); }
.valt-song-hero__badges { display: flex; gap: 0.5rem; margin-top: 0.5rem; }

.valt-song-actions { margin: 2rem 0; padding: 2rem; background: var(--valt-dark); border-radius: var(--valt-radius); border: 1px solid rgba(232,196,139,0.1); }

@media (max-width: 640px) {
	.valt-song-hero__inner { flex-direction: column; align-items: center; text-align: center; }
	.valt-song-hero__art { width: 200px; height: 200px; }
	.valt-song-hero__meta { justify-content: center; }
	.valt-song-hero__badges { justify-content: center; }
}

/* ─── Discovery ───────────────────────────────────────────────────── */
.valt-discovery__filters {
	display: flex; gap: 0.75rem; margin-bottom: 2rem; flex-wrap: wrap;
}
.valt-discovery__search { flex: 2; min-width: 200px; }
.valt-discovery__select { flex: 1; min-width: 140px; }

/* ─── Trending ────────────────────────────────────────────────────── */
.valt-trending__scroll {
	display: flex; gap: var(--valt-gap); overflow-x: auto; padding-bottom: 1rem;
	scrollbar-width: thin; scrollbar-color: var(--valt-mid) transparent;
}
.valt-trending__card {
	flex-shrink: 0; width: 200px; background: var(--valt-dark); border-radius: var(--valt-radius);
	overflow: hidden; text-decoration: none; border: 1px solid rgba(232,196,139,0.08); transition: transform 0.2s;
}
.valt-trending__card:hover { transform: translateY(-3px); }
.valt-trending__img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.valt-trending__info { padding: 0.75rem; }
.valt-trending__info strong { color: var(--valt-gold); font-size: 0.9rem; display: block; }
.valt-trending__fans { color: var(--valt-mid); font-size: 0.75rem; }

/* ─── Leaderboard ─────────────────────────────────────────────────── */
.valt-leaderboard__avatar { width: 32px; height: 32px; border-radius: 50%; vertical-align: middle; margin-right: 0.5rem; }
.valt-leaderboard__me td { background: rgba(232,196,139,0.08) !important; }

/* ─── User Points ─────────────────────────────────────────────────── */
.valt-user-points { padding: 1.5rem; background: var(--valt-dark); border-radius: var(--valt-radius); border: 1px solid rgba(232,196,139,0.1); }
.valt-user-points__total { font-size: 2rem; font-weight: 700; color: var(--valt-gold); }
.valt-user-points__total small { font-size: 0.9rem; font-weight: 400; color: var(--valt-mid); }
.valt-user-points__level { margin: 0.5rem 0; display: flex; align-items: center; gap: 0.75rem; }
.valt-user-points__next { font-size: 0.8rem; color: var(--valt-mid); }
.valt-user-points__bar { height: 6px; background: rgba(232,196,139,0.15); border-radius: 3px; margin-top: 0.5rem; overflow: hidden; }
.valt-user-points__fill { height: 100%; background: var(--valt-gold); border-radius: 3px; transition: width 0.5s; }

/* ─── Badges Grid ─────────────────────────────────────────────────── */
.valt-badges-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 1rem; }
.valt-badge-card {
	padding: 1rem; border-radius: var(--valt-radius); text-align: center; border: 1px solid rgba(232,196,139,0.1);
}
.valt-badge-card--earned { background: rgba(232,196,139,0.1); }
.valt-badge-card--locked { background: var(--valt-dark); opacity: 0.5; }
.valt-badge-card__icon { font-size: 1.5rem; margin-bottom: 0.5rem; }
.valt-badge-card strong { display: block; color: var(--valt-gold); font-size: 0.85rem; }
.valt-badge-card small { display: block; color: var(--valt-mid); font-size: 0.75rem; margin-top: 0.25rem; }

/* ─── Campaigns ───────────────────────────────────────────────────── */
.valt-campaigns-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: var(--valt-gap); }
.valt-campaign { padding: 1.5rem; background: var(--valt-dark); border-radius: var(--valt-radius); border: 1px solid rgba(232,196,139,0.1); }
.valt-campaign h3 { margin-bottom: 0.25rem; }
.valt-campaign__artist { color: var(--valt-mid); font-size: 0.9rem; margin-bottom: 0.75rem; }
.valt-campaign__bar { height: 8px; background: rgba(232,196,139,0.15); border-radius: 4px; margin: 1rem 0; overflow: hidden; }
.valt-campaign__fill { height: 100%; background: linear-gradient(90deg, var(--valt-gold-dark), var(--valt-gold)); border-radius: 4px; transition: width 0.5s; }
.valt-campaign__stats { display: flex; gap: 1.5rem; font-size: 0.85rem; color: var(--valt-mid); flex-wrap: wrap; }
.valt-campaign__stats strong { color: var(--valt-gold); }
.valt-campaign__deadline { font-size: 0.8rem; color: var(--valt-mid); margin-top: 0.5rem; }
.valt-campaign__pledge { display: flex; gap: 0.5rem; margin-top: 1rem; }
.valt-campaign__pledge input { flex: 1; }

/* ─── Mint / Checkout (wallet-aware) ──────────────────────────────── */
.valt-mint { margin: 1rem 0; }
.valt-mint__prices { display: flex; align-items: baseline; gap: 1rem; margin-bottom: 1rem; flex-wrap: wrap; }
.valt-mint__price-ada { font-size: 1.5rem; font-weight: 700; color: var(--valt-gold); }
.valt-mint__price-usd { font-size: 1rem; color: var(--valt-mid); }
.valt-mint__supply { font-size: 0.8rem; color: var(--valt-mid); }

.valt-mint__wallet-connected {
	display: flex; align-items: center; gap: 0.5rem;
	padding: 0.6rem 0.8rem; margin-bottom: 0.75rem;
	background: rgba(74,222,128,0.08); border: 1px solid rgba(74,222,128,0.2);
	border-radius: var(--valt-radius); font-size: 0.85rem; color: var(--valt-tan);
}
.valt-mint__wallet-connected .valt-icon { stroke: #4ade80; }
.valt-mint__wallet-connected code { color: var(--valt-gold); font-size: 0.8rem; }

.valt-mint__wallet-input { margin-bottom: 0.75rem; }
.valt-mint__hint { font-size: 0.8rem; color: var(--valt-mid); margin-top: 0.4rem; }
.valt-mint__hint a { color: var(--valt-coral); }
.valt-mint__status { margin-top: 0.5rem; font-size: 0.85rem; color: var(--valt-mid); }

.valt-mint__done { display: flex; align-items: center; gap: 0.75rem; }
.valt-mint__done .valt-icon { stroke: var(--valt-gold); }
.valt-mint__count { font-size: 0.8rem; color: var(--valt-mid); }

.valt-mint__pending { }
.valt-mint__pending p { margin-top: 0.5rem; }

.valt-mint__btn { display: inline-flex; align-items: center; gap: 0.5rem; }
.valt-mint__btn .valt-icon { stroke: var(--valt-brown); }

/* Price tiers */
.valt-mint__tiers { display: flex; gap: 0.75rem; flex-wrap: wrap; }
.valt-mint__tier {
	display: flex; flex-direction: column; align-items: center;
	padding: 1rem 1.5rem; border-radius: var(--valt-radius); min-width: 140px;
	text-decoration: none; text-align: center; transition: all 0.2s;
}
.valt-mint__tier:hover { transform: translateY(-2px); box-shadow: var(--valt-shadow); }
.valt-mint__tier--primary {
	background: var(--valt-gold-dark); border: 2px solid var(--valt-gold-dark);
}
.valt-mint__tier--primary .valt-mint__tier-label { color: var(--valt-cream); font-weight: 600; font-size: var(--valt-fs-small); }
.valt-mint__tier--primary .valt-mint__tier-price { color: var(--valt-cream); font-size: 1.3rem; font-weight: 700; }
.valt-mint__tier--primary .valt-mint__tier-usd { color: rgba(255,248,237,0.6); font-size: var(--valt-fs-xs); }
.valt-mint__tier--primary:hover { background: var(--valt-gold); border-color: var(--valt-gold); }
.valt-mint__tier--primary:hover .valt-mint__tier-label,
.valt-mint__tier--primary:hover .valt-mint__tier-price { color: var(--valt-darker); }

.valt-mint__tier--bundle {
	background: var(--valt-darker); border: 2px solid var(--valt-gold);
}
.valt-mint__tier--bundle .valt-mint__tier-label { color: var(--valt-gold); font-weight: 600; font-size: var(--valt-fs-small); }
.valt-mint__tier--bundle .valt-mint__tier-price { color: var(--valt-cream); font-size: 1.3rem; font-weight: 700; }
.valt-mint__tier--bundle .valt-mint__tier-usd { color: var(--valt-green); font-size: var(--valt-fs-xs); font-weight: 500; }
.valt-mint__tier--bundle:hover { background: rgba(232,196,139,0.08); }

.valt-checkout { margin: 1rem 0; }
.valt-checkout__hint { font-size: 0.8rem; color: var(--valt-mid); margin-top: 0.4rem; }
.valt-checkout__btn { display: inline-flex; align-items: center; gap: 0.5rem; }

/* ─── Connect-Mint Combo ──────────────────────────────────────────── */
.valt-connect-mint__divider {
	display: flex; align-items: center; gap: 1rem; margin: 1rem 0;
	color: var(--valt-mid); font-size: 0.8rem;
}
.valt-connect-mint__divider::before, .valt-connect-mint__divider::after {
	content: ''; flex: 1; height: 1px; background: rgba(232,196,139,0.15);
}
.valt-connect-mint__nudge {
	display: flex; align-items: center; gap: 0.5rem;
	margin-top: 1rem; padding: 0.6rem 0.8rem;
	background: rgba(232,196,139,0.06); border-radius: var(--valt-radius);
	font-size: 0.8rem; color: var(--valt-mid);
}
.valt-connect-mint__nudge .valt-icon { stroke: var(--valt-gold); flex-shrink: 0; }
.valt-connect-mint__nudge a { color: var(--valt-coral); }

/* ─── Music Player Wrap ───────────────────────────────────────────── */
.valt-player-wrap { position: sticky; bottom: 0; z-index: 500; }

/* ─── Artist Fans (mini leaderboard) ──────────────────────────────── */
.valt-artist-fans__item {
	display: flex; align-items: center; gap: 0.75rem; padding: 0.5rem 0;
	border-bottom: 1px solid rgba(232,196,139,0.08); font-size: 0.9rem;
}
.valt-artist-fans__item img { width: 32px; height: 32px; border-radius: 50%; }

/* ─── Fan Dashboard Tabs ──────────────────────────────────────────── */
.valt-tabs { display: flex; gap: 0; border-bottom: 1px solid rgba(232,196,139,0.15); margin-bottom: 1.5rem; }
.valt-tab-btn {
	padding: 0.6rem 1.25rem; background: none; border: none; color: var(--valt-mid);
	font-family: var(--valt-font); font-size: 0.9rem; font-weight: 500; cursor: pointer;
	border-bottom: 2px solid transparent; transition: all 0.2s;
}
.valt-tab-btn:hover { color: var(--valt-gold); }
.valt-tab-btn--active { color: var(--valt-gold); border-bottom-color: var(--valt-gold); }
.valt-tab-panel { display: none; }
.valt-tab-panel--active { display: block; }

/* ─── Section spacing ─────────────────────────────────────────────── */
.valt-section { margin: 3rem 0; }

/* ─── Contact Form ────────────────────────────────────────────────── */
.valt-contact-form { max-width: 500px; }

/* ─── Footer ──────────────────────────────────────────────────────── */
.valt-footer {
	background: var(--valt-dark); border-top: 1px solid rgba(232,196,139,0.1); padding: 2rem 0; margin-top: auto;
}
.valt-footer__inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.valt-footer__brand { color: var(--valt-gold); font-weight: 600; }
.valt-footer__links { display: flex; gap: 1.5rem; }
.valt-footer__links a { color: var(--valt-mid); font-size: 0.85rem; }
.valt-footer__links a:hover { color: var(--valt-gold); }
.valt-footer__copy { color: var(--valt-mid); font-size: 0.8rem; }

@media (max-width: 640px) {
	.valt-footer__inner { flex-direction: column; text-align: center; }
}

/* ─── Gated content states ────────────────────────────────────────── */
.valt-gated { padding: 2rem; border-radius: var(--valt-radius); text-align: center; }
.valt-gated--disconnected { background: rgba(232,196,139,0.08); border: 1px dashed rgba(232,196,139,0.2); }
.valt-gated--locked { background: rgba(212,165,116,0.08); border: 1px dashed rgba(212,165,116,0.2); }

/* ─── The Valt — Token-Gated Section ─────────────────────────────── */
.valt-vault {
	margin: 3rem 0; text-align: center;
}
.valt-vault__header { margin-bottom: 2rem; }
.valt-vault__title {
	font-size: var(--valt-fs-h1); font-weight: 700; color: var(--valt-gold);
	letter-spacing: 0.06em; margin-bottom: 0.25rem;
}
.valt-vault__sub { color: var(--valt-mid); font-size: var(--valt-fs-body); margin: 0; }

/* Door container */
.valt-vault__door {
	position: relative; display: flex; flex-direction: column; align-items: center;
	padding: 3rem 2rem; margin: 0 auto; max-width: 500px;
	background: var(--valt-darker); border-radius: var(--valt-radius-lg);
	border: var(--valt-border); overflow: hidden;
}
.valt-vault__door::before {
	content: ''; position: absolute; inset: 0;
	background: radial-gradient(circle at center, rgba(232,196,139,0.04) 0%, transparent 70%);
	pointer-events: none;
}

/* Door inner — holds the spinning logo */
.valt-vault__door-inner {
	position: relative; z-index: 1; margin-bottom: 1.5rem;
	transition: transform 0.8s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.6s ease;
}

/* LOCKED — logo spins continuously */
[data-state="disconnected"] .valt-vault__door-inner,
[data-state="needs-sync"] .valt-vault__door-inner,
[data-state="locked"] .valt-vault__door-inner {
	/* Animation is already on the .valt-spokes inside via CSS */
}

/* UNLOCKED — logo stops spinning, scales down, fades to reveal content */
[data-state="unlocked"] .valt-vault__door-inner {
	transform: scale(0.6);
	opacity: 0.3;
}
[data-state="unlocked"] .valt-vault__door-inner .valt-spokes {
	animation: none !important;
}
[data-state="unlocked"] .valt-vault__door-inner .valt-outer {
	animation: none !important;
}
[data-state="unlocked"] .valt-vault__door-inner .valt-groove {
	animation: none !important;
}

/* Status badges below the door */
.valt-vault__status {
	position: relative; z-index: 2;
	display: flex; flex-direction: column; align-items: center; gap: 0.75rem;
}
.valt-vault__status p {
	color: var(--valt-tan); font-size: var(--valt-fs-body); margin: 0;
}
.valt-vault__status--open {
	display: flex; flex-direction: row; align-items: center; gap: 0.5rem;
	padding: 0.5rem 1.2rem; border-radius: var(--valt-radius-sm);
	background: rgba(74,222,128,0.1); border: 1px solid rgba(74,222,128,0.25);
}
.valt-vault__status--open span { color: var(--valt-green); font-weight: 600; font-size: var(--valt-fs-small); }
.valt-vault__status--open .valt-icon { stroke: var(--valt-green); }

/* Unlocked content area */
.valt-vault__content {
	margin-top: 2rem; text-align: left;
	animation: valt-reveal 0.6s ease-out;
}
@keyframes valt-reveal {
	from { opacity: 0; transform: translateY(20px); }
	to { opacity: 1; transform: translateY(0); }
}
.valt-vault__inner { padding: 2rem; background: var(--valt-darker); border-radius: var(--valt-radius); border: var(--valt-border); }
.valt-vault__inner h3 { color: var(--valt-cream); }
.valt-vault__inner > p { color: var(--valt-tan); }
.valt-vault__grid {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--valt-gap); margin-top: 1.5rem;
}
.valt-vault__collection { margin-bottom: 2rem; }
.valt-vault__collection h4 {
	display: flex; align-items: center; gap: 0.5rem;
	font-size: var(--valt-fs-h3); color: var(--valt-cream); margin-bottom: 1rem;
}
.valt-vault__collection h4 .valt-icon { stroke: var(--valt-gold-light); }

.valt-vault__grid .valt-card {
	background: var(--valt-dark); border: var(--valt-border);
}
.valt-vault__grid .valt-card h4 {
	display: flex; align-items: center; gap: 0.5rem;
	font-size: var(--valt-fs-h3); color: var(--valt-cream); margin-bottom: 0.5rem;
}
.valt-vault__grid .valt-card h4 .valt-icon { stroke: var(--valt-gold-light); }
.valt-vault__grid .valt-card p { color: var(--valt-tan); font-size: var(--valt-fs-small); }

/* ─── Nav: Wallet Connect Button (prominent, top-right) ───────────── */
.valt-nav__right {
	display: flex; align-items: center; gap: 0.75rem;
}
.valt-nav__connect-btn {
	display: flex; align-items: center; gap: 0.5rem;
	padding: 0.5rem 1.2rem; border-radius: var(--valt-radius);
	background: var(--valt-gold-dark); color: var(--valt-cream);
	font-weight: 600; font-size: var(--valt-fs-small); text-decoration: none;
	transition: all 0.2s; white-space: nowrap;
	border: 2px solid var(--valt-gold-dark);
}
.valt-nav__connect-btn:hover {
	background: var(--valt-gold); color: var(--valt-darker);
	border-color: var(--valt-gold); box-shadow: 0 2px 12px rgba(201,166,107,0.3);
}
.valt-nav__connect-btn .valt-icon { stroke: currentColor; }

.valt-nav__wallet-btn {
	display: flex; align-items: center; gap: 0.5rem;
	padding: 0.45rem 1rem; border-radius: var(--valt-radius);
	border: 1px solid var(--valt-gold); color: var(--valt-gold);
	font-weight: 600; font-size: 0.85rem; text-decoration: none;
	transition: all 0.2s; position: relative; white-space: nowrap;
}
.valt-nav__wallet-btn:hover { background: rgba(232,196,139,0.1); color: var(--valt-gold); }
.valt-nav__wallet-dot {
	width: 8px; height: 8px; border-radius: 50%; background: #4ade80;
	position: absolute; top: 6px; right: 6px;
}

/* ─── SVG Icons ───────────────────────────────────────────────────── */
.valt-icon { display: inline-block; vertical-align: middle; flex-shrink: 0; }
.valt-nav__links a .valt-icon { margin-right: 0.25rem; opacity: 0.7; }

/* Animated logo — spokes spin, grooves pulse */
@keyframes valt-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes valt-breathe { 0%,40% { transform: scale(1); } 70% { transform: scale(1.06); } 100% { transform: scale(1); } }
@keyframes valt-groove { 0%,100% { opacity: 0.15; } 50% { opacity: 0.35; } }
.valt-logo-animated .valt-spokes { transform-origin: center; animation: valt-spin 8s linear infinite; }
.valt-logo-animated .valt-outer { transform-origin: center; animation: valt-breathe 8s ease-in-out infinite; }
.valt-logo-animated .valt-groove { animation: valt-groove 4s ease-in-out infinite; }
.valt-logo-animated .valt-groove:nth-child(3) { animation-delay: 0.4s; }
.valt-logo-animated .valt-groove:nth-child(4) { animation-delay: 0.8s; }
.valt-logo-animated .valt-groove:nth-child(5) { animation-delay: 1.2s; }
.valt-logo-animated .valt-groove:nth-child(6) { animation-delay: 1.6s; }
.valt-logo-animated .valt-groove:nth-child(7) { animation-delay: 2.0s; }
.valt-logo-animated .valt-groove:nth-child(8) { animation-delay: 2.4s; }
.valt-logo-animated .valt-groove:nth-child(9) { animation-delay: 2.8s; }

/* ─── Wallet Connect Modal ────────────────────────────────────────── */
.valt-modal-overlay {
	position: fixed; inset: 0; z-index: 9999;
	display: flex; align-items: center; justify-content: center;
	background: rgba(0,0,0,0.6); backdrop-filter: blur(4px);
}
.valt-modal {
	width: 100%; max-width: 420px; margin: 1rem;
	background: var(--valt-dark); border: 1px solid rgba(232,196,139,0.15);
	border-radius: 12px; overflow: hidden;
	box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.valt-modal-box-enter { transition: all 0.2s ease-out; }
.valt-modal-box-start { opacity: 0; transform: scale(0.9) translateY(10px); }
.valt-modal-box-end { opacity: 1; transform: scale(1) translateY(0); }
.valt-modal-box-leave { transition: all 0.15s ease-in; }
.valt-modal-enter { transition: opacity 0.2s; }
.valt-modal-leave { transition: opacity 0.15s; }

.valt-modal__header {
	display: flex; align-items: center; justify-content: space-between;
	padding: 1.25rem 1.5rem; border-bottom: 1px solid rgba(232,196,139,0.1);
}
.valt-modal__title {
	display: flex; align-items: center; gap: 0.6rem;
}
.valt-modal__title h2 { margin: 0; font-size: 1.15rem; color: var(--valt-gold); }
.valt-modal__title .valt-icon { stroke: var(--valt-gold); }
.valt-modal__close {
	background: none; border: none; color: var(--valt-mid); cursor: pointer;
	padding: 4px; border-radius: 4px; transition: color 0.2s;
}
.valt-modal__close:hover { color: var(--valt-gold); }

.valt-modal__body { padding: 1.25rem 1.5rem; }
.valt-modal__hint { font-size: 0.8rem; color: var(--valt-mid); margin-bottom: 1rem; }

.valt-wallet-list { display: flex; flex-direction: column; gap: 0.5rem; transition: opacity 0.2s; }
.valt-modal__help { font-size: var(--valt-fs-xs); color: var(--valt-mid); margin-top: 1rem; text-align: center; }
.valt-modal__help a { color: var(--valt-coral); }

/* ─── Wallet Buttons (inside modal) ───────────────────────────────── */
.valt-wallet-btn {
	display: flex; align-items: center; justify-content: space-between;
	width: 100%; padding: 0.75rem 1rem; border-radius: var(--valt-radius);
	border: 1px solid rgba(232,196,139,0.12); background: var(--valt-navy);
	color: var(--valt-tan); font-family: var(--valt-font); font-size: 0.9rem;
	cursor: pointer; transition: all 0.2s; text-align: left;
}
.valt-wallet-btn:hover { border-color: var(--valt-gold); background: rgba(232,196,139,0.06); }
.valt-wallet-btn:disabled { opacity: 0.4; cursor: not-allowed; }

.valt-wallet-btn--available {
	border-color: rgba(232,196,139,0.25); background: rgba(232,196,139,0.06);
}
.valt-wallet-btn--available .valt-wallet-btn__name { color: var(--valt-gold); font-weight: 600; }
.valt-wallet-btn--unavailable { opacity: 0.55; }
.valt-wallet-btn--unavailable:hover { opacity: 0.75; }

.valt-wallet-btn__name { flex: 1; }
.valt-wallet-btn__vespr { font-size: 0.7rem; color: var(--valt-mid); font-style: italic; margin-left: 0.5rem; }

/* Spinner (hidden by default, shown when connecting) */
.valt-wallet-btn__spinner {
	display: none; width: 16px; height: 16px;
	border: 2px solid rgba(232,196,139,0.2); border-top-color: var(--valt-gold);
	border-radius: 50%; animation: valt-spin 0.6s linear infinite;
}

/* Connecting state — clicked button shows spinner, others dim */
.valt-wallet-btn--connecting .valt-wallet-btn__spinner { display: block; }
.valt-wallet-btn--connecting { border-color: var(--valt-gold); pointer-events: none; }
.valt-wallet-list.is-connecting .valt-wallet-btn:not(.valt-wallet-btn--connecting) {
	opacity: 0.3; pointer-events: none;
}

/* ─── Connect Trigger Button ──────────────────────────────────────── */
.valt-connect-trigger { display: inline-flex; align-items: center; gap: 0.5rem; }
.valt-connect-trigger .valt-icon { stroke: var(--valt-brown); }

/* ─── Wallet Prompt (empty state) ─────────────────────────────────── */
.valt-wallet-prompt {
	text-align: center; padding: 4rem 2rem;
	max-width: 480px; margin: 0 auto;
}
.valt-wallet-prompt--compact { padding: 2rem; }
.valt-wallet-prompt__icon { margin-bottom: 1.5rem; }
.valt-wallet-prompt__icon .valt-icon { stroke: var(--valt-gold); opacity: 0.6; }
.valt-wallet-prompt h1 { font-size: 1.75rem; }
.valt-wallet-prompt p { color: var(--valt-mid); margin-bottom: 1.5rem; }

/* ─── Welcome Banner ──────────────────────────────────────────────── */
.valt-welcome {
	display: flex; align-items: center; justify-content: space-between;
	padding: 1rem 0; margin-bottom: 1.5rem;
	border-bottom: 1px solid rgba(232,196,139,0.1);
}
.valt-welcome__greeting {
	display: flex; align-items: center; gap: 0.6rem;
}
.valt-welcome__greeting h2 { margin: 0; font-size: 1.15rem; }
.valt-welcome__greeting em { font-style: normal; color: var(--valt-gold-light); }
.valt-welcome__greeting .valt-icon { stroke: var(--valt-gold); }

/* ─── Dashboard Grid ──────────────────────────────────────────────── */
.valt-dashboard-grid {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: var(--valt-gap); margin-bottom: 2rem;
}
.valt-card {
	padding: 1.5rem; background: var(--valt-dark);
	border-radius: var(--valt-radius); border: var(--valt-border);
}
.valt-card h3 {
	display: flex; align-items: center; gap: 0.5rem;
	font-size: 1rem; margin-bottom: 1rem; color: var(--valt-gold);
}
.valt-card h3 .valt-icon { stroke: var(--valt-gold); opacity: 0.7; }
.valt-dashboard-links { display: flex; flex-direction: column; gap: 0.5rem; }

/* ─── Dashboard Overview Stats ────────────────────────────────────── */
.valt-dash-overview {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 1rem; margin-bottom: 2rem;
}
.valt-dash-stat {
	padding: 1.25rem; background: var(--valt-dark); border-radius: var(--valt-radius);
	border: var(--valt-border); text-align: center;
}
.valt-dash-stat__label {
	display: block; font-size: var(--valt-fs-xs); color: var(--valt-mid);
	text-transform: uppercase; letter-spacing: 0.06em; font-weight: 500; margin-bottom: 0.4rem;
}
.valt-dash-stat__value {
	display: block; font-size: 1.75rem; font-weight: 700; color: var(--valt-cream);
}
.valt-dash-stat__value small { font-size: 0.8rem; font-weight: 400; color: var(--valt-mid); margin-left: 0.25rem; }
.valt-dash-stat__value--sm { font-size: 1rem; }

/* ─── Dashboard Wallet Details ────────────────────────────────────── */
.valt-dash-wallet { margin-bottom: 2rem; }
.valt-dash-table { width: 100%; border-collapse: collapse; }
.valt-dash-table tr { border-bottom: 1px solid rgba(232,196,139,0.06); }
.valt-dash-table tr:last-child { border-bottom: none; }
.valt-dash-table td { padding: 0.6rem 0; font-size: var(--valt-fs-small); color: var(--valt-tan); vertical-align: top; }
.valt-dash-table__label { color: var(--valt-mid); font-weight: 500; width: 100px; white-space: nowrap; }
.valt-dash-addr {
	font-size: var(--valt-fs-xs); color: var(--valt-gold); word-break: break-all;
	background: var(--valt-darker); padding: 0.2rem 0.4rem; border-radius: 4px;
}
.valt-dash-wallet__actions {
	display: flex; gap: 0.75rem; margin-top: 1rem; align-items: center;
}

/* ─── Dashboard Other Assets Toggle ───────────────────────────────── */
.valt-dash-other-assets { margin-top: 1.5rem; }
.valt-dash-other-assets summary { cursor: pointer; list-style: none; }
.valt-dash-other-assets summary::-webkit-details-marker { display: none; }

/* ─── Section Header ──────────────────────────────────────────────── */
.valt-section-header { margin-bottom: 1.5rem; }
.valt-section-header h1, .valt-section-header h2 {
	display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.25rem;
}
.valt-section-header h2 .valt-icon { stroke: var(--valt-gold); opacity: 0.7; }
.valt-section-header p { color: var(--valt-mid); margin: 0; font-size: var(--valt-fs-small); }
.valt-section-header a { color: var(--valt-coral); }

/* ─── Collection Grid (CardanoPress NFTs) ─────────────────────────── */
.valt-collection-grid {
	display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: var(--valt-gap); list-style: none; padding: 0;
}
.valt-collection-actions { margin-bottom: 1.5rem; }

/* ─── NFT Card (Collection item) ──────────────────────────────────── */
.valt-nft-card {
	background: var(--valt-dark); border-radius: var(--valt-radius);
	border: 1px solid rgba(232,196,139,0.1); overflow: hidden;
	transition: transform 0.2s, box-shadow 0.2s;
}
.valt-nft-card:hover { transform: translateY(-3px); box-shadow: 0 8px 25px rgba(0,0,0,0.3); }
.valt-nft-card__image img, .valt-nft-card__img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.valt-nft-card__img-wrap { width: 100%; }
.valt-nft-card__img-placeholder {
	width: 100%; aspect-ratio: 1; display: flex; align-items: center; justify-content: center;
	background: linear-gradient(135deg, var(--valt-navy), var(--valt-dark));
	font-size: 3rem; font-weight: 700; color: var(--valt-mid);
}
.valt-nft-card__body { padding: 1rem; }
.valt-nft-card__name { font-size: 0.95rem; color: var(--valt-gold); margin-bottom: 0.25rem; }
.valt-nft-card__name a { color: var(--valt-gold); text-decoration: none; }
.valt-nft-card__name a:hover { color: var(--valt-cream); }
.valt-nft-card__artist-link {
	display: inline-flex; align-items: center; gap: 0.3rem;
	font-size: var(--valt-fs-small); color: var(--valt-coral); text-decoration: none;
	margin-bottom: 0.25rem;
}
a.valt-nft-card__artist-link:hover { color: var(--valt-gold); }
.valt-nft-card__artist-link .valt-icon { stroke: currentColor; }
.valt-nft-card__album { display: block; font-size: var(--valt-fs-xs); color: var(--valt-mid); margin-bottom: 0.35rem; }
.valt-nft-card__badge { margin-bottom: 0.35rem; }
.valt-nft-card--valt { border-color: rgba(201,166,107,0.25); }
.valt-nft-card__qty { font-size: 0.8rem; color: var(--valt-mid); display: block; margin-bottom: 0.4rem; }
.valt-nft-card__links { display: flex; gap: 0.75rem; margin-bottom: 0.5rem; }
.valt-nft-card__explorer {
	display: inline-flex; align-items: center; gap: 0.25rem;
	font-size: var(--valt-fs-xs); color: var(--valt-mid); text-decoration: none;
}
.valt-nft-card__explorer:hover { color: var(--valt-gold); }
.valt-nft-card__explorer .valt-icon { stroke: currentColor; }
.valt-nft-card__meta { display: flex; flex-direction: column; gap: 0.3rem; }
.valt-nft-card__field { display: flex; gap: 0.5rem; font-size: 0.8rem; }
.valt-nft-card__label { color: var(--valt-mid); font-weight: 500; min-width: 70px; }
.valt-nft-card__value { color: var(--valt-tan); }

/* ─── CardanoPress Profile Connection override ────────────────────── */
.valt-card table { width: 100%; }
.valt-card table td { padding: 0.4rem 0; font-size: 0.85rem; color: var(--valt-tan); border: none; }
.valt-card table td:first-child { color: var(--valt-mid); font-weight: 500; width: 100px; }
.valt-card code { font-size: 0.75rem; color: var(--valt-gold); word-break: break-all; }

/* ─── Dropdown Menu ───────────────────────────────────────────────── */
.valt-dropdown__link {
	display: block; padding: 0.4rem 0.8rem; color: var(--valt-tan);
	font-size: 0.85rem; transition: color 0.2s;
}
.valt-dropdown__link:hover { color: var(--valt-gold); }

/* ─── Toast Notifications (CardanoPress) ───────────────────────────── */
.valt-toast-container {
	position: fixed; top: 80px; left: 50%; transform: translateX(-50%);
	z-index: 10000; display: flex; flex-direction: column; align-items: center; gap: 0.5rem;
	pointer-events: none; width: 100%; max-width: 480px; padding: 0 1rem;
}
.valt-toast {
	display: flex; align-items: center; gap: 1rem;
	padding: 0.8rem 1.2rem; border-radius: var(--valt-radius);
	background: var(--valt-dark); border: var(--valt-border);
	box-shadow: var(--valt-shadow-lg); pointer-events: all;
	width: 100%; animation: valt-toast-in 0.3s ease-out;
}
.valt-toast--success { border-color: rgba(74,222,128,0.4); background: rgba(42,41,64,0.97); }
.valt-toast--info    { border-color: rgba(232,196,139,0.4); }
.valt-toast--warning { border-color: rgba(212,165,116,0.4); }
.valt-toast--error   { border-color: rgba(232,124,124,0.4); }

.valt-toast__text { flex: 1; color: var(--valt-cream); font-size: var(--valt-fs-body); font-weight: 500; }
.valt-toast--success .valt-toast__text { color: var(--valt-green); }
.valt-toast--error .valt-toast__text { color: var(--valt-red); }

.valt-toast__actions { display: flex; align-items: center; gap: 0.5rem; flex-shrink: 0; }
.valt-toast__refresh {
	padding: 0.3rem 0.8rem; border-radius: var(--valt-radius-sm);
	background: var(--valt-gold-dark); color: var(--valt-cream);
	font-family: var(--valt-font); font-size: var(--valt-fs-xs); font-weight: 600;
	border: none; cursor: pointer; transition: background 0.2s;
}
.valt-toast__refresh:hover { background: var(--valt-gold); color: var(--valt-darker); }
.valt-toast__close {
	background: none; border: none; color: var(--valt-mid); font-size: 1.2rem;
	cursor: pointer; padding: 0 0.3rem; line-height: 1;
}
.valt-toast__close:hover { color: var(--valt-cream); }

@keyframes valt-toast-in { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }
.valt-toast-enter { transition: all 0.3s ease-out; }
.valt-toast-leave { transition: all 0.3s ease-in; }
.valt-toast-start { opacity: 0; transform: translateY(-10px); }
.valt-toast-end { opacity: 1; transform: translateY(0); }

/* ─── Sync Button & Prompt ─────────────────────────────────────────── */
.valt-sync-btn { display: inline-flex; align-items: center; gap: 0.4rem; }
.valt-sync-btn__icon { transition: transform 0.3s; }
.valt-sync-btn:hover .valt-sync-btn__icon { transform: rotate(180deg); }
.valt-sync-btn:disabled { opacity: 0.5; }

.valt-sync-prompt {
	padding: 1.5rem; background: var(--valt-darker); border-radius: var(--valt-radius);
	border: 1px dashed rgba(232,196,139,0.2); text-align: center;
}
.valt-sync-prompt p { margin-bottom: 0.75rem; }

/* ─── Follow Button ───────────────────────────────────────────────── */
.valt-follow {
	display: inline-flex; align-items: center; gap: 0.6rem;
}
.valt-follow__count { font-weight: 700; color: var(--valt-cream); font-size: var(--valt-fs-body); }
.valt-follow__label { color: var(--valt-mid); font-size: var(--valt-fs-small); }
.valt-follow--active { border-color: var(--valt-green) !important; color: var(--valt-green) !important; }
.valt-follow--active:hover { background: rgba(74,222,128,0.08); }

/* ─── Utility ─────────────────────────────────────────────────────── */
.text-center { text-align: center; }
.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 2rem; }
.mb-2 { margin-bottom: 1rem; }

/* ─── Override CardanoPress Tailwind resets ────────────────────────── */
.valt-site .container { max-width: var(--valt-container); margin: 0 auto; padding: 0 var(--valt-gap); }
.valt-site h2.mb-0 { margin-bottom: 0; }
.valt-site .wallet-button { display: none; } /* Hide old CardanoPress buttons, we use valt-wallet-btn */