/* ══════════════════════════════════════════════════════════════════════════
   AI EVENTS — public kit  (.evp-)
   Loaded by resources/views/livewire/public/events/_kit.blade.php

   ⚠ THIS SHEET IS DETAIL / TRANSACTIONAL ONLY SINCE 2026-08-14.
     /events, its six quick-filter landings, /events/category|tag|type|
     format|location|organizer and /events/categories were rebuilt on
     /ai-directory's LIVE stylesheet (.v2x.dir.evx). A LISTING rule added
     here now does NOTHING — put it in assets/css/ext/public-events.css.
     The listing-only kit (.evp-eyebrow/-quick/-chip/-stats/-stat*/
     -sec-head/-sec-title/-sec-sub/-sec-cta/-tax*/-filters/-clear/
     -result-count/-search-btn/-rail/-grid-3/-grad + the dead -tone-*)
     was deleted in that pass: 38 rules, 41 selectors, 5.5KB.
     What STAYED is what the other nine public surfaces still render —
     .evp-card* is one of them, because _card.blade.php is included by
     the DETAIL page, the speaker profile and /my-events.

   ── RULES THIS FILE FOLLOWS, each one a bug that has shipped here before ──
   1. Every token is namespaced --ev-*. A bare --green / --ink inherits some
      other module's greyscale and the whole kit goes monochrome.
   2. Every *-ink token has a DARK TWIN. A missing twin is the "text is
      hidden" report — the text is there, it is just the same colour as its
      background.
   3. Hover lifts/tints live inside @media (hover:hover). Without it :hover
      LATCHES after a tap on touch, so two tapped cards both look selected.
      :active gives touch its own press feedback.
   4. Grids use minmax(min(N,100%),1fr). A bare minmax min is a HARD FLOOR and
      forces sideways scroll on a 360px phone.
   5. Grid/flex children get min-width:0, or long titles refuse to shrink and
      clip out of their column.
   6. Colour is never the only signal — every state chip carries an icon and
      text as well as a hue (WCAG 1.4.1).
   7. WCAG 2.2: interactive targets are >= 24x24 (2.5.8), the sticky panel
      never covers a focused element (2.4.11, via scroll-margin).
   ══════════════════════════════════════════════════════════════════════════ */

.evp {
  /* Surface */
  --ev-bg:            #ffffff;
  --ev-bg-soft:       #f7f9fc;
  --ev-panel:         #ffffff;
  --ev-panel-2:       #f9fafb;
  --ev-border:        #e5e9f0;
  --ev-border-strong: #d3dae6;

  /* Ink — every one of these has a dark twin below */
  --ev-ink:        #0f172a;
  --ev-ink-2:      #334155;
  --ev-ink-3:      #64748b;
  --ev-ink-muted:  #667085;   /* 4.97:1 on panel — was #94a3b8 at 2.56:1 */
  --ev-ink-invert: #ffffff;

  /* Brand */
  --ev-brand:      #2563eb;
  --ev-brand-2:    #4f46e5;
  --ev-brand-ink:  #1d4ed8;
  --ev-brand-soft: #eff6ff;

  /* Semantic tones */
  --ev-live:        #e11d48;
  --ev-live-soft:   #fff1f2;
  --ev-live-ink:    #be123c;
  --ev-free:        #059669;
  --ev-free-soft:   #ecfdf5;
  --ev-free-ink:    #047857;
  --ev-warn:        #d97706;
  --ev-warn-soft:   #fffbeb;
  --ev-warn-ink:    #b45309;
  --ev-cancel:      #dc2626;
  --ev-cancel-soft: #fef2f2;
  --ev-cancel-ink:  #b91c1c;
  --ev-info:        #0891b2;
  --ev-info-soft:   #ecfeff;
  --ev-info-ink:    #0e7490;

  --ev-radius:    16px;
  --ev-radius-sm: 10px;
  --ev-shadow:    0 1px 2px rgba(15,23,42,.04), 0 8px 24px rgba(15,23,42,.06);
  --ev-shadow-lg: 0 2px 4px rgba(15,23,42,.05), 0 18px 48px rgba(15,23,42,.10);
  --ev-ring:      0 0 0 3px rgba(37,99,235,.28);

  color: var(--ev-ink);
}

/* ── Dark twins. Rule 2. The site sets body.theme-dark; we also honour the
      OS preference when the site has expressed no explicit choice. ─────── */
body.theme-dark .evp,
.evp[data-theme="dark"] {
  --ev-bg:            #0b1220;
  --ev-bg-soft:       #0f172a;
  --ev-panel:         #111a2e;
  --ev-panel-2:       #16203a;
  --ev-border:        #1e293b;
  --ev-border-strong: #334155;

  --ev-ink:        #e8eefc;
  --ev-ink-2:      #c2cde3;
  --ev-ink-3:      #93a1bb;
  --ev-ink-muted:  #8b99b5;   /* 6.05:1 on dark panel — was #6b7a97 at 4.01:1 */
  --ev-ink-invert: #0b1220;

  --ev-brand:      #60a5fa;
  --ev-brand-2:    #818cf8;
  --ev-brand-ink:  #93c5fd;
  --ev-brand-soft: #16233d;

  --ev-live-soft:   #2a1220;
  --ev-live-ink:    #fda4af;
  --ev-free-soft:   #0d2a20;
  --ev-free-ink:    #6ee7b7;
  --ev-warn-soft:   #2a1f0b;
  --ev-warn-ink:    #fcd34d;
  --ev-cancel-soft: #2b1414;
  --ev-cancel-ink:  #fca5a5;
  --ev-info-soft:   #0a2530;
  --ev-info-ink:    #67e8f9;

  --ev-shadow:    0 1px 2px rgba(0,0,0,.4), 0 8px 24px rgba(0,0,0,.34);
  --ev-shadow-lg: 0 2px 4px rgba(0,0,0,.45), 0 18px 48px rgba(0,0,0,.5);
}

@media (prefers-color-scheme: dark) {
  body:not(.theme-light) .evp { color-scheme: dark; }
}

/* `.sr-only` is defined in fontawesome.min.css on this build, NOT in the main
   stylesheet — so screen-reader text would silently depend on an icon library
   being loaded. Declared locally. */
.evp .sr-only {
  position: absolute !important; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}

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

.evp a { color: inherit; text-decoration: none; }
.evp a:hover { text-decoration: none; }

/* Visible focus everywhere. WCAG 2.4.7 + 2.4.11: scroll-margin keeps a focused
   element clear of the sticky header/registration panel when tabbed to. */
.evp :focus-visible {
  outline: 2px solid var(--ev-brand);
  outline-offset: 2px;
  border-radius: 6px;
  scroll-margin-top: 96px;
  scroll-margin-bottom: 120px;
}

.evp-wrap { max-width: var(--seo-shell-max, 1600px); margin: 0 auto; padding-block: 0; padding-left: max(var(--seo-shell-pad, 24px), env(safe-area-inset-left)); padding-right: max(var(--seo-shell-pad, 24px), env(safe-area-inset-right)); }

/* ══════════════ HERO ══════════════ */

.evp-hero {
  position: relative;
  padding: 56px 0 32px;
  background:
    radial-gradient(1200px 380px at 12% -10%, rgba(37,99,235,.13), transparent 60%),
    radial-gradient(900px 320px at 88% 0%, rgba(79,70,229,.11), transparent 60%),
    var(--ev-bg);
  overflow: hidden;
}
body.theme-dark .evp-hero {
  background:
    radial-gradient(1200px 380px at 12% -10%, rgba(37,99,235,.20), transparent 60%),
    radial-gradient(900px 320px at 88% 0%, rgba(79,70,229,.16), transparent 60%),
    var(--ev-bg);
}

.evp-hero-inner { position: relative; z-index: 1; }

.evp-h1 {
  margin: 0 0 14px;
  font-size: clamp(30px, 4.6vw, 50px);
  line-height: 1.08; font-weight: 800; letter-spacing: -.022em;
  color: var(--ev-ink);
}

.evp-sub {
  margin: 0 0 26px; max-width: 760px;
  font-size: clamp(15px, 1.6vw, 18px); line-height: 1.65;
  color: var(--ev-ink-3);
}

/* ── Search ─────────────────────────────────────────────────────────── */

.evp-search {
  display: flex; align-items: center; gap: 10px;
  background: var(--ev-panel);
  border: 1px solid var(--ev-border-strong);
  border-radius: 999px;
  padding: 8px 8px 8px 20px;
  box-shadow: var(--ev-shadow);
  max-width: 720px;
}
.evp-search:focus-within { box-shadow: var(--ev-shadow), var(--ev-ring); border-color: var(--ev-brand); }

.evp-search i { color: var(--ev-ink-muted); font-size: 15px; flex: none; }

.evp-search input {
  flex: 1 1 auto; min-width: 0;          /* rule 5 */
  border: 0; outline: 0; background: transparent;
  font-size: 15px; color: var(--ev-ink); padding: 10px 0;
}
.evp-search input::placeholder { color: var(--ev-ink-muted); }

/* ── Quick filters ──────────────────────────────────────────────────── */

/* ── Stat cards ─────────────────────────────────────────────────────── */

/* ══════════════ SECTIONS ══════════════ */

.evp-section { padding: 40px 0; }
.evp-section + .evp-section { padding-top: 8px; }

/* ══════════════ EVENT CARD ══════════════ */

.evp-grid {
  display: grid; gap: 18px;
  grid-template-columns: repeat(auto-fill, minmax(min(310px, 100%), 1fr));  /* rule 4 */
}

/* Horizontal rail — scrolls rather than squashing. */

.evp-card {
  position: relative; display: flex; flex-direction: column;
  min-width: 0;                            /* rule 5 */
  background: var(--ev-panel);
  border: 1px solid var(--ev-border);
  border-radius: var(--ev-radius);
  overflow: hidden;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
@media (hover: hover) {
  .evp-card:hover { border-color: var(--ev-border-strong); box-shadow: var(--ev-shadow-lg); transform: translateY(-2px); }
}
.evp-card:active { transform: translateY(0); }

/* The whole card is clickable, but the title keeps the real link so screen
   readers and the status bar get a meaningful target. */
.evp-card-link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.evp-card .evp-card-body a:not(.evp-card-link) { position: relative; z-index: 2; }

.evp-card-media {
  position: relative; aspect-ratio: 16 / 9;
  background: linear-gradient(135deg, var(--ev-panel-2), var(--ev-bg-soft));
  overflow: hidden;
}
.evp-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.evp-card-fallback {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, color-mix(in srgb, var(--ev-brand) 14%, transparent), color-mix(in srgb, var(--ev-brand-2) 12%, transparent));
  color: var(--ev-brand-ink); font-size: 30px;
}

.evp-card-badges {
  position: absolute; top: 10px; left: 10px; right: 10px; z-index: 2;
  display: flex; gap: 6px; flex-wrap: wrap;
}

.evp-card-body { padding: 15px 16px 16px; display: flex; flex-direction: column; gap: 9px; flex: 1 1 auto; min-width: 0; }

.evp-card-meta {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 12.5px; color: var(--ev-ink-3);
}
.evp-card-meta .evp-dot { width: 3px; height: 3px; border-radius: 50%; background: currentColor; opacity: .5; }

.evp-card-title {
  margin: 0; font-size: 16.5px; line-height: 1.34; font-weight: 700;
  color: var(--ev-ink);
  /* Wrap to two lines rather than ellipsing at one — a clipped event title is
     unreadable, and these titles carry the date and format. */
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (hover: hover) { .evp-card:hover .evp-card-title { color: var(--ev-brand-ink); } }

.evp-card-when {
  display: flex; align-items: center; gap: 8px;
  font-size: 13.5px; font-weight: 600; color: var(--ev-ink-2);
}
.evp-card-when i { color: var(--ev-brand); font-size: 12.5px; }

.evp-card-where {
  display: flex; align-items: center; gap: 8px;
  font-size: 13px; color: var(--ev-ink-3); min-width: 0;
}
.evp-card-where span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }

.evp-card-foot {
  margin-top: auto; padding-top: 12px;
  border-top: 1px solid var(--ev-border);
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
}

.evp-org { display: flex; align-items: center; gap: 8px; min-width: 0; }
.evp-org img { width: 24px; height: 24px; border-radius: 6px; object-fit: cover; flex: none; }
.evp-org-name {
  font-size: 12.5px; color: var(--ev-ink-3); font-weight: 560;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;
}

.evp-price { font-size: 13.5px; font-weight: 700; color: var(--ev-ink); white-space: nowrap; flex: none; }
.evp-price.is-free { color: var(--ev-free-ink); }

/* ══════════════ BADGES / STATE CHIPS ══════════════
   Rule 6 — each carries an ICON and TEXT, never colour alone. */

.evp-badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 4px 9px; border-radius: 7px;
  font-size: 11.5px; font-weight: 700; line-height: 1.4;
  letter-spacing: .01em; white-space: nowrap;
  border: 1px solid transparent;
  backdrop-filter: blur(6px);
}
.evp-badge i { font-size: 10px; }

.evp-badge-live { background: var(--ev-live-soft);   color: var(--ev-live-ink);   border-color: color-mix(in srgb, var(--ev-live) 30%, transparent); }
.evp-badge-free { background: var(--ev-free-soft);   color: var(--ev-free-ink);   border-color: color-mix(in srgb, var(--ev-free) 30%, transparent); }
.evp-badge-soon { background: var(--ev-warn-soft);   color: var(--ev-warn-ink);   border-color: color-mix(in srgb, var(--ev-warn) 30%, transparent); }
.evp-badge-cancel { background: var(--ev-cancel-soft); color: var(--ev-cancel-ink); border-color: color-mix(in srgb, var(--ev-cancel) 32%, transparent); }
.evp-badge-info { background: var(--ev-info-soft);   color: var(--ev-info-ink);   border-color: color-mix(in srgb, var(--ev-info) 30%, transparent); }
.evp-badge-brand { background: var(--ev-brand-soft);  color: var(--ev-brand-ink);  border-color: color-mix(in srgb, var(--ev-brand) 26%, transparent); }
.evp-badge-plain { background: var(--ev-panel-2);     color: var(--ev-ink-3);      border-color: var(--ev-border); }

/* Live pulse, disabled for reduced motion. */
.evp-badge-live .evp-pulse {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--ev-live); animation: evpPulse 1.6s ease-in-out infinite;
}
@keyframes evpPulse { 0%,100% { opacity: 1; transform: scale(1); } 50% { opacity: .45; transform: scale(.8); } }

@media (prefers-reduced-motion: reduce) {
  .evp *,
.evp *::before,
.evp *::after {
    animation-duration: .001ms !important; animation-iteration-count: 1 !important;
    transition-duration: .001ms !important; scroll-behavior: auto !important;
  }
  .evp-badge-live .evp-pulse { animation: none; opacity: 1; }
}

/* ══════════════ EMPTY STATE ══════════════ */

.evp-empty {
  text-align: center; padding: 56px 24px;
  background: var(--ev-panel-2); border: 1px dashed var(--ev-border-strong);
  border-radius: var(--ev-radius); color: var(--ev-ink-3);
}
.evp-empty i { font-size: 30px; color: var(--ev-ink-muted); margin-bottom: 12px; display: block; }
.evp-empty h3 { margin: 0 0 6px; font-size: 17px; color: var(--ev-ink); font-weight: 700; }
.evp-empty p { margin: 0; font-size: 14px; }

/* ══════════════ TAXONOMY TILES ══════════════ */

/* ══════════════ FILTER BAR ══════════════ */

.evp-select {
  min-height: 36px; padding: 7px 30px 7px 12px; border-radius: 9px;
  background: var(--ev-panel-2); color: var(--ev-ink);
  border: 1px solid var(--ev-border); font-size: 13.5px; font-weight: 550;
  appearance: none; cursor: pointer; min-width: 0;
  background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
  background-position: calc(100% - 15px) 50%, calc(100% - 10px) 50%;
  background-size: 5px 5px, 5px 5px; background-repeat: no-repeat;
}
.evp-select:focus { border-color: var(--ev-brand); box-shadow: var(--ev-ring); outline: 0; }

/* ══════════════ RESPONSIVE ══════════════ */

@media (max-width: 900px) {
  .evp-hero { padding: 40px 0 26px; }
  .evp-section { padding: 30px 0; }
}
@media (max-width: 640px) {
  .evp-search { padding-left: 14px; border-radius: 14px; }
  
  
  
}

/* Print: a printed listing needs neither chrome nor hover affordances. */
@media print {
  .evp-hero { display: none !important; }
  .evp-card { break-inside: avoid; border-color: #ccc; box-shadow: none; }
}

/* ══════════════════════════════════════════════════════════════════════════
   BREADCRUMBS
   ══════════════════════════════════════════════════════════════════════════ */

.evp-crumbs {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 13px; color: var(--ev-ink-muted); margin-bottom: 16px;
}
.evp-crumbs a { color: var(--ev-ink-3); }
@media (hover: hover) { .evp-crumbs a:hover { color: var(--ev-brand-ink); } }
.evp-crumbs [aria-current="page"] { color: var(--ev-ink-2); font-weight: 560; }

.evp-hero-tight { padding: 36px 0 22px; }

/* ══════════════════════════════════════════════════════════════════════════
   DETAIL — hero
   ══════════════════════════════════════════════════════════════════════════ */

.evp-dhero { position: relative; padding: 40px 0 30px; overflow: hidden; background: var(--ev-bg-soft); }

/* The banner sits behind a heavy scrim rather than behind raw text: a photo
   with light and dark regions cannot be made to hold 4.5:1 against a single
   ink colour, so the scrim guarantees it. */
.evp-dhero-bg {
  position: absolute; inset: 0; background-size: cover; background-position: center;
  filter: blur(26px) saturate(1.15); transform: scale(1.12); opacity: .30;
}
.evp-dhero::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--ev-bg) 62%, transparent),
    color-mix(in srgb, var(--ev-bg) 92%, transparent));
}
.evp-dhero-inner { position: relative; z-index: 2; }

.evp-dhero-badges { display: flex; gap: 7px; flex-wrap: wrap; margin-bottom: 14px; }

.evp-dtitle {
  margin: 0 0 10px; font-size: clamp(26px, 3.8vw, 42px);
  line-height: 1.13; font-weight: 800; letter-spacing: -.021em; color: var(--ev-ink);
}
.evp-dsub { margin: 0 0 16px; font-size: clamp(15px, 1.5vw, 17.5px); color: var(--ev-ink-3); max-width: 720px; line-height: 1.6; }

.evp-dorg { display: flex; align-items: center; gap: 10px; font-size: 14.5px; color: var(--ev-ink-2); flex-wrap: wrap; }
.evp-dorg img { width: 34px; height: 34px; border-radius: 9px; object-fit: cover; flex: none; }
.evp-dorg a { color: var(--ev-brand-ink); }

/* ── Notices ── */

.evp-notice {
  display: flex; gap: 13px; align-items: flex-start;
  padding: 15px 18px; border-radius: var(--ev-radius-sm);
  margin: 20px 0 0; border: 1px solid transparent;
}
.evp-notice i { font-size: 18px; flex: none; margin-top: 1px; }
.evp-notice strong { display: block; font-size: 15px; margin-bottom: 3px; }
.evp-notice p { margin: 0; font-size: 14px; opacity: .9; }
.evp-notice-cancel { background: var(--ev-cancel-soft); color: var(--ev-cancel-ink); border-color: color-mix(in srgb, var(--ev-cancel) 30%, transparent); }
.evp-notice-warn { background: var(--ev-warn-soft);   color: var(--ev-warn-ink);   border-color: color-mix(in srgb, var(--ev-warn) 30%, transparent); }

/* ── Layout ── */

.evp-dlayout {
  display: grid; gap: 30px; padding-top: 28px; padding-bottom: 56px;
  grid-template-columns: minmax(0, 1fr) 348px;   /* minmax(0,…) = rule 5 */
  align-items: start;
}
@media (max-width: 1000px) { .evp-dlayout { grid-template-columns: 1fr; } }

.evp-dmain { min-width: 0; }
.evp-dside { min-width: 0; position: sticky; top: 84px; }
@media (max-width: 1000px) { .evp-dside { position: static; } }

/* ── Tabs ── */

.evp-tabs {
  display: flex; gap: 6px; overflow-x: auto; padding-bottom: 4px;
  border-bottom: 1px solid var(--ev-border); margin-bottom: 24px;
  scrollbar-width: thin;
}
.evp-tab {
  flex: none; min-height: 40px; padding: 9px 16px; cursor: pointer;
  background: transparent; border: 0; border-bottom: 2px solid transparent;
  color: var(--ev-ink-3); font-size: 14.5px; font-weight: 620; white-space: nowrap;
}
.evp-tab.is-on { color: var(--ev-brand-ink); border-bottom-color: var(--ev-brand); }
@media (hover: hover) { .evp-tab:hover { color: var(--ev-ink); } }

.evp-block { margin-bottom: 38px; }
.evp-h2 { margin: 0 0 16px; font-size: 20px; font-weight: 750; letter-spacing: -.012em; color: var(--ev-ink); }

.evp-prose { font-size: 15.5px; line-height: 1.75; color: var(--ev-ink-2); }
.evp-prose p { margin: 0 0 15px; }
.evp-prose h2,
.evp-prose h3 { color: var(--ev-ink); font-weight: 720; margin: 26px 0 11px; }
.evp-prose ul,
.evp-prose ol { margin: 0 0 15px; padding-left: 22px; }
.evp-prose li { margin-bottom: 7px; }
.evp-prose a { color: var(--ev-brand-ink); text-decoration: underline; }
.evp-prose img { max-width: 100%; height: auto; border-radius: var(--ev-radius-sm); }
/* Wide content scrolls INSIDE its own box; the page body never scrolls sideways. */
.evp-prose table { display: block; overflow-x: auto; max-width: 100%; }
.evp-prose pre { overflow-x: auto; max-width: 100%; background: var(--ev-panel-2); padding: 14px; border-radius: 10px; }

/* ── Requirements ── */

.evp-reqs { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 10px; }
.evp-reqs li { display: flex; gap: 11px; align-items: flex-start; font-size: 14.5px; color: var(--ev-ink-2); }
.evp-reqs i { color: var(--ev-free-ink); font-size: 12px; margin-top: 5px; flex: none; }

/* ── Gallery ── */

.evp-gallery {
  display: grid; gap: 12px; margin-bottom: 22px;
  grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
}
.evp-gallery figure { margin: 0; min-width: 0; }
.evp-gallery img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: var(--ev-radius-sm); display: block; }
.evp-gallery figcaption { font-size: 12.5px; color: var(--ev-ink-3); margin-top: 6px; }

/* ── Tags ── */

.evp-tags { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 20px; }
.evp-tagchip {
  padding: 5px 12px; border-radius: 999px; min-height: 28px;
  display: inline-flex; align-items: center;
  background: var(--ev-panel-2); border: 1px solid var(--ev-border);
  color: var(--ev-ink-3); font-size: 12.5px; font-weight: 560;
}
@media (hover: hover) { .evp-tagchip:hover { border-color: var(--ev-brand); color: var(--ev-brand-ink); } }

/* ── Agenda ── */

.evp-agenda { list-style: none; margin: 0; padding: 0; }
.evp-sess {
  display: grid; gap: 16px; padding: 16px 0;
  grid-template-columns: 92px minmax(0, 1fr);
  border-bottom: 1px solid var(--ev-border);
  scroll-margin-top: 90px;      /* deep links land clear of the sticky header */
}
.evp-sess.is-break { opacity: .72; }
@media (max-width: 620px) { .evp-sess { grid-template-columns: 1fr; gap: 8px; } }

.evp-sess-time { font-size: 15px; font-weight: 750; color: var(--ev-brand-ink); }
.evp-sess-dur { display: block; font-size: 12px; font-weight: 500; color: var(--ev-ink-muted); margin-top: 2px; }
.evp-sess-body { min-width: 0; }
.evp-sess-title { margin: 0 0 7px; font-size: 16px; font-weight: 700; color: var(--ev-ink); }
.evp-sess-meta { display: flex; gap: 7px; flex-wrap: wrap; align-items: center; margin-bottom: 8px; }
.evp-sess-room { font-size: 12.5px; color: var(--ev-ink-3); }
.evp-sess-desc { margin: 0 0 9px; font-size: 14px; color: var(--ev-ink-3); line-height: 1.6; }
.evp-sess-spk { display: flex; gap: 7px; flex-wrap: wrap; }

.evp-spk-chip {
  display: inline-flex; align-items: center; gap: 6px; min-height: 28px;
  padding: 4px 11px 4px 5px; border-radius: 999px;
  background: var(--ev-panel-2); border: 1px solid var(--ev-border);
  font-size: 12.5px; color: var(--ev-ink-2); font-weight: 560;
}
.evp-spk-chip img { width: 22px; height: 22px; border-radius: 50%; object-fit: cover; }
@media (hover: hover) { .evp-spk-chip:hover { border-color: var(--ev-brand); color: var(--ev-brand-ink); } }

/* ── Speakers ── */

.evp-spk-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr)); }
.evp-spk {
  display: flex; gap: 14px; min-width: 0; padding: 16px;
  background: var(--ev-panel); border: 1px solid var(--ev-border); border-radius: var(--ev-radius);
}
.evp-spk-photo { width: 72px; height: 72px; border-radius: 14px; object-fit: cover; flex: none; }
.evp-spk-ph { display: grid; place-items: center; background: var(--ev-brand-soft); color: var(--ev-brand-ink); font-size: 24px; }
.evp-spk-body { min-width: 0; }
.evp-spk-name { margin: 0 0 4px; font-size: 15.5px; font-weight: 700; color: var(--ev-ink); display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.evp-spk-role { margin: 0 0 7px; font-size: 13px; color: var(--ev-brand-ink); font-weight: 560; }
.evp-spk-bio { margin: 0 0 9px; font-size: 13.5px; color: var(--ev-ink-3); line-height: 1.58; }
.evp-spk-soc { display: flex; gap: 9px; }
.evp-spk-soc a { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 7px; background: var(--ev-panel-2); color: var(--ev-ink-3); font-size: 12px; }
@media (hover: hover) { .evp-spk-soc a:hover { background: var(--ev-brand); color: #fff; } }

/* ── Sponsors ── */

.evp-spon-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr)); }
.evp-spon {
  display: grid; place-items: center; min-height: 92px; padding: 16px; min-width: 0;
  background: var(--ev-panel); border: 1px solid var(--ev-border); border-radius: var(--ev-radius-sm);
}
.evp-spon img { max-width: 100%; max-height: 56px; object-fit: contain; }
.evp-spon-name { font-size: 14px; font-weight: 650; color: var(--ev-ink-2); text-align: center; }
@media (hover: hover) { .evp-spon:hover { border-color: var(--ev-border-strong); } }

/* ── Venue ── */

.evp-venue h3 { margin: 0 0 8px; font-size: 17px; font-weight: 720; color: var(--ev-ink); }
.evp-venue-addr { font-size: 14.5px; color: var(--ev-ink-3); margin: 0 0 16px; }
.evp-venue-addr i { color: var(--ev-brand); margin-right: 6px; }
.evp-venue-note { padding: 13px 15px; background: var(--ev-panel-2); border-radius: var(--ev-radius-sm); margin-bottom: 12px; border: 1px solid var(--ev-border); }
.evp-venue-note strong { display: block; font-size: 13.5px; color: var(--ev-ink); margin-bottom: 4px; }
.evp-venue-note p { margin: 0; font-size: 13.5px; color: var(--ev-ink-3); }

.evp-map { border-radius: var(--ev-radius-sm); overflow: hidden; border: 1px solid var(--ev-border); margin: 16px 0 12px; }
.evp-map iframe { width: 100%; height: 320px; border: 0; display: block; }

/* ── FAQs ── */

.evp-faqs { display: grid; gap: 10px; }
.evp-faq { background: var(--ev-panel); border: 1px solid var(--ev-border); border-radius: var(--ev-radius-sm); overflow: hidden; }
.evp-faq summary {
  padding: 15px 18px; cursor: pointer; font-size: 15px; font-weight: 650;
  color: var(--ev-ink); list-style: none; display: flex; align-items: center;
  justify-content: space-between; gap: 12px; min-height: 44px;
}
.evp-faq summary::-webkit-details-marker { display: none; }
.evp-faq summary::after { content: "+"; font-size: 19px; color: var(--ev-ink-muted); flex: none; }
.evp-faq[open] summary::after { content: "\2013"; }
.evp-faq[open] summary { border-bottom: 1px solid var(--ev-border); }
.evp-faq .evp-prose { padding: 15px 18px; font-size: 14.5px; }

/* ── Reviews ── */

.evp-reviews { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(320px, 100%), 1fr)); }
.evp-review { min-width: 0; padding: 16px; background: var(--ev-panel); border: 1px solid var(--ev-border); border-radius: var(--ev-radius-sm); }
.evp-review-top { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; margin-bottom: 8px; font-size: 14px; color: var(--ev-ink); }
.evp-review h3 { margin: 0 0 5px; font-size: 14.5px; font-weight: 680; color: var(--ev-ink); }
.evp-review p { margin: 0; font-size: 14px; color: var(--ev-ink-3); line-height: 1.6; }
.evp-stars { margin-left: auto; font-size: 11px; color: var(--ev-border-strong); }
.evp-stars .is-on { color: #f59e0b; }

/* ══════════════════════════════════════════════════════════════════════════
   STICKY PANEL
   ══════════════════════════════════════════════════════════════════════════ */

.evp-panel {
  background: var(--ev-panel); border: 1px solid var(--ev-border);
  border-radius: var(--ev-radius); padding: 20px; box-shadow: var(--ev-shadow);
}

.evp-countdown {
  text-align: center; padding: 13px; margin-bottom: 16px; border-radius: var(--ev-radius-sm);
  background: linear-gradient(135deg, var(--ev-brand-soft), color-mix(in srgb, var(--ev-brand-2) 10%, transparent));
  border: 1px solid color-mix(in srgb, var(--ev-brand) 20%, transparent);
}
.evp-countdown-l { display: block; font-size: 12px; color: var(--ev-ink-3); text-transform: uppercase; letter-spacing: .06em; font-weight: 620; }
.evp-countdown-v { display: block; font-size: 26px; font-weight: 800; color: var(--ev-brand-ink); font-variant-numeric: tabular-nums; margin-top: 3px; }
.evp-countdown-v.is-live { color: var(--ev-live-ink); }

.evp-facts { margin: 0 0 18px; }
.evp-facts > div { display: flex; justify-content: space-between; gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--ev-border); }
.evp-facts > div:last-child { border-bottom: 0; }
.evp-facts dt { font-size: 13px; color: var(--ev-ink-3); font-weight: 550; flex: none; }
.evp-facts dt i { width: 15px; color: var(--ev-ink-muted); margin-right: 5px; }
.evp-facts dd { margin: 0; font-size: 13.5px; color: var(--ev-ink); font-weight: 620; text-align: right; min-width: 0; }
.evp-facts dd.is-free { color: var(--ev-free-ink); }
.evp-tzhint { display: block; font-size: 11.5px; color: var(--ev-ink-muted); font-weight: 450; }

.evp-btn {
  display: flex; align-items: center; justify-content: center; gap: 9px;
  width: 100%; min-height: 48px; padding: 13px 20px; margin-bottom: 10px;
  border: 1px solid transparent; border-radius: 12px; cursor: pointer;
  font-size: 15px; font-weight: 680; text-align: center;
}
.evp-btn-primary { background: linear-gradient(100deg, var(--ev-brand), var(--ev-brand-2)); color: #fff; }
.evp-btn-live { background: var(--ev-live); color: #fff; }
.evp-btn-warn { background: var(--ev-warn); color: #fff; }
.evp-btn-ok { background: var(--ev-free-soft); color: var(--ev-free-ink); border-color: color-mix(in srgb, var(--ev-free) 34%, transparent); }
.evp-btn-ghost { background: var(--ev-panel-2); color: var(--ev-ink-2); border-color: var(--ev-border); width: auto; display: inline-flex; }
.evp-btn-disabled { background: var(--ev-panel-2); color: var(--ev-ink-muted); border-color: var(--ev-border); cursor: not-allowed; }

@media (hover: hover) {
  .evp-btn-primary:hover { filter: brightness(1.07); color: #fff; }
  .evp-btn-live:hover,
.evp-btn-warn:hover { filter: brightness(1.07); color: #fff; }
  .evp-btn-ghost:hover { border-color: var(--ev-brand); color: var(--ev-brand-ink); }
}
.evp-btn:not(.evp-btn-disabled):active { transform: translateY(1px); }

.evp-panel-note { font-size: 12px; color: var(--ev-ink-muted); text-align: center; margin: -3px 0 12px; }

.evp-panel-actions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; margin-top: 14px; }
.evp-iconbtn {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px;
  min-height: 60px; padding: 10px 6px; border-radius: 10px; cursor: pointer; min-width: 0;
  background: var(--ev-panel-2); border: 1px solid var(--ev-border);
  color: var(--ev-ink-3); font-size: 11.5px; font-weight: 580; text-align: center;
}
.evp-iconbtn i { font-size: 15px; }
.evp-iconbtn span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.evp-iconbtn[aria-pressed="true"] { background: var(--ev-brand-soft); color: var(--ev-brand-ink); border-color: color-mix(in srgb, var(--ev-brand) 26%, transparent); }
@media (hover: hover) { .evp-iconbtn:hover { border-color: var(--ev-brand); color: var(--ev-brand-ink); } }

.evp-report { display: block; text-align: center; margin-top: 15px; font-size: 12.5px; color: var(--ev-ink-muted); }
@media (hover: hover) { .evp-report:hover { color: var(--ev-cancel-ink); } }

/* ══════════════════════════════════════════════════════════════════════════
   CALENDAR
   ══════════════════════════════════════════════════════════════════════════ */

.evp-cal-bar {
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
  padding: 14px 16px; margin-bottom: 18px;
  background: var(--ev-panel); border: 1px solid var(--ev-border); border-radius: var(--ev-radius-sm);
}
.evp-cal-nav { display: flex; align-items: center; gap: 8px; }
.evp-cal-arrow {
  width: 36px; height: 36px; display: grid; place-items: center; cursor: pointer;
  border-radius: 9px; background: var(--ev-panel-2); border: 1px solid var(--ev-border); color: var(--ev-ink-2);
}
.evp-cal-today {
  min-height: 36px; padding: 7px 15px; border-radius: 9px; cursor: pointer;
  background: var(--ev-panel-2); border: 1px solid var(--ev-border);
  color: var(--ev-ink-2); font-size: 13.5px; font-weight: 600;
}
@media (hover: hover) {
  .evp-cal-arrow:hover,
.evp-cal-today:hover { border-color: var(--ev-brand); color: var(--ev-brand-ink); }
}
.evp-cal-period { margin: 0 0 0 8px; font-size: 17px; font-weight: 720; color: var(--ev-ink); }

.evp-cal-views { display: flex; gap: 5px; margin-left: auto; }
.evp-cal-view {
  display: inline-flex; align-items: center; gap: 6px; min-height: 36px;
  padding: 7px 13px; border-radius: 9px; cursor: pointer;
  background: transparent; border: 1px solid var(--ev-border);
  color: var(--ev-ink-3); font-size: 13px; font-weight: 580;
}
.evp-cal-view.is-on { background: var(--ev-brand); border-color: var(--ev-brand); color: #fff; }
@media (hover: hover) { .evp-cal-view:hover { border-color: var(--ev-brand); color: var(--ev-brand-ink); } }
@media (max-width: 700px) { .evp-cal-view span { display: none; } .evp-cal-views { margin-left: 0; } }

/* Month grid — scrolls inside its own box on narrow screens rather than
   forcing the page body sideways. */
.evp-cal-grid {
  border: 1px solid var(--ev-border); border-radius: var(--ev-radius);
  overflow: hidden; background: var(--ev-panel); margin-bottom: 30px;
}
@media (max-width: 720px) {
  .evp-cal-grid { overflow-x: auto; }
  .evp-cal-head,
.evp-cal-week { min-width: 660px; }
}
.evp-cal-head,
.evp-cal-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.evp-cal-head { background: var(--ev-panel-2); border-bottom: 1px solid var(--ev-border); }
.evp-cal-dow { padding: 10px 8px; font-size: 12px; font-weight: 700; color: var(--ev-ink-3); text-align: center; text-transform: uppercase; letter-spacing: .05em; }
.evp-cal-week { border-bottom: 1px solid var(--ev-border); }
.evp-cal-week:last-child { border-bottom: 0; }

.evp-cal-cell {
  min-height: 116px; padding: 7px; min-width: 0;
  border-right: 1px solid var(--ev-border); display: flex; flex-direction: column; gap: 4px;
}
.evp-cal-cell:last-child { border-right: 0; }
.evp-cal-cell.is-other { background: var(--ev-bg-soft); opacity: .6; }
.evp-cal-cell.is-today { background: var(--ev-brand-soft); }
.evp-cal-num { font-size: 12.5px; font-weight: 700; color: var(--ev-ink-3); margin-bottom: 2px; }
.evp-cal-cell.is-today .evp-cal-num { color: var(--ev-brand-ink); }

.evp-cal-ev {
  display: flex; gap: 5px; align-items: baseline; min-width: 0;
  padding: 4px 7px; border-radius: 6px; font-size: 11.5px; line-height: 1.35;
  background: var(--ev-panel-2); border-left: 3px solid var(--ev-brand); color: var(--ev-ink-2);
}

.evp-cal-ev-time { font-weight: 700; flex: none; font-variant-numeric: tabular-nums; }
.evp-cal-ev-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
@media (hover: hover) { .evp-cal-ev:hover { filter: brightness(.97); } }

.evp-cal-more { font-size: 11px; color: var(--ev-ink-muted); padding: 2px 7px; font-weight: 600; }
.evp-cal-hint { text-align: center; color: var(--ev-ink-3); font-size: 14px; padding: 20px 0 40px; }
.evp-cal-none { color: var(--ev-ink-muted); font-size: 13px; text-align: center; padding: 8px 0; }

/* Week */
.evp-cal-wk { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; margin-bottom: 30px; }
@media (max-width: 900px) { .evp-cal-wk { grid-template-columns: repeat(auto-fill, minmax(min(160px, 100%), 1fr)); } }
.evp-cal-wkcol { min-width: 0; background: var(--ev-panel); border: 1px solid var(--ev-border); border-radius: var(--ev-radius-sm); overflow: hidden; }
.evp-cal-wkcol.is-today { border-color: var(--ev-brand); }
.evp-cal-wkhead { padding: 9px; text-align: center; background: var(--ev-panel-2); border-bottom: 1px solid var(--ev-border); }
.evp-cal-wkdow { display: block; font-size: 11px; font-weight: 700; color: var(--ev-ink-3); text-transform: uppercase; }
.evp-cal-wknum { display: block; font-size: 17px; font-weight: 750; color: var(--ev-ink); }
.evp-cal-wkbody { padding: 8px; display: grid; gap: 5px; min-height: 110px; }

/* Agenda / timeline */
.evp-cal-agenda { margin-bottom: 40px; }
.evp-ag-day { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 18px; padding: 18px 0; border-bottom: 1px solid var(--ev-border); }
@media (max-width: 620px) { .evp-ag-day { grid-template-columns: 1fr; gap: 10px; } }
.evp-ag-date { text-align: center; }
.evp-ag-dow { display: block; font-size: 11.5px; font-weight: 700; color: var(--ev-ink-muted); text-transform: uppercase; }
.evp-ag-num { display: block; font-size: 26px; font-weight: 800; color: var(--ev-ink); line-height: 1.1; }
.evp-ag-mon { display: block; font-size: 12px; color: var(--ev-ink-3); font-weight: 600; }
.evp-ag-list { display: grid; gap: 9px; min-width: 0; }
.evp-ag-item {
  display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; gap: 13px; align-items: center;
  padding: 13px 15px; border-radius: var(--ev-radius-sm);
  background: var(--ev-panel); border: 1px solid var(--ev-border);
}
@media (max-width: 620px) { .evp-ag-item { grid-template-columns: 52px minmax(0, 1fr); } .evp-ag-badges { grid-column: 1 / -1; } }
@media (hover: hover) { .evp-ag-item:hover { border-color: var(--ev-brand); background: var(--ev-brand-soft); } }
.evp-ag-time { font-size: 13.5px; font-weight: 750; color: var(--ev-brand-ink); font-variant-numeric: tabular-nums; }
.evp-ag-body { min-width: 0; }
.evp-ag-title { display: block; font-size: 15px; font-weight: 650; color: var(--ev-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.evp-ag-meta { display: block; font-size: 12.5px; color: var(--ev-ink-3); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.evp-ag-badges { display: flex; gap: 6px; flex-wrap: wrap; }

.is-timeline .evp-ag-list { border-left: 2px solid var(--ev-border); padding-left: 16px; }

/* ══════════════════════════════════════════════════════════════════════════
   REGISTRATION / MY EVENTS / WAITLIST
   ══════════════════════════════════════════════════════════════════════════ */

.evp-reg-layout {
  display: grid; gap: 28px; padding: 26px 0 56px;
  grid-template-columns: minmax(0, 1fr) 320px;   /* minmax(0,…) = rule 5 */
  align-items: start;
}
@media (max-width: 980px) { .evp-reg-layout { grid-template-columns: 1fr; } }
.evp-reg-main { min-width: 0; }
.evp-reg-side { min-width: 0; position: sticky; top: 84px; }
@media (max-width: 980px) { .evp-reg-side { position: static; order: -1; } }

.evp-card-form {
  background: var(--ev-panel); border: 1px solid var(--ev-border);
  border-radius: var(--ev-radius); padding: 24px; margin-bottom: 20px;
}
@media (max-width: 560px) { .evp-card-form { padding: 18px 16px; } }

.evp-panel-title { margin: 0 0 14px; font-size: 16px; font-weight: 720; color: var(--ev-ink); line-height: 1.35; }

.evp-fieldset { border: 0; padding: 0; margin: 0 0 26px; }
.evp-legend {
  padding: 0; margin: 0 0 4px; font-size: 15px; font-weight: 720; color: var(--ev-ink);
}
.evp-form-hint { margin: 0 0 16px; font-size: 13.5px; color: var(--ev-ink-3); line-height: 1.55; }
.evp-form-h3 { margin: 20px 0 10px; font-size: 15px; font-weight: 700; color: var(--ev-ink); }
.evp-form-hr { border: 0; border-top: 1px solid var(--ev-border); margin: 20px 0; }

.evp-field { margin-bottom: 16px; min-width: 0; }
.evp-field > label,
.evp-label {
  display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
  margin-bottom: 6px; font-size: 13.5px; font-weight: 620; color: var(--ev-ink-2);
}
.evp-req { color: var(--ev-cancel-ink); font-weight: 700; }
.evp-field-help { display: block; font-size: 12.5px; color: var(--ev-ink-muted); margin-bottom: 6px; }

.evp-input {
  width: 100%; min-width: 0; min-height: 44px;      /* rule 7 — comfortable target */
  padding: 11px 14px; border-radius: 10px;
  background: var(--ev-panel-2); color: var(--ev-ink);
  border: 1px solid var(--ev-border); font-size: 15px; font-family: inherit;
}
.evp-input::placeholder { color: var(--ev-ink-muted); }
.evp-input:focus { outline: 0; border-color: var(--ev-brand); box-shadow: var(--ev-ring); background: var(--ev-panel); }
.evp-input:disabled { opacity: .6; cursor: not-allowed; }
.evp-input-sm { max-width: 160px; }
.evp-textarea { min-height: 92px; resize: vertical; line-height: 1.55; }

/* A one-time code is read digit by digit — space it out and make it big. */
.evp-input-otp {
  max-width: 240px; font-size: 24px; font-weight: 700;
  letter-spacing: .3em; text-align: center; font-variant-numeric: tabular-nums;
}

.evp-err { display: block; margin-top: 6px; font-size: 12.5px; color: var(--ev-cancel-ink); font-weight: 560; }

.evp-check { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 12px; }
.evp-check input {
  width: 20px; height: 20px; flex: none; margin-top: 2px; cursor: pointer;
  accent-color: var(--ev-brand);
}
.evp-check label { font-size: 13.5px; color: var(--ev-ink-2); line-height: 1.5; cursor: pointer; }

.evp-radios { display: flex; gap: 9px; flex-wrap: wrap; }
.evp-radio {
  display: inline-flex; align-items: center; gap: 8px; min-height: 40px;
  padding: 9px 14px; border-radius: 10px; cursor: pointer;
  background: var(--ev-panel-2); border: 1px solid var(--ev-border);
  font-size: 13.5px; color: var(--ev-ink-2); font-weight: 560;
}
.evp-radio input { accent-color: var(--ev-brand); width: 17px; height: 17px; cursor: pointer; }
@media (hover: hover) { .evp-radio:hover { border-color: var(--ev-brand); } }
.evp-radio:focus-within { border-color: var(--ev-brand); box-shadow: var(--ev-ring); }

.evp-badge-tiny { font-size: 10px; padding: 2px 6px; }

.evp-btn-lg { min-height: 52px; font-size: 15.5px; }
.evp-form-foot { margin: 12px 0 0; font-size: 12.5px; color: var(--ev-ink-muted); text-align: center; }
.evp-form-foot a { color: var(--ev-brand-ink); text-decoration: underline; }

.evp-linkbtn {
  display: block; width: 100%; margin-top: 12px; padding: 10px; min-height: 40px;
  background: none; border: 0; cursor: pointer;
  color: var(--ev-brand-ink); font-size: 13.5px; font-weight: 600; text-align: center;
}
.evp-linkbtn-danger { color: var(--ev-cancel-ink); }
@media (hover: hover) { .evp-linkbtn:hover { text-decoration: underline; } }
.evp-muted { color: var(--ev-ink-muted); font-weight: 450; }

/* ── Done panel ── */

.evp-done {
  text-align: center; padding: 46px 26px;
  background: var(--ev-panel); border: 1px solid var(--ev-border); border-radius: var(--ev-radius);
}
.evp-done-mark {
  width: 62px; height: 62px; margin: 0 auto 18px;
  display: grid; place-items: center; border-radius: 50%;
  background: var(--ev-free-soft); color: var(--ev-free-ink); font-size: 26px;
}
.evp-done h2 { margin: 0 0 8px; font-size: 22px; font-weight: 760; color: var(--ev-ink); }
.evp-done > p { margin: 0 auto 20px; font-size: 15px; color: var(--ev-ink-3); max-width: 460px; line-height: 1.6; }

.evp-ref {
  display: inline-flex; flex-direction: column; gap: 3px; align-items: center;
  padding: 13px 26px; margin-bottom: 22px; border-radius: var(--ev-radius-sm);
  background: var(--ev-panel-2); border: 1px dashed var(--ev-border-strong);
}
.evp-ref-l { font-size: 11.5px; color: var(--ev-ink-muted); text-transform: uppercase; letter-spacing: .06em; font-weight: 650; }
.evp-ref-v { font-size: 20px; font-weight: 800; color: var(--ev-ink); font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .06em; }

.evp-done-actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.evp-done-actions .evp-btn { width: auto; margin-bottom: 0; }

/* ── RSVP buttons ── */

.evp-rsvp-row { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(min(140px, 100%), 1fr)); margin-top: 6px; }
.evp-rsvp {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  min-height: 88px; padding: 16px 12px; border-radius: 12px; cursor: pointer; min-width: 0;
  background: var(--ev-panel-2); border: 2px solid var(--ev-border);
  color: var(--ev-ink-2); font-size: 14px; font-weight: 650;
}
.evp-rsvp i { font-size: 19px; }
.evp-rsvp-yes { color: var(--ev-free-ink); }
.evp-rsvp-maybe { color: var(--ev-warn-ink); }
.evp-rsvp-no { color: var(--ev-ink-3); }
@media (hover: hover) {
  .evp-rsvp-yes:hover { border-color: var(--ev-free);   background: var(--ev-free-soft); }
  .evp-rsvp-maybe:hover { border-color: var(--ev-warn);   background: var(--ev-warn-soft); }
  .evp-rsvp-no:hover { border-color: var(--ev-border-strong); }
}
.evp-rsvp:active { transform: translateY(1px); }

/* ── Notices (shared) ── */

.evp-notice-ok { background: var(--ev-free-soft); color: var(--ev-free-ink); border-color: color-mix(in srgb, var(--ev-free) 30%, transparent); }
.evp-notice-info { background: var(--ev-info-soft); color: var(--ev-info-ink); border-color: color-mix(in srgb, var(--ev-info) 30%, transparent); }
.evp-notice code { background: rgba(0,0,0,.08); padding: 1px 6px; border-radius: 5px; font-size: .92em; }
.evp-notice a { text-decoration: underline; }

/* ── My events list ── */

.evp-tab-n {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  background: var(--ev-panel-2); color: var(--ev-ink-3); font-size: 11.5px; font-weight: 700;
}
.evp-tab.is-on .evp-tab-n { background: var(--ev-brand-soft); color: var(--ev-brand-ink); }

.evp-reglist { display: grid; gap: 10px; }
.evp-regrow {
  display: grid; grid-template-columns: 58px minmax(0, 1fr) auto; gap: 15px; align-items: center;
  padding: 14px 16px; border-radius: var(--ev-radius-sm);
  background: var(--ev-panel); border: 1px solid var(--ev-border);
}
@media (max-width: 620px) {
  .evp-regrow { grid-template-columns: 50px minmax(0, 1fr); }
  .evp-regrow-state { grid-column: 1 / -1; }
}
@media (hover: hover) { .evp-regrow:hover { border-color: var(--ev-brand); background: var(--ev-brand-soft); } }

.evp-regrow-date { text-align: center; }
.evp-regrow-d { display: block; font-size: 21px; font-weight: 800; color: var(--ev-ink); line-height: 1.1; }
.evp-regrow-m { display: block; font-size: 11.5px; font-weight: 700; color: var(--ev-ink-muted); text-transform: uppercase; }
.evp-regrow-body { min-width: 0; }
.evp-regrow-title { display: block; font-size: 15px; font-weight: 650; color: var(--ev-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.evp-regrow-meta { display: block; font-size: 12.5px; color: var(--ev-ink-3); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.evp-attendees { list-style: none; margin: 0; padding: 0; display: grid; gap: 9px; }
.evp-attendees li { display: flex; align-items: center; gap: 10px; font-size: 14px; color: var(--ev-ink-2); }
.evp-attendees i { color: var(--ev-ink-muted); font-size: 12px; }

.evp-confirm { margin-top: 14px; padding: 15px; border-radius: var(--ev-radius-sm); background: var(--ev-cancel-soft); border: 1px solid color-mix(in srgb, var(--ev-cancel) 26%, transparent); }
.evp-confirm p { margin: 0 0 8px; font-size: 13.5px; color: var(--ev-cancel-ink); }
.evp-confirm .evp-input { margin-bottom: 10px; }
.evp-confirm-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.evp-confirm-actions .evp-btn { width: auto; flex: 1 1 auto; margin-bottom: 0; min-height: 42px; font-size: 13.5px; }

/* ══════════════════════════════════════════════════════════════════════════
   CHECKOUT / TICKET ROWS
   ══════════════════════════════════════════════════════════════════════════ */

.evp-tkrow {
  display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 14px; align-items: center;
  padding: 15px 0; border-bottom: 1px solid var(--ev-border);
}
.evp-tkrow:last-of-type { border-bottom: 0; }
.evp-tkrow.is-out { opacity: .55; }
@media (max-width: 560px) {
  .evp-tkrow { grid-template-columns: minmax(0, 1fr) auto; }
  .evp-tkrow-qty { grid-column: 2; grid-row: 1; }
  .evp-tkrow-price { grid-column: 1 / -1; }
}

.evp-tkrow-info { min-width: 0; }
.evp-tkrow-name {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
  font-size: 15px; font-weight: 680; color: var(--ev-ink);
}
.evp-tkrow-desc { display: block; font-size: 13px; color: var(--ev-ink-3); margin-top: 3px; line-height: 1.5; }
.evp-tkrow-note { display: inline-flex; align-items: center; gap: 5px; margin-top: 5px; font-size: 12px; color: var(--ev-ink-muted); font-weight: 600; }
.evp-tkrow-low { color: var(--ev-warn-ink); }
.evp-tkrow-price { font-size: 15px; font-weight: 750; color: var(--ev-ink); white-space: nowrap; }
.evp-tkrow-qty .evp-input { max-width: 78px; min-width: 0; }

.evp-promo { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--ev-border); }
.evp-promo > label { display: block; margin-bottom: 6px; font-size: 13.5px; font-weight: 620; color: var(--ev-ink-2); }
.evp-promo-row { display: flex; gap: 8px; align-items: stretch; }
.evp-promo-row .evp-input { flex: 1 1 auto; min-width: 0; text-transform: uppercase; }
.evp-promo-row .evp-btn { width: auto; flex: none; margin-bottom: 0; min-height: 44px; }

.evp-order { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 9px; }
.evp-order li { display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px; min-width: 0; }
.evp-order-n { color: var(--ev-ink-2); min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.evp-order-v { font-weight: 650; color: var(--ev-ink); white-space: nowrap; flex: none; }

.evp-order-total { border-top: 2px solid var(--ev-border-strong) !important; padding-top: 12px !important; }
.evp-order-total dt { font-size: 15px !important; font-weight: 700 !important; color: var(--ev-ink) !important; }
.evp-order-total dd { font-size: 18px !important; font-weight: 800 !important; color: var(--ev-brand-ink) !important; }

.evp-notice-warn strong { color: inherit; }

/* ══════════════════════════════════════════════════════════════════════════
   CHECK-IN KIOSK  (.evk-)

   Designed for a door, not a desk: one hand, arm's length, poor light, a cheap
   phone. Targets are large, the verdict is enormous, and every state carries an
   icon AND a sentence — a steward glancing down must not have to interpret a
   colour (WCAG 1.4.1).
   ══════════════════════════════════════════════════════════════════════════ */

.evp-kiosk { background: var(--ev-bg-soft); min-height: 100vh; }
.evk { max-width: 720px; margin: 0 auto; padding: 16px 14px 40px; }

.evk-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.evk-top-l { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
.evk-back {
  width: 44px; height: 44px; flex: none; display: grid; place-items: center;
  border-radius: 12px; background: var(--ev-panel); border: 1px solid var(--ev-border);
  color: var(--ev-ink-2); font-size: 16px;
}
.evk-eyebrow { display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; color: var(--ev-brand-ink); }
.evk-title { margin: 2px 0 0; font-size: 17px; font-weight: 720; color: var(--ev-ink); line-height: 1.3;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

.evk-gate-in {
  width: 110px; min-height: 44px; padding: 10px 12px; border-radius: 12px;
  background: var(--ev-panel); border: 1px solid var(--ev-border);
  color: var(--ev-ink); font-size: 14px; font-weight: 600; text-align: center;
}
.evk-gate-in:focus { outline: 0; border-color: var(--ev-brand); box-shadow: var(--ev-ring); }

/* ── Counters ── */

.evk-stats {
  display: grid; gap: 8px; margin-bottom: 14px;
  grid-template-columns: repeat(auto-fit, minmax(min(96px, 100%), 1fr));
}
.evk-stat {
  min-width: 0; text-align: center; padding: 11px 8px; border-radius: 12px;
  background: var(--ev-panel); border: 1px solid var(--ev-border);
}
.evk-stat-v { display: block; font-size: 22px; font-weight: 800; color: var(--ev-ink); font-variant-numeric: tabular-nums; line-height: 1.15; }
.evk-stat-l { display: block; font-size: 11px; color: var(--ev-ink-3); margin-top: 2px; font-weight: 600; }
.evk-stat-queue { border-color: color-mix(in srgb, var(--ev-info) 40%, transparent); background: var(--ev-info-soft); }
.evk-stat-queue .evk-stat-v,
.evk-stat-queue .evk-stat-l { color: var(--ev-info-ink); }
.is-hidden { display: none !important; }

/* ── Verdict ── */

.evk-verdict {
  text-align: center; padding: 26px 18px; margin-bottom: 14px;
  border-radius: 18px; border: 2px solid var(--ev-border);
  background: var(--ev-panel); transition: background .15s ease, border-color .15s ease;
}
.evk-verdict-ico {
  display: grid; place-items: center; width: 62px; height: 62px; margin: 0 auto 12px;
  border-radius: 50%; font-size: 26px;
  background: var(--ev-panel-2); color: var(--ev-ink-3);
}
.evk-verdict-msg { display: block; font-size: 22px; font-weight: 780; color: var(--ev-ink); line-height: 1.25; }
.evk-verdict-sub { display: block; font-size: 14px; color: var(--ev-ink-3); margin-top: 5px; min-height: 20px; }

.evk-verdict.is-emerald { background: var(--ev-free-soft);   border-color: var(--ev-free); }
.evk-verdict.is-emerald .evk-verdict-ico { background: var(--ev-free); color: #fff; }
.evk-verdict.is-emerald .evk-verdict-msg { color: var(--ev-free-ink); }

.evk-verdict.is-amber { background: var(--ev-warn-soft);   border-color: var(--ev-warn); }
.evk-verdict.is-amber .evk-verdict-ico { background: var(--ev-warn); color: #fff; }
.evk-verdict.is-amber .evk-verdict-msg { color: var(--ev-warn-ink); }

.evk-verdict.is-rose { background: var(--ev-cancel-soft); border-color: var(--ev-cancel); }
.evk-verdict.is-rose .evk-verdict-ico { background: var(--ev-cancel); color: #fff; }
.evk-verdict.is-rose .evk-verdict-msg { color: var(--ev-cancel-ink); }

.evk-verdict.is-cyan { background: var(--ev-info-soft);   border-color: var(--ev-info); }
.evk-verdict.is-cyan .evk-verdict-ico { background: var(--ev-info); color: #fff; }
.evk-verdict.is-cyan .evk-verdict-msg { color: var(--ev-info-ink); }

/* ── Camera ── */

.evk-cam {
  position: relative; aspect-ratio: 4 / 3; margin-bottom: 14px;
  border-radius: 16px; overflow: hidden; background: #000;
  border: 1px solid var(--ev-border);
}
.evk-video { width: 100%; height: 100%; object-fit: cover; display: block; }
.evk-cam-off {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 10px; padding: 20px;
  background: var(--ev-panel); color: var(--ev-ink-3); text-align: center;
}
.evk-cam-off i { font-size: 30px; color: var(--ev-ink-muted); }
.evk-cam-off p { margin: 0; font-size: 14px; }
.evk-cam-note { font-size: 12.5px; color: var(--ev-warn-ink); max-width: 320px; }

/* ── Fallbacks ── */

.evk-fallbacks { display: grid; gap: 12px; margin-bottom: 22px; }
.evk-manual > label { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 620; color: var(--ev-ink-2); }
.evk-manual-row { display: flex; gap: 8px; }
.evk-code-in {
  flex: 1 1 auto; min-width: 0; min-height: 52px; padding: 12px 16px;
  border-radius: 12px; background: var(--ev-panel); border: 1px solid var(--ev-border);
  color: var(--ev-ink); font-size: 19px; font-weight: 700; letter-spacing: .12em;
  text-align: center; text-transform: uppercase;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}
.evk-code-in:focus { outline: 0; border-color: var(--ev-brand); box-shadow: var(--ev-ring); }

.evk-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; padding: 12px 20px; border-radius: 12px; cursor: pointer;
  border: 1px solid transparent; font-size: 15px; font-weight: 680; flex: none;
}
.evk-btn-primary { background: linear-gradient(100deg, var(--ev-brand), var(--ev-brand-2)); color: #fff; }
.evk-btn-ghost { background: var(--ev-panel); border-color: var(--ev-border); color: var(--ev-ink-2); width: 100%; }
@media (hover: hover) {
  .evk-btn-primary:hover { filter: brightness(1.07); }
  .evk-btn-ghost:hover { border-color: var(--ev-brand); color: var(--ev-brand-ink); }
}
.evk-btn:active { transform: translateY(1px); }

/* ── Log ── */

.evk-recent-h { margin: 0 0 10px; font-size: 14px; font-weight: 700; color: var(--ev-ink-3); text-transform: uppercase; letter-spacing: .06em; }
.evk-log { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.evk-log-row {
  display: grid; grid-template-columns: 62px minmax(0, 1fr) auto; gap: 10px; align-items: center;
  padding: 10px 13px; border-radius: 10px;
  background: var(--ev-panel); border: 1px solid var(--ev-border);
  border-left: 4px solid var(--ev-border-strong);
  font-size: 13px;
}
.evk-log-row.evk-tone-emerald { border-left-color: var(--ev-free); }
.evk-log-row.evk-tone-amber { border-left-color: var(--ev-warn); }
.evk-log-row.evk-tone-rose { border-left-color: var(--ev-cancel); }
.evk-log-t { color: var(--ev-ink-muted); font-variant-numeric: tabular-nums; font-size: 12px; }
.evk-log-n { color: var(--ev-ink); font-weight: 620; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.evk-log-r { color: var(--ev-ink-3); font-size: 12px; white-space: nowrap; }
.evk-log-empty { padding: 16px; text-align: center; color: var(--ev-ink-muted); font-size: 13.5px; }

@media (max-width: 420px) {
  .evk-log-row { grid-template-columns: 54px minmax(0, 1fr); }
  .evk-log-r { grid-column: 1 / -1; }
  .evk-manual-row { flex-direction: column; }
  .evk-btn { width: 100%; }
}