/* Страница события (/events/:id). Разметка — src/web-event.ts, поведение — event-page.js.
   Первый экран: текст слева, обложка фоном справа с градиентным переходом в фон страницы. */
/* Ширина body без скроллбара: фото тянется ровно до правого края окна, без горизонтальной прокрутки. */
body:has(.evp){container-type:inline-size}
.event-page:has(.evp){padding-bottom:72px}
.event-page:has(.evp) .breadcrumbs{position:relative;z-index:2;padding-block:22px 0}

.evp{--evp-radius:24px;--evp-fade:var(--bg)}
.evp .icon{width:18px;height:18px;flex:none}

/* ── Первый экран ─────────────────────────────────────── */
.evp-hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:clamp(540px,calc(100svh - 170px),760px);margin-top:-48px;padding-top:48px}
.evp-hero-media{position:absolute;z-index:-1;top:12px;bottom:0;left:40%;right:calc(50% - 50cqw);overflow:hidden}
.evp-hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 30%;animation:evp-zoom 1.2s cubic-bezier(.2,.7,.2,1) both}
.evp-hero-media::before,.evp-hero-media::after{content:"";position:absolute;z-index:1;inset:0;pointer-events:none}
.evp-hero-media::before{left:-1px;background:linear-gradient(90deg,var(--evp-fade) 0 3px,color-mix(in srgb,var(--evp-fade) 88%,transparent) 14%,color-mix(in srgb,var(--evp-fade) 45%,transparent) 36%,transparent 62%)}
.evp-hero-media::after{background:linear-gradient(0deg,var(--evp-fade) 0%,transparent 26%),linear-gradient(180deg,var(--evp-fade) 0%,transparent 16%),radial-gradient(ellipse at 100% 0%,#c699ff26,transparent 55%)}
.evp-hero-copy{position:relative;display:flex;flex-direction:column;gap:20px;width:min(620px,54%);padding:28px 0 64px;min-width:0}

.evp-tags{display:flex;flex-wrap:wrap;gap:8px}
.evp-tag{display:inline-flex;align-items:center;min-height:32px;padding:6px 13px;border-radius:999px;background:#ffffff14;backdrop-filter:blur(6px);color:var(--text);font-size:13px;font-weight:700;line-height:1.2;max-width:100%;overflow-wrap:anywhere}
.evp-tag.is-main{background:var(--purple);color:var(--bg);transform:rotate(-2deg)}
.evp-tag.is-main:hover{background:var(--text)}
.evp-tag.is-age{border:1px solid #ffffff40;background:transparent}

.evp-hero h1{margin:0;font-size:clamp(36px,4.6vw,72px);line-height:1.02;letter-spacing:-.035em;font-weight:800;overflow-wrap:anywhere;text-wrap:balance}
.evp-past{margin:0;color:var(--purple);font-size:16px;font-weight:700}

.evp-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 28px;margin:4px 0 0;padding:20px 0;border-block:1px solid #ffffff1f}
.evp-fact{min-width:0}
.evp-fact dt{margin-bottom:4px;color:var(--muted);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.evp-fact dd{margin:0;font-size:17px;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.evp-fact dd small{display:block;margin-top:2px;color:var(--muted);font-size:14px;font-weight:500}
.evp-price{color:var(--purple)}

.evp-actions{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.evp-actions-row{display:flex;gap:4px}
.evp-btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:54px;padding:0 24px;border:0;border-radius:999px;font:inherit;font-size:16px;font-weight:800;line-height:1;cursor:pointer;white-space:nowrap;transition:transform .18s,background-color .18s,color .18s,box-shadow .18s}
.evp-btn:active{transform:scale(.97)}
.evp-btn:focus-visible,.evp-read-more:focus-visible,.evp-link:focus-visible,.evp-session-buy:focus-visible{outline:2px solid var(--purple);outline-offset:3px}
.evp-btn-primary{background:var(--purple);color:var(--bg);box-shadow:0 10px 30px -12px #c699ffaa}
.evp-btn-primary:hover{background:var(--text);transform:translateY(-1px)}
.evp-btn-primary .icon{transition:transform .18s}.evp-btn-primary:hover .icon{transform:translateX(3px)}
.evp-btn-ghost{background:#ffffff14;color:var(--text);backdrop-filter:blur(6px)}
.evp-btn-ghost:hover{background:#ffffff26}
.evp-like[aria-pressed=true]{background:color-mix(in srgb,var(--purple) 22%,transparent);color:var(--purple)}
.evp-like[aria-pressed=true] .icon{fill:currentColor}
.evp-btn-icon{min-height:48px;padding:0 14px;background:transparent;color:var(--text);font-weight:700;font-size:15px}
.evp-btn-icon:hover{color:var(--purple)}
.evp-pin{width:14px;height:14px;border:2px solid currentColor;border-radius:50% 50% 50% 0;transform:rotate(-45deg) translate(1px,-1px);flex:none}

/* ── Тело страницы ────────────────────────────────────── */
.evp-body{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:start;margin-top:8px}
.evp-main{display:grid;gap:24px;min-width:0}
.evp-card{background:var(--panel);border-radius:var(--evp-radius);padding:32px;min-width:0}
.evp-card h2{margin:0 0 18px;font-size:clamp(22px,2vw,28px);letter-spacing:-.02em;line-height:1.15}
.evp-empty-note{margin:0;color:var(--muted);font-size:16px;line-height:1.55}

.evp-desc{position:relative;font-size:17px;line-height:1.65;color:#e6e6e6;overflow-wrap:anywhere}
.evp-desc p{margin:0 0 .9em}.evp-desc p:last-child{margin-bottom:0}
.evp-desc.is-clamped{max-height:calc(1.65em * 7);overflow:hidden}
.evp-desc.is-clamped::after{content:"";position:absolute;inset:auto 0 0;height:3.3em;background:linear-gradient(0deg,var(--panel),transparent)}
.evp-read-more{margin-top:14px;padding:10px 0;border:0;background:none;color:var(--purple);font:inherit;font-size:16px;font-weight:800;cursor:pointer}
.evp-read-more:hover{text-decoration:underline;text-underline-offset:4px}

.evp-days{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.evp-day{display:grid;grid-template-columns:64px minmax(0,1fr);gap:16px;align-items:start;padding:14px;border-radius:18px;background:#ffffff08}
.evp-day-date{display:grid;justify-items:center;align-content:start;padding:8px 0;border-radius:14px;background:var(--bg);line-height:1.1}
.evp-day-date strong{font-size:26px;font-weight:800}
.evp-day-date span{font-size:13px;font-weight:700;color:var(--purple)}
.evp-day-date small{margin-top:2px;font-size:12px;color:var(--muted)}
.evp-sessions{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.evp-session{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;min-height:52px}
.evp-session+.evp-session{padding-top:8px;border-top:1px solid #ffffff12}
.evp-session-time{font-size:20px;font-weight:800;font-variant-numeric:tabular-nums}
.evp-session-time.is-unknown{font-size:14px;font-weight:700;color:var(--muted)}
.evp-session-place{font-size:16px;font-weight:700;min-width:0;overflow-wrap:anywhere}
.evp-session-place small{display:block;color:var(--muted);font-size:14px;font-weight:500}
.evp-session-buy{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid var(--line);font-size:14px;font-weight:800;white-space:nowrap;transition:border-color .18s,color .18s}
.evp-session-buy:hover{border-color:var(--purple);color:var(--purple)}
.evp-more-days{margin-top:10px}
.evp-more-days summary{cursor:pointer;color:var(--purple);font-size:16px;font-weight:800;padding:10px 0;list-style:none}
.evp-more-days summary::-webkit-details-marker{display:none}
.evp-more-days summary::after{content:" ↓"}.evp-more-days[open] summary::after{content:" ↑"}

.evp-place{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 20px;margin-top:18px;padding-top:18px;border-top:1px solid #ffffff14}
.evp-place strong{display:block;font-size:17px}
.evp-place span{display:block;margin-top:2px;color:var(--muted);font-size:15px}
.evp-link{display:inline-flex;align-items:center;gap:6px;color:var(--purple);font-size:16px;font-weight:800}
.evp-link:hover{text-decoration:underline;text-underline-offset:4px}

/* Билет: карточка с надсечками — чуть-чуть настоящего билета в интерфейсе. */
.evp-side{position:sticky;top:24px;min-width:0}
.evp-ticket{position:relative;display:grid;gap:14px;background:radial-gradient(circle at 0 132px,var(--bg) 13px,transparent 14px),radial-gradient(circle at 100% 132px,var(--bg) 13px,transparent 14px),linear-gradient(160deg,color-mix(in srgb,var(--purple) 14%,var(--panel)),var(--panel) 55%)}
.evp-ticket::before{content:"";position:absolute;left:24px;right:24px;top:132px;border-top:2px dashed #ffffff1f}
.evp-ticket-label{margin:0;color:var(--muted);font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.evp-ticket-price{margin:0 0 30px;font-size:32px;font-weight:800;letter-spacing:-.02em;line-height:1.1;overflow-wrap:anywhere}
.evp-ticket .evp-btn-primary{width:100%;margin-top:10px}
.evp-ticket-meta{display:grid;gap:10px;margin:6px 0 0}
.evp-ticket-meta div{display:flex;justify-content:space-between;gap:12px;font-size:15px}
.evp-ticket-meta dt{color:var(--muted)}
.evp-ticket-meta dd{margin:0;font-weight:700;text-align:right;overflow-wrap:anywhere;min-width:0}
.evp-ticket-note{margin:0;color:var(--muted);font-size:13px;line-height:1.5}

.evp-sticky{display:none}
.evp-toast-link{color:inherit;font-weight:800;text-decoration:underline;text-underline-offset:3px}

@keyframes evp-zoom{from{transform:scale(1.06);opacity:.4}to{transform:none;opacity:1}}

/* ── Планшет ──────────────────────────────────────────── */
@media(max-width:1100px){
 .evp-hero-media{left:30%}
 .evp-hero-copy{width:min(600px,64%)}
 .evp-body{grid-template-columns:minmax(0,1fr) 300px}
 .evp-card{padding:26px}
 .evp-ticket{background:radial-gradient(circle at 0 126px,var(--bg) 13px,transparent 14px),radial-gradient(circle at 100% 126px,var(--bg) 13px,transparent 14px),linear-gradient(160deg,color-mix(in srgb,var(--purple) 14%,var(--panel)),var(--panel) 55%)}
 .evp-ticket::before{top:126px}
}
@media(max-width:900px){
 .evp-hero{min-height:clamp(520px,80svh,680px)}
 .evp-hero-media{left:22%}
 .evp-hero-media::before{background:linear-gradient(90deg,var(--evp-fade) 0%,color-mix(in srgb,var(--evp-fade) 85%,transparent) 30%,color-mix(in srgb,var(--evp-fade) 40%,transparent) 60%,transparent 90%)}
 .evp-hero-copy{width:min(560px,78%)}
 .evp-body{grid-template-columns:1fr}
 .evp-side{position:static;order:-1}
 .evp-ticket{background:linear-gradient(160deg,color-mix(in srgb,var(--purple) 14%,var(--panel)),var(--panel) 55%)}
 .evp-ticket::before{display:none}
 .evp-ticket-price{margin-bottom:0}
}

/* ── Телефон: фото сверху, текст под ним, липкая панель снизу ── */
@media(max-width:760px){
 .event-page:has(.evp){padding-bottom:110px}
 .event-page:has(.evp) .breadcrumbs{display:none}
 .evp-hero{display:block;min-height:0;margin-top:0;padding-top:0}
 .evp-hero-media{position:relative;inset:auto;z-index:0;height:min(64svh,440px);margin-inline:-18px}
 .evp-hero-media::before{background:linear-gradient(0deg,var(--evp-fade) 0%,color-mix(in srgb,var(--evp-fade) 60%,transparent) 22%,transparent 55%)}
 .evp-hero-media::after{background:radial-gradient(ellipse at 100% 0%,#c699ff26,transparent 60%)}
 .evp-hero-copy{width:auto;gap:16px;margin-top:-96px;padding:0 0 28px;z-index:1}
 .evp-hero h1{font-size:clamp(30px,9vw,40px)}
 .evp-facts{gap:14px 18px;padding:16px 0}
 .evp-fact dd{font-size:16px}
 .evp-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .evp-actions>.evp-btn-primary{grid-column:1/-1}
 .evp-actions-row{grid-column:1/-1;justify-content:flex-start;margin-left:-14px}
 .evp-hero .evp-actions>.evp-btn-primary{display:none}
 .evp-actions>.evp-like{grid-column:1/-1}
 .evp-card{padding:22px 18px;border-radius:20px}
 .evp-desc{font-size:16px}
 .evp-day{grid-template-columns:52px minmax(0,1fr);gap:12px;padding:12px}
 .evp-day-date strong{font-size:22px}
 .evp-session{grid-template-columns:auto minmax(0,1fr);gap:4px 12px}
 .evp-session-buy{grid-column:1/-1;justify-self:start}
 .evp-ticket .evp-btn-primary{display:none}
 .evp-side{order:0}
 .evp-sticky{position:fixed;z-index:30;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 10px 10px 20px;border-radius:999px;background:color-mix(in srgb,var(--panel) 88%,transparent);backdrop-filter:blur(14px);box-shadow:0 12px 40px -10px #000c,0 0 0 1px #ffffff14}
 .evp-sticky>div{display:grid;min-width:0}
 .evp-sticky span{font-size:16px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .evp-sticky small{color:var(--muted);font-size:12px}
 .evp-sticky .evp-btn{min-height:48px;padding:0 20px;flex:none}
 body:has(.evp-sticky) #toast{bottom:calc(88px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){.evp-hero-media img{animation:none}.evp-btn,.evp-btn .icon{transition:none}}
.evp-notes{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:0}
.evp-notes li{padding:7px 13px;border-radius:999px;background:#ffffff0d;color:#e6e6e6;font-size:14px;font-weight:700}