/* ==========================================================================
   Tesoro WebApp — Public CSS v3.0
   Identidad: Aventura pirata · Océano nocturno · Pergamino dorado
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Tokens y fundamento
   -------------------------------------------------------------------------- */
.tw-app {
	--tw-navy-950: #040e1a;
	--tw-navy-900: #071525;
	--tw-navy-800: #0c2236;
	--tw-navy-700: #113048;
	--tw-navy-600: #164060;
	--tw-gold-300: #f5d98a;
	--tw-gold-400: #eac55c;
	--tw-gold-500: #d9a748;
	--tw-gold-600: #b97922;
	--tw-gold-700: #8c5a10;
	--tw-parchment-50:  #fffdf5;
	--tw-parchment-100: #fff8e8;
	--tw-parchment-200: #f5dfb4;
	--tw-parchment-300: #e8c88a;
	--tw-ruby-500: #c73346;
	--tw-ruby-600: #9f2438;
	--tw-ruby-700: #7a1a2a;
	--tw-green-500: #2fa854;
	--tw-green-600: #247a3e;
	--tw-blue-500:  #1a6fa8;
	--tw-ink:      #1a1008;
	--tw-ink-soft: #3d2b14;
	--tw-muted:    #6b5040;
	--tw-font-display: Georgia, 'Palatino Linotype', Palatino, 'Book Antiqua', serif;
	--tw-font-body:    ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--tw-shadow-card: 0 8px 28px rgba(4,14,26,.36), 0 2px 8px rgba(4,14,26,.22);
	--tw-shadow-lift: 0 18px 50px rgba(4,14,26,.48), 0 4px 14px rgba(4,14,26,.28);
	--tw-border-gold:  rgba(217,167,72,.36);
	--tw-border-parch: rgba(90,57,22,.22);
	--tw-radius-card: 10px;
	--tw-radius-btn:  8px;
	--tw-gap: 20px;

	width: min(1200px, calc(100% - 24px));
	margin: 28px auto;
	padding: 16px;
	border: 1px solid var(--tw-border-gold);
	border-radius: var(--tw-radius-card);
	background:
		linear-gradient(155deg, var(--tw-navy-950) 0%, var(--tw-navy-800) 60%, #0d2840 100%),
		repeating-linear-gradient(45deg,
			rgba(217,167,72,.055) 0, rgba(217,167,72,.055) 1px,
			transparent 1px, transparent 28px);
	box-shadow:
		0 0 0 1px rgba(217,167,72,.08) inset,
		0 32px 80px rgba(4,14,26,.55);
	color: var(--tw-parchment-100);
	font-family: var(--tw-font-body);
}

.tw-app *, .tw-app *::before, .tw-app *::after { box-sizing: border-box; }

.tw-app h1,
.tw-app .tw-winners-hero h1,
.tw-app .tw-dashboard-head h2,
.tw-app .tw-dashboard-hero h2,
.tw-app .tw-dashboard-detail__overlay h2 {
	font-family: var(--tw-font-display);
	letter-spacing: .01em;
}

.tw-app p { line-height: 1.7; }

/* --------------------------------------------------------------------------
   2. Navegación de aventura
   -------------------------------------------------------------------------- */
.tw-adventure-nav {
	display: flex;
	align-items: center;
	gap: 4px;
	margin: 0 0 16px;
	padding: 8px 10px;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	border: 1px solid rgba(217,167,72,.2);
	border-radius: var(--tw-radius-card);
	background: linear-gradient(180deg, rgba(7,21,37,.98), rgba(12,34,54,.92));
	box-shadow:
		inset 0 -2px 0 rgba(217,167,72,.16),
		inset 0 1px 0 rgba(255,255,255,.04);
	scrollbar-width: none;
}
.tw-adventure-nav::-webkit-scrollbar { display: none; }

.tw-adventure-nav::before {
	content: "✦";
	flex-shrink: 0;
	color: var(--tw-gold-500);
	font-size: 14px;
	opacity: .7;
	margin-right: 4px;
}

.tw-adventure-nav a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 34px;
	padding: 0 13px;
	border-radius: 6px;
	color: rgba(255,248,232,.72);
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	white-space: nowrap;
	transition: background 140ms ease, color 140ms ease;
}
.tw-adventure-nav a:hover,
.tw-adventure-nav a:focus,
.tw-adventure-nav a.is-active {
	background: linear-gradient(180deg, rgba(217,167,72,.22), rgba(185,121,34,.14));
	color: var(--tw-gold-300);
	outline: 0;
}
.tw-adventure-nav a.is-active {
	font-weight: 900;
	box-shadow: inset 0 0 0 1px rgba(217,167,72,.24);
}

/* --------------------------------------------------------------------------
   3. Hero sections
   -------------------------------------------------------------------------- */
.tw-hero,
.tw-winners-hero,
.tw-dashboard-head,
.tw-dashboard-hero,
.tw-dashboard-detail__hero {
	position: relative;
	overflow: hidden;
	min-height: 240px;
	margin-bottom: var(--tw-gap);
	padding: clamp(28px,5vw,56px) clamp(24px,5vw,52px);
	border: 1px solid rgba(217,167,72,.3);
	border-radius: var(--tw-radius-card);
	background:
		linear-gradient(135deg, rgba(4,14,26,.92) 0%, rgba(11,34,54,.96) 100%),
		radial-gradient(ellipse at 90% 10%, rgba(217,167,72,.2) 0%, transparent 38%),
		radial-gradient(ellipse at 10% 90%, rgba(159,36,56,.18) 0%, transparent 36%),
		repeating-linear-gradient(0deg,
			rgba(255,248,232,.04) 0, rgba(255,248,232,.04) 1px,
			transparent 1px, transparent 22px);
	box-shadow:
		inset 0 0 0 2px rgba(217,167,72,.12),
		inset 0 0 0 4px rgba(4,14,26,.6),
		0 22px 54px rgba(4,14,26,.44);
	color: var(--tw-parchment-100);
}

.tw-hero::before,
.tw-winners-hero::before,
.tw-dashboard-head::before {
	content: "";
	position: absolute;
	inset: 10px;
	border: 1px solid rgba(217,167,72,.14);
	border-radius: 6px;
	pointer-events: none;
}

.tw-hero::after,
.tw-winners-hero::after,
.tw-dashboard-head::after {
	content: "";
	position: absolute;
	right: 28px;
	bottom: 24px;
	width: 120px;
	height: 120px;
	border: 2px solid rgba(217,167,72,.18);
	border-radius: 50%;
	background:
		linear-gradient(  0deg, transparent 47%, rgba(217,167,72,.26) 48%, rgba(217,167,72,.26) 52%, transparent 53%),
		linear-gradient( 90deg, transparent 47%, rgba(217,167,72,.26) 48%, rgba(217,167,72,.26) 52%, transparent 53%),
		linear-gradient( 45deg, transparent 47%, rgba(217,167,72,.14) 48%, rgba(217,167,72,.14) 52%, transparent 53%),
		linear-gradient(-45deg, transparent 47%, rgba(217,167,72,.14) 48%, rgba(217,167,72,.14) 52%, transparent 53%);
	opacity: .55;
	pointer-events: none;
}

.tw-hero--image .tw-hero__image,
.tw-dashboard-detail__hero--image .tw-dashboard-banner {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	filter: saturate(.9) brightness(.55);
}

.tw-hero--image::after,
.tw-dashboard-detail__hero--image::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, rgba(4,14,26,.9) 0%, rgba(4,14,26,.4) 65%);
	z-index: 0;
}

.tw-hero__content,
.tw-dashboard-detail__overlay {
	position: relative;
	z-index: 1;
	display: grid;
	align-content: end;
	justify-items: start;
	min-height: 240px;
}

.tw-app .tw-hero h1,
.tw-app .tw-winners-hero h1,
.tw-app .tw-dashboard-head h2,
.tw-app .tw-dashboard-hero h2,
.tw-app .tw-dashboard-detail__overlay h2 {
	margin: 8px 0 12px;
	color: var(--tw-parchment-50);
	font-size: clamp(34px,5.5vw,66px);
	line-height: 1.04;
	text-shadow: 0 2px 16px rgba(4,14,26,.6);
}

.tw-app .tw-hero p,
.tw-app .tw-hero__description,
.tw-app .tw-winners-hero p,
.tw-app .tw-dashboard-head p,
.tw-app .tw-dashboard-hero p,
.tw-app .tw-dashboard-detail__overlay p {
	max-width: 740px;
	color: rgba(255,248,232,.82);
	font-size: 16px;
	margin-top: 0;
	margin-bottom: 0;
}

.tw-app .tw-hero__description p { margin: 0 0 10px; }

.tw-kicker,
.tw-card-label {
	display: block;
	color: var(--tw-gold-400);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.tw-hero__facts {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
	width: min(800px, 100%);
	margin-top: 22px;
}

.tw-hero__facts div {
	padding: 14px 16px;
	border: 1px solid rgba(217,167,72,.22);
	border-radius: 8px;
	background: rgba(255,248,232,.08);
	backdrop-filter: blur(6px);
}

.tw-hero__facts span {
	display: block;
	color: rgba(255,255,255,.66);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.tw-hero__facts strong {
	display: block;
	margin-top: 5px;
	color: var(--tw-gold-300);
	font-size: 20px;
	font-weight: 900;
	line-height: 1.2;
}

.tw-hero__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 22px;
}

/* --------------------------------------------------------------------------
   4. Botones
   -------------------------------------------------------------------------- */
.tw-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	min-height: 46px;
	padding: 0 20px;
	border: 1px solid rgba(115,75,18,.7);
	border-radius: var(--tw-radius-btn);
	background: linear-gradient(180deg, #e8ba5a 0%, #c48a1e 55%, #a06a0e 100%);
	box-shadow:
		0 1px 0 rgba(255,255,255,.22) inset,
		0 10px 24px rgba(4,14,26,.28);
	color: #1a0c00;
	font-size: 14px;
	font-weight: 900;
	line-height: 1.15;
	text-align: center;
	text-decoration: none;
	text-shadow: 0 1px 0 rgba(255,255,255,.2);
	white-space: normal;
	cursor: pointer;
	transition: transform 150ms ease, box-shadow 150ms ease, background 150ms ease;
}

.tw-button:hover, .tw-button:focus {
	background: linear-gradient(180deg, #f2ca6e 0%, #d49a2c 55%, #a87418 100%);
	box-shadow:
		0 1px 0 rgba(255,255,255,.26) inset,
		0 14px 32px rgba(4,14,26,.36),
		0 0 18px rgba(217,167,72,.24);
	color: #1a0c00;
	outline: 0;
	transform: translateY(-2px);
}

.tw-button:focus-visible {
	outline: 3px solid rgba(217,167,72,.5);
	outline-offset: 3px;
}
.tw-button:active { transform: translateY(0); }

.tw-button-primary {
	border-color: rgba(100,20,38,.75);
	background: linear-gradient(180deg, #cf3f54 0%, #a12232 55%, #7c1824 100%);
	box-shadow:
		0 1px 0 rgba(255,255,255,.14) inset,
		0 10px 24px rgba(4,14,26,.32);
	color: #fff;
	text-shadow: 0 1px 2px rgba(0,0,0,.3);
}

.tw-button-primary:hover, .tw-button-primary:focus {
	background: linear-gradient(180deg, #e04a60 0%, #b72e40 55%, #8c1e2c 100%);
	box-shadow:
		0 1px 0 rgba(255,255,255,.18) inset,
		0 14px 36px rgba(4,14,26,.38),
		0 0 20px rgba(160,34,50,.26);
	color: #fff;
}

.tw-button-large { min-height: 54px; padding: 0 26px; font-size: 16px; }

/* --------------------------------------------------------------------------
   5. Tarjetas base (pergamino)
   -------------------------------------------------------------------------- */
.tw-card,
.tw-clue-card,
.tw-prize-card,
.tw-avatar-card,
.tw-map-wrap,
.tw-entry-panel,
.tw-empty-state,
.tw-winner-card,
.tw-how-it-works article,
.tw-calendar-row {
	border: 1px solid var(--tw-border-parch);
	border-radius: var(--tw-radius-card);
	background:
		linear-gradient(170deg, var(--tw-parchment-50) 0%, var(--tw-parchment-100) 50%, var(--tw-parchment-200) 100%),
		repeating-linear-gradient(90deg,
			rgba(90,57,22,.04) 0, rgba(90,57,22,.04) 1px,
			transparent 1px, transparent 20px);
	box-shadow: var(--tw-shadow-card);
	color: var(--tw-ink);
	transition: transform 170ms ease, box-shadow 170ms ease, border-color 170ms ease;
}

.tw-card:hover,
.tw-hunt-card:hover,
.tw-winner-card:hover {
	border-color: rgba(185,121,34,.44);
	box-shadow: var(--tw-shadow-lift);
	transform: translateY(-3px);
}

/* --------------------------------------------------------------------------
   6. Status badges
   -------------------------------------------------------------------------- */
.tw-status-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 26px;
	padding: 0 10px;
	border: 1px solid transparent;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .06em;
	line-height: 1;
	text-transform: uppercase;
}

.tw-status-badge--active,
.tw-status-badge--winner {
	background: #2fa854;
	border-color: rgba(39,120,62,.6);
	box-shadow: 0 0 12px rgba(47,168,84,.4);
	color: #fff;
}

.tw-status-badge--upcoming,
.tw-status-badge--scheduled {
	background: #e07a20;
	border-color: rgba(160,84,14,.5);
	box-shadow: 0 0 10px rgba(224,122,32,.3);
	color: #fff;
}

.tw-status-badge--finished,
.tw-status-badge--disqualified {
	background: #1a6fa8;
	border-color: rgba(26,111,168,.5);
	color: #fff;
}

/* --------------------------------------------------------------------------
   7. Alertas
   -------------------------------------------------------------------------- */
.tw-alert {
	margin: 14px 0;
	padding: 13px 16px;
	border: 1px solid var(--tw-border-parch);
	border-radius: 8px;
	background: var(--tw-parchment-100);
	color: var(--tw-ink);
	font-weight: 700;
	line-height: 1.5;
}
.tw-alert--success { border-color: rgba(39,122,62,.35); background: #eaf4ef; color: #15523a; }
.tw-alert--error   { border-color: rgba(200,60,60,.3);  background: #fdeaea; color: #8c2020; }
.tw-alert--info    { border-color: rgba(26,111,168,.3); background: #e6f2fb; color: #104e7a; }

/* --------------------------------------------------------------------------
   8. Barras de progreso — mapa del tesoro
   -------------------------------------------------------------------------- */
.tw-progress-bar,
.tw-progress-meter {
	overflow: hidden;
	width: 100%;
	height: 14px;
	border: 1px solid rgba(4,14,26,.38);
	border-radius: 999px;
	background: linear-gradient(180deg, rgba(4,14,26,.88), rgba(12,34,54,.82));
	box-shadow: inset 0 2px 4px rgba(0,0,0,.42);
}

.tw-progress-bar span,
.tw-progress-meter span {
	display: block;
	height: 100%;
	border-radius: inherit;
	background:
		linear-gradient(90deg, #1c8c40 0%, #42c66a 50%, #d9a748 80%, #f5d98a 100%),
		repeating-linear-gradient(45deg,
			rgba(255,255,255,.18) 0, rgba(255,255,255,.18) 8px,
			transparent 8px, transparent 16px);
	background-size: 200% 100%;
	box-shadow: 0 0 12px rgba(66,198,106,.5);
	transition: width 380ms cubic-bezier(.4,0,.2,1);
	animation: tw-bar-sheen 5s ease-in-out infinite;
}

@keyframes tw-bar-sheen {
	0%   { background-position: 0 0; }
	50%  { background-position: 100% 0; }
	100% { background-position: 0 0; }
}

.tw-progress-bar--participants { height: 10px; }

.tw-progress-bar--participants span {
	background: linear-gradient(90deg, #a0790e, #d9a748, #f5d98a, #d9a748);
	box-shadow: 0 0 8px rgba(217,167,72,.4);
}

/* --------------------------------------------------------------------------
   9. Grilla de búsquedas
   -------------------------------------------------------------------------- */
.tw-hunts-page,
.tw-calendar-page { color: var(--tw-parchment-100); }

.tw-hunt-grid,
.tw-hunts-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--tw-gap); }

.tw-hunt-card { overflow: hidden; padding: 0; }

.tw-hunt-card__media,
.tw-card-banner {
	position: relative;
	display: block;
	min-height: 200px;
	overflow: hidden;
	border-bottom: 1px solid var(--tw-border-parch);
	background:
		linear-gradient(135deg, var(--tw-navy-900) 0%, var(--tw-navy-800) 100%),
		radial-gradient(ellipse at 30% 35%, rgba(217,167,72,.22), transparent 38%);
	color: var(--tw-parchment-100);
	text-decoration: none;
}

.tw-hunt-card__banner,
.tw-card-banner__image,
.tw-dashboard-banner,
.tw-hero__image {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.tw-hunt-card__banner { height: 215px; }

.tw-hunt-card__placeholder,
.tw-card-banner > span,
.tw-prize-placeholder {
	display: grid;
	min-height: 200px;
	place-items: center;
	padding: 20px;
	color: rgba(255,248,232,.6);
	font-family: var(--tw-font-display);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .06em;
	text-align: center;
	text-transform: uppercase;
}

.tw-hunt-card__media::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(4,14,26,.55) 0%, transparent 55%);
	pointer-events: none;
}

.tw-hunt-card__media .tw-status-badge,
.tw-card-banner .tw-status-badge {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 1;
	box-shadow: 0 4px 14px rgba(4,14,26,.5);
}

.tw-hunt-card__body    { display: grid; gap: 14px; padding: 18px; }

.tw-hunt-card__title {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 12px;
	align-items: start;
}

.tw-hunt-card__top {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 12px;
	align-items: center;
}

.tw-hunt-card__title h2,
.tw-hunt-card h3 {
	margin: 4px 0 0;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: 21px;
	line-height: 1.18;
}

.tw-hunt-card p { margin: 4px 0 0; color: var(--tw-muted); font-size: 14px; line-height: 1.5; }

.tw-hunt-card__prize span,
.tw-hunt-card__meta span {
	display: block;
	color: var(--tw-muted);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.tw-hunt-card__prize strong,
.tw-hunt-card__meta strong {
	display: block;
	color: var(--tw-ink);
	font-size: 14px;
	font-weight: 900;
	margin-top: 3px;
}

.tw-hunt-card__prize-img,
.tw-hunt-card__avatar img,
.tw-winner-avatar img,
.tw-avatar-card__preview img {
	width: 62px;
	height: 62px;
	border: 2px solid rgba(185,121,34,.5);
	border-radius: 8px;
	object-fit: cover;
}

.tw-hunt-card__meta {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.tw-hunt-card__actions,
.tw-hero__actions,
.tw-calendar-row__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.tw-hunt-card__actions .tw-button,
.tw-calendar-row__actions .tw-button {
	flex: 1 1 140px;
	justify-content: center;
}

/* --------------------------------------------------------------------------
   10. Filtros
   -------------------------------------------------------------------------- */
.tw-filter-tabs {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px;
	margin: 0 0 var(--tw-gap);
}

.tw-filter-tabs a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 40px;
	padding: 0 16px;
	border: 1px solid rgba(217,167,72,.26);
	border-radius: 999px;
	background: rgba(255,248,232,.07);
	color: var(--tw-parchment-100);
	font-size: 13px;
	font-weight: 900;
	text-decoration: none;
	transition: background 150ms ease, color 150ms ease;
}

.tw-filter-tabs a strong {
	display: inline-grid;
	min-width: 22px;
	height: 22px;
	place-items: center;
	border-radius: 999px;
	background: rgba(4,14,26,.3);
	color: inherit;
	font-size: 11px;
}

.tw-filter-tabs a:hover, .tw-filter-tabs a:focus {
	background: rgba(217,167,72,.14);
	color: var(--tw-gold-300);
}

.tw-filter-tabs a.is-active {
	background: linear-gradient(180deg, #e8ba5a, #c48a1e);
	border-color: rgba(115,75,18,.6);
	box-shadow: 0 4px 14px rgba(185,121,34,.36);
	color: #1a0c00;
}

.tw-hunt-filter-tabs { justify-content: flex-start; }

/* --------------------------------------------------------------------------
   11. Página de búsqueda individual
   -------------------------------------------------------------------------- */
.tw-hunt-page { display: grid; gap: var(--tw-gap); max-width: 1200px; }

.tw-hunt-main-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.5fr) minmax(280px, 0.5fr);
	gap: var(--tw-gap);
	align-items: start;
}

.tw-prize-card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(160px, 260px);
	gap: var(--tw-gap);
	align-items: center;
	padding: 20px;
}

.tw-prize-card--landing {
	background:
		linear-gradient(170deg, var(--tw-parchment-50) 0%, var(--tw-parchment-200) 100%),
		repeating-linear-gradient(90deg,
			rgba(90,57,22,.04) 0, rgba(90,57,22,.04) 1px,
			transparent 1px, transparent 20px);
}

.tw-prize-card h2,
.tw-prize-card--landing h2,
.tw-map-wrap h2,
.tw-how-it-works h2,
.tw-winner-public h2 {
	margin: 0 0 10px;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: clamp(24px,3.5vw,38px);
	line-height: 1.12;
}

.tw-prize-image {
	width: 100%;
	max-height: 260px;
	border: 1px solid var(--tw-border-parch);
	border-radius: 8px;
	object-fit: cover;
}

.tw-prize-placeholder {
	min-height: 190px;
	border: 1px dashed rgba(140,90,16,.3);
	border-radius: 8px;
	background: linear-gradient(135deg, rgba(217,167,72,.18), rgba(185,121,34,.1));
	color: var(--tw-ink-soft);
}

.tw-progress-wrap {
	align-self: stretch;
	display: grid;
	align-content: center;
	gap: 14px;
	padding: 20px;
	border: 1px solid var(--tw-border-gold);
	border-radius: var(--tw-radius-card);
	background:
		linear-gradient(160deg, var(--tw-navy-900), var(--tw-navy-800)),
		radial-gradient(ellipse at 80% 20%, rgba(217,167,72,.16), transparent 40%);
	box-shadow: var(--tw-shadow-card);
	color: var(--tw-parchment-100);
}

.tw-progress-wrap .tw-card-label,
.tw-progress-wrap p { color: rgba(255,248,232,.72); }

.tw-progress-wrap__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 12px;
}

.tw-progress-wrap__head strong {
	color: var(--tw-gold-300);
	font-size: 28px;
	font-weight: 900;
	line-height: 1;
}

.tw-how-it-works {
	display: grid;
	gap: 16px;
	padding: clamp(20px,4vw,34px);
	border: 1px solid var(--tw-border-parch);
	border-radius: var(--tw-radius-card);
	background:
		linear-gradient(160deg, var(--tw-parchment-50), var(--tw-parchment-200)),
		repeating-linear-gradient(90deg,
			rgba(90,57,22,.05) 0, rgba(90,57,22,.05) 1px,
			transparent 1px, transparent 22px);
}

.tw-how-it-works__head { margin-bottom: 6px; }

.tw-how-it-works__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

.tw-how-it-works article { padding: 16px; text-align: center; }

.tw-how-it-works article > span {
	display: inline-grid;
	width: 40px;
	height: 40px;
	margin-bottom: 12px;
	place-items: center;
	border-radius: 999px;
	background: linear-gradient(180deg, #e8ba5a, #b97922);
	box-shadow: 0 4px 12px rgba(185,121,34,.4);
	color: #1a0c00;
	font-weight: 900;
}

.tw-how-it-works h3 { margin: 0 0 8px; color: var(--tw-ink); font-size: 17px; }

.tw-public-stats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

.tw-public-stats .tw-card { display: grid; gap: 6px; padding: 16px; }

.tw-public-stats span {
	color: var(--tw-muted);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.tw-public-stats strong {
	display: block;
	color: var(--tw-ink);
	font-size: 28px;
	font-weight: 900;
	line-height: 1;
}

.tw-winner-public {
	display: grid;
	grid-template-columns: 88px minmax(0, 1fr);
	gap: 16px;
	align-items: center;
	padding: 20px;
	background: linear-gradient(135deg, #e6f4ea, var(--tw-parchment-50));
	border: 1px solid rgba(39,122,62,.22);
}

.tw-winner-public p { margin: 8px 0 0; color: var(--tw-muted); font-size: 14px; }

.tw-winner-public__avatar {
	display: grid;
	place-items: center;
	width: 80px;
	height: 80px;
	border: 3px solid rgba(185,121,34,.5);
	border-radius: 999px;
	background: var(--tw-parchment-50);
	overflow: hidden;
}

.tw-winner-public__avatar img,
.tw-winner-public__avatar .tw-avatar { width: 100%; height: 100%; object-fit: cover; }

.tw-map-wrap { display: grid; gap: 14px; padding: 20px; background: linear-gradient(160deg, var(--tw-parchment-50), var(--tw-parchment-200)); }

.tw-map-wrap__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }

.tw-map-wrap__head strong { color: var(--tw-ruby-600); font-weight: 900; }

.tw-map-canvas {
	overflow: hidden;
	width: 100%;
	min-height: 340px;
	border: 1px solid var(--tw-border-parch);
	border-radius: 8px;
	background: #e4efe0;
}

.tw-map-canvas--fallback {
	display: grid;
	place-items: center;
	color: var(--tw-muted);
	font-weight: 800;
}

.tw-map-wrap p { margin: 0; color: var(--tw-muted); line-height: 1.55; }

.tw-video-card { display: grid; gap: 14px; padding: 20px; }

.tw-video-embed {
	overflow: hidden;
	border-radius: 8px;
	background: var(--tw-navy-900);
	aspect-ratio: 16 / 9;
}

.tw-video-embed iframe { display: block; width: 100%; height: 100%; }

.tw-landing-cta { display: flex; justify-content: center; padding: 14px 0 4px; }

/* --------------------------------------------------------------------------
   12. Dashboard del jugador
   -------------------------------------------------------------------------- */
.tw-dashboard-layout {
	display: grid;
	grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
	gap: var(--tw-gap);
	margin-top: var(--tw-gap);
}

.tw-dashboard-main { display: grid; gap: 14px; min-width: 0; }

.tw-dashboard-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--tw-gap);
}

.tw-avatar-card {
	position: sticky;
	top: 24px;
	align-self: start;
	display: grid;
	gap: 16px;
	padding: 20px;
	text-align: center;
}

.tw-avatar-card__preview {
	display: grid;
	width: 140px;
	height: 140px;
	margin: 0 auto;
	place-items: center;
	overflow: hidden;
	border: 4px solid rgba(185,121,34,.6);
	border-radius: 999px;
	background: radial-gradient(circle at center, var(--tw-navy-700), var(--tw-navy-900));
	box-shadow:
		0 0 0 2px rgba(217,167,72,.22),
		0 12px 30px rgba(4,14,26,.36);
}

.tw-avatar-card__preview img {
	width: 100%;
	height: 100%;
	border: 0;
	border-radius: inherit;
	object-fit: cover;
}

.tw-participant-code {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 42px;
	padding: 0 14px;
	border: 1px solid rgba(185,121,34,.4);
	border-radius: 8px;
	background: linear-gradient(180deg, #0f2a42, #08192e);
	box-shadow:
		inset 0 0 0 1px rgba(217,167,72,.14),
		0 4px 14px rgba(4,14,26,.3);
	color: var(--tw-gold-300);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 15px;
	font-weight: 900;
	letter-spacing: .08em;
}

.tw-avatar-upload-form { display: grid; gap: 10px; }

.tw-avatar-upload-form label { display: grid; gap: 6px; font-weight: 800; text-align: left; }

.tw-avatar-upload-form input[type="file"] {
	width: 100%;
	padding: 10px;
	border: 1px solid var(--tw-border-parch);
	border-radius: 6px;
	background: var(--tw-parchment-50);
	color: var(--tw-ink);
	font-size: 13px;
}

.tw-progress-card { padding: 18px; }

.tw-progress-card__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px;
}

.tw-progress-text { color: var(--tw-ink); font-size: 28px; font-weight: 900; }

.tw-clue-stage { display: grid; gap: 16px; padding: 18px; }

.tw-clue-stage__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.tw-clue-card { display: grid; gap: 12px; padding: 18px; }

.tw-clue-card h3 {
	margin: 4px 0 8px;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: 22px;
	line-height: 1.2;
}

.tw-clue-card > span {
	color: var(--tw-ruby-600);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.tw-clue-text { color: var(--tw-ink-soft); font-size: 15px; line-height: 1.7; }

.tw-clue-image {
	width: 100%;
	max-height: 280px;
	margin: 8px 0;
	border: 1px solid var(--tw-border-parch);
	border-radius: 8px;
	object-fit: cover;
}

.tw-next-clue-note {
	display: grid;
	gap: 4px;
	padding: 14px 16px;
	border-left: 4px solid var(--tw-gold-500);
	border-radius: 0 8px 8px 0;
	background: linear-gradient(90deg, rgba(217,167,72,.1), var(--tw-parchment-100));
}

.tw-next-clue-note span {
	color: var(--tw-muted);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.tw-next-clue-note strong { color: var(--tw-ink); font-size: 15px; line-height: 1.4; }

.tw-code-form {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 12px;
	align-items: end;
	margin-top: 14px;
	padding-top: 16px;
	border-top: 1px dashed rgba(140,90,16,.28);
}

.tw-code-form label { display: grid; gap: 6px; color: var(--tw-ink); font-weight: 800; }

.tw-app input[type="text"],
.tw-app select,
.tw-app textarea {
	border: 1px solid var(--tw-border-parch);
	border-radius: 8px;
	background: rgba(255,255,255,.94);
	box-shadow: inset 0 1px 3px rgba(4,14,26,.06);
	color: var(--tw-ink);
	font-size: 15px;
}

.tw-app input[type="file"] {
	border: 1px solid var(--tw-border-parch);
	border-radius: 8px;
	background: rgba(255,255,255,.94);
	color: var(--tw-ink);
}

.tw-app input[type="text"]:focus,
.tw-app select:focus,
.tw-app textarea:focus {
	border-color: var(--tw-gold-500);
	box-shadow: 0 0 0 3px rgba(217,167,72,.22);
	outline: 0;
}

.tw-code-form input[type="text"] {
	min-height: 48px;
	padding-inline: 14px;
	font-weight: 900;
	font-size: 17px;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.tw-empty-state, .tw-dashboard-empty { padding: 28px; }

.tw-empty-state h3, .tw-dashboard-empty h3 {
	margin: 0 0 10px;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: clamp(22px,3vw,30px);
	line-height: 1.15;
}

.tw-empty-state p, .tw-dashboard-empty p { margin: 0 0 16px; color: var(--tw-muted); line-height: 1.65; }

.tw-victory-banner {
	display: grid;
	gap: 6px;
	margin-bottom: 16px;
	padding: 16px 18px;
	border: 1px solid rgba(39,120,62,.3);
	border-radius: 8px;
	background: linear-gradient(135deg, #d8f0e2, #eaf6ef);
	color: #14522e;
}

.tw-victory-banner span { font-size: 11px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }

.tw-clue-history { display: grid; gap: 10px; margin-top: 14px; }

.tw-clue-history__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

.tw-clue-history__head strong {
	display: inline-grid;
	min-width: 30px;
	height: 30px;
	place-items: center;
	border-radius: 999px;
	background: linear-gradient(180deg, #e8ba5a, #b97922);
	color: #1a0c00;
	font-size: 13px;
	font-weight: 900;
}

.tw-clue-history ol { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }

.tw-clue-history li {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	gap: 10px;
	align-items: center;
	padding: 10px 14px;
	border: 1px solid var(--tw-border-parch);
	border-radius: 8px;
	background: rgba(255,255,255,.5);
}

.tw-clue-history li span,
.tw-clue-history li time {
	color: var(--tw-muted);
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.tw-clue-history li strong { min-width: 0; color: var(--tw-ink); overflow-wrap: anywhere; }

.tw-dashboard-winner {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	margin-bottom: var(--tw-gap);
	padding: 18px;
}

.tw-dashboard-winner__avatar {
	display: grid;
	width: 72px;
	height: 72px;
	place-items: center;
	overflow: hidden;
	border: 3px solid rgba(185,121,34,.6);
	border-radius: 999px;
	background: linear-gradient(135deg, var(--tw-navy-700), var(--tw-navy-900));
}

.tw-dashboard-winner__avatar img,
.tw-dashboard-winner__avatar .tw-avatar { width: 100%; height: 100%; object-fit: cover; }

.tw-back-link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 12px;
	color: rgba(255,248,232,.88);
	font-size: 13px;
	font-weight: 900;
	text-decoration: none;
	transition: color 130ms ease;
}

.tw-back-link::before { content: "←"; }

.tw-back-link:hover, .tw-back-link:focus { color: var(--tw-gold-300); }

.tw-current-clue {
	display: grid;
	gap: 4px;
	padding: 12px 14px;
	border-radius: 8px;
	border-left: 3px solid var(--tw-gold-500);
	background: linear-gradient(90deg, rgba(217,167,72,.1), rgba(255,255,255,.5));
}

/* --------------------------------------------------------------------------
   13. Ganadores
   -------------------------------------------------------------------------- */
.tw-winners-page { display: grid; gap: var(--tw-gap); max-width: 1200px; }

.tw-winners-hero { text-align: center; }

.tw-winner-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--tw-gap); }

.tw-winner-card { position: relative; overflow: hidden; padding: 20px; }

.tw-winner-card::before {
	content: "";
	position: absolute;
	inset: 0 0 auto;
	height: 5px;
	background: linear-gradient(90deg, var(--tw-gold-600), var(--tw-gold-400), var(--tw-gold-600));
}

.tw-winner-card__top {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 14px;
	align-items: center;
	margin-top: 10px;
	margin-bottom: 16px;
}

.tw-winner-avatar {
	position: relative;
	display: grid;
	place-items: center;
	width: 80px;
	height: 80px;
	border: 3px solid rgba(185,121,34,.6);
	border-radius: 999px;
	background: var(--tw-parchment-50);
	box-shadow:
		0 0 0 5px rgba(217,167,72,.12),
		0 8px 22px rgba(4,14,26,.22);
	overflow: hidden;
}

.tw-winner-avatar img,
.tw-winner-avatar .tw-avatar { width: 100%; height: 100%; object-fit: cover; }

.tw-winner-badge {
	display: inline-flex;
	align-items: center;
	min-height: 24px;
	padding: 0 10px;
	border-radius: 999px;
	background: linear-gradient(180deg, #e8ba5a, #b97922);
	box-shadow: 0 3px 10px rgba(185,121,34,.38);
	color: #1a0c00;
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .06em;
	text-transform: uppercase;
}

.tw-winner-card h2 {
	margin: 6px 0 4px;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: 21px;
	line-height: 1.15;
}

.tw-winner-card code {
	display: inline-flex;
	padding: 3px 8px;
	border: 1px dashed rgba(90,57,22,.28);
	border-radius: 6px;
	background: rgba(255,255,255,.7);
	color: var(--tw-muted);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 12px;
	font-weight: 900;
}

.tw-winner-card__body {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 10px;
}

.tw-winner-card__body > div {
	display: grid;
	gap: 3px;
	padding: 10px 12px;
	border: 1px solid rgba(90,57,22,.12);
	border-radius: 8px;
	background: rgba(255,255,255,.55);
}

.tw-winner-card__body span {
	color: var(--tw-muted);
	font-size: 10px;
	font-weight: 900;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.tw-winner-card__body strong { color: var(--tw-ink); font-size: 14px; line-height: 1.35; }

.tw-winner-delivery strong { color: var(--tw-ruby-600); }

/* Insignias por posición */
.tw-winner-card--rank-1 .tw-winner-badge  { background: linear-gradient(180deg, #ffd96a, #c49b14); }
.tw-winner-card--rank-2 .tw-winner-badge  { background: linear-gradient(180deg, #e2e8ed, #9eaab4); color: #1a1c1e; }
.tw-winner-card--rank-3 .tw-winner-badge  { background: linear-gradient(180deg, #f0a07a, #b04e22); }
.tw-winner-card--rank-1::before { background: linear-gradient(90deg, #c49b14, #ffd96a, #c49b14); }
.tw-winner-card--rank-2::before { background: linear-gradient(90deg, #9eaab4, #e2e8ed, #9eaab4); }
.tw-winner-card--rank-3::before { background: linear-gradient(90deg, #b04e22, #f0a07a, #b04e22); }

.tw-winners-empty { display: grid; gap: 10px; padding: 28px; }

.tw-winners-empty h2 {
	margin: 0;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: clamp(22px,3.5vw,36px);
}

.tw-winners-empty p { margin: 0; color: var(--tw-muted); }

/* --------------------------------------------------------------------------
   14. Calendario
   -------------------------------------------------------------------------- */
.tw-calendar-sections { display: grid; gap: 28px; }

.tw-calendar-section__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	margin-bottom: 14px;
	color: var(--tw-parchment-100);
}

.tw-calendar-section__head h2 {
	margin: 0;
	color: var(--tw-gold-300);
	font-family: var(--tw-font-display);
	font-size: clamp(22px,3vw,30px);
	line-height: 1.1;
}

.tw-calendar-section__head > span {
	display: inline-grid;
	min-width: 34px;
	height: 34px;
	place-items: center;
	border: 1px solid rgba(217,167,72,.3);
	border-radius: 999px;
	background: rgba(255,248,232,.08);
	color: var(--tw-parchment-100);
	font-weight: 900;
}

.tw-calendar-list { display: grid; gap: 12px; }

.tw-calendar-row {
	display: grid;
	grid-template-columns: 82px minmax(0, 1fr) auto;
	gap: 16px;
	align-items: center;
	padding: 16px;
}

.tw-calendar-row__date {
	display: grid;
	height: 82px;
	place-items: center;
	border-radius: 10px;
	background: linear-gradient(180deg, #e8ba5a, #b97922 55%, #8a5a0e 100%);
	box-shadow:
		0 1px 0 rgba(255,255,255,.22) inset,
		0 6px 16px rgba(4,14,26,.22);
	color: #fff;
	text-align: center;
}

.tw-calendar-row__date span {
	font-size: 11px;
	font-weight: 900;
	letter-spacing: .1em;
	text-transform: uppercase;
	opacity: .88;
}

.tw-calendar-row__date strong { display: block; color: #fff; font-size: 32px; font-weight: 900; line-height: 1; }

.tw-calendar-row__main h3 {
	margin: 8px 0 6px;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: 21px;
	line-height: 1.2;
}

.tw-calendar-row__meta { display: flex; flex-wrap: wrap; gap: 8px 16px; color: var(--tw-muted); font-size: 13px; font-weight: 700; }

.tw-calendar-empty { padding: 18px; color: var(--tw-ink); }

/* --------------------------------------------------------------------------
   15. WooCommerce — Orden aventura
   -------------------------------------------------------------------------- */
.tw-order-adventure {
	margin: 28px 0;
	padding: 28px;
	border: 1px solid rgba(217,167,72,.32);
	border-radius: var(--tw-radius-card);
	background:
		linear-gradient(155deg, var(--tw-navy-950), var(--tw-navy-800)),
		radial-gradient(ellipse at 85% 15%, rgba(217,167,72,.18), transparent 36%),
		repeating-linear-gradient(45deg,
			rgba(217,167,72,.06) 0, rgba(217,167,72,.06) 1px,
			transparent 1px, transparent 24px);
	box-shadow:
		inset 0 0 0 2px rgba(217,167,72,.1),
		0 24px 60px rgba(4,14,26,.42);
	color: var(--tw-parchment-100);
}

.tw-order-adventure__head { max-width: 780px; margin-bottom: 22px; }

.tw-order-adventure__head h2 {
	margin: 6px 0 10px;
	color: var(--tw-parchment-50);
	font-family: var(--tw-font-display);
	font-size: clamp(26px,4vw,44px);
	line-height: 1.08;
}

.tw-order-adventure__head p { margin: 0; color: rgba(255,248,232,.8); font-size: 16px; }

.tw-order-adventure__list { display: grid; gap: 16px; }

.tw-order-adventure__card {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 20px;
	padding: 20px;
	border: 1px solid var(--tw-border-parch);
	border-radius: var(--tw-radius-card);
	background: linear-gradient(160deg, var(--tw-parchment-50), var(--tw-parchment-200));
	color: var(--tw-ink);
}

.tw-order-adventure__card h3 {
	margin: 4px 0 12px;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: 22px;
	line-height: 1.2;
}

.tw-order-adventure__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: 8px; }

.tw-order-adventure__meta span { color: var(--tw-muted); font-size: 12px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }

.tw-order-adventure__meta strong { color: var(--tw-ink); font-weight: 900; }

/* --------------------------------------------------------------------------
   16. Mi cuenta
   -------------------------------------------------------------------------- */
.tw-account-hunts { color: var(--tw-ink); }

.tw-account-hunts h2 { margin: 0 0 18px; font-family: var(--tw-font-display); font-size: 28px; line-height: 1.2; }

.tw-account-hunts__table code {
	display: inline-flex;
	padding: 4px 8px;
	border-radius: 6px;
	background: rgba(90,57,22,.1);
	color: var(--tw-ink);
	font-weight: 900;
}

/* --------------------------------------------------------------------------
   17. Miscelánea
   -------------------------------------------------------------------------- */
.tw-avatar {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: var(--tw-navy-700);
	color: var(--tw-gold-300);
	font-weight: 900;
	font-size: 18px;
}

.tw-pill {
	display: inline-flex;
	align-items: center;
	min-height: 26px;
	padding: 0 10px;
	border: 1px solid rgba(217,167,72,.28);
	border-radius: 999px;
	background: rgba(217,167,72,.1);
	color: var(--tw-parchment-100);
	font-size: 12px;
	font-weight: 700;
}

.tw-entry-panel { padding: 22px; }
.tw-entry-panel h3 { margin: 0 0 10px; color: var(--tw-ink); font-family: var(--tw-font-display); font-size: 22px; }
.tw-entry-panel p, .tw-dashboard-card p { color: var(--tw-muted); line-height: 1.65; }
.tw-entry-product { display: inline-flex; margin-left: 12px; color: var(--tw-muted); font-weight: 700; }

.tw-story { color: var(--tw-ink-soft); line-height: 1.7; }

/* --------------------------------------------------------------------------
   18. Responsive
   -------------------------------------------------------------------------- */
@media (max-width: 1020px) {
	.tw-hunt-grid, .tw-hunts-grid, .tw-winner-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tw-hunt-main-grid, .tw-prize-card { grid-template-columns: 1fr; }
	.tw-how-it-works__grid, .tw-public-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
	.tw-dashboard-layout { grid-template-columns: 1fr; }
	.tw-avatar-card { position: static; }
	.tw-prize-card { grid-template-columns: 1fr; }
	.tw-order-adventure__card { grid-template-columns: 1fr; }
	.tw-order-adventure { padding: 20px; }
}

@media (max-width: 720px) {
	.tw-app { width: calc(100% - 16px); margin: 14px auto; padding: 12px; }

	.tw-app .tw-hero h1,
	.tw-app .tw-winners-hero h1,
	.tw-app .tw-dashboard-head h2,
	.tw-app .tw-dashboard-hero h2 { font-size: 30px; }

	.tw-hero, .tw-winners-hero, .tw-dashboard-head, .tw-dashboard-hero { min-height: 0; padding: 24px 20px; }

	.tw-hero::after, .tw-winners-hero::after, .tw-dashboard-head::after {
		width: 70px; height: 70px; right: 14px; bottom: 12px;
	}

	.tw-hunt-grid, .tw-hunts-grid, .tw-winner-grid,
	.tw-dashboard-grid, .tw-winner-card__body,
	.tw-hero__facts, .tw-how-it-works__grid,
	.tw-public-stats, .tw-hunt-card__meta { grid-template-columns: 1fr; }

	.tw-calendar-row { grid-template-columns: 1fr; }
	.tw-calendar-row__date { width: 82px; }

	.tw-code-form { grid-template-columns: 1fr; }
	.tw-code-form .tw-button { width: 100%; }

	.tw-dashboard-winner, .tw-clue-history li { grid-template-columns: 1fr; }

	.tw-winner-public { grid-template-columns: 1fr; text-align: center; }
	.tw-winner-public__avatar { margin: 0 auto; }

	.tw-prize-card--landing { grid-template-columns: 1fr; }
}

@media (max-width: 500px) {
	.tw-filter-tabs { display: grid; grid-template-columns: 1fr; }
	.tw-button-large { width: 100%; text-align: center; }
	.tw-hunt-card__actions { flex-direction: column; }
	.tw-hunt-card__actions .tw-button { flex: none; width: 100%; }
}

/* --------------------------------------------------------------------------
   19. Accesibilidad
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.tw-app *, .tw-app *::before, .tw-app *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: .01ms !important;
	}
}

.tw-filter-tabs a:focus-visible,
.tw-adventure-nav a:focus-visible,
.tw-button:focus-visible,
.tw-back-link:focus-visible {
	outline: 3px solid rgba(217,167,72,.55);
	outline-offset: 3px;
}

/* ==========================================================================
   Cómo funciona — [tesoro_como_funciona]
   ========================================================================== */

.tw-how-page {
	display: grid;
	gap: var(--tw-gap);
	max-width: 1200px;
}

/* Grilla de pasos 3x2 */
.tw-hiw-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--tw-gap);
}

/* Tarjeta de paso individual */
.tw-hiw-step {
	position: relative;
	display: grid;
	gap: 12px;
	padding: 28px 22px 22px;
	text-align: center;
	overflow: hidden;
}

/* Número grande de fondo decorativo */
.tw-hiw-step__num {
	position: absolute;
	top: -12px;
	right: 10px;
	color: rgba(90, 57, 22, 0.08);
	font-family: var(--tw-font-display);
	font-size: 100px;
	font-weight: 900;
	line-height: 1;
	pointer-events: none;
	user-select: none;
}

/* Icono central */
.tw-hiw-step__icon {
	display: inline-grid;
	width: 64px;
	height: 64px;
	margin: 0 auto;
	place-items: center;
	border-radius: 999px;
	background: linear-gradient(180deg, #e8ba5a, #b97922);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.28) inset,
		0 8px 22px rgba(185, 121, 34, 0.4);
	font-size: 30px;
	line-height: 1;
}

.tw-hiw-step h2 {
	margin: 4px 0;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: 20px;
	line-height: 1.2;
}

.tw-hiw-step p {
	margin: 0;
	color: var(--tw-muted);
	font-size: 14px;
	line-height: 1.65;
}

/* Separador central con ícono */
.tw-hiw-divider {
	display: flex;
	align-items: center;
	gap: 16px;
	color: rgba(217, 167, 72, 0.5);
	font-size: 28px;
	text-align: center;
}

.tw-hiw-divider::before,
.tw-hiw-divider::after {
	content: "";
	flex: 1;
	height: 1px;
	background: linear-gradient(90deg, transparent, rgba(217, 167, 72, 0.35), transparent);
}

/* Sección FAQ */
.tw-hiw-faq {
	display: grid;
	gap: 16px;
}

.tw-hiw-faq__title {
	color: var(--tw-parchment-100);
	font-family: var(--tw-font-display);
	font-size: clamp(26px, 4vw, 40px);
	line-height: 1.1;
	margin: 0 0 4px;
}

.tw-hiw-faq__title .tw-kicker {
	margin-bottom: 8px;
}

.tw-hiw-faq__list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--tw-gap);
}

.tw-hiw-faq__item {
	padding: 20px 22px;
}

.tw-hiw-faq__item h3 {
	margin: 0 0 10px;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: 17px;
	line-height: 1.3;
}

.tw-hiw-faq__item p {
	margin: 0;
	color: var(--tw-muted);
	font-size: 14px;
	line-height: 1.65;
}

/* CTA final */
.tw-hiw-cta {
	padding-bottom: 8px;
}

.tw-hiw-cta__inner {
	display: grid;
	gap: 14px;
	padding: clamp(28px, 5vw, 50px);
	text-align: center;
	background:
		linear-gradient(160deg, var(--tw-navy-900), var(--tw-navy-800)),
		radial-gradient(ellipse at 50% 0%, rgba(217, 167, 72, 0.2), transparent 50%);
	border-color: var(--tw-border-gold);
	color: var(--tw-parchment-100);
}

.tw-hiw-cta__inner .tw-kicker {
	text-align: center;
}

.tw-hiw-cta__inner h2 {
	margin: 4px 0;
	color: var(--tw-parchment-50);
	font-family: var(--tw-font-display);
	font-size: clamp(28px, 4.5vw, 46px);
	line-height: 1.08;
}

.tw-hiw-cta__inner p {
	margin: 0 auto;
	max-width: 680px;
	color: rgba(255, 248, 232, 0.8);
	font-size: 16px;
}

.tw-hiw-cta__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 8px;
}

/* Responsive Cómo funciona */
@media (max-width: 860px) {
	.tw-hiw-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tw-hiw-faq__list { grid-template-columns: 1fr; }
}

@media (max-width: 540px) {
	.tw-hiw-grid { grid-template-columns: 1fr; }

	.tw-hiw-cta__actions {
		flex-direction: column;
		align-items: stretch;
	}

	.tw-hiw-cta__actions .tw-button {
		width: 100%;
		text-align: center;
	}
}

/* ==========================================================================
   Términos del Concurso — [tesoro_terminos]
   ========================================================================== */

.tw-terms-page {
	display: grid;
	gap: var(--tw-gap);
	max-width: 1200px;
}

/* Grid de secciones 2x2 */
.tw-terms-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--tw-gap);
}

/* Tarjeta de sección */
.tw-terms-section {
	display: grid;
	gap: 16px;
	padding: 24px;
}

.tw-terms-section__head {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 14px;
	align-items: center;
}

.tw-terms-section__icon {
	display: inline-grid;
	width: 52px;
	height: 52px;
	flex-shrink: 0;
	place-items: center;
	border-radius: 999px;
	background: linear-gradient(180deg, #e8ba5a, #b97922);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.28) inset,
		0 6px 18px rgba(185, 121, 34, 0.38);
	font-size: 24px;
	line-height: 1;
}

.tw-terms-section__head h2 {
	margin: 0;
	color: var(--tw-ink);
	font-family: var(--tw-font-display);
	font-size: 20px;
	line-height: 1.2;
}

/* Lista de términos */
.tw-terms-list {
	display: grid;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.tw-terms-list li {
	display: grid;
	grid-template-columns: 20px minmax(0, 1fr);
	gap: 10px;
	align-items: baseline;
	color: var(--tw-ink-soft);
	font-size: 14px;
	line-height: 1.65;
}

.tw-terms-list li::before {
	content: "⚓";
	font-size: 11px;
	color: var(--tw-gold-600);
	justify-self: center;
}

/* Footer de términos */
.tw-terms-footer {
	display: grid;
	gap: 12px;
	padding: 28px 32px;
	text-align: center;
	background:
		linear-gradient(160deg, var(--tw-navy-900), var(--tw-navy-800)),
		radial-gradient(ellipse at 50% 0%, rgba(217, 167, 72, 0.18), transparent 48%);
	border-color: var(--tw-border-gold);
	color: var(--tw-parchment-100);
	justify-items: center;
}

.tw-terms-footer p {
	max-width: 680px;
	color: rgba(255, 248, 232, 0.8);
	font-size: 15px;
	line-height: 1.65;
	margin: 0;
}

/* Responsive Términos */
@media (max-width: 720px) {
	.tw-terms-grid { grid-template-columns: 1fr; }
}