/* Enchanted Press Core 2 — interactive components. Colors/fonts follow the theme's variables. */

/* ---------- Store buttons ---------- */
.epc-buy { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 1em; }
.epc-buy .ep-btn { font-size: 14px; padding: .85em 1.3em; }
.epc-buy .ep-btn:not(:first-child) { background: transparent; color: inherit; border-color: color-mix(in srgb, currentColor 40%, transparent); box-shadow: none; }

/* ---------- Video frame ---------- */
.epc-video { position: relative; width: 100%; margin: 1.5em 0; background: #000; overflow: hidden; border-radius: 4px; }
.epc-video .ep-media { position: absolute; inset: 0; width: 100%; height: 100%; }

/* ---------- Countdown ---------- */
.epc-countdown { text-align: center; margin: 2em auto; }
.epc-countdown__title { font-family: var(--ep-font-display); font-size: 1.35em; font-style: var(--ep-accent-style, italic); color: inherit; margin-bottom: .8em; }
.epc-countdown__cells { display: flex; justify-content: center; gap: clamp(8px, 2vw, 18px); }
.epc-countdown__cell { min-width: 84px; padding: 14px 10px 12px; border: 1px solid var(--ep-line); border-radius: 14px; background: color-mix(in srgb, var(--ep-surface) 60%, transparent); }
.epc-countdown__num { display: block; font-family: var(--ep-font-display); font-size: clamp(30px, 4.5vw, 52px); line-height: 1; color: var(--ep-heading); font-variant-numeric: tabular-nums lining-nums; }
.epc-countdown__label { font-size: 12px; opacity: .7; }
@media (max-width: 560px) { .epc-countdown__cell { min-width: 0; flex: 1 1 0; padding: 10px 4px; } }

/* ---------- Lore cards ---------- */
.epc-lore__tools { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; justify-content: space-between; margin-bottom: 32px; }
.epc-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.epc-chip { font-family: var(--ep-font-nav); font-size: 14px; cursor: pointer; padding: .55em 1.1em; border-radius: 999px; border: 1px solid var(--ep-line); background: transparent; color: inherit; transition: background .25s ease, color .25s ease, border-color .25s ease; }
.epc-chip:hover { border-color: currentColor; }
.epc-chip.is-active { background: var(--ep-heading); border-color: var(--ep-heading); color: var(--ep-bg); }
.epc-lore__search input { min-width: 240px; }
.epc-lore__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--epc-cols, 4), minmax(0, 1fr)); gap: clamp(14px, 2vw, 26px); }
@media (max-width: 1000px) { .epc-lore__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .epc-lore__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.epc-card[hidden] { display: none; }
.epc-card__btn {
	all: unset; box-sizing: border-box; cursor: pointer; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end;
	width: 100%; aspect-ratio: 3 / 4.2; padding: 22px 16px 24px; text-align: center; overflow: hidden;
	background: radial-gradient(circle at 50% 36%, color-mix(in srgb, var(--ep-accent) 22%, var(--ep-surface)) 0%, var(--ep-surface) 62%);
	border: 1px solid var(--ep-line); border-radius: 14px; color: var(--ep-heading);
	transition: transform .5s var(--ep-ease, ease), box-shadow .5s ease, border-color .3s ease;
}
.epc-card__btn::before { content: ""; position: absolute; inset: 8px; border: 1px solid color-mix(in srgb, var(--ep-heading) 18%, transparent); border-radius: 9px; pointer-events: none; }
.epc-card__btn:hover, .epc-card__btn:focus-visible { transform: translateY(-6px); border-color: color-mix(in srgb, var(--ep-glow) 60%, transparent); box-shadow: 0 24px 50px -24px rgba(0,0,0,.55), 0 0 36px -10px color-mix(in srgb, var(--ep-glow) 60%, transparent); }
.epc-card__btn:focus-visible { outline: 2px solid var(--ep-accent); outline-offset: 4px; }
.epc-card__art { position: absolute; inset: 0 0 32%; display: grid; place-items: center; }
.epc-card__art .ep-emblem { width: 44%; color: var(--ep-heading); opacity: .9; transition: color .4s ease, filter .4s ease, transform .6s var(--ep-ease, ease); }
.epc-card__btn:hover .ep-emblem { color: var(--ep-glow); filter: drop-shadow(0 0 10px var(--ep-glow)); transform: scale(1.06); }
.epc-card.has-image .epc-card__art { inset: 0; }
.epc-card.has-image .epc-card__art img { width: 100%; height: 100%; object-fit: cover; }
.epc-card.has-image .epc-card__art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(transparent 45%, rgba(4,8,18,.85)); }
.epc-card.has-image .epc-card__btn { color: #fff; }
.epc-card__type { position: relative; font-family: var(--ep-font-nav); font-size: 12px; opacity: .7; margin-bottom: 4px; }
.epc-card__name { position: relative; font-family: var(--ep-font-display); font-size: clamp(19px, 1.7vw, 24px); line-height: 1.15; }
.epc-lore__empty { text-align: center; opacity: .7; }

/* ---------- Dialog ---------- */
.epc-modal { border: 0; padding: 0; width: min(980px, 94vw); max-height: 90vh; background: var(--ep-bg); color: var(--ep-text); border-radius: 18px; overflow: hidden; box-shadow: 0 40px 120px rgba(0,0,0,.6); }
.epc-modal::backdrop { background: rgba(3,6,16,.72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.epc-modal[open] { animation: epc-open .55s var(--ep-ease, ease); }
@keyframes epc-open { from { opacity: 0; transform: scale(.96) translateY(14px); } to { opacity: 1; transform: none; } }
.epc-modal__close { position: absolute; top: 12px; right: 14px; z-index: 2; width: 40px; height: 40px; border-radius: 50%; font-size: 26px; line-height: 1; background: color-mix(in srgb, var(--ep-bg) 70%, transparent); border: 1px solid var(--ep-line); color: inherit; cursor: pointer; }
.epc-entry { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
.epc-entry__art { background: var(--ep-surface); min-height: 100%; }
.epc-entry__art img { width: 100%; height: 100%; object-fit: cover; max-height: 90vh; }
.epc-entry__emblem { height: 100%; min-height: 320px; display: grid; place-items: center; color: var(--ep-heading); background: radial-gradient(circle at 50% 45%, color-mix(in srgb, var(--ep-accent) 30%, var(--ep-surface)), var(--ep-surface)); }
.epc-entry__emblem .ep-emblem { width: 48%; }
.epc-entry__body { padding: clamp(24px, 4vw, 48px); overflow: auto; max-height: 90vh; }
.epc-entry__type { font-family: var(--ep-font-nav); font-size: 13px; opacity: .7; margin: 0; }
.epc-entry__title { margin: .2em 0 .3em; font-size: clamp(30px, 3.4vw, 44px); }
.epc-entry__tag { font-family: var(--ep-font-display); font-style: var(--ep-accent-style, italic); font-size: 1.2em; }
.epc-facts { display: grid; gap: 8px; margin: 1.4em 0; padding: 16px 18px; border-radius: 12px; background: color-mix(in srgb, var(--ep-surface) 80%, transparent); border: 1px solid var(--ep-line); }
.epc-facts div { display: flex; gap: 12px; }
.epc-facts dt { font-weight: 600; min-width: 120px; }
.epc-facts dd { margin: 0; opacity: .85; }
@media (max-width: 700px) { .epc-entry { grid-template-columns: 1fr; } .epc-entry__emblem { min-height: 200px; } .epc-entry__art img { max-height: 36vh; } }

/* ---------- Explorable map ---------- */
.epc-map { position: relative; }
.epc-map__canvas { position: relative; border-radius: 14px; overflow: hidden; box-shadow: 0 30px 80px -40px rgba(0,0,0,.6); }
.epc-map__art img, .epc-map__art svg { width: 100%; height: auto; display: block; }
.epc-map__art .map-bg { fill: color-mix(in srgb, var(--ep-surface) 82%, var(--ep-portal)); }
.epc-map__art .map-frame { fill: none; stroke: color-mix(in srgb, var(--ep-silver-2) 70%, transparent); stroke-width: 1.5; }
.epc-map__art .map-frame--thin { stroke-width: .6; }
.epc-map__art .map-river { fill: none; stroke: color-mix(in srgb, var(--ep-portal) 40%, var(--ep-surface)); stroke-width: 22; stroke-linecap: round; }
.epc-map__art .map-river-line { fill: none; stroke: var(--ep-link); stroke-width: 1.2; }
.epc-map__art .map-mtn { fill: color-mix(in srgb, var(--ep-surface) 82%, var(--ep-portal)); stroke: var(--ep-silver-2); stroke-width: 1.4; stroke-linejoin: round; }
.epc-map__art .map-hatch { stroke: var(--ep-silver-2); stroke-width: .7; }
.epc-map__art .map-tree { fill: none; stroke: color-mix(in srgb, var(--ep-glow) 55%, var(--ep-silver-3)); stroke-width: 1.1; }
.epc-map__art .map-town path { fill: var(--ep-warm); stroke: var(--ep-warm); }
.epc-map__art .map-label { font-family: var(--ep-font-display); font-style: var(--ep-accent-style, italic); font-size: 30px; fill: var(--ep-silver-1); }
.epc-map__art .map-label--small { font-size: 20px; fill: var(--ep-silver-2); }
.epc-map__art .map-label--big { font-size: 66px; fill: var(--ep-silver-1); opacity: .7; }
.epc-map__art .map-edge { fill: none; stroke: var(--ep-silver-1); stroke-dasharray: 6 8; stroke-width: 1.4; opacity: .6; }
.epc-map__art .map-compass circle, .epc-map__art .map-compass path { fill: none; stroke: var(--ep-silver-2); }
.epc-map__art .map-compass .dash { stroke-dasharray: 2 6; }
.epc-map__fog { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 2; cursor: crosshair; touch-action: pan-y; transition: opacity 1.2s ease; }
.epc-map.is-cleared .epc-map__fog { opacity: 0; pointer-events: none; }
.epc-map__spot {
	position: absolute; z-index: 3; translate: -50% -50%; background: none; border: 0; padding: 0; cursor: pointer; color: #fff;
	display: flex; flex-direction: column; align-items: center; gap: 6px;
	transition: opacity .8s ease, transform .5s var(--ep-ease, ease);
}
.epc-map.has-fog .epc-map__spot:not(.is-found) { opacity: 0; pointer-events: none; }
.epc-map.has-fog .epc-map__spot:focus-visible { opacity: 1; pointer-events: auto; }
.epc-map__pin { width: 18px; height: 18px; border-radius: 50%; background: var(--ep-glow); box-shadow: 0 0 0 5px color-mix(in srgb, var(--ep-glow) 25%, transparent), 0 0 24px var(--ep-glow); animation: epc-pulse 2.6s ease-in-out infinite; }
@keyframes epc-pulse { 0%, 100% { box-shadow: 0 0 0 4px color-mix(in srgb, var(--ep-glow) 25%, transparent), 0 0 18px var(--ep-glow); } 50% { box-shadow: 0 0 0 10px color-mix(in srgb, var(--ep-glow) 8%, transparent), 0 0 34px var(--ep-glow); } }
.epc-map__label { font-family: var(--ep-font-display); font-style: var(--ep-accent-style, italic); font-size: clamp(14px, 1.4vw, 20px); white-space: nowrap; padding: 3px 10px; border-radius: 999px; background: rgba(6,14,18,.7); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.epc-map__spot:hover { transform: translateY(-3px); }
.epc-map__spot.is-new .epc-map__pin { animation: epc-found 1.2s var(--ep-ease, ease); }
@keyframes epc-found { 0% { transform: scale(0); } 60% { transform: scale(1.6); } 100% { transform: scale(1); } }
.epc-map__ui { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin-top: 18px; }
.epc-map__hint { margin: 0; font-style: var(--ep-accent-style, italic); font-family: var(--ep-font-display); font-size: 1.15em; }
.epc-map__count { margin: 0; opacity: .75; font-size: 14px; }
.epc-map__clear { margin-left: auto; }
.epc-map.is-cleared .epc-map__clear { display: none; }

/* ---------- Shelf ---------- */
.epc-shelf { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(150px, 40vw), 1fr)); gap: clamp(20px, 3vw, 40px) clamp(16px, 2.4vw, 32px); }
.epc-shelf--details { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); }
.epc-shelf__cover { position: relative; display: block; perspective: 900px; }
.epc-shelf__cover img, .epc-shelf__blank {
	display: block; width: 100%; aspect-ratio: 2 / 3; object-fit: cover; border-radius: 3px 7px 7px 3px;
	box-shadow: inset 2px 0 0 rgba(255,255,255,.15), 0 24px 40px -22px rgba(0,0,0,.6);
	transform: rotateY(var(--ry, 0deg)) rotateX(var(--rx, 0deg)); transition: transform .5s var(--ep-ease, ease), filter .5s ease;
}
.epc-shelf__blank { display: grid; place-items: center; padding: 14px; text-align: center; background: var(--ep-surface); font-family: var(--ep-font-display); }
.epc-shelf__book.is-sealed .epc-shelf__cover img { filter: grayscale(.6) brightness(.55) blur(1.5px); }
.epc-shelf__book.is-sealed .epc-shelf__cover:hover img { filter: grayscale(.3) brightness(.7) blur(.5px); }
.epc-seal { position: absolute; left: 50%; top: 50%; width: 42%; translate: -50% -50%; filter: drop-shadow(0 6px 10px rgba(0,0,0,.5)); transition: transform .5s var(--ep-ease, ease); }
.epc-seal svg { width: 100%; display: block; }
.epc-seal path:first-child { fill: color-mix(in srgb, var(--ep-banner-bg) 75%, #000); }
.epc-seal .epc-seal__ring { fill: none; stroke: color-mix(in srgb, var(--ep-banner-bg) 70%, #fff); stroke-width: 2; }
.epc-seal .epc-seal__mark { fill: color-mix(in srgb, var(--ep-banner-bg) 55%, #fff); }
.epc-shelf__cover:hover .epc-seal { transform: rotate(-8deg) scale(1.06); }
.epc-shelf__meta { display: flex; justify-content: space-between; gap: 8px; margin-top: 12px; font-size: 13px; }
.epc-shelf__num { font-weight: 600; }
.epc-shelf__state { opacity: .7; text-align: right; }
.epc-shelf__title { font-size: clamp(18px, 1.5vw, 22px); line-height: 1.15; margin: .3em 0 .1em; }
.epc-shelf__title a { color: inherit; text-decoration: none; }
.epc-shelf__sub { font-style: italic; opacity: .8; font-size: .95em; }
.epc-shelf--details .epc-buy { justify-content: flex-start; }

/* ---------- Quiz ---------- */
.epc-quiz { position: relative; padding: clamp(24px, 4vw, 48px); border-radius: 22px; border: 1px solid var(--ep-line); background: color-mix(in srgb, var(--ep-surface) 75%, transparent); min-height: 360px; display: grid; }
.epc-quiz__lead { font-family: var(--ep-font-display); font-size: clamp(22px, 2.4vw, 30px); line-height: 1.3; color: var(--ep-heading); max-width: 26ch; }
.epc-quiz.is-running .epc-quiz__intro { display: none; }
.epc-quiz__progress { display: flex; align-items: center; gap: 14px; font-size: 13px; opacity: .8; margin-bottom: 22px; }
.epc-quiz__bar { flex: 1; height: 2px; background: var(--ep-line); position: relative; overflow: hidden; border-radius: 2px; }
.epc-quiz__bar i { position: absolute; inset: 0 auto 0 0; background: var(--ep-accent); transition: width .6s var(--ep-ease, ease); }
.epc-quiz__q { font-size: clamp(24px, 2.6vw, 34px); margin: 0 0 22px; }
.epc-quiz__answers { display: grid; gap: 10px; }
.epc-quiz__answer {
	text-align: left; font: inherit; color: inherit; cursor: pointer;
	padding: 16px 20px; border-radius: 14px; border: 1px solid var(--ep-line); background: var(--ep-bg);
	transition: border-color .2s ease, transform .3s var(--ep-ease, ease), background .2s ease;
	animation: epc-in .5s var(--ep-ease, ease) both;
}
.epc-quiz__answer:nth-child(2) { animation-delay: .06s; } .epc-quiz__answer:nth-child(3) { animation-delay: .12s; } .epc-quiz__answer:nth-child(4) { animation-delay: .18s; }
.epc-quiz__answer:hover, .epc-quiz__answer:focus-visible { border-color: var(--ep-accent); transform: translateX(4px); }
@keyframes epc-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.epc-quiz__back { margin-top: 18px; background: none; border: 0; color: inherit; opacity: .7; cursor: pointer; font: inherit; font-size: 14px; padding: 0; }
.epc-quiz__result { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 28px; align-items: center; animation: epc-in .8s var(--ep-ease, ease) both; }
.epc-quiz__sigil { width: clamp(110px, 14vw, 170px); aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; background: radial-gradient(circle, color-mix(in srgb, var(--ep-glow) 40%, transparent), transparent 70%); color: var(--ep-heading); overflow: hidden; }
.epc-quiz__sigil img { width: 100%; height: 100%; object-fit: cover; }
.epc-quiz__sigil svg { width: 52%; }
.epc-quiz__yours { margin: 0; font-size: 14px; opacity: .75; }
.epc-quiz__name { margin: .1em 0 .3em; font-size: clamp(36px, 4.4vw, 56px); }
.epc-quiz__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
@media (max-width: 600px) { .epc-quiz__result { grid-template-columns: 1fr; } }

/* ---------- Hidden gems ---------- */
/* Small, faint and easy to scroll past: they only catch the light now and then. */
.epc-sigil {
	--gem: var(--ep-glow);
	display: inline-grid; place-items: center; vertical-align: middle;
	width: 18px; height: 18px; padding: 0; margin: 0 2px; border: 0; background: none; cursor: pointer;
	color: currentColor; opacity: .32; transition: opacity .4s ease, color .4s ease, transform .4s ease, filter .4s ease;
	animation: epc-glint 11s ease-in-out infinite; animation-delay: calc(var(--d, 0) * -1s);
}
.epc-sigil svg { width: 100%; height: 100%; }
.epc-sigil:hover, .epc-sigil:focus-visible { opacity: 1; color: var(--gem); filter: drop-shadow(0 0 6px var(--gem)); transform: scale(1.35) rotate(-8deg); }
.epc-sigil.is-found { opacity: .9; color: var(--gem); animation: none; filter: drop-shadow(0 0 4px var(--gem)); }
.epc-sigil--right { float: right; margin: 0 0 10px 16px; }
.epc-sigil--left { float: left; margin: 0 16px 10px 0; }
.epc-sigil--center { display: grid; margin: 1em auto; }
@keyframes epc-glint { 0%, 92%, 100% { opacity: .32; filter: none; } 95% { opacity: .9; filter: drop-shadow(0 0 5px var(--gem)); } }
@media (prefers-reduced-motion: reduce) { .epc-sigil { animation: none; } }
/* Under the fog on the map: invisible until that very spot is brushed by hand. */
.epc-map__gem { position: absolute; z-index: 3; translate: -50% -50%; width: 16px; height: 16px; color: #fff; opacity: 0; pointer-events: none; animation: none; }
.epc-map__gem.is-uncovered { opacity: .6; pointer-events: auto; animation: epc-glint 6s ease-in-out infinite; }
.epc-map__gem.is-found { opacity: 1; pointer-events: auto; }
.epc-quiz__gem-btn { width: 16px; height: 16px; }

.epc-tracker { position: relative; }
.epc-tracker__btn { display: inline-flex; align-items: center; gap: 10px; padding: 7px 12px; border-radius: 999px; border: 1px solid color-mix(in srgb, currentColor 30%, transparent); background: transparent; color: inherit; cursor: pointer; font-family: var(--ep-font-nav); font-size: 13px; }
.epc-tracker__dots { display: inline-flex; gap: 4px; }
.epc-tracker__dots i { width: 5px; height: 5px; border-radius: 50%; background: currentColor; opacity: .3; transition: background .4s ease, opacity .4s ease, box-shadow .4s ease; }
.epc-tracker__dots i.is-lit { background: var(--ep-glow); opacity: 1; box-shadow: 0 0 6px var(--ep-glow); }
.epc-tracker__pop { position: absolute; right: 0; top: calc(100% + 10px); width: 280px; padding: 18px; border-radius: 16px; background: var(--ep-header-bg); color: var(--ep-header-text); border: 1px solid color-mix(in srgb, currentColor 18%, transparent); box-shadow: 0 30px 60px -20px rgba(0,0,0,.6); font-size: 14px; z-index: 50; }
.epc-tracker__title { font-family: var(--ep-font-display); font-size: 1.3em; margin: 0 0 .3em; }
.epc-reward__glyphs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.epc-tracker__pop { width: min(360px, 88vw); max-height: 70vh; overflow: auto; }
.epc-tracker__list { list-style: none; margin: 12px 0 0; padding: 0; display: grid; gap: 12px; }
.epc-tracker__item { display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: start; font-size: 13px; line-height: 1.45; }
.epc-tracker__item em { opacity: .78; }
.epc-tracker__glyph { width: 24px; height: 24px; opacity: .3; }
.epc-tracker__item.is-lit .epc-tracker__glyph, .epc-progress__glyph.is-lit { opacity: 1; color: var(--gem, var(--ep-glow)); filter: drop-shadow(0 0 6px var(--gem, var(--ep-glow))); }
.epc-tracker__item.is-lit strong::after { content: " ✓"; color: var(--gem, var(--ep-glow)); }
.epc-tracker__glyph svg, .epc-reward__glyphs svg { width: 100%; height: 100%; }
@media (max-width: 960px) { .epc-tracker__dots { display: none; } }

.epc-toast { position: fixed; z-index: 10000; left: 50%; bottom: 28px; translate: -50% 0; padding: 12px 20px; border-radius: 999px; background: var(--ep-dark-bg); color: var(--ep-dark-text); border: 1px solid color-mix(in srgb, var(--ep-glow) 50%, transparent); box-shadow: 0 0 30px -6px var(--ep-glow); font-family: var(--ep-font-nav); font-size: 14px; animation: epc-in .5s var(--ep-ease, ease) both; }

.epc-reward { border: 0; border-radius: 22px; padding: clamp(28px, 5vw, 56px); width: min(560px, 92vw); text-align: center; background: var(--ep-dark-bg); color: var(--ep-dark-text); box-shadow: 0 0 120px -20px var(--ep-glow); }
.epc-reward::backdrop { background: rgba(3,6,16,.8); }
.epc-reward h2 { color: var(--ep-dark-text); margin: .4em 0 .3em; }
.epc-reward__glyphs { justify-content: center; }
.epc-reward__glyphs span { width: 30px; height: 30px; color: var(--gem, var(--ep-glow)); filter: drop-shadow(0 0 6px var(--gem, var(--ep-glow))); animation: epc-in .6s var(--ep-ease, ease) both; }
.epc-reward__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; margin-top: 18px; }

.epc-progress { text-align: center; }
.epc-progress__glyphs { list-style: none; margin: 0 auto; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: clamp(14px, 3vw, 34px); }
.epc-progress__glyph { width: clamp(38px, 6vw, 64px); aspect-ratio: 1; opacity: .18; transition: opacity .6s ease; }
.epc-progress__glyph svg { width: 100%; height: 100%; }
.epc-progress__text { margin-top: 1.4em; font-family: var(--ep-font-display); font-style: var(--ep-accent-style, italic); font-size: 1.25em; }

/* ---------- Fairy-name generator ---------- */
.epc-namegen { max-width: 640px; margin: 2em auto; padding: clamp(22px, 4vw, 40px); text-align: center; border: 1px solid var(--ep-line); border-radius: 22px; background: color-mix(in srgb, var(--ep-surface) 70%, transparent); }
.epc-namegen__title { margin-top: 0; }
.epc-namegen__form { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; align-items: flex-end; }
.epc-namegen__form label { display: flex; flex-direction: column; text-align: left; gap: 4px; font-size: 13px; }
.epc-namegen__result:empty { display: none; }
.epc-namegen__result { margin: 1.2em 0 0; font-family: var(--ep-font-display); font-size: clamp(28px, 3.6vw, 44px); color: var(--ep-heading); }
.epc-namegen__result.is-new { animation: epc-reveal 1.4s ease both; }
.epc-namegen__result small { display: block; font-style: italic; font-size: .5em; opacity: .85; }
@keyframes epc-reveal { 0% { opacity: 0; letter-spacing: .4em; filter: blur(8px); } 100% { opacity: 1; letter-spacing: normal; filter: none; } }
@media (max-width: 560px) { .epc-namegen__form { flex-direction: column; align-items: stretch; } .epc-namegen__form input, .epc-namegen__form select { width: 100%; } }

/* ---------- Portal link ---------- */
.epc-portal-wrap { display: flex; justify-content: center; margin: 2.5em 0; }
.epc-portal { position: relative; display: grid; place-items: center; width: var(--epc-portal-size, 360px); max-width: 82vw; aspect-ratio: 1; text-decoration: none; color: #fff; }
.epc-portal .ep-portal-wreath { position: absolute; inset: 0; }
.epc-portal__inner { position: absolute; inset: 21%; border-radius: 50%; background: radial-gradient(circle at 50% 45%, #fff 0%, color-mix(in srgb, var(--ep-glow) 50%, var(--ep-portal, var(--ep-accent))) 18%, var(--ep-portal, var(--ep-accent)) 45%, color-mix(in srgb, var(--ep-portal, var(--ep-accent)) 20%, #000) 100%) center / cover; box-shadow: 0 0 80px color-mix(in srgb, var(--ep-portal, var(--ep-accent)) 70%, transparent); transition: transform .8s var(--ep-ease, ease); }
.epc-portal:hover .epc-portal__inner { transform: scale(1.07); }
.epc-portal__text { position: relative; z-index: 2; font-family: var(--ep-font-display); font-size: calc(var(--epc-portal-size, 360px) / 12); text-shadow: 0 2px 14px rgba(0,0,0,.6); }

/* ---------- Shimmer text, newsletter ---------- */
.epc-sparkle-text { display: inline-block; background: linear-gradient(110deg, var(--ep-heading) 40%, #fff 50%, var(--ep-heading) 60%); background-size: 250% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: epc-shine 5s ease-in-out infinite; }
@keyframes epc-shine { 0% { background-position: 150% 0; } 60%, 100% { background-position: -100% 0; } }
.epc-newsletter { text-align: center; }
.epc-newsletter__row { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.epc-newsletter__row label { flex: 1 1 200px; max-width: 280px; }
.epc-newsletter__row input { width: 100%; }
.epc-newsletter__note { font-size: 13px; opacity: .7; margin-top: 1em; }

@media (prefers-reduced-motion: reduce) {
	.epc-map__pin, .epc-sparkle-text { animation: none; }
	.epc-card__btn, .epc-shelf__cover img { transition: none; }
}
