/* ==========================================================================
   The events page (/events.html, /en/events.html; source site/src/events.html).
   Loaded only there, after site.css (tokens, buttons, bar, footer) and content.css
   (page head, forms, questions, call to action, motion). Every class starts with ep-,
   so nothing here reaches another page. Script: site/events.js.
   ========================================================================== */

/* the sports: one colour each, dark enough for a white icon */
.sp-running { --sp: #4F46E5; --sp-t: #EEF0FF; }
.sp-yoga { --sp: #059669; --sp-t: #E7F8F1; }
.sp-cycling { --sp: #0284C7; --sp-t: #E6F4FB; }
.sp-strength { --sp: #1E293B; --sp-t: #EEF0F4; }
.sp-pilates { --sp: #DB2777; --sp-t: #FDEBF4; }
.sp-crossfit { --sp: #EA580C; --sp-t: #FFF0E6; }
.sp-boxing { --sp: #DC2626; --sp-t: #FDECEC; }
.sp-swimming { --sp: #0E7490; --sp-t: #E4F4F7; }
.sp-climbing { --sp: #4D7C0F; --sp-t: #EEF6E3; }
.sp-other { --sp: #7C3AED; --sp-t: #F2EDFE; }

.t-events .ic { width: 18px; height: 18px; flex: none; }

/* ------------------------------------------------------------ the head */
.t-events .ep-hero { padding: 136px 0 44px; }
.ep-go { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 30px; }
.ep-go .btn .ic { width: 17px; height: 17px; transition: transform .25s var(--ease); }
.ep-go .btn-primary:hover .ic { transform: translateY(2px) rotate(90deg); }
.ep-facts { list-style: none; margin: 22px 0 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; font-size: 14px; color: var(--dim); }
.ep-facts li { display: inline-flex; align-items: center; gap: 7px; }
.ep-facts .ic { width: 15px; height: 15px; color: var(--emerald); }

/* ------------------------------------------------------------ the app: bar, list, map */
.ep-find { padding: 4px 0 24px; scroll-margin-top: 76px; }
.ep-wrap { max-width: 1400px; }
.ep-app { position: relative; isolation: isolate; display: flex; flex-direction: column; height: clamp(600px, calc(100vh - 92px), 880px); border-radius: var(--r-3xl); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-lg); overflow: hidden; }
.cp .ep-app { animation: cm-rise 1.3s var(--cm-ease) .32s both; }

.ep-bar { position: relative; z-index: 6; flex: none; display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; padding: 14px 16px 12px; border-bottom: 1px solid var(--line); background: #fff; }
.ep-bar-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.ep-search { position: relative; flex: 1 1 280px; max-width: 420px; }
.ep-search-ic { position: absolute; left: 14px; top: 50%; width: 18px; height: 18px; margin-top: -9px; color: #8A93A8; pointer-events: none; }
.ep-input { display: block; width: 100%; height: 44px; padding: 0 44px 0 42px; border-radius: 14px; border: 1px solid transparent; background: #F1F3F8; font: 400 15.5px Inter, sans-serif; color: var(--text); transition: background-color .2s, border-color .2s, box-shadow .2s; -webkit-appearance: none; appearance: none; }
.ep-input::placeholder { color: #8A93A8; }
.ep-input:hover { background: #ECEEF5; }
.ep-input:focus { outline: none; background: #fff; border-color: var(--violet); box-shadow: 0 0 0 4px rgba(99, 102, 241, .15); }
.ep-clear { position: absolute; right: 6px; top: 50%; width: 32px; height: 32px; margin-top: -16px; display: grid; place-items: center; border-radius: 50%; color: var(--dim); }
.ep-clear:hover { background: rgba(15, 23, 42, .06); color: var(--text); }
.ep-clear .ic { width: 15px; height: 15px; }
.ep-clear[hidden] { display: none; }
.ep-sugg { top: 50px; z-index: 30; }
.ep-sugg button { align-items: baseline; }
.ep-near { display: inline-flex; align-items: center; gap: 8px; height: 44px; padding: 0 15px 0 13px; border-radius: 14px; border: 1px solid var(--line); background: #fff; font: 600 14.5px Inter, sans-serif; color: var(--text); white-space: nowrap; transition: border-color .2s, background-color .2s, color .2s; }
.ep-near .ic { color: var(--violet-600); }
.ep-near:hover { border-color: #CDD2E2; }
.ep-near[aria-pressed="true"] { background: var(--violet-50); border-color: rgba(99, 102, 241, .35); color: var(--violet-600); }
.ep-near.is-busy .ic { animation: ep-spin 1.1s linear infinite; }
@keyframes ep-spin { to { transform: rotate(360deg); } }

.ep-seg { position: relative; display: inline-flex; margin: 0 0 0 auto; padding: 4px; border: 0; border-radius: 14px; background: #F1F3F8; min-width: 0; }
.ep-seg label { position: relative; z-index: 1; cursor: pointer; }
.ep-seg input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.ep-seg span { display: flex; align-items: center; height: 36px; padding: 0 14px; border-radius: 10px; font: 600 14px Inter, sans-serif; color: var(--dim); white-space: nowrap; transition: color .3s; }
.ep-seg label:hover span { color: var(--text); }
.ep-seg input:checked + span { color: var(--ink); }
.ep-seg input:focus-visible + span { outline: 3px solid var(--violet-600); outline-offset: 0; }
.ep-knob { position: absolute; z-index: 0; top: 4px; bottom: 4px; left: 0; width: 0; border-radius: 10px; background: #fff; box-shadow: 0 1px 2px rgba(15, 23, 42, .08), 0 4px 12px rgba(15, 23, 42, .08); transition: transform .45s var(--ease), width .45s var(--ease); }
.ep-seg:not(.is-ready) .ep-knob { transition: none; }

.ep-free { display: inline-flex; align-items: center; gap: 9px; height: 44px; padding: 0 16px 0 12px; border-radius: 14px; border: 1px solid var(--line); background: #fff; font: 600 14.5px Inter, sans-serif; color: var(--text); white-space: nowrap; transition: border-color .2s, background-color .2s, color .2s; }
.ep-free:hover { border-color: #CDD2E2; }
.ep-free-box { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid #BFC5D6; background: #fff; transition: background-color .2s, border-color .2s; }
.ep-free-box .ic { width: 12px; height: 12px; color: #fff; opacity: 0; transform: scale(.6); transition: opacity .2s, transform .3s var(--ease); }
.ep-free[aria-pressed="true"] { border-color: rgba(16, 185, 129, .45); background: var(--emerald-50); color: #065F46; }
.ep-free[aria-pressed="true"] .ep-free-box { background: var(--emerald); border-color: var(--emerald); }
.ep-free[aria-pressed="true"] .ep-free-box .ic { opacity: 1; transform: none; }

.ep-chipwrap { position: relative; min-width: 0; margin: 0 -16px; }
.ep-chips { --fl: 16px; --fr: 16px; display: flex; gap: 6px; overflow-x: auto; padding: 2px 16px; scroll-padding-inline: 16px; scrollbar-width: none; -webkit-mask-image: linear-gradient(90deg, transparent, #000 var(--fl), #000 calc(100% - var(--fr)), transparent); mask-image: linear-gradient(90deg, transparent, #000 var(--fl), #000 calc(100% - var(--fr)), transparent); }
.has-prev > .ep-chips { --fl: 72px; }
.has-next > .ep-chips { --fr: 80px; }
.ep-chips-go { position: absolute; z-index: 2; top: 50%; display: grid; place-items: center; width: 34px; height: 34px; margin-top: -17px; border-radius: 50%; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-md); color: var(--text); transition: transform .2s var(--ease); }
.ep-chips-go:hover { transform: scale(1.06); }
.ep-chips-go .ic { width: 16px; height: 16px; }
.ep-chips-go.is-prev { left: 14px; }
.ep-chips-go.is-next { right: 14px; }
.ep-chips-go[hidden] { display: none; }
@media (hover: none), (pointer: coarse) { .ep-chips-go { display: none; } }
.ep-chips::-webkit-scrollbar { display: none; }
.ep-chip { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 12px 0 5px; border-radius: 999px; border: 1px solid var(--line); background: #fff; font: 500 14px Inter, sans-serif; color: var(--text); white-space: nowrap; transition: background-color .2s, border-color .2s, color .2s, transform .2s var(--ease); }
.ep-chip:active { transform: scale(.96); }
.ep-chip.is-all { padding: 0 16px; }
.ep-chip:hover { border-color: #CDD2E2; }
.ep-chip-ic { display: grid; place-items: center; width: 27px; height: 27px; border-radius: 50%; background: var(--sp-t); color: var(--sp); transition: background-color .2s, color .2s; }
.ep-chip-ic .ic { width: 16px; height: 16px; }
.ep-chip-n { font: 600 12px Inter, sans-serif; color: var(--faint); font-variant-numeric: tabular-nums; }
.ep-chip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: #fff; }
.ep-chip[aria-pressed="true"] .ep-chip-ic { background: var(--sp, #fff); color: #fff; }
.ep-chip[aria-pressed="true"] .ep-chip-n { color: rgba(255, 255, 255, .6); }
.ep-chip.is-empty:not([aria-pressed="true"]) { color: var(--faint); }
.ep-chip.is-empty:not([aria-pressed="true"]) .ep-chip-ic { opacity: .5; }
.ep-chip.ep-free-m { padding: 0 14px 0 9px; gap: 8px; }
.ep-chip.ep-free-m[aria-pressed="true"] { background: var(--emerald-50); border-color: rgba(16, 185, 129, .45); color: #065F46; }
.ep-chip.ep-free-m[aria-pressed="true"] .ep-free-box { background: var(--emerald); border-color: var(--emerald); }
.ep-chip.ep-free-m[aria-pressed="true"] .ep-free-box .ic { opacity: 1; transform: none; }
.ep-geo { margin: 0; padding: 9px 12px; border-radius: 12px; background: #FFF6E5; color: #92400E; font-size: 13.5px; line-height: 1.45; }
.ep-geo[hidden] { display: none; }

.ep-body { position: relative; flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 400px minmax(0, 1fr); }

/* the list panel (a side panel on wide screens, a bottom sheet on phones) */
.ep-panel { position: relative; z-index: 3; display: flex; flex-direction: column; min-height: 0; background: #fff; border-right: 1px solid var(--line); }
.ep-grab { position: relative; flex: none; padding: 16px 20px 12px; }
.ep-panel.is-scrolled .ep-grab { box-shadow: 0 1px 0 var(--line); }
.ep-handle { display: none; }
.ep-lh { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.ep-count { font: 600 18px/1.25 Outfit, Inter, sans-serif; letter-spacing: -.01em; color: var(--ink); }
.ep-where { margin-top: 2px; font-size: 13.5px; line-height: 1.4; color: var(--dim); }
.ep-where:empty { display: none; }
.ep-demo { flex: none; display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 10px 0 11px; border-radius: 999px; background: #FEF3C7; color: #92400E; font: 600 12.5px Inter, sans-serif; }
.ep-demo .ic { width: 14px; height: 14px; }
.ep-demo:hover { background: #FDE9A8; }
.ep-demo[hidden] { display: none; }
.ep-demo-note { margin-top: 10px; padding: 11px 13px; border-radius: 14px; background: #FFFBEB; border: 1px solid #FDE68A; color: #78350F; font-size: 13.5px; line-height: 1.5; }
.ep-demo-note a { font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.ep-demo-note[hidden] { display: none; }
.ep-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 10px 18px; scrollbar-width: thin; scrollbar-color: #D5D9E4 transparent; }

.ep-group + .ep-group { margin-top: 6px; }
.ep-day { position: sticky; top: 0; z-index: 2; display: flex; align-items: baseline; gap: 8px; margin: 0; padding: 12px 10px 8px; background: rgba(255, 255, 255, .92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font: 600 15px/1.2 Outfit, Inter, sans-serif; letter-spacing: -.01em; color: var(--ink); }
.ep-day small { font: 500 13px Inter, sans-serif; color: var(--faint); letter-spacing: 0; }
.ep-items { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }

/* one event in the list (and in the form's preview) */
.ep-item { position: relative; display: grid; grid-template-columns: 76px minmax(0, 1fr); gap: 14px; align-items: center; width: 100%; padding: 10px; border-radius: 18px; text-align: left; background: transparent; transition: background-color .25s; }
button.ep-item:hover, .ep-item.is-hot { background: #F5F6FA; }
.ep-item.is-on { background: var(--violet-50); }
.ep-item:focus-visible { outline-offset: -2px; }
.ep-thumb { position: relative; width: 76px; height: 76px; border-radius: 16px; overflow: hidden; background: var(--mist); }
.ep-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
button.ep-item:hover .ep-thumb img, .ep-item.is-hot .ep-thumb img { transform: scale(1.06); }
.ep-thumb-ic { position: absolute; left: 6px; bottom: 6px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--sp); color: #fff; box-shadow: 0 0 0 2px #fff, 0 2px 6px rgba(15, 23, 42, .25); }
.ep-thumb-ic .ic { width: 13px; height: 13px; }
.ep-it { display: grid; gap: 3px; min-width: 0; }
.ep-it-time { display: flex; align-items: center; gap: 8px; font: 600 13px Inter, sans-serif; color: var(--violet-600); font-variant-numeric: tabular-nums; }
.ep-live { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px 2px 7px; border-radius: 999px; background: var(--emerald-50); color: #047857; font: 600 11.5px Inter, sans-serif; }
.ep-live::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--emerald); animation: ep-live 1.8s ease-in-out infinite; }
@keyframes ep-live { 50% { opacity: .35; } }
.ep-it-h { font: 600 16px/1.28 Outfit, Inter, sans-serif; letter-spacing: -.01em; color: var(--ink); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.ep-it-meta { font-size: 13.5px; line-height: 1.4; color: var(--dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ep-it-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 3px; }
.ep-tag { display: inline-flex; align-items: center; height: 22px; padding: 0 8px; border-radius: 999px; background: #F1F3F8; font: 600 11.5px Inter, sans-serif; color: #475069; white-space: nowrap; }
.ep-tag.is-free { background: var(--emerald-50); color: #047857; }
.ep-tag.is-dist { background: none; padding: 0; color: var(--faint); font-weight: 500; }

/* a sport without a photo: the blog's drawn cover, in the sport's colours */
.ep-art { position: relative; width: 100%; height: 100%; display: grid; place-items: center; isolation: isolate; overflow: hidden;
  background: radial-gradient(70% 80% at 85% 0%, color-mix(in srgb, var(--sp) 22%, transparent), transparent 70%), radial-gradient(60% 70% at 0% 100%, color-mix(in srgb, var(--sp) 12%, transparent), transparent 70%), linear-gradient(135deg, var(--sp-t), #fff); }
.ep-art::before { content: ""; position: absolute; inset: 0; z-index: -1; background-image: radial-gradient(color-mix(in srgb, var(--sp) 16%, transparent) 1.2px, transparent 1.2px); background-size: 14px 14px; -webkit-mask-image: radial-gradient(70% 80% at 50% 50%, #000 30%, transparent 85%); mask-image: radial-gradient(70% 80% at 50% 50%, #000 30%, transparent 85%); }
.ep-art-ring { position: absolute; left: 50%; top: 50%; width: 74%; aspect-ratio: 1; border-radius: 50%; border: 1.5px dashed color-mix(in srgb, var(--sp) 32%, transparent); transform: translate(-50%, -50%); }
.ep-art-tile { position: relative; display: grid; place-items: center; width: 50%; aspect-ratio: 1; border-radius: 28%; color: #fff; background: linear-gradient(135deg, color-mix(in srgb, var(--sp) 78%, #fff), var(--sp)); box-shadow: 0 10px 24px color-mix(in srgb, var(--sp) 34%, transparent); transform: rotate(-6deg); }
.ep-art-tile .ic { width: 50%; height: 50%; }
.ep-item .ep-art-tile { width: 46%; }
.ep-thumb .ep-art + .ep-thumb-ic { display: none; }

/* the list's other states */
.ep-skel { display: grid; gap: 10px; padding: 8px 10px; }
.ep-skel i { display: block; height: 96px; border-radius: 18px; background: linear-gradient(90deg, #F2F3F7 25%, #F8F9FB 45%, #F2F3F7 65%) 0 0 / 300% 100%; animation: ep-shimmer 1.4s linear infinite; }
@keyframes ep-shimmer { to { background-position: -150% 0; } }
.ep-empty { display: grid; justify-items: center; gap: 10px; padding: 36px 18px 28px; text-align: center; }
.ep-empty-ic { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 18px; background: var(--violet-50); color: var(--violet-600); }
.ep-empty-ic .ic { width: 24px; height: 24px; }
.ep-empty h3 { font-size: 19px; line-height: 1.3; letter-spacing: -.015em; }
.ep-empty p { font-size: 14.5px; line-height: 1.55; color: var(--dim); max-width: 300px; }
.ep-empty-go { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 6px; }
.ep-empty-go .btn { height: 40px; padding: 0 14px; font-size: 14px; border-radius: 12px; }
.ep-list-end { margin: 18px 10px 4px; padding: 16px; border-radius: 18px; background: var(--mist); font-size: 14px; line-height: 1.5; color: var(--dim); }
.ep-list-end a { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-weight: 600; color: var(--violet-600); }
.ep-list-end a .ic { width: 15px; height: 15px; transition: transform .25s var(--ease); }
.ep-list-end a:hover .ic { transform: translateX(3px); }

/* the detail of one event, over the list */
.ep-detail { position: absolute; inset: 0; z-index: 4; display: flex; flex-direction: column; background: #fff; animation: ep-in .5s var(--cm-ease, var(--ease)); }
.ep-detail[hidden] { display: none; }
@keyframes ep-in { from { opacity: 0; transform: translate3d(22px, 0, 0); } }
.ep-d-bar { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px 8px; }
.ep-d-back { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px 0 10px; border-radius: 12px; font: 600 14.5px Inter, sans-serif; color: var(--text); }
.ep-d-back:hover { background: var(--mist); }
.ep-d-share { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; color: var(--dim); }
.ep-d-share:hover { background: var(--mist); color: var(--text); }
.ep-d-share.is-done { color: #047857; }
.ep-d-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 0 16px 20px; }
.ep-d-cover { position: relative; aspect-ratio: 16 / 9; border-radius: 22px; overflow: hidden; background: var(--mist); }
.ep-d-cover img { width: 100%; height: 100%; object-fit: cover; }
.ep-d-cover::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11, 16, 34, .28), rgba(11, 16, 34, 0) 38%); pointer-events: none; }
.ep-d-cover .ep-art-tile { width: 26%; }
.ep-d-cover .ep-art-ring { width: 46%; }
.ep-d-sport { position: absolute; z-index: 1; left: 12px; top: 12px; display: inline-flex; align-items: center; gap: 7px; height: 32px; padding: 0 12px 0 5px; border-radius: 999px; background: rgba(255, 255, 255, .9); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); font: 600 13px Inter, sans-serif; color: var(--ink); }
.ep-d-sport i { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--sp); color: #fff; }
.ep-d-sport .ic { width: 14px; height: 14px; }
.ep-d-demo { position: absolute; z-index: 1; right: 12px; top: 12px; height: 28px; display: inline-flex; align-items: center; padding: 0 10px; border-radius: 999px; background: #FEF3C7; color: #92400E; font: 600 12px Inter, sans-serif; }
.ep-d-h { margin-top: 18px; font-size: 25px; line-height: 1.15; letter-spacing: -.025em; color: var(--ink); text-wrap: balance; }
.ep-d-by { display: flex; align-items: center; gap: 10px; margin-top: 10px; font-size: 14px; color: var(--dim); }
.ep-d-by b { color: var(--text); font-weight: 600; }
.ep-d-av { display: grid; place-items: center; flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--sp); color: #fff; font: 600 11.5px Inter, sans-serif; }
.ep-d-facts { list-style: none; margin: 18px 0 0; padding: 0; display: grid; gap: 2px; border-radius: 18px; background: var(--mist); padding: 6px; }
.ep-d-facts li { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 8px; }
.ep-d-facts li + li { border-top: 1px solid rgba(15, 23, 42, .06); }
.ep-d-fi { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 11px; background: #fff; color: var(--violet-600); box-shadow: var(--shadow-sm); }
.ep-d-fi .ic { width: 17px; height: 17px; }
.ep-d-ft { display: grid; gap: 1px; min-width: 0; }
.ep-d-ft b { font-weight: 600; font-size: 15px; line-height: 1.35; color: var(--ink); }
.ep-d-ft small { font-size: 13px; line-height: 1.4; color: var(--dim); }
.ep-d-route { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 11px; border-radius: 10px; background: #fff; border: 1px solid var(--line); font: 600 13px Inter, sans-serif; color: var(--violet-600); white-space: nowrap; }
.ep-d-route:hover { border-color: rgba(99, 102, 241, .45); }
.ep-d-route .ic { width: 15px; height: 15px; }
.ep-d-desc { margin-top: 18px; font-size: 15.5px; line-height: 1.65; color: var(--prose, #283044); white-space: pre-line; overflow-wrap: anywhere; }
.ep-d-report { display: inline-flex; align-items: center; gap: 7px; min-height: 40px; margin-top: 12px; font-size: 13.5px; color: var(--faint); }
.ep-d-report:hover { color: var(--text); }
.ep-d-report .ic { width: 15px; height: 15px; }
.ep-d-foot { flex: none; padding: 12px 16px 14px; border-top: 1px solid var(--line); background: rgba(255, 255, 255, .96); }
.ep-d-join { width: 100%; height: 52px; font-size: 16.5px; border-radius: 15px; }
.ep-d-join .ic { transition: transform .25s var(--ease); }
.ep-d-join:hover .ic { transform: translateX(3px); }
.ep-d-note { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 10px; margin-top: 9px; font-size: 13px; color: var(--dim); text-align: center; }
.ep-d-note a { font-weight: 600; color: var(--violet-600); }
.ep-d-note-m { display: none; }
.ep-d-demo-msg { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 12px; padding: 12px 14px; border-radius: 14px; background: var(--violet-50); color: #3730A3; font-size: 13.5px; line-height: 1.5; animation: ep-up .45s var(--ease); }
.ep-d-demo-msg .ic { width: 18px; height: 18px; margin-top: 1px; }
.ep-d-demo-msg[hidden] { display: none; }
@keyframes ep-up { from { opacity: 0; transform: translateY(8px); } }

/* the map */
.ep-map { position: relative; z-index: 1; min-width: 0; overflow: hidden; background: #EFEBF4; }
.ep-canvas { position: absolute; inset: 0; opacity: 0; transition: opacity 1s var(--ease); }
.is-live > .ep-canvas { opacity: 1; }
.ep-canvas .maplibregl-canvas { outline: none; }
.ep-poster { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 12px; background: radial-gradient(60% 55% at 58% 48%, #F7F5FB 0%, #EFEBF4 60%, #E8E3F0 100%); transition: opacity .8s ease .3s; }
.ep-poster::before { content: ""; position: absolute; inset: 0; background-image: radial-gradient(rgba(79, 70, 229, .12) 1.2px, transparent 1.2px); background-size: 22px 22px; -webkit-mask-image: radial-gradient(60% 60% at 55% 50%, #000 20%, transparent 80%); mask-image: radial-gradient(60% 60% at 55% 50%, #000 20%, transparent 80%); }
.ep-poster-dot { position: relative; width: 14px; height: 14px; border-radius: 50%; background: var(--violet); box-shadow: 0 0 0 5px rgba(99, 102, 241, .18); animation: ep-live 1.6s ease-in-out infinite; }
.ep-poster-t { position: relative; font-size: 13.5px; color: #6E7390; text-align: center; max-width: 320px; padding: 0 16px; line-height: 1.5; }
.is-live > .ep-poster { opacity: 0; pointer-events: none; }
.is-nomap > .ep-poster .ep-poster-dot { animation: none; background: #C4C9D8; box-shadow: none; }
.ep-map .maplibregl-ctrl-bottom-right { right: 10px; bottom: 12px; }
.ep-map .maplibregl-ctrl-group { border-radius: 12px; box-shadow: var(--shadow-md); overflow: hidden; }
.ep-map .maplibregl-ctrl-group button { width: 36px; height: 36px; }
.ep-map .maplibregl-ctrl-attrib { font-size: 10.5px; }
.ep-map .maplibregl-ctrl-attrib.maplibregl-compact:not(.maplibregl-compact-show) { opacity: .55; }
.ep-reset { position: absolute; z-index: 5; left: 50%; top: 14px; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px 0 12px; border-radius: 999px; background: rgba(255, 255, 255, .94); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: var(--shadow-md); font: 600 13.5px Inter, sans-serif; color: var(--ink); transform: translateX(-50%); animation: ep-drop .45s var(--ease); }
.ep-reset .ic { width: 15px; height: 15px; color: var(--dim); }
.ep-reset:hover .ic { color: var(--text); }
.ep-reset[hidden] { display: none; }
@keyframes ep-drop { from { opacity: 0; transform: translate(-50%, -8px); } }
.ep-map-tag { position: absolute; z-index: 5; left: 12px; bottom: 12px; display: inline-flex; align-items: center; height: 26px; padding: 0 10px; border-radius: 999px; background: rgba(254, 243, 199, .95); color: #92400E; font: 600 11.5px Inter, sans-serif; pointer-events: none; }
.ep-map-tag[hidden] { display: none; }

/* pins: the shape of the landing page's coach pins, in the sport's colour */
.ep-mk { z-index: 1; }
.ep-mk.is-hot, .ep-mk.is-on { z-index: 5; }
.ep-pin { position: relative; display: block; width: 40px; height: 48px; padding: 0; cursor: pointer; }
.ep-pin-b { position: absolute; left: 3px; top: 3px; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50% 50% 50% 6px; background: var(--sp); border: 2.5px solid #fff; box-shadow: 0 6px 16px rgba(15, 23, 42, .22), 0 1px 3px rgba(15, 23, 42, .18); transform: rotate(-45deg); transform-origin: 50% 50%; transition: transform .3s var(--ease), box-shadow .3s; }
.ep-pin-b .ic { width: 16px; height: 16px; color: #fff; transform: rotate(45deg); }
.ep-pin-in { animation: ep-pin-in .6s var(--ease) both; }
@keyframes ep-pin-in { from { opacity: 0; transform: translateY(-14px); } }
.ep-pin:hover .ep-pin-b, .is-hot .ep-pin-b { transform: rotate(-45deg) scale(1.16); box-shadow: 0 10px 22px rgba(15, 23, 42, .28); }
.is-on .ep-pin-b { transform: rotate(-45deg) scale(1.28); box-shadow: 0 0 0 6px color-mix(in srgb, var(--sp) 22%, transparent), 0 12px 26px rgba(15, 23, 42, .3); }
.ep-pin-l { position: absolute; left: 50%; bottom: calc(100% + 4px); display: grid; gap: 1px; width: max-content; min-width: 120px; max-width: 250px; padding: 7px 11px 8px; border-radius: 12px; background: #fff; box-shadow: var(--shadow-md); text-align: left; transform: translate(-50%, 6px) scale(.96); opacity: 0; pointer-events: none; transition: opacity .25s, transform .35s var(--ease); }
.ep-pin-l b { font: 600 13.5px/1.25 Outfit, Inter, sans-serif; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ep-pin-l small { font: 500 12px Inter, sans-serif; color: var(--dim); white-space: nowrap; }
.is-hot .ep-pin-l, .is-on .ep-pin-l { opacity: 1; transform: translate(-50%, 0); }
.is-on .ep-pin-l { bottom: calc(100% + 10px); }
.ep-cl { position: relative; display: grid; place-items: center; width: var(--s, 44px); height: var(--s, 44px); padding: 0; border-radius: 50%; background: var(--g, var(--violet)); box-shadow: 0 8px 22px rgba(15, 23, 42, .2); cursor: pointer; transition: transform .3s var(--ease); }
.ep-cl::before { content: ""; position: absolute; inset: 4px; border-radius: 50%; background: #fff; }
.ep-cl b { position: relative; font: 700 15px Outfit, Inter, sans-serif; color: var(--ink); font-variant-numeric: tabular-nums; }
.ep-cl:hover, .ep-cl.is-hot { transform: scale(1.1); }
.ep-cl.is-hot { box-shadow: 0 0 0 6px rgba(99, 102, 241, .18), 0 10px 24px rgba(15, 23, 42, .24); }
.ep-me { position: relative; display: block; width: 20px; height: 20px; border-radius: 50%; background: var(--violet); border: 3px solid #fff; box-shadow: 0 3px 10px rgba(79, 70, 229, .45); }
.ep-me::before { content: ""; position: absolute; inset: -16px; border-radius: 50%; background: rgba(99, 102, 241, .2); animation: ep-halo 2.6s var(--ease) infinite; }
@keyframes ep-halo { from { transform: scale(.35); opacity: 1; } to { transform: scale(1.2); opacity: 0; } }
.ep-draft .ep-pin-b { background: var(--violet); }
.ep-draft { cursor: grab; }

/* ------------------------------------------------------------ list your event */
.ep-add { position: relative; padding: 112px 0 104px; margin-top: 72px; background: linear-gradient(180deg, rgba(244, 246, 251, 0), var(--mist) 140px, var(--mist) calc(100% - 140px), rgba(244, 246, 251, 0)); scroll-margin-top: 40px; }
.ep-add-head { max-width: 780px; margin-bottom: 52px; }
.ep-add-head h2 .grad { display: inline-block; }
.ep-add-grid { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: 40px; align-items: start; }
.ep-side { position: sticky; top: 96px; }
.ep-how { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; }
.ep-how li { position: relative; display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 16px; align-items: start; }
.ep-how li:not(:last-child)::after { content: ""; position: absolute; left: 22px; top: 52px; bottom: -18px; width: 2px; border-radius: 2px; background: linear-gradient(#D9DCF4, rgba(217, 220, 244, 0)); }
.ep-how-ic { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 15px; background: #fff; color: var(--violet-600); box-shadow: var(--shadow-sm), 0 0 0 1px rgba(15, 23, 42, .04); }
.ep-how-ic .ic { width: 20px; height: 20px; }
.ep-how-t { display: grid; gap: 3px; padding-top: 2px; }
.ep-how-t b { font: 600 17px/1.3 Outfit, Inter, sans-serif; color: var(--ink); letter-spacing: -.01em; }
.ep-how-t span { font-size: 15px; line-height: 1.55; color: var(--dim); }
.ep-rule { display: flex; gap: 12px; align-items: flex-start; margin-top: 30px; padding: 16px 18px; border-radius: 20px; background: #fff; border: 1px solid var(--line); }
.ep-rule .ic { width: 20px; height: 20px; margin-top: 1px; color: var(--violet-600); }
.ep-rule p { font-size: 14.5px; line-height: 1.55; color: var(--dim); }
.ep-rule b { color: var(--ink); font-weight: 600; }

.ep-card { position: relative; padding: 40px; border-radius: var(--r-3xl); background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-lg); scroll-margin-top: 88px; }
.ep-form-h { font-size: 26px; line-height: 1.2; letter-spacing: -.02em; }
.ep-form-sub { margin-top: 6px; font-size: 15px; color: var(--dim); }
.ep-fs { min-width: 0; margin: 28px 0 0; padding: 26px 0 0; border: 0; border-top: 1px solid var(--line); }
.ep-lg { float: left; width: 100%; display: flex; align-items: center; gap: 10px; padding: 0; margin: 0 0 18px; font: 600 17px/1.3 Outfit, Inter, sans-serif; letter-spacing: -.01em; color: var(--ink); }
.ep-lg-n { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--violet-50); color: var(--violet-600); font: 600 13px Inter, sans-serif; }
.ep-fs > .ep-lg + * { clear: both; }
.ep-form .fld + .fld, .ep-form .cf-2 + .fld { margin-top: 18px; }
.ep-form .cf-2 > .fld + .fld { margin-top: 0; }
.ep-form textarea.fi { min-height: 128px; }
.f-help { margin-top: 7px; font-size: 13px; line-height: 1.45; color: var(--faint); }
.ep-pick { min-width: 0; margin: 20px 0 0; padding: 0; border: 0; }
.ep-pick-lg { display: block; padding: 0; margin-bottom: 10px; font: 600 14px/1.3 Inter, sans-serif; color: var(--text); }
.ep-pick-lg .f-req, .ep-check .f-req { color: var(--violet-600); }
.ep-tiles { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.ep-tile { position: relative; display: grid; justify-items: center; gap: 7px; padding: 12px 4px 10px; border-radius: 16px; border: 1px solid #D6DAE8; background: #fff; cursor: pointer; transition: border-color .2s, box-shadow .2s, background-color .2s, transform .2s var(--ease); }
.ep-tile input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }
.ep-tile:hover { border-color: #C3C8DB; }
.ep-tile:active { transform: scale(.97); }
.ep-tile-ic { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: var(--sp-t); color: var(--sp); transition: background-color .2s, color .2s, transform .35s var(--ease); }
.ep-tile-ic .ic { width: 19px; height: 19px; }
.ep-tile-t { font: 500 13px/1.2 Inter, sans-serif; color: var(--text); text-align: center; }
.ep-tile:has(input:checked) { border-color: var(--sp); background: color-mix(in srgb, var(--sp) 5%, #fff); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sp) 16%, transparent); }
.ep-tile:has(input:checked) .ep-tile-ic { background: var(--sp); color: #fff; transform: scale(1.06); }
.ep-tile:has(input:checked) .ep-tile-t { font-weight: 600; color: var(--ink); }
.ep-tile:has(input:focus-visible) { outline: 3px solid var(--violet-600); outline-offset: 2px; }
.ep-pick[aria-invalid="true"] .ep-tile { border-color: rgba(225, 29, 72, .45); }
.ep-3 { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); gap: 14px; margin-top: 20px; }
.ep-3 .fld + .fld { margin-top: 0; }
.ep-form input[type="date"].fi, .ep-form input[type="time"].fi { padding-right: 12px; min-width: 0; }
.ep-pinq { position: relative; }
.ep-pinq .fi { padding-left: 42px; }
.ep-pinmap { position: relative; height: 290px; margin-top: 10px; border-radius: 18px; overflow: hidden; border: 1px solid var(--line); background: #EFEBF4; isolation: isolate; }
.ep-pinmap .ep-poster { gap: 0; }
.ep-pinmap.is-set { border-color: rgba(99, 102, 241, .5); box-shadow: 0 0 0 3px rgba(99, 102, 241, .12); }
.ep-pinmap[aria-invalid="true"] { border-color: #E11D48; box-shadow: 0 0 0 4px rgba(225, 29, 72, .1); }
.ep-pin-clear { position: absolute; z-index: 5; right: 10px; top: 10px; display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px 0 9px; border-radius: 999px; background: rgba(255, 255, 255, .94); box-shadow: var(--shadow-sm); font: 600 13px Inter, sans-serif; color: var(--text); }
.ep-pin-clear .ic { width: 14px; height: 14px; }
.ep-pin-clear[hidden] { display: none; }
.ep-pin-hint.is-ok { color: #047857; }
.ep-city { max-width: 360px; }
.ep-cost { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; }
.ep-opt { position: relative; cursor: pointer; }
.ep-opt input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.ep-opt > span { position: relative; display: grid; gap: 2px; height: 100%; padding: 14px 16px 14px 48px; border-radius: 16px; border: 1px solid #D6DAE8; background: #fff; transition: border-color .2s, box-shadow .2s, background-color .2s; }
.ep-opt > span::before { content: ""; position: absolute; left: 16px; top: 16px; width: 20px; height: 20px; border-radius: 50%; border: 1.5px solid #BFC5D6; background: #fff; transition: border-color .2s, box-shadow .2s; }
.ep-opt b { font-weight: 600; font-size: 15px; color: var(--ink); }
.ep-opt small { font-size: 13px; color: var(--dim); }
.ep-opt:hover > span { border-color: #C3C8DB; }
.ep-opt input:checked + span { border-color: var(--violet); background: #FAFAFF; box-shadow: 0 0 0 3px rgba(99, 102, 241, .12); }
.ep-opt input:checked + span::before { border-color: var(--violet); box-shadow: inset 0 0 0 5px var(--violet); }
.ep-opt input:focus-visible + span { outline: 3px solid var(--violet-600); outline-offset: 2px; }
.ep-amount { margin-top: 16px; }
.ep-amount[hidden] { display: none; }
.ep-money { display: flex; gap: 10px; max-width: 320px; }
.ep-money > .fi { flex: 1 1 auto; min-width: 0; font-variant-numeric: tabular-nums; }
.ep-cur { flex: none; width: 104px; }
.ep-level { max-width: 320px; margin-top: 18px; }
.ep-desc-help { display: flex; justify-content: space-between; gap: 12px; }
.ep-desc-help .is-near { color: #B45309; font-weight: 600; }
.ep-prev { margin-top: 28px; padding: 14px 14px 12px; border-radius: 22px; background: var(--mist); border: 1px dashed #D3D7E5; }
.ep-prev-k { display: flex; align-items: center; gap: 7px; margin: 0 4px 8px; font: 600 12px Inter, sans-serif; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
.ep-prev-k .ic { width: 14px; height: 14px; }
.ep-prev-card .ep-item { background: #fff; box-shadow: var(--shadow-sm); }
.ep-prev-card .is-ph { color: #A6ADBF; }
.ep-consent { margin-top: 24px; }
.ep-check { position: relative; display: flex; align-items: flex-start; gap: 12px; cursor: pointer; font-size: 15px; line-height: 1.5; color: var(--text); }
.ep-check input { position: absolute; left: 0; top: 0; width: 24px; height: 24px; opacity: 0; margin: 0; cursor: pointer; }
.ep-check-box { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 7px; border: 1.5px solid #BFC5D6; background: #fff; transition: background-color .2s, border-color .2s; }
.ep-check-box .ic { width: 14px; height: 14px; color: #fff; opacity: 0; transform: scale(.5); transition: opacity .2s, transform .3s var(--ease); }
.ep-check input:checked + .ep-check-box { background: var(--violet); border-color: var(--violet); }
.ep-check input:checked + .ep-check-box .ic { opacity: 1; transform: none; }
.ep-check input:focus-visible + .ep-check-box { outline: 3px solid var(--violet-600); outline-offset: 2px; }
.ep-check input[aria-invalid="true"] + .ep-check-box { border-color: #E11D48; box-shadow: 0 0 0 4px rgba(225, 29, 72, .1); }
.ep-form .cf-foot { margin-top: 26px; }
.ep-form .f-msg .btn { margin-top: 12px; text-decoration: none; color: #fff; }

/* after sending: the next steps */
.ep-done { display: grid; gap: 18px; outline: none; animation: ep-up .5s var(--ease); }
.ep-done[hidden] { display: none; }
.ep-done-ic { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 18px; color: #fff; background: var(--aurora); box-shadow: 0 14px 30px rgba(124, 58, 237, .3); }
.ep-done-ic.is-mail { background: var(--emerald); box-shadow: 0 14px 30px rgba(16, 185, 129, .3); }
.ep-done-ic .ic { width: 26px; height: 26px; }
.ep-done h3 { font-size: 26px; line-height: 1.2; letter-spacing: -.02em; }
.ep-done > p { font-size: 16px; line-height: 1.6; color: var(--dim); max-width: 560px; }
.ep-done > p b { color: var(--ink); overflow-wrap: anywhere; }
.ep-track { list-style: none; margin: 4px 0 0; padding: 0; display: grid; gap: 0; }
.ep-track li { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 14px; padding: 0 0 18px; }
.ep-track li:not(:last-child)::after { content: ""; position: absolute; left: 15px; top: 34px; bottom: 2px; width: 2px; border-radius: 2px; background: var(--line); }
.ep-track li.is-done:not(:last-child)::after { background: var(--emerald); }
.ep-track i { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--mist); color: var(--faint); font: 600 13px Inter, sans-serif; font-style: normal; }
.ep-track .is-done i { background: var(--emerald); color: #fff; }
.ep-track .is-now i { background: var(--violet); color: #fff; box-shadow: 0 0 0 5px rgba(99, 102, 241, .16); }
.ep-track i .ic { width: 15px; height: 15px; }
.ep-track b { display: block; padding-top: 5px; font-weight: 600; font-size: 15.5px; color: var(--ink); }
.ep-track span { font-size: 14px; line-height: 1.5; color: var(--dim); }
.ep-done-go { display: flex; flex-wrap: wrap; gap: 10px; }
.ep-done-go .btn .ic { width: 17px; height: 17px; }
.ep-done-note { padding: 14px 16px; border-radius: 16px; background: #FFFBEB; border: 1px solid #FDE68A; color: #78350F; font-size: 14.5px; line-height: 1.55; }

/* the account card */
.ep-acct { margin-top: 56px; grid-template-columns: minmax(0, 1fr) minmax(280px, 340px); align-items: center; padding: 56px 60px; }
.ep-acct-h { color: #fff; font-size: clamp(30px, 3.6vw, 46px); line-height: 1.05; letter-spacing: -.035em; margin-top: 14px; max-width: 640px; text-wrap: balance; }
.ep-acct-h .grad { display: inline-block; }
.ep-acct-list { list-style: none; margin: 26px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 28px; }
.ep-acct-list li { display: flex; gap: 10px; align-items: flex-start; font-size: 16px; line-height: 1.45; color: rgba(255, 255, 255, .86); }
.ep-acct-list .ic { width: 18px; height: 18px; margin-top: 2px; color: #6EE7B7; }
.ep-acct-go { display: grid; gap: 10px; }
.ep-acct-go .btn { width: 100%; }
.ep-acct-go .btn .ic { width: 17px; height: 17px; transition: transform .25s var(--ease); }
.ep-acct-go .btn:hover .ic { transform: translateX(3px); }
.ep-acct-note { margin-top: 4px; font-size: 13px; line-height: 1.5; color: rgba(255, 255, 255, .6); }

.ep-faq { padding: 104px 0 8px; }
.ep-faq .cp-faq { margin-top: 0; }
.ep-nojs { margin: 16px 0; padding: 16px 18px; border-radius: 16px; background: #FFF6E5; color: #92400E; font-size: 15px; line-height: 1.55; }

/* ------------------------------------------------------------ tablets */
@media (max-width: 1180px) {
  .ep-body { grid-template-columns: 360px minmax(0, 1fr); }
  .ep-seg { margin-left: 0; }
  .ep-search { max-width: none; }
  .ep-add-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .ep-side { position: static; display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 20px 32px; align-items: start; }
  .ep-how { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 24px; }
  .ep-how li:not(:last-child)::after { display: none; }
  .ep-rule { margin-top: 0; }
  .ep-acct { grid-template-columns: minmax(0, 1fr); padding: 48px 44px; }
  .ep-acct-go { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ep-acct-note { grid-column: 1 / -1; }
}
@media (max-width: 1180px) and (min-width: 761px) {
  .ep-bar-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; }
  .ep-search { grid-column: 1; }
  .ep-seg { grid-column: 1 / 3; grid-row: 2; justify-self: start; }
  .ep-free { grid-column: 3; grid-row: 2; justify-self: end; }
}
@media (max-width: 900px) {
  .ep-side { grid-template-columns: minmax(0, 1fr); }
}

/* ------------------------------------------------------------ phones: the map, and the list as a sheet over it */
@media (max-width: 760px) {
  .t-events .ep-hero { padding: 108px 0 30px; }
  .ep-go { justify-content: flex-start; margin-top: 24px; }
  .ep-go .btn { flex: 1 1 auto; }
  .ep-facts { justify-content: flex-start; gap: 6px 16px; font-size: 13.5px; }
  .ep-find { padding-top: 0; scroll-margin-top: 68px; }
  .ep-wrap { padding: 0 8px; }
  .ep-app { height: auto; border-radius: 26px; }
  .ep-bar { padding: 12px 12px 10px; gap: 10px; }
  .ep-bar-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
  .ep-search { grid-column: 1; }
  .ep-near { width: 44px; padding: 0; justify-content: center; }
  .ep-near span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .ep-seg { grid-column: 1 / -1; margin: 0; display: grid; grid-template-columns: repeat(4, auto); }
  .ep-seg span { justify-content: center; padding: 0 6px; font-size: 13.5px; height: 34px; }
  .ep-free { display: none; }
  .ep-chipwrap { margin: 0 -12px; }
  .ep-chips { padding: 2px 12px; scroll-padding-inline: 12px; }
  .ep-chip { height: 36px; font-size: 13.5px; }
  .ep-chip-ic { width: 26px; height: 26px; }
  .ep-chips .ep-free-m { display: inline-flex; }
  .ep-body { display: block; height: clamp(460px, calc(100svh - 236px), 680px); overflow: hidden; }
  .ep-map { position: absolute; inset: 0; }
  .ep-map .maplibregl-ctrl-bottom-right { display: none; }
  .ep-map-tag { display: none !important; }
  .ep-d-cover { aspect-ratio: 2.3 / 1; border-radius: 18px; }
  .ep-d-foot .ep-d-note { display: none; }
  .ep-d-note-m { display: flex; justify-content: flex-start; text-align: left; margin-top: 16px; }
  .ep-d-foot { padding: 10px 16px 12px; }
  .ep-d-h { margin-top: 14px; }
  .ep-reset { top: 46px; }
  .ep-panel { position: absolute; left: 0; right: 0; bottom: 0; top: 0; border-right: 0; border-radius: 22px 22px 0 0; box-shadow: 0 -1px 0 rgba(15, 23, 42, .06), 0 -12px 32px rgba(15, 23, 42, .14); transform: translate3d(0, var(--sheet-y, 60%), 0); transition: transform .5s var(--cm-ease, var(--ease)); will-change: transform; }
  .ep-panel.is-drag { transition: none; }
  .ep-grab { padding: 20px 16px 10px; touch-action: none; cursor: grab; }
  .ep-handle { display: block; position: absolute; left: 50%; top: 0; width: 88px; height: 26px; margin-left: -44px; border-radius: 0 0 12px 12px; }
  .ep-handle::before { content: ""; position: absolute; left: 50%; top: 9px; width: 40px; height: 5px; margin-left: -20px; border-radius: 3px; background: #D3D7E2; transition: background-color .2s; }
  .ep-handle:hover::before { background: #B9BFCF; }
  .ep-count { font-size: 17px; }
  .ep-scroll { padding: 0 6px calc(var(--sheet-y, 0px) + 16px); }
  .ep-detail { border-radius: 22px 22px 0 0; }
  .ep-d-bar { padding-top: 16px; touch-action: none; }
  .ep-d-scroll { padding-bottom: 12px; }
  .ep-d-foot { margin-bottom: var(--sheet-y, 0px); }
  .ep-item { grid-template-columns: 68px minmax(0, 1fr); gap: 12px; padding: 9px 8px; }
  .ep-thumb { width: 68px; height: 68px; border-radius: 14px; }
  .ep-it-h { font-size: 15.5px; }
  .ep-d-h { font-size: 23px; }

  .ep-add { padding: 88px 0 80px; margin-top: 48px; }
  .ep-add-head { margin-bottom: 36px; }
  .ep-side { display: block; }
  .ep-how { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .ep-rule { margin-top: 24px; }
  .ep-card { padding: 26px 18px; border-radius: 28px; margin: 0 -8px; }
  .ep-form-h { font-size: 23px; }
  .ep-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ep-tile { grid-template-columns: auto minmax(0, 1fr); justify-items: start; align-items: center; gap: 10px; padding: 8px 10px 8px 8px; border-radius: 14px; }
  .ep-tile-ic { width: 34px; height: 34px; }
  .ep-tile-ic .ic { width: 17px; height: 17px; }
  .ep-tile-t { text-align: left; font-size: 14px; }
  .ep-3 { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .ep-3 .fld:first-child { grid-column: 1 / -1; }
  .ep-pinmap { height: 250px; }
  .ep-cost { grid-template-columns: minmax(0, 1fr); }
  .ep-money, .ep-level, .ep-city { max-width: none; }
  .ep-acct { padding: 40px 24px 28px; margin: 40px -8px 0; border-radius: 28px; }
  .ep-acct-list { grid-template-columns: minmax(0, 1fr); }
  .ep-acct-go { grid-template-columns: minmax(0, 1fr); }
  .ep-faq { padding-top: 80px; }
}
@media (min-width: 761px) { .ep-chips .ep-free-m { display: none; } }
@media (max-width: 380px) {
  .ep-seg span { font-size: 12.5px; padding: 0 4px; }
}

@media (prefers-reduced-motion: reduce) {
  .ep-panel, .ep-detail, .ep-pin-in, .ep-reset { animation: none !important; transition: none !important; }
  .ep-live::before, .ep-me::before, .ep-poster-dot { animation: none !important; }
}
@media (forced-colors: active) {
  .ep-chip[aria-pressed="true"], .ep-seg input:checked + span, .ep-free[aria-pressed="true"] { forced-color-adjust: none; background: Highlight; color: HighlightText; }
  .ep-app, .ep-card, .ep-item { border: 1px solid CanvasText; }
}
/* a real event without a join page (join_url null): a quiet walk in note instead of the button */
.ep-d-walkin { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--dim); }
.ep-d-walkin svg { width: 18px; height: 18px; flex: none; color: var(--violet-600); }