/* =====================================================================
   TAMiTAM — "Sunset Bento" redesign, 2026
   -----------------------------------------------------------------
   Концепция: светлый кремово-лавандовый минимализм + bento-сетка +
   мягкое стекло (glassmorphism) в шапке + фирменный sunset-градиент
   (коралл → розовый → фиолет) как единственный яркий акцент.
   Все классы и CSS-переменные (--cat-bg, --cat-accent, --marker-*)
   оставлены без изменений — их подставляет app.js, логика не менялась.
   ===================================================================== */

:root{
  /* ---- Базовые поверхности и текст ---- */
  --bg:#F5F2FB;                 /* светлый кремово-лавандовый фон страницы */
  --bg-accent-1:#FDEFE6;        /* пастельное пятно (персик) для декора */
  --bg-accent-2:#EFEBFF;        /* пастельное пятно (лаванда) для декора */
  --surface:#FFFFFF;            /* карточки, шапка, модалки — чистый белый */
  --surface-warm:#FBF7FF;       /* лёгкий тон поверх белого (было тёплым, теперь чуть лавандовый) */
  --text:#1E1A2B;                /* основной текст — глубокий графитово-фиолетовый */
  --muted:#756E88;               /* вторичный текст */
  --line:#EAE4F7;               /* тонкие границы */

  /* ---- Фирменные акцентные цвета (сохранены из бренда) ---- */
  --coral:#FF5D7A;
  --coral-dark:#E5426A;
  --violet:#6F4FF2;
  --violet-dark:#5A3AD9;
  --amber:#FFB238;
  --amber-dark:#E89000;
  --teal:#12A48E;
  --teal-dark:#0C8A77;
  --red:#D93A3A;

  --sunset:linear-gradient(120deg,#FF7A59 0%,#FF5D8F 48%,#7C5CFC 100%);
  --sunset-soft:linear-gradient(135deg,#FFEADD 0%,#FFE1EC 55%,#EDE6FF 100%);

  /* ---- Стекло (glassmorphism) для шапки и плавающих панелей ---- */
  --glass-bg:rgba(255,255,255,.72);
  --glass-border:rgba(255,255,255,.6);
  --glass-blur:18px;

  /* ---- Тени: мягкие, многослойные, без резких краёв ---- */
  --shadow-sm:0 4px 14px rgba(40,24,64,.06);
  --shadow:0 14px 34px rgba(50,28,74,.09);
  --shadow-lg:0 28px 64px rgba(45,24,70,.16);
  --shadow-inset:inset 0 0 0 1px rgba(255,255,255,.5);

  /* ---- Скругления по шкале Bento ---- */
  --radius-sm:12px;
  --radius-md:16px;
  --radius-lg:20px;
  --radius-xl:28px;
  --radius:20px; /* оставлено для обратной совместимости со старыми правилами */

  /* ---- Единая плавная анимация для интерактивных элементов ---- */
  --ease:all .3s cubic-bezier(.4,0,.2,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  color:var(--text);
  background:
    radial-gradient(680px 420px at 92% -6%, var(--bg-accent-1) 0%, transparent 62%),
    radial-gradient(720px 460px at -6% 12%, var(--bg-accent-2) 0%, transparent 60%),
    var(--bg);
  background-attachment:fixed;
}
button,input,select,textarea{font:inherit}
button{cursor:pointer}
h1,h2,.brand-word,.hero-brand,.section-head h2,.page-head h1,.map-spotlight-head h2,
.organizer-hero h1,.narrow h1,.split-promo h2,.event-detail-content h2,.event-detail-cover-title{
  font-family:"Manrope","Inter",ui-sans-serif,system-ui,sans-serif;
}
.ui-icon{display:inline-grid;place-items:center;color:currentColor;line-height:1}
.ui-icon svg{display:block;width:100%;height:100%;overflow:visible}
.ui-icon img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
::selection{background:rgba(111,79,242,.18)}

/* ---------- Top bar & nav (стеклянная шапка) ---------- */
.topbar{
  height:78px;background:var(--glass-bg);
  -webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));
  display:flex;align-items:center;gap:18px;padding:0 max(22px,calc((100vw - 1280px)/2));
  border-bottom:1px solid var(--glass-border);
  box-shadow:0 1px 0 rgba(30,20,50,.02),0 12px 30px rgba(40,24,64,.05);
  position:sticky;top:0;z-index:1000;
}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;color:var(--text);min-width:190px}
.brand-mark{width:40px;height:40px;border-radius:50%;display:block;overflow:hidden;flex:0 0 40px;box-shadow:0 6px 16px rgba(255,93,122,.32);transition:var(--ease)}
.brand:hover .brand-mark{transform:translateY(-1px) rotate(-2deg)}
.brand-mark img{display:block;width:100%;height:100%;object-fit:cover}
.brand-word{display:inline-flex;font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1}
.logo-letter{display:inline-block;color:inherit}
/* TAM-I-TAM: слова "TAM" — фиолетовые, буква "I" между ними — коралловая (акцент бренда) */
.brand-tam{background:linear-gradient(135deg,#8F6FF0,#5A3AD9);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-i{background:linear-gradient(135deg,#FF8FA8,#E5426A);-webkit-background-clip:text;background-clip:text;color:transparent;padding:0 .01em}
.brand small{display:block;font-size:10px;font-weight:600;color:var(--muted);margin-top:1px;letter-spacing:.01em;font-family:"Inter",sans-serif}

.search-wrap{flex:1}
.search-wrap input{width:100%;border:1.5px solid var(--line);background:var(--surface-warm);border-radius:var(--radius-sm);padding:12px 16px;outline:none;color:var(--text);transition:var(--ease)}
.search-wrap input:focus{border-color:var(--coral);background:var(--surface);box-shadow:0 0 0 4px rgba(255,93,122,.14)}
.top-actions{display:flex;gap:8px;align-items:center}
.top-actions select{border:1.5px solid var(--line);background:var(--surface);padding:10px 12px;border-radius:var(--radius-sm);color:var(--text);font-weight:600;transition:var(--ease)}
.top-actions select:hover{border-color:var(--coral)}

.btn{border:0;border-radius:var(--radius-sm);padding:11px 18px;font-weight:700;transition:var(--ease)}
.btn.primary{background:var(--sunset);color:#fff;box-shadow:0 10px 24px rgba(255,93,122,.32)}
.btn.primary:hover{filter:brightness(1.06);transform:translateY(-2px);box-shadow:0 14px 30px rgba(255,93,122,.4)}
.btn.primary:active{transform:translateY(0)}
.btn.ghost{background:var(--surface-warm);color:var(--text);border:1.5px solid var(--line)}
.btn.ghost:hover{border-color:var(--coral);background:var(--surface);transform:translateY(-1px)}
.btn.big{padding:14px 24px;font-size:15px}
.btn.danger{background:var(--red);color:#fff}
.btn.danger:hover{filter:brightness(1.08);transform:translateY(-1px)}
.btn.danger-ghost{background:#fff;color:var(--red);border:1.5px solid #f3c3c3}
.btn.danger-ghost:hover{background:#FFF3F2;transform:translateY(-1px)}
.mobile-menu{display:none;border:0;background:transparent;font-size:24px;color:var(--text)}

.subnav{display:flex;justify-content:center;gap:8px;background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--glass-blur));backdrop-filter:blur(var(--glass-blur));border-bottom:1px solid var(--glass-border);height:56px;align-items:center;flex-wrap:wrap}
.navlink,.text-btn{border:0;background:none;color:var(--muted);font-weight:700;padding:9px 14px;border-radius:999px;transition:var(--ease)}
.navlink:hover{color:var(--text);background:var(--surface-warm)}
.navlink.active{color:#fff;background:var(--sunset);box-shadow:0 8px 18px rgba(255,93,122,.28)}
.text-btn{color:var(--violet);padding:0}
.text-btn:hover{color:var(--violet-dark)}

/* ---------- Layout basics ---------- */
main{max-width:1280px;margin:0 auto;padding:26px 24px 40px}
.view{display:none}
.view.active{display:block;animation:viewFadeIn .35s ease}
@keyframes viewFadeIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.eyebrow{font-size:12px;font-weight:800;letter-spacing:.07em;color:var(--coral-dark);margin:0 0 8px;text-transform:uppercase}
.section-head,.page-head{display:flex;align-items:end;justify-content:space-between;margin:44px 0 18px;gap:16px}
.section-head h2,.page-head h1{margin:0;font-size:29px;font-weight:800;letter-spacing:-.02em}
.page-head h1{font-size:38px}
.page-head p:not(.eyebrow){color:var(--muted);margin:.4rem 0 0}
.result-count{color:var(--muted);font-weight:700}
.wave-divider{display:none}

/* ---------- Hero (bento-блок) ---------- */
.hero{border-radius:var(--radius-xl);overflow:visible;background:transparent;box-shadow:none;position:relative}
.hero-green{
  display:grid;grid-template-columns:1.05fr .95fr;gap:32px;align-items:center;
  background:var(--surface);border-radius:var(--radius-xl);padding:46px 48px;position:relative;overflow:hidden;
  box-shadow:var(--shadow-lg);border:1px solid rgba(255,255,255,.7);
}
.hero-green::before{content:"";position:absolute;left:-90px;top:-120px;width:340px;height:340px;border-radius:50%;background:var(--sunset-soft);opacity:.85;filter:blur(6px)}
.hero-copy-green{position:relative;z-index:1;padding-right:6px}
.hero-kicker{margin:0 0 14px;color:var(--coral-dark);font-size:12px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.hero-copy-green h1{margin:0}
.hero-brand{display:inline-block;font-size:74px;line-height:.92;letter-spacing:-.03em;font-weight:800}
/* Декоративный рукописный акцент заменён на чистую типографику Manrope */
.hero-script{margin:12px 0 16px;font-family:"Manrope","Inter",sans-serif;font-size:21px;font-weight:700;line-height:1.35;color:var(--violet-dark);letter-spacing:-.01em}
.hero-lead{margin:0 0 20px;max-width:520px;font-size:17px;line-height:1.6;color:var(--muted)}
.hero-mini-note{display:inline-flex;align-items:center;gap:8px;padding:10px 15px;background:var(--surface-warm);border:1px solid var(--line);border-radius:999px;color:var(--text);font-size:13px;font-weight:700;margin-bottom:20px}
.hero-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-top:0}
.calendar-tab-wrap{position:relative;display:inline-flex}
.calendar-date-input{position:absolute;inset:0;width:100%;height:100%;opacity:.001;pointer-events:none;border:0;z-index:3;cursor:pointer;-webkit-appearance:none;appearance:none}
.pill,.chip{border:1.5px solid var(--line);background:var(--surface);color:var(--text);border-radius:999px;padding:10px 18px;font-weight:700;transition:var(--ease)}
.pill:hover,.chip:hover{border-color:var(--coral);transform:translateY(-1px)}
.hero .pill{background:var(--surface-warm);border-color:var(--line)}
.pill.active,.chip.active{background:var(--sunset);color:#fff;border-color:transparent;box-shadow:0 8px 18px rgba(255,93,122,.28)}

.hero-visuals-green{position:relative;min-height:420px;display:flex;align-items:center;justify-content:center;z-index:1}
.hero-photo-frame{
  position:relative;width:100%;max-width:420px;aspect-ratio:1/1;border-radius:50%;overflow:hidden;
  display:flex;align-items:flex-end;justify-content:center;
  background:
    radial-gradient(circle at 30% 26%, rgba(255,178,56,.55) 0 10%, transparent 11%),
    radial-gradient(circle at 76% 22%, rgba(255,93,143,.55) 0 9%, transparent 9.6%),
    radial-gradient(circle at 80% 78%, rgba(111,79,242,.5) 0 9%, transparent 9.6%),
    radial-gradient(circle at 50% 46%, #FFF3E6 0 46%, #FFE4D3 66%, #FFD9E4 100%);
  box-shadow:0 24px 50px rgba(120,60,70,.18);
}
.hero-photo-main{width:112%;height:auto;object-fit:contain;transform:translateY(10px);filter:drop-shadow(0 14px 18px rgba(70,35,50,.16))}
.hero-heart{position:absolute;display:block;border-radius:50%;background:var(--amber)}
.hero-heart-big{width:22px;height:22px;right:126px;top:8px;background:var(--amber)}
.hero-heart-small{width:14px;height:14px;right:34px;top:76px;background:var(--violet)}

/* ---------- Homepage map spotlight ---------- */
.map-spotlight{margin:26px 0 12px;background:transparent;border:0;border-radius:0;padding:0;box-shadow:none}
.map-spotlight-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:16px}
.map-spotlight-head h2{margin:0;font-size:30px;font-weight:800;letter-spacing:-.02em}
.map-spotlight-shell{background:var(--surface);border-radius:var(--radius-xl);padding:16px;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.7)}
#map{height:560px;border-radius:var(--radius-lg);border:0;box-shadow:none;overflow:hidden}
.leaflet-popup-content-wrapper{border-radius:var(--radius-md)}
.map-popup{min-width:205px}
.map-popup h3{margin:0 0 6px;display:flex;align-items:center;gap:8px;font-size:17px}
.map-popup h3 .ui-icon{width:20px;height:20px;color:var(--violet);flex:0 0 20px}
.map-popup p{margin:4px 0;color:var(--muted)}
.map-popup .map-more-btn{width:100%;margin-top:8px;border:0;border-radius:var(--radius-sm);background:var(--sunset);color:#fff;padding:10px 12px;font-weight:800;cursor:pointer;transition:var(--ease)}
.map-popup .map-more-btn:hover{filter:brightness(1.06)}
.map-cancelled{display:inline-block;background:var(--red);color:#fff;border-radius:999px;padding:3px 7px;font-size:10px;font-weight:900;margin-bottom:5px}

/* ---------- Category grid (bento-плитки категорий, цвета из JS) ---------- */
.filter-heading{margin-top:40px}
.filter-heading-note{color:var(--muted);font-size:12px;font-weight:700}
.category-grid{display:grid;grid-template-columns:repeat(9,1fr);gap:12px;margin:16px 0}
.category{
  background:var(--surface);border:1.5px solid var(--line);border-radius:var(--radius-lg);
  padding:16px 10px 14px;text-align:center;box-shadow:var(--shadow-sm);transition:var(--ease);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:122px;
}
.category.active{
  transform:translateY(-4px);
  background:linear-gradient(145deg,#FFF0F3 0%,#FFE0E7 100%);
  border-color:#FF4968;
  box-shadow:0 10px 24px rgba(255,73,104,.26),0 0 0 3px rgba(255,73,104,.12)
}
.category.active .icon{transform:scale(1.09)}
.category.active .label{color:#B81838}
@media(hover:hover) and (pointer:fine){
  .category:hover:not(.active){
    transform:translateY(-3px);
    border-color:var(--cat-border,var(--coral));
    box-shadow:var(--shadow)
  }
  .category:hover .icon{transform:scale(1.06)}
}
.category .icon{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;background:transparent;border:0;line-height:1;margin:0;box-shadow:var(--shadow-sm);transition:var(--ease)}
.category .icon .ui-icon{width:60px;height:60px}
.category .label{font-size:12.5px;font-weight:800;line-height:1.15;color:var(--text);transition:var(--ease)}

/* ---------- Filters ---------- */
.filters-panel{display:flex;gap:28px;justify-content:space-between;background:var(--surface);border:1px solid var(--line);padding:15px 18px;border-radius:var(--radius-lg);flex-wrap:wrap;box-shadow:var(--shadow-sm)}
.filter-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.filter-row b{font-weight:700;color:var(--text)}
.chip{padding:8px 13px;font-size:13px;background:var(--surface-warm)}
.chip.active{background:var(--violet);color:#fff;border-color:var(--violet)}

/* ---------- Event cards ---------- */
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}

/* ---------- Карусель «События сегодня» на главной ---------- */
.cards-carousel-wrap{position:relative;margin:0 -24px;padding:0 24px}
.cards-carousel-wrap::after{content:"";position:absolute;top:0;right:0;bottom:8px;width:56px;background:linear-gradient(90deg,transparent,var(--bg));pointer-events:none}
.cards-carousel{
  display:flex;gap:18px;overflow-x:auto;overflow-y:hidden;padding:4px 4px 16px;
  scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--line) transparent;
  cursor:grab;
}
.cards-carousel.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.cards-carousel.dragging .event-card{pointer-events:none}
.cards-carousel::-webkit-scrollbar{height:8px}
.cards-carousel::-webkit-scrollbar-track{background:transparent}
.cards-carousel::-webkit-scrollbar-thumb{background:var(--line);border-radius:999px}
.cards-carousel::-webkit-scrollbar-thumb:hover{background:var(--coral)}
.cards-carousel .event-card{flex:0 0 280px;scroll-snap-align:start}
.carousel-sentinel{flex:0 0 1px;align-self:stretch}
.carousel-loading{
  flex:0 0 140px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  color:var(--muted);font-size:12px;font-weight:700;
}
.carousel-spinner{
  width:28px;height:28px;border-radius:50%;border:3px solid var(--line);border-top-color:var(--coral);
  animation:carouselSpin .7s linear infinite;
}
@keyframes carouselSpin{to{transform:rotate(360deg)}}
.event-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);transition:var(--ease);display:flex;flex-direction:column}
.event-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.event-image{height:172px;position:relative;background:linear-gradient(145deg,#FF7A59,#FF5D8F 55%,#6F4FF2);overflow:hidden}
.event-image:not(.has-photo):before,.event-image:not(.has-photo):after{content:"";position:absolute;border-radius:50%;filter:blur(2px)}
.event-image:not(.has-photo):before{width:160px;height:160px;right:-22px;top:-40px;background:rgba(255,255,255,.18)}
.event-image:not(.has-photo):after{width:90px;height:90px;left:18px;bottom:-34px;background:rgba(255,178,56,.24)}
.event-cover-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s ease}
.event-card:hover .event-cover-photo{transform:scale(1.04)}
.event-image.has-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,10,25,.02) 35%,rgba(20,10,25,.58) 100%)}
.event-title-cover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:28px 22px 42px;color:#fff;font-size:22px;line-height:1.1;font-weight:800;letter-spacing:-.02em;text-shadow:0 2px 10px rgba(0,0,0,.24);z-index:1;font-family:"Manrope",sans-serif}
.badge-time{position:absolute;left:12px;bottom:12px;background:rgba(30,26,43,.85);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;padding:6px 10px;border-radius:var(--radius-sm);font-size:12px;font-weight:800;z-index:2}
.cancelled-ribbon{position:absolute;left:10px;top:10px;z-index:4;background:var(--red);color:#fff;border-radius:999px;padding:6px 9px;font-size:10px;font-weight:900;letter-spacing:.03em}
.recurring-badge{position:absolute;right:12px;bottom:12px;z-index:2;background:rgba(36,26,46,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;border-radius:var(--radius-sm);padding:6px 9px;font-size:10.5px;font-weight:800;white-space:nowrap}
.heart{position:absolute;right:10px;top:10px;background:rgba(255,255,255,.94);border:0;width:34px;height:34px;border-radius:50%;font-size:18px;z-index:2;color:var(--text);transition:var(--ease)}
.heart:hover{transform:scale(1.1)}
.heart.saved{color:var(--coral-dark)}
.event-body{padding:15px;display:flex;flex-direction:column;gap:7px;flex:1}
.festival-meta-row{display:flex;justify-content:space-between;gap:8px;font-size:11.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.event-body h3{margin:0;font-size:17px;line-height:1.25;font-weight:800;font-family:"Manrope",sans-serif}
.meta{font-size:13px;color:var(--muted)}
.event-contact{font-size:12.5px;color:var(--muted)}
.event-description{color:var(--muted);font-size:13px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tags,.festival-tags{display:flex;gap:6px;flex-wrap:wrap}
.tag{background:var(--surface-warm);color:var(--violet-dark);border-radius:999px;font-size:11px;font-weight:800;padding:5px 9px}
.festival-footer{display:flex;align-items:center;margin-top:2px}
.price{font-weight:800}
.price.free{color:var(--teal-dark)}
.price.donation{color:var(--amber-dark)}
.card-actions,.festival-actions{display:flex;gap:7px;margin-top:6px;flex-wrap:wrap}
.small-btn{border:1px solid var(--line);background:var(--surface);border-radius:var(--radius-sm);padding:8px 11px;font-weight:800;font-size:12px;color:var(--text);transition:var(--ease)}
.small-btn:hover{border-color:var(--coral);transform:translateY(-1px)}
.small-btn.primary{background:var(--violet);color:#fff;border-color:var(--violet)}
.small-btn.primary:hover{filter:brightness(1.08)}
.owner-action{border-color:var(--violet);background:#F1ECFF;color:var(--violet-dark)}
.report-action{color:var(--muted)}
.cancel-status-text{align-self:center;color:var(--red);font-size:11px;font-weight:800;padding:7px 2px}

/* ---------- Organizer promo split (bento-панель) ---------- */
.split-promo{margin:40px 0;background:var(--sunset-soft);border:1px solid #F5DCEA;border-radius:var(--radius-xl);padding:36px;display:grid;grid-template-columns:1.3fr 1fr;gap:32px;box-shadow:var(--shadow-sm)}
.split-promo h2{font-size:31px;margin:0 0 10px;font-weight:800;letter-spacing:-.02em}
.promo-points{display:grid;gap:13px;align-content:center}
.promo-points span{background:rgba(255,255,255,.8);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.7);padding:13px 15px;border-radius:var(--radius-md);font-weight:700;transition:var(--ease)}
.promo-points span:hover{transform:translateX(3px)}

/* ---------- Organizer page ---------- */
.organizer-hero{display:grid;grid-template-columns:1.2fr 1fr;gap:30px;align-items:center;background:linear-gradient(150deg,#2B1E3F,#5A3AD9 55%,#E5426A);color:#fff;border-radius:var(--radius-xl);padding:56px;box-shadow:var(--shadow-lg)}
.organizer-hero .eyebrow{color:#FFD9A8}
.organizer-hero h1{font-size:42px;margin:0 0 12px;font-weight:800;letter-spacing:-.02em}
.organizer-hero p{font-size:17px;color:#EDE3FF}
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.stat-grid div{background:rgba(255,255,255,.14);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.22);border-radius:var(--radius-md);padding:20px;transition:var(--ease)}
.stat-grid div:hover{background:rgba(255,255,255,.2);transform:translateY(-2px)}
.stat-grid b{font-size:24px;display:block;font-family:"Manrope",sans-serif}
.stat-grid span{font-size:13px;color:#EDE3FF}
.steps,.about-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin:26px 0}
.steps article,.about-grid article{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:26px;box-shadow:var(--shadow-sm);transition:var(--ease)}
.steps article:hover,.about-grid article:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.steps article span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--sunset);color:#fff;font-weight:800}
.narrow{max-width:900px;margin:auto}
.narrow h1{font-size:40px;font-weight:800;letter-spacing:-.02em}
.lead{font-size:19px;color:var(--muted);line-height:1.6}
footer{text-align:center;color:var(--muted);padding:34px 20px 46px}

/* ---------- My events ---------- */
.my-events-head{align-items:flex-start}
.my-events-head p{max-width:720px;color:var(--muted);line-height:1.5}
.my-events-note{display:flex;gap:12px;align-items:flex-start;background:var(--surface-warm);border:1px solid var(--line);border-radius:var(--radius-lg);padding:15px 17px;margin:0 0 24px;color:var(--text)}
.my-events-note>span{font-size:22px}
.my-events-note small{color:var(--muted);line-height:1.45}
.my-events-recovery{margin:22px 0 10px;text-align:center}
.my-events-empty{grid-column:1/-1;text-align:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:48px 24px;box-shadow:var(--shadow-sm)}
.my-events-empty-icon{font-size:42px;margin-bottom:8px}
.my-events-empty h3{margin:6px 0}
.my-events-empty p{color:var(--muted);margin:0 0 18px}
.recovery-link{margin-top:10px}
.recovery-code-box{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:16px;padding:14px 15px;border:1.5px dashed #E6C9D4;background:var(--surface-warm);border-radius:var(--radius-md)}
.recovery-code-box>div{display:grid;gap:2px}
.recovery-code-box span{font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.recovery-code-box b{font-size:18px;letter-spacing:.12em;color:var(--text)}
.recovery-code-box small{color:var(--muted);line-height:1.35}
.expiry-badge{display:inline-flex;align-items:center;gap:5px;background:#FFF1D6;color:var(--amber-dark);border-radius:999px;padding:5px 8px;font-size:10px;font-weight:800}

/* ---------- Modals ---------- */
.modal-backdrop{position:fixed;inset:0;background:rgba(30,20,45,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2000;display:grid;place-items:center;padding:20px}
.modal-backdrop[hidden]{display:none!important}
.modal{background:var(--surface);width:min(760px,100%);max-height:92vh;overflow:auto;border-radius:var(--radius-xl);padding:30px;box-shadow:var(--shadow-lg);position:relative}
.modal-close{position:absolute;right:18px;top:16px;border:0;background:var(--surface-warm);width:36px;height:36px;border-radius:50%;font-size:22px;color:var(--text);transition:var(--ease)}
.modal-close:hover{background:var(--line);transform:rotate(90deg)}
.modal h2{margin-top:0;font-weight:800;letter-spacing:-.02em}
.manage-modal{max-width:560px}
.manage-event-name{font-weight:800;color:var(--text);margin:2px 0 16px}
.manage-actions{display:grid;gap:10px}
.manage-actions .btn{width:100%;justify-content:center}
.manage-help{color:var(--muted);font-size:12px;line-height:1.45;margin:15px 0 0}
.required-star{color:var(--red);font-weight:900;margin-left:2px}
.required-note{margin:-4px 0 14px;color:var(--muted);font-size:12px;font-weight:600}
.required-note .required-star{font-size:15px}

.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-grid label{font-size:13px;font-weight:800;display:grid;gap:6px;color:var(--text)}
.form-grid [hidden]{display:none!important}
.form-grid .full{grid-column:1/-1}
.form-grid input,.form-grid select,.form-grid textarea{border:1.5px solid var(--line);border-radius:var(--radius-sm);padding:11px 12px;outline:none;background:var(--surface);color:var(--text);transition:var(--ease)}
.form-grid input:focus,.form-grid textarea:focus,.form-grid select:focus{border-color:var(--coral);box-shadow:0 0 0 4px rgba(255,93,122,.14)}
.form-note{background:var(--surface-warm);color:var(--muted);border-radius:var(--radius-sm);padding:12px;margin:15px 0}
.field-label{font-size:13px;font-weight:800;margin-bottom:6px}
.field-hint{font-weight:600;color:var(--muted);font-size:11px;margin-left:5px}

/* ---------- Image upload / crop editor ---------- */
.image-upload-box{display:grid;grid-template-columns:220px 1fr;gap:14px;padding:12px;border:1.5px solid var(--line);border-radius:var(--radius-md);background:var(--surface-warm)}
.image-preview{height:124px;border-radius:var(--radius-sm);overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center;text-align:center;padding:18px;background:var(--sunset);color:#fff;font-size:18px;font-weight:800;line-height:1.1}
.image-preview img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.image-preview .preview-title{position:relative;z-index:2;text-shadow:0 2px 10px rgba(0,0,0,.2)}
.image-upload-controls{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:9px}
.image-upload-controls small{color:var(--muted);font-weight:500;line-height:1.35}
.image-upload-button{display:inline-flex;align-items:center;justify-content:center;background:var(--violet);color:#fff;border-radius:var(--radius-sm);padding:10px 14px;font-weight:800;cursor:pointer;transition:var(--ease)}
.image-upload-button input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.image-upload-button:hover{filter:brightness(1.08);transform:translateY(-1px)}
.image-editor{min-width:0}
.image-preview{padding:0;touch-action:none;user-select:none}
.image-preview.is-cropping{cursor:grab}
.image-preview.is-dragging{cursor:grabbing}
.image-preview canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.crop-drag-hint{position:absolute;left:50%;bottom:8px;transform:translateX(-50%);z-index:3;background:rgba(36,26,46,.75);color:#fff;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:800;white-space:nowrap;pointer-events:none}
.crop-controls{display:grid;grid-template-columns:34px minmax(90px,1fr) 34px auto auto;gap:7px;align-items:center;margin-top:8px}
.crop-controls[hidden]{display:none!important}
.zoom-btn{width:34px;height:32px;border:1.5px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);font-size:20px;font-weight:800;color:var(--text);transition:var(--ease)}
.zoom-btn:hover{background:var(--surface-warm);border-color:var(--coral)}
.crop-controls #zoomValue{font-size:11px;font-weight:800;color:var(--muted);min-width:40px;text-align:center}
.crop-reset{padding:7px 9px}

/* ---------- Category chooser in the form ---------- */
.category-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.category-choice{display:block;position:relative;cursor:pointer}
.category-choice input{position:absolute;opacity:0;pointer-events:none;width:1px;height:1px}
.category-choice-box{display:flex;align-items:center;gap:10px;border:1.5px solid var(--line);background:var(--surface);border-radius:var(--radius-md);padding:10px 11px;min-height:50px;font-size:12px;font-weight:800;transition:var(--ease)}
.category-choice-icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:transparent;border:0;line-height:1;flex:0 0 38px}
.category-choice-icon .ui-icon{width:38px;height:38px}
.category-choice-label{line-height:1.2;color:var(--text)}
.category-choice input:checked + .category-choice-box{background:var(--cat-label-bg,#FFF5F8);border-color:var(--cat-accent,#E5426A);color:var(--cat-accent,#E5426A);box-shadow:0 0 0 3px rgba(255,93,122,.12)}
.category-choice input:focus-visible + .category-choice-box{outline:3px solid #FFD9E4;outline-offset:1px}
.category-help{display:block;margin-top:7px;color:var(--muted);font-weight:500;line-height:1.35}
.category-field.invalid .category-options{outline:2px solid var(--red);outline-offset:3px;border-radius:var(--radius-sm)}
.category-field.invalid .category-help{color:var(--red);font-weight:700}

/* ---------- Address input & map picker ---------- */
.address-field{position:relative}
.address-input-wrap{position:relative;display:grid;grid-template-columns:1fr auto;gap:8px}
.address-input-wrap input{min-width:0}
.map-pick-btn{border:1.5px solid var(--line);background:var(--surface-warm);color:var(--text);border-radius:var(--radius-sm);padding:10px 12px;font-weight:800;white-space:nowrap;transition:var(--ease)}
.map-pick-btn:hover{background:#FFEADD;border-color:var(--amber);transform:translateY(-1px)}
.address-help{font-weight:500;color:var(--muted);line-height:1.35}
.address-suggestions{position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:2300;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);overflow:hidden;max-height:280px;overflow-y:auto}
.address-suggestions[hidden]{display:none!important}
.address-suggestion{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid var(--line);background:var(--surface);padding:10px 12px;transition:var(--ease)}
.address-suggestion:last-child{border-bottom:0}
.address-suggestion:hover,.address-suggestion.active{background:var(--surface-warm)}
.address-suggestion b{display:block;color:var(--text);font-size:13px}
.address-suggestion span{display:block;color:var(--muted);font-size:11px;margin-top:3px;line-height:1.35}
.address-map-panel{border:1.5px solid var(--line);background:var(--surface-warm);border-radius:var(--radius-md);padding:12px}
.address-map-panel[hidden]{display:none!important}
.address-map-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:10px}
.address-map-head span{display:block;color:var(--muted);font-size:12px;margin-top:3px}
.address-map-panel #addressPickerMap{height:320px;border-radius:var(--radius-md);overflow:hidden;border:1px solid var(--line)}
.picked-location{font-size:12px;color:var(--muted);margin-top:9px}
.picked-location.ok{color:var(--teal-dark);font-weight:700}

/* ---------- Recurrence / management ---------- */
.recurrence-note{background:#F1ECFF;border:1px solid #DCCCFF;color:var(--violet-dark);border-radius:var(--radius-sm);padding:10px 12px;font-size:12px;font-weight:650;line-height:1.4}
.renewal-reminder{background:#FFF6E2;border:1px solid #F5DFA0;border-radius:var(--radius-sm);padding:11px 12px;font-size:12px;line-height:1.45}
.renewal-reminder>span{display:flex;align-items:center;gap:9px;font-weight:800}
.renewal-reminder input[type=checkbox]{width:17px;height:17px;accent-color:var(--violet);margin:0;padding:0}
.renewal-reminder small{font-weight:600;color:#7A6A3B}
.event-card.cancelled{opacity:.78}
.event-card.cancelled .event-image{filter:grayscale(.35)}
.organizer-buttons{display:flex;gap:10px;flex-wrap:wrap}
.organizer-buttons .btn{min-height:46px}

/* ---------- Event map markers ---------- */
.event-map-div-icon{background:transparent!important;border:0!important}
.event-map-marker{display:flex;align-items:center;gap:7px;width:172px;filter:drop-shadow(0 6px 12px rgba(50,26,66,.18));transform:translateY(-1px);transition:var(--ease)}
.event-map-thumb{width:46px;height:46px;border-radius:50%;flex:0 0 46px;border:2px solid var(--marker-border,#F0E2D6);background:var(--marker-bg,#FFF6EE);overflow:hidden;display:grid;place-items:center;box-shadow:0 0 0 2px rgba(255,255,255,.9),0 6px 14px rgba(60,30,40,.12);transition:var(--ease)}
.event-map-thumb img,.event-map-thumb-image{width:100%;height:100%;object-fit:contain;object-position:center;display:block;background:#fff}
.event-map-thumb .event-map-fallback{width:100%;height:100%;display:grid;place-items:center;color:var(--marker-accent,#6F4FF2);background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.92),rgba(255,255,255,.42) 38%,transparent 39%),var(--marker-bg,#FFF6EE)}
.event-map-thumb .event-map-fallback .ui-icon{width:22px;height:22px}
.event-map-label{
  max-width:116px;
  background:var(--marker-label-bg,#fff);
  border:1px solid var(--marker-border,#F0E2D6);
  border-radius:var(--radius-sm);
  padding:6px 8px;
  color:var(--text);
  font:800 10.5px/1.2 Inter,sans-serif;
  white-space:normal;
  overflow:hidden;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:3;
  line-clamp:3;
  height:auto;
  min-height:0;
  max-height:calc(3 * 1.2em + 12px);
  box-shadow:0 5px 12px rgba(60,30,40,.08)
}
.event-map-marker:hover .event-map-label{border-color:var(--marker-accent,#FF5D7A)}
.event-map-marker:hover .event-map-thumb{transform:scale(1.08)}

/* ---------- Event detail modal ---------- */
.event-detail-backdrop{position:fixed;inset:0;z-index:2600;background:rgba(30,20,45,.45);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:grid;place-items:center;padding:22px;opacity:1;transition:opacity .22s ease}
.event-detail-backdrop[hidden]{display:none!important}
.event-detail-backdrop.is-closing{opacity:0}
.event-detail-modal{--origin-x:50%;--origin-y:50%;width:min(880px,100%);max-height:min(88vh,900px);overflow:auto;background:var(--surface);border-radius:var(--radius-xl);box-shadow:0 36px 90px rgba(25,15,40,.34);position:relative;transform-origin:var(--origin-x) var(--origin-y);animation:eventDetailOpen .34s cubic-bezier(.2,.78,.25,1);overflow-x:hidden}
.event-detail-modal.is-closing{animation:eventDetailClose .2s ease forwards}
@keyframes eventDetailOpen{0%{opacity:0;transform:translateY(18px) scale(.78);filter:blur(2px)}60%{opacity:1}100%{opacity:1;transform:translateY(0) scale(1);filter:none}}
@keyframes eventDetailClose{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:translateY(10px) scale(.88)}}
.event-detail-close{position:absolute;top:16px;right:16px;z-index:5;width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--text);font-size:24px;line-height:1;box-shadow:var(--shadow);transition:var(--ease)}
.event-detail-close:hover{transform:scale(1.08) rotate(90deg);background:#fff}
.event-detail-cover{height:320px;position:relative;overflow:hidden;background:linear-gradient(145deg,#FF7A59,#FF5D8F 55%,#6F4FF2)}
.event-detail-cover img{width:100%;height:100%;display:block;object-fit:cover}
.event-detail-cover.no-photo{display:grid;place-items:center;padding:40px;text-align:center;color:#fff}
.event-detail-cover-title{position:relative;z-index:1;max-width:650px;font-size:36px;line-height:1.06;font-weight:800;letter-spacing:-.02em;text-shadow:0 4px 18px rgba(0,0,0,.2)}
.event-detail-cancelled{position:absolute;left:22px;top:22px;z-index:3;background:var(--red);color:#fff;border-radius:999px;padding:8px 12px;font-size:12px;font-weight:900;letter-spacing:.04em}
.event-detail-content{padding:28px 32px 32px}
.event-detail-topline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:var(--muted);font-weight:700;font-size:13px;margin-bottom:8px}
.event-detail-topline .recurring{background:#F1ECFF;color:var(--violet-dark);padding:5px 9px;border-radius:999px}
.event-detail-content h2{font-size:32px;line-height:1.1;letter-spacing:-.02em;margin:0 0 20px;font-weight:800}
.event-detail-meta-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.event-detail-meta{background:var(--surface-warm);border:1px solid var(--line);border-radius:var(--radius-md);padding:12px 13px;min-height:72px}
.event-detail-meta span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:800;margin-bottom:5px}
.event-detail-meta b{font-size:13px;color:var(--text);line-height:1.3;display:block}
.event-detail-categories{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 4px}
.event-detail-category{display:inline-flex;align-items:center;gap:6px;border-radius:999px;padding:7px 10px;background:var(--cat-label-bg,#FFF5F8);border:1px solid var(--cat-border,#FFB8CE);color:var(--cat-accent,#E5426A);font-size:12px;font-weight:800}
.event-detail-category .ui-icon{width:18px;height:18px}
.event-detail-description{margin-top:23px;padding-top:20px;border-top:1px solid var(--line)}
.event-detail-description h3,.event-detail-organizer h3{font-size:15px;margin:0 0 8px}
.event-detail-description p{margin:0;color:var(--muted);font-size:15px;line-height:1.65;white-space:pre-wrap}
.event-detail-organizer{margin-top:18px;background:var(--surface-warm);border:1px solid var(--line);border-radius:var(--radius-md);padding:16px 18px}
.event-detail-organizer p{margin:4px 0;color:var(--muted);font-size:13px}
.event-detail-organizer a{color:var(--violet);text-decoration:none;font-weight:800}
.event-detail-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.event-detail-actions .btn,.event-detail-actions a.btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center}
.event-detail-actions .route-btn{background:#EEF3FF;color:#2A4B9E}
.event-detail-actions .route-btn:hover{background:#E1E9FF}
.event-detail-actions .share-detail-btn{background:var(--surface-warm);color:var(--text)}
.event-detail-actions .manage-detail-btn{background:#F1ECFF;color:var(--violet-dark)}
.event-detail-actions .report-detail-btn{background:#FFF1EF;color:#A93B31;border:1px solid #F0C6C1}

/* ---------- Toast ---------- */
.toast{position:fixed;right:22px;bottom:22px;background:var(--text);color:#fff;padding:13px 17px;border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);z-index:3000;opacity:0;transform:translateY(12px);pointer-events:none;transition:.25s}
.toast.show{opacity:1;transform:none}

/* ---------- Responsive (mobile-first overrides) ---------- */
@media(max-width:1100px){
  .top-actions .ghost{display:none}
  .top-actions #uiLang{display:block}
  .category-grid{grid-template-columns:repeat(5,1fr)}
  .cards{grid-template-columns:repeat(3,1fr)}
  .filters-panel{flex-direction:column;gap:10px}
  .organizer-hero{grid-template-columns:1fr}
  .hero-green{grid-template-columns:1fr;padding:32px 28px}
  .hero-brand{font-size:60px}
  .split-promo{grid-template-columns:1fr}
}
@media(max-width:760px){
  .topbar{height:auto;padding:12px 14px;flex-wrap:wrap}
  .brand{min-width:auto}
  .brand small{display:none}
  .brand-word{font-size:21px}
  .search-wrap,.top-actions{display:none}
  .mobile-menu{display:block;margin-left:auto;color:var(--text)}
  .subnav{position:fixed;left:0;right:0;bottom:0;z-index:1200;height:64px;gap:0;justify-content:space-around;border-top:1px solid var(--line);border-bottom:0;background:var(--glass-bg)}
  .subnav .navlink{font-size:11px;padding:10px 6px;border-radius:0}
  .subnav .navlink.active{background:transparent;color:var(--coral-dark)}
  .subnav .navlink:nth-child(4),.subnav .navlink:nth-child(5){display:none}
  main{padding:14px 14px 84px}
  .hero-green{padding:26px 20px;border-radius:var(--radius-xl);gap:20px}
  .hero-brand{font-size:46px}
  .hero-script{font-size:17px}
  .hero-lead{font-size:15px}
  .hero-mini-note{font-size:12px}
  .hero-visuals-green{min-height:300px}
  .hero-photo-frame{max-width:280px}
  .map-spotlight-head{flex-direction:column;align-items:flex-start;gap:12px}
  #map{height:400px}
  .section-head,.page-head{display:block}
  .section-head h2,.page-head h1{font-size:25px}
  .category-grid{grid-template-columns:repeat(4,1fr);overflow:hidden}
  .category:nth-child(n+9){display:none}
  .filters-panel{overflow-x:auto}
  .filter-row{min-width:max-content}
  .cards{grid-template-columns:1fr}
  .cards-carousel-wrap{margin:0 -14px;padding:0 14px}
  .cards-carousel .event-card{flex-basis:238px;display:flex;flex-direction:column}
  .cards-carousel .event-image{height:172px;min-height:0}
  .event-card{display:grid;grid-template-columns:130px 1fr}
  .event-image{height:auto;min-height:170px}
  .recurring-badge{left:10px;right:auto;top:10px;bottom:auto;padding:5px 7px;font-size:0}
  .recurring-badge::before{content:"↻";font-size:13px}
  .cancelled-ribbon~.recurring-badge{top:40px}
  .event-body{padding:12px}
  .split-promo{padding:24px}
  .split-promo h2{font-size:25px}
  .organizer-hero{padding:28px 22px}
  .organizer-hero h1,.narrow h1{font-size:30px}
  .stat-grid{grid-template-columns:1fr 1fr}
  .steps,.about-grid{grid-template-columns:1fr}
  .form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:auto}
  .modal{padding:24px 18px}
  .image-upload-box{grid-template-columns:1fr}
  .image-preview{height:170px}
  .image-upload-controls{align-items:stretch}
  .image-upload-button{width:100%}
  .category-options{grid-template-columns:repeat(2,minmax(0,1fr))}
  .crop-controls{grid-template-columns:34px 1fr 34px auto}
  .crop-reset{grid-column:1/-1}
  .event-map-marker{width:165px}
  .event-map-label{max-width:102px;font-size:10px}
  .address-input-wrap{grid-template-columns:1fr}
  .map-pick-btn{width:100%}
  .address-map-head{align-items:flex-start;flex-direction:column}
  .address-map-panel #addressPickerMap{height:280px}
  .recovery-code-box{align-items:flex-start;flex-direction:column}
  .my-events-note{font-size:13px}
  .organizer-buttons{display:grid}
  .organizer-buttons .btn{width:100%}
  .event-detail-backdrop{padding:8px;align-items:end}
  .event-detail-modal{width:100%;max-height:93vh;border-radius:var(--radius-xl) var(--radius-xl) 0 0;animation-name:eventDetailOpenMobile}
  .event-detail-cover{height:220px}
  .event-detail-content{padding:22px 18px 26px}
  .event-detail-content h2{font-size:26px}
  .event-detail-meta-grid{grid-template-columns:1fr 1fr}
  .event-detail-cover-title{font-size:28px}
    @keyframes eventDetailOpenMobile{0%{opacity:0;transform:translateY(60px) scale(.96)}100%{opacity:1;transform:none}}
}


/* ---------- Organizer account / Supabase Auth ---------- */
.auth-modal{max-width:520px}
.auth-lead{color:var(--muted);margin-top:-6px;margin-bottom:20px;line-height:1.5}
.auth-field{display:grid;gap:7px;font-weight:700;margin:14px 0}
.auth-field input{width:100%;box-sizing:border-box;border:1px solid rgba(20,38,27,.14);border-radius:14px;padding:13px 14px;font:inherit;background:#fff;outline:none}
.auth-field input:focus{border-color:rgba(77,160,45,.65);box-shadow:0 0 0 3px rgba(112,205,72,.12)}
.auth-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.auth-note{font-size:13px;line-height:1.45;color:var(--muted);margin:18px 0 0}
.account-card{display:grid;gap:6px;padding:16px;border-radius:18px;background:rgba(193,255,95,.18);margin:14px 0 18px}
.account-card span,.account-card small{color:var(--muted)}
.account-card b{font-size:18px;overflow-wrap:anywhere}
.my-events-account-actions{margin-top:10px}
.btn.compact{padding:8px 12px;font-size:13px}
#loginBtn.account-active{max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:700px){
  .auth-modal{width:min(92vw,520px)}
  .auth-actions{display:grid;grid-template-columns:1fr}
  .auth-actions .btn{width:100%}
}


/* ---------- Mobile menu drawer ---------- */
.mobile-drawer-backdrop{
  position:fixed;inset:0;background:rgba(20,24,22,.34);z-index:2400;
  opacity:0;transition:opacity .22s ease
}
.mobile-drawer-backdrop.open{opacity:1}
.mobile-drawer{
  position:fixed;top:0;right:0;bottom:0;width:min(86vw,340px);z-index:2500;
  background:var(--surface);box-shadow:-18px 0 40px rgba(20,30,24,.18);
  padding:18px;transform:translateX(104%);transition:transform .24s ease;
  display:flex;flex-direction:column;gap:18px
}
.mobile-drawer.open{transform:translateX(0)}
.mobile-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:4px 2px 12px}
.mobile-drawer-head b{font-size:20px}
.mobile-drawer-close{border:0;background:transparent;font-size:32px;line-height:1;color:var(--text);padding:2px 6px}
.mobile-drawer-actions{display:grid;gap:10px}
.mobile-drawer-btn{width:100%;text-align:left}
body.mobile-drawer-open{overflow:hidden}

@media(min-width:761px){
  .mobile-drawer,.mobile-drawer-backdrop{display:none!important}
}

.edit-event-hint{
  margin:0 0 16px;padding:11px 13px;border-radius:14px;
  background:rgba(193,255,95,.18);color:var(--muted);font-size:13px;line-height:1.45
}


/* ---------- Moderation ---------- */
.moderation-ribbon{
  position:absolute;left:10px;bottom:10px;z-index:5;
  padding:6px 9px;border-radius:999px;font-size:10px;font-weight:900;letter-spacing:.04em;
  box-shadow:0 4px 14px rgba(0,0,0,.12)
}
.moderation-ribbon.pending{background:#FFF4C8;color:#785A00}
.moderation-ribbon.rejected{background:#FFE1DE;color:#A1322B}
.moderation-note-card{
  margin:8px 0;padding:8px 10px;border-radius:10px;background:#FFF8D9;color:#6D5900;
  font-size:12px;line-height:1.4
}
.moderation-note-card.rejected{background:#FFF0EE;color:#9B332B}
.moderation-detail{
  display:inline-flex;align-items:center;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800
}
.moderation-detail.pending{background:#FFF4C8;color:#785A00}
.moderation-detail.rejected{background:#FFE1DE;color:#A1322B}

/* Moderator panel */
.admin-navlink{position:relative}
.admin-pending-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;margin-left:5px;border-radius:999px;background:#FF5D7A;color:#fff;font-size:10px;font-weight:900}
.admin-page-head{align-items:center}.admin-summary{display:flex;align-items:baseline;gap:8px;padding:12px 16px;border-radius:16px;background:var(--surface-warm);border:1px solid var(--line)}.admin-summary b{font-size:28px}.admin-summary span{color:var(--muted);font-size:13px}
.admin-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 18px}.admin-toolbar .btn.active{background:var(--text);color:#fff;border-color:var(--text)}
.admin-list{display:grid;gap:14px}.admin-event{display:grid;grid-template-columns:180px 1fr;gap:16px;background:var(--surface);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:var(--shadow-sm)}
.admin-event-cover{min-height:150px;background-size:cover;background-position:center;position:relative}.admin-event-cover.no-photo{display:flex;align-items:center;justify-content:center;padding:16px;text-align:center;color:#fff;font-weight:800;font-size:20px}
.admin-event-body{padding:16px}.admin-event-top{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}.admin-status{padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800}
.admin-status.pending{background:#FFF4C8;color:#785A00}.admin-status.approved{background:#E5F7EA;color:#1B6B3B}.admin-status.rejected{background:#FFE1DE;color:#A1322B}
.admin-event-body h3{margin:0 0 8px;font-size:20px}.admin-event-meta{color:var(--muted);font-size:13px;line-height:1.5;margin-bottom:10px}.admin-event-desc{font-size:14px;line-height:1.5;margin-bottom:12px}.admin-event-actions{display:flex;gap:8px;flex-wrap:wrap}
.admin-reject-note{margin:8px 0;padding:9px 10px;border-radius:10px;background:#FFF0EE;color:#96392F;font-size:12px}
#moderationRejectNote{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:14px;padding:12px;font:inherit;resize:vertical}
@media(max-width:760px){.admin-event{grid-template-columns:1fr}.admin-event-cover{min-height:190px}.admin-toolbar{overflow-x:auto;flex-wrap:nowrap}.admin-toolbar .btn{white-space:nowrap}}


/* Moderation UX improvements */
.mobile-moderation-btn{
  justify-content:space-between;
  font-weight:800;
}
.mobile-moderation-btn.has-pending{
  border-color:#E5B94C;
  background:#FFF8D9;
}
.moderation-note-card.rejected{
  border-left:4px solid #D95B4D;
}
.moderation-note-card.approved{
  border-left:4px solid #39A56B;
  background:#EEF9F2;
}


/* Full rejected-event correction flow */
.moderation-note-card.rejected{
  display:flex;
  flex-direction:column;
  gap:7px;
  padding:12px 13px;
}
.moderation-note-card.rejected b{
  font-size:14px;
}
.moderation-reason{
  display:block;
  line-height:1.45;
}
.moderation-fix-btn{
  align-self:flex-start;
  margin-top:3px;
}
.manage-moderation-alert{
  display:flex;
  flex-direction:column;
  gap:5px;
  width:100%;
  box-sizing:border-box;
  padding:12px 14px;
  border-radius:14px;
  font-size:13px;
  line-height:1.45;
}
.manage-moderation-alert.rejected{
  background:#FFF0EE;
  border:1px solid #F3C5BF;
  color:#8E3128;
}
.manage-moderation-alert.pending{
  background:#FFF8DA;
  border:1px solid #EEDB89;
  color:#6C5700;
}
.manage-moderation-alert b{
  font-size:14px;
}


/* My Events status filters */
.my-events-statusbar{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin:0 0 18px;
}
.my-events-status{
  appearance:none;
  border:1px solid var(--line);
  background:var(--surface);
  color:var(--text);
  border-radius:999px;
  padding:9px 12px;
  font:inherit;
  font-size:13px;
  font-weight:700;
  cursor:pointer;
}
.my-events-status b{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  height:20px;
  padding:0 5px;
  margin-left:4px;
  border-radius:999px;
  background:var(--surface-warm);
  font-size:11px;
}
.my-events-status.active{
  background:var(--text);
  border-color:var(--text);
  color:#fff;
}
.my-events-status.active b{
  background:rgba(255,255,255,.18);
  color:#fff;
}

/* Moderator quick rejection reasons */
.reject-presets{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin:0 0 10px;
}
.reject-presets button{
  appearance:none;
  border:1px solid var(--line);
  background:var(--surface-warm);
  color:var(--text);
  border-radius:999px;
  padding:7px 10px;
  font:inherit;
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}
.reject-presets button:hover{
  border-color:var(--text);
}
@media(max-width:760px){
  .my-events-statusbar{
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:3px;
  }
  .my-events-status{
    white-space:nowrap;
  }
}


/* Mobile form / iPhone Safari fix
   iOS automatically zooms focused inputs when their font-size is below 16px.
   The event form inputs inherit 13px from .form-grid label, so focusing
   "Название" could visually enlarge the full-screen modal beyond the viewport. */
@media(max-width:760px){
  .form-grid input,
  .form-grid select,
  .form-grid textarea,
  .auth-field input,
  #moderationRejectNote{
    font-size:16px;
  }

  /* Use the dynamic viewport while the on-screen keyboard is open. */
  .modal-backdrop{
    padding:0;
    align-items:stretch;
    justify-items:stretch;
  }
  .modal{
    width:100%;
    max-width:none;
    height:100dvh;
    max-height:100dvh;
    border-radius:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding:24px 18px calc(24px + env(safe-area-inset-bottom));
  }
}


/* Centered dismissible notifications */
.toast-backdrop{
  position:fixed;
  inset:0;
  z-index:5000;
  display:grid;
  place-items:center;
  padding:20px;
  background:rgba(20,17,34,.48);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
}
.toast-backdrop[hidden]{
  display:none !important;
}
.toast-dialog{
  position:relative;
  width:min(460px,calc(100vw - 32px));
  box-sizing:border-box;
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  padding:30px 24px 22px;
  box-shadow:0 24px 70px rgba(24,18,48,.28);
  text-align:center;
  animation:toastDialogIn .18s ease-out;
}
.toast-icon{
  width:54px;
  height:54px;
  margin:0 auto 15px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#EEF9F2;
  color:#2D9A5F;
  font-size:28px;
  font-weight:900;
}
.toast-message{
  color:var(--text);
  font-size:17px;
  line-height:1.5;
  font-weight:650;
  white-space:pre-line;
}
.toast-close{
  position:absolute;
  top:10px;
  right:12px;
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:50%;
  background:transparent;
  color:var(--muted);
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.toast-close:hover{
  background:var(--surface-warm);
  color:var(--text);
}
.toast-ok{
  margin-top:20px;
  min-width:120px;
}
body.toast-open{
  overflow:hidden;
}
@keyframes toastDialogIn{
  from{opacity:0;transform:translateY(8px) scale(.97)}
  to{opacity:1;transform:none}
}
@media(max-width:760px){
  .toast-backdrop{
    padding:16px;
  }
  .toast-dialog{
    width:100%;
    border-radius:22px;
    padding:28px 20px 20px;
  }
  .toast-message{
    font-size:16px;
  }
  .toast-ok{
    width:100%;
  }
}


/* Direct event link helper */
.event-detail-actions [data-detail-copy-link]{
  white-space:nowrap;
}


/* Full Favorites */
.favorites-navlink{position:relative}
.favorites-nav-count,.favorites-menu-count{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:20px;height:20px;padding:0 6px;margin-left:4px;border-radius:999px;
  background:#FF5D7A;color:#fff;font-size:10px;font-weight:900
}
.favorites-head{align-items:center}
.favorites-head-actions{display:flex;align-items:center;gap:10px}
.favorites-total{
  display:flex;align-items:baseline;gap:7px;padding:11px 14px;
  border:1px solid var(--line);border-radius:16px;background:var(--surface-warm)
}
.favorites-total b{font-size:26px}
.favorites-total span{font-size:12px;color:var(--muted)}
.favorites-info{
  display:flex;gap:12px;align-items:center;padding:14px 16px;margin-bottom:14px;
  border-radius:16px;background:#FFF7FB;border:1px solid #F4DDEB
}
.favorites-info>span{
  display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;
  border-radius:50%;background:#fff;color:#E94272;font-size:27px
}
.favorites-info small{color:var(--muted)}
.favorites-tabs{display:flex;gap:8px;margin:0 0 18px}
.favorites-empty{
  grid-column:1/-1;text-align:center;padding:44px 24px;border:1px dashed var(--line);
  border-radius:22px;background:#fff
}
.favorites-empty-heart{
  width:66px;height:66px;margin:0 auto 12px;display:grid;place-items:center;
  border-radius:50%;background:#FFF1F6;color:#E94272;font-size:38px
}
.favorites-empty h3{margin:0 0 8px}
.favorites-empty p{margin:0 auto 18px;color:var(--muted);max-width:460px}
@media(max-width:760px){
  .favorites-head{align-items:flex-start}
  .favorites-head-actions{width:100%;justify-content:space-between}
  .favorites-tabs{overflow-x:auto}
  .favorites-tabs .pill{white-space:nowrap}
}

/* Favorites account sync */
#favoritesInfoTitle,#favoritesInfoText{transition:opacity .15s ease}


/* Favorites reminders */
.reminder-options{
  display:grid;
  gap:10px;
  margin:18px 0 10px;
}
.reminder-option{
  width:100%;
  justify-content:center;
}
.reminder-option.active{
  background:var(--text);
  color:#fff;
  border-color:var(--text);
}
.reminder-card-btn.active{
  border-color:#E0B746;
  background:#FFF7D4;
}
@media(max-width:760px){
  .reminder-modal{
    height:auto;
    max-height:min(92dvh,720px);
    align-self:center;
    border-radius:22px;
  }
}

/* Functional interface-language selector */
#uiLang{min-width:76px}
html[lang="sr-Latn"] .navlink,html[lang="en"] .navlink{letter-spacing:-.01em}


/* Mobile language selector + iPhone bottom safe area */
.mobile-language-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:var(--surface-warm);
}
.mobile-language-label{
  font-size:13px;
  font-weight:800;
  color:var(--muted);
}
#mobileUiLang{
  min-width:92px;
  padding:9px 10px;
  border:1px solid var(--line);
  border-radius:12px;
  background:#fff;
  color:var(--text);
  font:800 14px/1 Inter,sans-serif;
}

@media(max-width:760px){
  .subnav{
    height:calc(64px + env(safe-area-inset-bottom));
    padding-bottom:env(safe-area-inset-bottom);
    box-sizing:border-box;
  }
  main{
    padding-bottom:calc(92px + env(safe-area-inset-bottom));
  }
  footer{
    padding-bottom:calc(72px + env(safe-area-inset-bottom));
  }
}

@media(max-width:760px){
  .calendar-tab-wrap{position:relative}
  .calendar-date-input{
    display:block;
    font-size:16px;
    color:transparent;
    background:transparent;
    pointer-events:auto;
  }
  .calendar-date-input::-webkit-date-and-time-value{color:transparent}
  .calendar-date-input::-webkit-calendar-picker-indicator{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    opacity:0;
    cursor:pointer;
  }
  .category:active{transform:scale(.98)}
}


/* v10.5 — mobile navigation lives entirely in the hamburger drawer */
.mobile-nav-section{
  display:grid;
  gap:8px;
  padding:4px 0 6px;
  border-bottom:1px solid var(--line);
}
.mobile-nav-item{
  font-weight:800;
}

@media(max-width:760px){
  .subnav{
    display:none !important;
  }
  main{
    padding-bottom:28px;
  }
  footer{
    padding-bottom:calc(22px + env(safe-area-inset-bottom));
  }
}


/* PWA install hint */
.pwa-install-hint{
  display:grid;
  gap:7px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:linear-gradient(135deg,#FFF0F3,#F5ECFF);
  font-size:12px;
  line-height:1.4;
}
.pwa-install-hint b{font-size:13px}
.pwa-ios-text{color:var(--muted)}
@media(display-mode:standalone){
  .pwa-install-hint{display:none!important}
}


/* v10.7 — double-tap full-screen map */
.map-fullscreen-close{
  display:none;
  position:absolute;
  top:calc(14px + env(safe-area-inset-top));
  right:14px;
  z-index:2205;
  width:46px;
  height:46px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.96);
  color:var(--text);
  box-shadow:0 8px 24px rgba(20,20,30,.22);
  font-size:30px;
  line-height:1;
  font-weight:600;
}
.map-stage-wrap.map-fullscreen{
  position:fixed !important;
  inset:0 !important;
  z-index:2200 !important;
  width:100vw !important;
  height:100dvh !important;
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
  border-radius:0 !important;
  background:#fff;
}
.map-stage-wrap.map-fullscreen #map{
  width:100% !important;
  height:100% !important;
  min-height:100dvh !important;
  border-radius:0 !important;
}
.map-stage-wrap.map-fullscreen .map-fullscreen-close{
  display:block;
}
body.map-fullscreen-open{
  overflow:hidden !important;
  overscroll-behavior:none;
}
body.map-fullscreen-open .topbar,
body.map-fullscreen-open .mobile-menu{
  pointer-events:none;
}
@media(max-width:760px){
  .map-fullscreen-close{
    top:calc(12px + env(safe-area-inset-top));
    right:12px;
  }
}


/* v10.8 — language switcher at top of home page */
.mobile-language-row{display:none!important}
.home-language-bar{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  padding:10px 24px 4px;
}
.home-language-switch{
  display:inline-flex;
  gap:4px;
  padding:4px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.88);
  box-shadow:var(--shadow-sm);
}
.home-lang-btn{
  min-width:44px;
  border:0;
  border-radius:999px;
  padding:9px 12px;
  background:transparent;
  color:var(--muted);
  font:800 13px/1 Inter,sans-serif;
  cursor:pointer;
  transition:var(--ease);
}
.home-lang-btn.active{
  background:var(--sunset);
  color:#fff;
  box-shadow:0 5px 14px rgba(255,73,104,.24);
}
@media(max-width:760px){
  .home-language-bar{
    padding:8px 14px 2px;
  }
}


/* v10.9 — language switcher in mobile header next to menu */
.home-language-bar{display:none!important}

.mobile-header-actions{
  display:flex;
  align-items:center;
  gap:10px;
  margin-left:auto;
}
.header-language-switch{
  display:none;
  align-items:center;
  gap:2px;
  padding:3px;
  border:1px solid var(--line);
  border-radius:999px;
  background:rgba(255,255,255,.92);
  box-shadow:var(--shadow-sm);
}
.header-lang-btn{
  min-width:38px;
  padding:8px 9px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:var(--muted);
  font:800 12px/1 Inter,sans-serif;
  cursor:pointer;
  transition:var(--ease);
}
.header-lang-btn.active{
  background:var(--sunset);
  color:#fff;
  box-shadow:0 4px 12px rgba(255,73,104,.22);
}
@media(max-width:760px){
  .header-language-switch{display:inline-flex}
  .mobile-header-actions{gap:8px}
  .mobile-menu{margin-left:0}
}


/* v11 — organizer profile pages */
.organizer-link{
  border:0;
  padding:0;
  background:transparent;
  color:inherit;
  font:inherit;
  cursor:pointer;
  text-align:left;
}
.organizer-link:hover{color:var(--coral);text-decoration:underline}
.organizer-detail-link{
  border:0;
  padding:0;
  background:transparent;
  color:var(--violet-dark);
  font:800 17px/1.3 Inter,sans-serif;
  cursor:pointer;
}
.organizer-detail-link:hover{color:var(--coral);text-decoration:underline}
.organizer-profile-view{max-width:1220px;margin:0 auto}
.organizer-profile-back{margin:8px 0 18px}
.organizer-profile-hero{
  display:grid;
  grid-template-columns:120px 1fr;
  gap:24px;
  align-items:center;
  padding:28px;
  border:1px solid var(--line);
  border-radius:var(--radius-xl);
  background:linear-gradient(135deg,#FFF0F3 0%,#F5ECFF 100%);
  box-shadow:var(--shadow-sm);
}
.organizer-profile-avatar{
  width:112px;
  height:112px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:linear-gradient(145deg,#FF5D7A,#6F4FF2);
  color:#fff;
  font:900 48px/1 Inter,sans-serif;
  box-shadow:0 14px 30px rgba(111,79,242,.2);
}
.organizer-profile-copy h1{margin:3px 0 8px;font-size:36px}
.organizer-profile-copy p{color:var(--muted);line-height:1.5}
.organizer-profile-links{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:14px}
.organizer-profile-contact{
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:8px 12px;
  border-radius:12px;
  background:#fff;
  border:1px solid var(--line);
  font-weight:700;
}
.organizer-profile-events-head{margin-top:30px}
.organizer-profile-cards{margin-bottom:26px}
.organizer-empty{grid-column:1/-1}
@media(max-width:760px){
  .organizer-profile-view{padding-top:8px}
  .organizer-profile-hero{
    grid-template-columns:1fr;
    text-align:center;
    padding:22px 18px;
  }
  .organizer-profile-avatar{width:88px;height:88px;font-size:38px;margin:0 auto}
  .organizer-profile-copy h1{font-size:30px}
  .organizer-profile-links{justify-content:center}
  .organizer-profile-events-head{align-items:flex-start}
}


/* v11.1 — organizer-link fixes */
.organizer-link,
.organizer-detail-link{
  pointer-events:auto !important;
  position:relative;
  z-index:4;
}
.organizer-link{
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
  text-decoration-color:rgba(255,73,104,.35);
}
.organizer-link:hover,
.organizer-link:focus-visible{
  color:var(--coral-dark);
  text-decoration-color:currentColor;
}
.organizer-placeholder{
  cursor:default;
  text-decoration:none;
}
@media(hover:hover) and (pointer:fine){
  .organizer-link{cursor:pointer}
}


/* v11.2 — clearer language / organizer separation on event cards */
.festival-meta-row{
  align-items:center;
  text-transform:none;
  letter-spacing:0;
}

.festival-lang{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:4px 8px;
  border-radius:999px;
  background:#F1ECFF;
  color:#6547D9;
  border:1px solid #D9CCFF;
  font-size:10.5px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}

.festival-organizer{
  color:#C93E59;
  font-weight:900;
  font-size:11.5px;
  line-height:1.2;
  text-align:right;
  max-width:58%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.organizer-link{
  color:#C93E59;
  text-decoration:none;
}

.organizer-link:hover,
.organizer-link:focus-visible{
  color:#A72440;
  text-decoration:underline;
  text-underline-offset:2px;
}

.organizer-placeholder{
  color:#8A8192;
  font-weight:800;
}

@media(max-width:760px){
  .festival-lang{
    font-size:10px;
    padding:4px 7px;
  }
  .festival-organizer{
    font-size:10.8px;
    max-width:56%;
  }
}


/* v11.3 — force the same card meta styling on desktop and mobile */
.event-card .festival-meta-row{
  align-items:center !important;
  text-transform:none !important;
  letter-spacing:0 !important;
}

.event-card .festival-lang{
  display:inline-flex !important;
  align-items:center !important;
  min-height:24px !important;
  padding:4px 8px !important;
  border-radius:999px !important;
  background:#F1ECFF !important;
  color:#6547D9 !important;
  border:1px solid #D9CCFF !important;
  font-size:10.5px !important;
  font-weight:900 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}

.event-card .festival-organizer{
  color:#C93E59 !important;
  font-weight:900 !important;
  font-size:11.5px !important;
  line-height:1.2 !important;
  text-align:right !important;
  max-width:58% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
}

.event-card .organizer-link{
  color:#C93E59 !important;
  text-decoration:none !important;
}

.event-card .organizer-link:hover,
.event-card .organizer-link:focus-visible{
  color:#A72440 !important;
  text-decoration:underline !important;
  text-underline-offset:2px !important;
}

.event-card .organizer-placeholder{
  color:#8A8192 !important;
  font-weight:800 !important;
}

/* Mobile keeps the same colors; only typography is slightly smaller */
@media(max-width:760px){
  .event-card .festival-lang{
    font-size:10px !important;
    padding:4px 7px !important;
  }
  .event-card .festival-organizer{
    font-size:10.8px !important;
    max-width:56% !important;
  }
}


/* v11.4 — mobile Safari drawer + clear PWA installation */
@media(max-width:760px){
  .mobile-drawer{
    top:0 !important;
    bottom:auto !important;
    height:100dvh !important;
    max-height:100dvh !important;
    box-sizing:border-box;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    padding-top:calc(18px + env(safe-area-inset-top)) !important;
    /* Extra room keeps the last menu item above Safari's floating toolbar.
       The drawer can also be scrolled independently. */
    padding-bottom:calc(150px + env(safe-area-inset-bottom)) !important;
  }

  .mobile-drawer-head{
    position:sticky;
    top:calc(-18px - env(safe-area-inset-top));
    z-index:5;
    background:var(--surface);
    padding-top:calc(18px + env(safe-area-inset-top));
    margin-top:calc(-18px - env(safe-area-inset-top));
  }

  .mobile-drawer-actions{
    padding-bottom:8px;
  }
}

.pwa-install-hint{
  display:grid;
  gap:8px;
  padding:14px;
  border:1px solid #E9DFFC;
  border-radius:16px;
  background:linear-gradient(135deg,#FFF0F3,#F5ECFF);
}
.pwa-install-hint b{
  font-size:14px;
  line-height:1.3;
}
.pwa-install-short{
  color:var(--muted);
  font-size:12px;
  line-height:1.4;
}
.pwa-help-btn{
  margin-top:2px;
  background:linear-gradient(135deg,#FF5D7A,#7B4FE9) !important;
  color:#fff !important;
  border:0 !important;
  text-align:center !important;
  justify-content:center;
}

.pwa-guide-backdrop{
  position:fixed;
  inset:0;
  z-index:4200;
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:14px;
  padding-bottom:calc(14px + env(safe-area-inset-bottom));
  background:rgba(20,20,30,.46);
  backdrop-filter:blur(4px);
}
.pwa-guide-backdrop[hidden]{display:none!important}
.pwa-guide{
  width:min(100%,520px);
  max-height:calc(100dvh - 28px);
  overflow-y:auto;
  box-sizing:border-box;
  padding:22px 18px 18px;
  border-radius:24px;
  background:#fff;
  box-shadow:0 24px 70px rgba(20,20,35,.28);
}
.pwa-guide-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.pwa-guide-head h2{
  margin:4px 0 0;
  font-size:24px;
  line-height:1.15;
}
.pwa-guide-close{
  flex:0 0 auto;
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  background:#F5F2F8;
  color:var(--text);
  font-size:28px;
  line-height:1;
}
.pwa-guide-steps{
  display:grid;
  gap:12px;
  margin:20px 0 14px;
}
.pwa-guide-step{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:12px;
  align-items:flex-start;
  padding:13px;
  border:1px solid var(--line);
  border-radius:16px;
  background:#FCFAFE;
}
.pwa-step-num{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:linear-gradient(135deg,#FF5D7A,#7B4FE9);
  color:#fff;
  font-weight:900;
}
.pwa-guide-step b{font-size:14px}
.pwa-guide-step p{
  margin:5px 0 0;
  color:var(--muted);
  font-size:12.5px;
  line-height:1.45;
}
.pwa-share-symbol{
  display:inline-grid;
  place-items:center;
  width:24px;
  height:24px;
  margin:0 2px;
  border:1.5px solid currentColor;
  border-radius:5px;
  font-size:17px;
  font-weight:900;
  vertical-align:middle;
}
.pwa-guide-note{
  padding:11px 12px;
  border-radius:13px;
  background:#FFF7DE;
  color:#705A18;
  font-size:12px;
  line-height:1.45;
}
.pwa-guide-ok{
  width:100%;
  margin-top:14px;
}
@media(min-width:761px){
  .pwa-guide-backdrop{align-items:center}
}
@media(display-mode:standalone){
  .pwa-install-hint{display:none!important}
}


/* v11.6 — device-aware PWA guide */
.pwa-guide-device{
  display:inline-flex;
  align-items:center;
  margin-top:12px;
  padding:7px 10px;
  border-radius:999px;
  background:#F1ECFF;
  color:#6547D9;
  border:1px solid #D9CCFF;
  font-size:12px;
  font-weight:900;
}


/* v12 — organizer profiles */
.organizer-profile-avatar.has-logo{overflow:hidden;padding:0;background:#fff}
.organizer-profile-avatar.has-logo img{width:100%;height:100%;object-fit:cover;display:block}
.organizer-profile-edit-btn{margin-top:12px}
.organizer-profile-editor-modal{width:min(92vw,720px);max-height:92dvh;overflow-y:auto}
.organizer-profile-form{display:grid;gap:14px;margin-top:18px}
.organizer-profile-form label{display:grid;gap:7px;font-weight:800;font-size:13px}
.organizer-profile-form label small{color:var(--muted);font-weight:500;line-height:1.4}
.organizer-profile-form input,.organizer-profile-form textarea{
  width:100%;box-sizing:border-box;border:1.5px solid var(--line);border-radius:12px;
  padding:11px 12px;background:var(--surface);color:var(--text);font:inherit;font-weight:500
}
.organizer-profile-form textarea{resize:vertical}
.organizer-profile-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.organizer-profile-logo-preview-row{display:flex;align-items:center;gap:14px}
.organizer-profile-logo-preview{
  width:82px;height:82px;flex:0 0 82px;display:grid;place-items:center;border-radius:50%;
  border:1px solid var(--line);background:linear-gradient(145deg,#FF5D7A,#6F4FF2);
  color:#fff;background-size:cover;background-position:center;font:900 34px/1 Inter,sans-serif;overflow:hidden
}
.organizer-profile-logo-preview.has-logo{color:transparent;background-color:#fff}
.organizer-profile-form-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:4px}
@media(max-width:760px){
  .organizer-profile-editor-modal{width:100%;max-height:94dvh}
  .organizer-profile-form-grid{grid-template-columns:1fr}
  .organizer-profile-form-actions{display:grid;grid-template-columns:1fr 1fr}
}


/* v13 — multiple organizer profiles per account */
.organizer-profile-manager{display:grid;gap:14px;margin-top:18px}
.organizer-profile-manager[hidden],.organizer-profile-form[hidden]{display:none!important}
.organizer-profile-list-head,.organizer-profile-editor-head{
  display:flex;align-items:center;justify-content:space-between;gap:12px
}
.organizer-profile-list{display:grid;gap:10px}
.organizer-profile-list-item{
  display:grid;grid-template-columns:56px minmax(0,1fr) auto;gap:12px;align-items:center;
  padding:12px;border:1px solid var(--line);border-radius:16px;background:var(--surface)
}
.organizer-profile-list-logo{
  width:54px;height:54px;border-radius:50%;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(145deg,#FF5D7A,#6F4FF2);color:#fff;font-weight:900;font-size:22px
}
.organizer-profile-list-logo img{width:100%;height:100%;object-fit:cover}
.organizer-profile-list-copy{display:grid;gap:4px;min-width:0}
.organizer-profile-list-copy b{font-size:14px}
.organizer-profile-list-copy small{
  color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.organizer-profile-list-actions{display:flex;gap:7px}
#organizerProfileSelectWrap small{font-weight:500;color:var(--muted);line-height:1.35}
@media(max-width:760px){
  .organizer-profile-list-item{grid-template-columns:48px 1fr}
  .organizer-profile-list-logo{width:46px;height:46px}
  .organizer-profile-list-actions{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}
}


/* v13.1 — organizer profile desktop reliability */
.organizer-profile-loading{
  padding:26px 18px;
  text-align:center;
  color:var(--muted);
  font-weight:800;
  border:1px dashed var(--line);
  border-radius:16px;
  background:var(--surface-warm);
}
#openOrganizerProfileEditor{
  position:relative;
  z-index:2;
  pointer-events:auto!important;
  cursor:pointer;
}


/* v14 — required event registration */
.registration-fields{
  display:grid;
  gap:12px;
  padding:14px;
  border:1.5px solid #FFB4C0;
  border-radius:16px;
  background:linear-gradient(135deg,#FFF3F5,#FFF9EE);
}
.registration-fields[hidden]{display:none!important}
.registration-form-callout{
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 13px;
  border-radius:12px;
  background:#FF4968;
  color:#fff;
}
.registration-form-callout b{white-space:nowrap}
.registration-form-callout span{font-size:12px;line-height:1.4;opacity:.94}
.registration-form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
.registration-form-grid label{
  display:grid;
  gap:6px;
  font-size:13px;
  font-weight:800;
}
.registration-form-grid .full{grid-column:1/-1}
.registration-form-grid small{font-size:11px;color:var(--muted);font-weight:500}

.registration-card-alert{
  display:flex;
  align-items:center;
  gap:7px;
  width:max-content;
  max-width:100%;
  margin:0 0 10px;
  padding:7px 10px;
  border-radius:10px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.015em;
}
.registration-card-alert.open{
  background:#FF4968;
  color:#fff;
  box-shadow:0 7px 18px rgba(255,73,104,.22);
}
.registration-card-alert.full{
  background:#2B2430;
  color:#fff;
}
.registration-card-alert.closed{
  background:#FFF0D6;
  color:#8A5900;
  border:1px solid #FFD38A;
}
.registration-card-alert small{
  font-size:10px;
  font-weight:800;
  opacity:.9;
  border-left:1px solid currentColor;
  padding-left:7px;
}
.registration-card-dot{
  width:7px;height:7px;border-radius:50%;background:currentColor;flex:0 0 7px;
}

.event-detail-registration-alert{
  display:grid;
  gap:10px;
  margin:12px 0 20px;
  padding:15px 16px;
  border-radius:16px;
}
.event-detail-registration-alert.open{
  background:linear-gradient(135deg,#FF4968,#FF6D84);
  color:#fff;
  box-shadow:0 10px 28px rgba(255,73,104,.22);
}
.event-detail-registration-alert.full{
  background:#2B2430;
  color:#fff;
}
.event-detail-registration-alert.closed{
  background:#FFF0D6;
  color:#805000;
  border:1px solid #FFD38A;
}
.event-detail-registration-main{
  display:flex;align-items:center;gap:12px
}
.registration-alert-icon{
  width:36px;height:36px;flex:0 0 36px;display:grid;place-items:center;
  border-radius:50%;background:rgba(255,255,255,.2);border:2px solid currentColor;
  font-size:20px;font-weight:900
}
.event-detail-registration-main div{display:grid;gap:3px}
.event-detail-registration-main b{font-size:17px;letter-spacing:.02em}
.event-detail-registration-main span{font-size:12px;opacity:.9}
.registration-capacity,.registration-note{
  font-size:12px;line-height:1.45;
  padding-top:8px;border-top:1px solid rgba(255,255,255,.24)
}
.event-detail-registration-alert.closed .registration-capacity,
.event-detail-registration-alert.closed .registration-note{
  border-top-color:#E9BE73
}
.registration-primary-btn{
  background:#FF4968!important;
  color:#fff!important;
  border-color:#FF4968!important;
  font-weight:900!important;
  box-shadow:0 8px 20px rgba(255,73,104,.22)
}
.registration-contact-hint{
  grid-column:1/-1;
  padding:11px 12px;
  border-radius:12px;
  background:#FFF3F5;
  color:#A92B43;
  font-size:12px;
  font-weight:800;
  line-height:1.4;
}
@media(max-width:760px){
  .registration-form-grid{grid-template-columns:1fr}
  .registration-form-grid .full{grid-column:auto}
  .registration-form-callout{align-items:flex-start;flex-direction:column;gap:5px}
  .registration-card-alert{
    width:100%;box-sizing:border-box;flex-wrap:wrap
  }
  .event-detail-registration-main b{font-size:16px}
}


/* v14.2 — registration choice is a prominent full-width section on desktop and mobile */
.event-entry-section{
  grid-column:1/-1;
  display:grid;
  gap:10px;
  margin-top:2px;
  padding:14px;
  border:1.5px solid #E6DFEA;
  border-radius:16px;
  background:#FCFAFE;
}
.event-entry-head{
  display:grid;
  gap:3px;
}
.event-entry-head b{
  font-size:14px;
  font-weight:900;
  color:var(--text);
}
.event-entry-head span{
  font-size:12px;
  color:var(--muted);
  line-height:1.4;
}
.event-entry-options{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.event-entry-option{
  appearance:none;
  border:1.5px solid var(--line);
  background:#fff;
  color:var(--text);
  border-radius:14px;
  padding:13px 14px;
  text-align:left;
  display:grid;
  gap:4px;
  cursor:pointer;
  transition:.18s ease;
}
.event-entry-option b{
  font-size:13px;
  font-weight:900;
}
.event-entry-option span{
  font-size:11px;
  line-height:1.35;
  color:var(--muted);
}
.event-entry-option:hover{
  border-color:#BDAFC9;
  transform:translateY(-1px);
}
.event-entry-option.active{
  border-color:#6547D9;
  background:#F1ECFF;
  box-shadow:0 0 0 3px rgba(101,71,217,.10);
}
.event-entry-option.required.active{
  border-color:#FF4968;
  background:#FFF0F3;
  box-shadow:0 0 0 3px rgba(255,73,104,.10);
}
.event-entry-option.required.active b{
  color:#C92F4D;
}
.registration-mode-native{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  opacity:0!important;
  pointer-events:none!important;
}
@media(max-width:760px){
  .event-entry-options{
    grid-template-columns:1fr;
  }
}


/* v14.3 — cleaner desktop entry controls */
@media(min-width:761px){
  .event-entry-options{
    display:none !important;
  }

  .registration-mode-native{
    position:static !important;
    width:100% !important;
    height:auto !important;
    opacity:1 !important;
    pointer-events:auto !important;
    border:1.5px solid var(--line) !important;
    border-radius:14px !important;
    padding:12px 14px !important;
    background:var(--surface) !important;
    color:var(--text) !important;
    font:inherit !important;
    font-size:16px !important;
    cursor:pointer !important;
  }

  .event-entry-section{
    gap:8px;
  }
}

/* Mobile keeps the large touch-friendly choices */
@media(max-width:760px){
  .event-entry-options{
    display:grid !important;
  }

  .registration-mode-native{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    opacity:0 !important;
    pointer-events:none !important;
  }
}


/* v14.8 — quick registration status in My Events */
.my-registration-quick{
  display:grid;
  gap:8px;
  margin:12px 0 4px;
  padding:11px;
  border:1px solid #EADFE5;
  border-radius:14px;
  background:#FFF9FB;
}
.my-registration-quick-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.my-registration-quick-head b{
  font-size:12px;
  font-weight:900;
}
.my-registration-quick-head span{
  color:var(--muted);
  font-size:10px;
  text-align:right;
}
.my-registration-quick-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}
.my-registration-quick-buttons .small-btn{
  flex:1 1 auto;
  min-width:110px;
  justify-content:center;
}
.my-registration-quick-buttons .small-btn.active{
  background:#2B2430;
  color:#fff;
  border-color:#2B2430;
}
.my-registration-quick-buttons .small-btn[data-quick-registration="open"].active{
  background:#2F9B61;
  border-color:#2F9B61;
}
.my-registration-quick-buttons .small-btn[data-quick-registration="full"].active{
  background:#FF4968;
  border-color:#FF4968;
}
.my-registration-series-note{
  color:var(--muted);
  font-size:10px;
  line-height:1.35;
}
@media(max-width:760px){
  .my-registration-quick-head{
    align-items:flex-start;
    flex-direction:column;
    gap:3px;
  }
  .my-registration-quick-head span{text-align:left}
  .my-registration-quick-buttons{
    display:grid;
    grid-template-columns:1fr;
  }
}


/* v15 — архив прошедших событий + возобновление */
.archive-renew-box{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:12px 0 4px;
  padding:12px;
  border:1px solid #E5DFEA;
  border-radius:14px;
  background:#FAF8FC;
}
.archive-renew-box>div{
  display:grid;
  gap:2px;
}
.archive-renew-box b{
  font-size:12px;
  font-weight:900;
}
.archive-renew-box span{
  font-size:10px;
  line-height:1.35;
  color:var(--muted);
}
.archive-renew-box .btn{
  flex:0 0 auto;
}
@media(max-width:760px){
  .archive-renew-box{
    align-items:stretch;
    flex-direction:column;
  }
  .archive-renew-box .btn{
    width:100%;
  }
}


/* v16 — статистика организатора */
.event-owner-stats{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:7px;
  margin:12px 0 4px;
}
.event-owner-stats>div{
  min-width:0;
  display:grid;
  gap:3px;
  padding:9px 7px;
  border:1px solid #E8E2EC;
  border-radius:12px;
  background:#FBFAFC;
  text-align:center;
}
.event-owner-stats b{
  font-size:16px;
  line-height:1;
  font-weight:900;
  color:var(--text);
}
.event-owner-stats span{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:9px;
  color:var(--muted);
}
@media(max-width:760px){
  .event-owner-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .event-owner-stats span{font-size:10px}
}


/* v16.2 — analytics now shows only real/meaningful metrics */
.event-owner-stats{
  grid-template-columns:repeat(3,minmax(0,1fr));
}
@media(max-width:760px){
  .event-owner-stats{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}


/* v17 — Add to calendar */
.calendar-modal{
  width:min(470px,calc(100vw - 28px));
}
.calendar-event-name{
  margin:6px 0 18px;
  font-weight:800;
  line-height:1.4;
}
.calendar-options{
  display:grid;
  gap:10px;
}
.calendar-option-btn{
  width:100%;
  justify-content:center;
  min-height:48px;
}
.calendar-help{
  margin:14px 0 0;
  color:var(--muted);
  font-size:12px;
  line-height:1.5;
}
.calendar-detail-btn{
  white-space:nowrap;
}
@media(max-width:760px){
  .calendar-modal{
    width:calc(100vw - 20px);
  }
  .calendar-option-btn{
    min-height:52px;
  }
}


/* v17.1 — calendar chooser must sit above the event detail modal */
#calendarBackdrop{
  z-index:3200;
}


/* v17.2 — stable calendar dialog on mobile/PWA */
@media(max-width:760px){
  #calendarBackdrop{
    padding:16px;
    align-items:center;
    justify-items:center;
  }
  #calendarBackdrop .calendar-modal{
    width:min(460px,100%);
    height:auto;
    max-height:calc(100dvh - 32px);
    border-radius:22px;
    padding:26px 18px calc(22px + env(safe-area-inset-bottom));
    overflow:auto;
  }
}


/* v17.6 — honest/stable iPhone calendar flow */
.calendar-ios-note{
  margin-top:2px;
  padding:10px 12px;
  border-radius:12px;
  background:var(--surface-warm);
  color:var(--muted);
  font-size:11px;
  line-height:1.45;
}


/* v18 — похожие события */
.event-detail-similar{
  margin-top:28px;
  padding-top:24px;
  border-top:1px solid var(--line);
}
.event-detail-similar[hidden]{display:none!important}
.event-detail-similar-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.event-detail-similar-head .eyebrow{
  margin:0 0 4px;
}
.event-detail-similar-head h3{
  margin:0;
  font-size:22px;
}
.event-detail-similar-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}
.similar-event-card{
  min-width:0;
  overflow:hidden;
  padding:0;
  border:1px solid var(--line);
  border-radius:16px;
  background:var(--surface);
  color:var(--text);
  text-align:left;
  cursor:pointer;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.similar-event-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow);
}
.similar-event-cover{
  position:relative;
  height:112px;
  overflow:hidden;
  display:grid;
  place-items:center;
}
.similar-event-cover img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.similar-event-cover>span{
  font-size:34px;
}
.similar-event-cover>b{
  position:absolute;
  left:8px;
  bottom:8px;
  padding:5px 7px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:var(--text);
  font-size:10px;
  line-height:1;
}
.similar-event-copy{
  padding:11px 12px 13px;
}
.similar-event-category{
  display:block;
  margin-bottom:4px;
  color:var(--muted);
  font-size:10px;
  font-weight:800;
  text-transform:uppercase;
}
.similar-event-copy h4{
  margin:0;
  font-size:14px;
  line-height:1.25;
}
.similar-event-copy p{
  margin:6px 0 0;
  color:var(--muted);
  font-size:10px;
  line-height:1.35;
}
@media(max-width:760px){
  .event-detail-similar{
    margin-top:22px;
    padding-top:20px;
  }
  .event-detail-similar-grid{
    display:flex;
    gap:10px;
    overflow-x:auto;
    scroll-snap-type:x proximity;
    padding-bottom:4px;
    scrollbar-width:none;
  }
  .event-detail-similar-grid::-webkit-scrollbar{display:none}
  .similar-event-card{
    flex:0 0 72%;
    scroll-snap-align:start;
  }
  .similar-event-cover{
    height:118px;
  }
}


/* v19 — follow organizers */
.organizer-profile-primary-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
}
.organizer-follow-btn.is-following{
  background:var(--surface-warm);
  color:var(--text);
  border:1px solid var(--line);
}
.following-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.following-card{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px;
  border:1px solid var(--line);
  border-radius:18px;
  background:var(--surface);
}
.following-card-main{
  flex:1;
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
}
.following-avatar{
  width:54px;
  height:54px;
  flex:0 0 54px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:16px;
  background:var(--surface-warm);
  font-size:22px;
  font-weight:900;
}
.following-avatar img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.following-copy{
  min-width:0;
}
.following-copy h3{
  margin:0 0 4px;
  font-size:16px;
}
.following-copy p{
  margin:0;
  color:var(--muted);
  font-size:11px;
  line-height:1.35;
}
.following-copy small{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:10px;
}
.following-unfollow{
  flex:0 0 auto;
}
.following-empty{
  grid-column:1/-1;
}
@media(max-width:760px){
  .following-grid{
    grid-template-columns:1fr;
  }
  .following-card{
    align-items:stretch;
    flex-direction:column;
  }
  .following-unfollow{
    width:100%;
  }
  .organizer-profile-primary-actions{
    display:grid;
  }
  .organizer-profile-primary-actions .btn{
    width:100%;
  }
}


/* v20 — new events carousel */
.new-events-section{
  margin-top:34px;
}
.new-events-head{
  align-items:flex-end;
}
.new-events-subtitle{
  margin:6px 0 0;
  color:var(--muted);
  font-size:14px;
}
.new-event-ribbon{
  position:absolute;
  top:12px;
  left:12px;
  z-index:4;
  padding:6px 10px;
  border-radius:999px;
  background:linear-gradient(135deg,#ff6b8a 0%, #ff8a5b 100%);
  color:#fff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  box-shadow:0 6px 18px rgba(255,107,138,.28);
  border:1px solid rgba(255,255,255,.45);
}
@media(max-width:760px){
  .new-events-section{
    margin-top:26px;
  }
  .new-events-subtitle{
    font-size:12px;
    line-height:1.45;
  }
  .new-event-ribbon{
    top:10px;
    left:10px;
    padding:5px 8px;
    font-size:10px;
  }
}


/* v21 — event of the week */
.featured-week-section{
  margin:34px 0 38px;
}
.featured-week-card{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:minmax(300px,42%) 1fr;
  min-height:310px;
  overflow:hidden;
  border:1px solid rgba(255,122,140,.22);
  border-radius:28px;
  background:linear-gradient(135deg, #fffaf7 0%, #fff7f5 52%, #fffdfb 100%);
  box-shadow:
    0 20px 56px rgba(35,31,26,.12),
    0 8px 24px rgba(255,122,140,.10);
}
.featured-week-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(1200px 400px at 110% -10%, rgba(255,138,91,.14), transparent 45%),
    radial-gradient(700px 280px at 0% 100%, rgba(255,107,138,.10), transparent 42%);
}
.featured-week-card > *{
  position:relative;
  z-index:1;
}
.featured-week-image{
  position:relative;
  min-height:310px;
  background-size:cover !important;
  background-position:center !important;
  display:flex;
  align-items:flex-end;
  padding:22px;
}
.featured-week-image.no-photo>span:not(.featured-week-badge){
  color:#fff;
  font-size:28px;
  line-height:1.05;
  font-weight:900;
  text-shadow:0 2px 12px rgba(0,0,0,.22);
  max-width:88%;
}
.featured-week-badge{
  position:absolute;
  top:18px;
  left:18px;
  padding:8px 13px;
  border-radius:999px;
  background:linear-gradient(135deg,#ff7d95 0%,#ff966c 100%);
  color:#fff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.02em;
  box-shadow:0 8px 22px rgba(255,107,138,.24);
  border:1px solid rgba(255,255,255,.58);
}
.featured-week-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:32px 36px;
}
.featured-week-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  color:rgba(66,58,50,.74);
  font-size:13px;
  font-weight:800;
}
.featured-week-copy h3{
  margin:10px 0 8px;
  font-size:clamp(28px,3vw,42px);
  line-height:1.02;
}
.featured-week-copy p{
  margin:14px 0 20px;
  color:rgba(66,58,50,.82);
  font-size:15px;
  line-height:1.6;
}
.featured-week-organizer{
  width:max-content;
  max-width:100%;
  padding:2px 0;
  border:0;
  background:transparent;
  color:#c85a68;
  font-weight:800;
  text-decoration:underline;
  text-decoration-color:rgba(200,90,104,.35);
  text-underline-offset:3px;
  cursor:pointer;
}
.featured-week-footer{
  margin-top:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding-top:8px;
  border-top:1px solid rgba(255,122,140,.12);
}
.featured-admin-btn.active{
  background:linear-gradient(135deg,#ff6b8a 0%,#ff8a5b 100%);
  border-color:transparent;
  color:#fff;
}
@media(max-width:760px){
  .featured-week-section{
    margin:26px 0 30px;
  }
  .featured-week-card{
    grid-template-columns:1fr;
    min-height:0;
    border-radius:22px;
    box-shadow:
      0 16px 42px rgba(35,31,26,.12),
      0 6px 18px rgba(255,122,140,.10);
  }
  .featured-week-image{
    min-height:220px;
  }
  .featured-week-copy{
    padding:22px 20px;
  }
  .featured-week-copy h3{
    font-size:28px;
  }
  .featured-week-footer{
    align-items:stretch;
    flex-direction:column;
  }
  .featured-week-footer .btn{
    width:100%;
  }
}


/* v21.1 — organizer field simplification */
#organizerFieldWrap[hidden],
#organizerProfileSelectWrap[hidden]{
  display:none !important;
}




/* v21.4 — city + language directly in the mobile header */
@media(max-width:760px){
  .topbar{
    flex-wrap:nowrap;
    align-items:center;
    gap:7px;
    padding:10px 12px;
  }
  .brand{
    flex:0 1 auto;
    min-width:0;
  }
  .brand > span:last-child{
    min-width:0;
  }
  .brand-word{
    white-space:nowrap;
    font-size:20px;
  }
  .mobile-header-actions{
    display:flex;
    align-items:center;
    gap:5px;
    margin-left:auto;
    flex:0 0 auto;
  }
  .mobile-header-selects{
    display:flex;
    align-items:center;
    gap:5px;
  }
  .mobile-header-select{
    height:35px;
    border:1px solid var(--line);
    border-radius:11px;
    background:#fff;
    color:var(--text);
    font:800 11px/1 Inter,sans-serif;
    outline:none;
    padding:0 24px 0 8px;
    box-shadow:0 3px 10px rgba(35,31,26,.04);
  }
  .mobile-city-select{width:98px}
  .mobile-lang-select{width:56px}
  .mobile-header-select:focus{
    border-color:rgba(255,107,138,.55);
    box-shadow:0 0 0 3px rgba(255,107,138,.10);
  }
  .mobile-menu{
    flex:0 0 auto;
    margin-left:0;
  }
  .header-language-switch{
    display:none !important;
  }
}

@media(max-width:390px){
  .topbar{
    gap:4px;
    padding-left:9px;
    padding-right:9px;
  }
  .brand-word{font-size:18px}
  .mobile-header-actions{gap:4px}
  .mobile-header-selects{gap:4px}
  .mobile-header-select{
    height:34px;
    font-size:10px;
    padding-left:6px;
    padding-right:19px;
  }
  .mobile-city-select{width:88px}
  .mobile-lang-select{width:50px}
}

/* v21.5 — mobile header controls must never appear on desktop */
.mobile-header-selects,
.mobile-header-select{
  display:none;
}

@media(max-width:760px){
  .mobile-header-selects{
    display:flex;
  }
  .mobile-header-select{
    display:block;
  }
}


/* v21.6 — phone landscape / small tablet header */
@media (min-width:761px) and (max-width:1100px){
  .topbar{
    gap:10px;
    padding-left:18px;
    padding-right:18px;
  }

  .search-wrap{
    min-width:160px;
    max-width:280px;
  }

  .top-actions{
    gap:8px;
    flex:0 0 auto;
  }

  .top-actions #citySelect{
    max-width:150px;
  }

  .top-actions #uiLang{
    width:68px;
    min-width:68px;
  }

  .top-actions .primary{
    white-space:nowrap;
    padding-left:16px;
    padding-right:16px;
  }

  /* Mobile-only header selectors remain hidden here.
     Landscape uses the normal desktop city/language controls. */
  .mobile-header-selects,
  .mobile-header-select{
    display:none !important;
  }
}


/* v21.8 — event QR code */
.qr-detail-btn{
  background:#F5F0FF;
  color:var(--violet-dark);
  border:1px solid #DDD0FF;
}

#qrBackdrop{
  z-index:3400;
}

.qr-modal{
  width:min(440px,calc(100vw - 28px));
  text-align:center;
}

.qr-event-name{
  margin:4px auto 16px;
  max-width:340px;
  color:var(--muted);
  font-weight:800;
  line-height:1.35;
}

.qr-image-shell{
  width:min(300px,78vw);
  aspect-ratio:1;
  margin:0 auto 16px;
  padding:14px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:22px;
  background:#fff;
  box-shadow:0 12px 34px rgba(35,31,26,.08);
}

.qr-image-shell img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  border-radius:10px;
}

.qr-help{
  margin:0 auto 16px;
  max-width:330px;
  color:var(--muted);
  line-height:1.45;
}

.qr-actions{
  display:flex;
  justify-content:center;
  gap:10px;
  flex-wrap:wrap;
}

.qr-save-note{
  margin:14px auto 0;
  max-width:340px;
  color:var(--muted);
  font-size:12px;
  line-height:1.4;
}

@media(max-width:760px){
  .qr-modal{
    max-height:min(90dvh,700px);
    overflow:auto;
  }
  .qr-image-shell{
    width:min(270px,72vw);
    padding:12px;
  }
  .qr-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .qr-actions .btn{
    width:100%;
  }
}


/* v21.8.1 — mobile QR modal centering fix */
@media(max-width:760px){
  #qrBackdrop.modal-backdrop{
    padding:14px;
    align-items:center;
    justify-items:center;
  }
  #qrBackdrop .qr-modal{
    width:min(440px,calc(100vw - 28px));
    max-width:440px;
    height:auto;
    max-height:min(90dvh,700px);
    border-radius:var(--radius-xl);
    overflow:auto;
    padding:24px 18px calc(24px + env(safe-area-inset-bottom));
  }
}


/* v21.8.2 — compact event detail action buttons on mobile */
.event-detail-actions .btn,
.event-detail-actions a.btn{
  gap:10px;
  min-height:54px;
  padding:12px 16px;
}
.event-detail-actions .action-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:18px;
  line-height:1;
  flex:0 0 auto;
}
.event-detail-actions .action-label{
  line-height:1.2;
  text-align:center;
}
@media(max-width:760px){
  .event-detail-actions{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:8px;
    align-items:stretch;
  }
  .event-detail-actions .btn,
  .event-detail-actions a.btn{
    width:100%;
    min-width:0;
    min-height:58px;
    padding:12px 10px;
    font-size:14px;
    line-height:1.15;
    box-sizing:border-box;
  }
  .event-detail-actions .registration-contact-hint{grid-column:1/-1}
  .event-detail-actions .registration-primary-btn,
  .event-detail-actions .primary{grid-column:span 4}
  .event-detail-actions .route-btn{grid-column:span 1;padding-inline:0}
  .event-detail-actions .calendar-detail-btn{grid-column:span 2}
  .event-detail-actions .share-detail-btn{grid-column:span 1;padding-inline:0}
  .event-detail-actions .qr-detail-btn{grid-column:span 2}
  .event-detail-actions .report-detail-btn,
  .event-detail-actions .manage-detail-btn{grid-column:span 2}
  .event-detail-actions .route-btn .action-label,
  .event-detail-actions .share-detail-btn .action-label{display:none}
  .event-detail-actions .route-btn .action-icon,
  .event-detail-actions .share-detail-btn .action-icon{font-size:22px}
}

/* v21.8.3 — mobile event detail modal should stay below the browser chrome */
@media(max-width:760px){
  .event-detail-backdrop{
    padding-top:calc(env(safe-area-inset-top) + 12px);
    padding-right:8px;
    padding-bottom:calc(env(safe-area-inset-bottom) + 8px);
    padding-left:8px;
    align-items:end;
  }
  .event-detail-modal{
    width:100%;
    max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 20px);
    margin:0;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }
  .event-detail-close{
    top:14px;
    right:14px;
  }
}

/* v21.8.4 — force the mobile "Add to calendar" action into two lines */
@media(max-width:760px){
  .event-detail-actions .calendar-detail-btn .action-label{
    display:inline-block;
    max-width:11ch;
    white-space:normal;
    line-height:1.08;
    text-wrap:balance;
  }
}


/* v21.8.6 — full event photo viewer */
.event-detail-photo-open{
  width:100%;height:100%;display:block;padding:0;border:0;background:transparent;cursor:zoom-in;
}
.event-detail-photo-open img{width:100%;height:100%;display:block;object-fit:cover}
.full-image-backdrop{
  position:fixed;inset:0;z-index:3700;background:rgba(13,10,20,.92);
  display:flex;align-items:center;justify-content:center;padding:24px;
}
.full-image-backdrop[hidden]{display:none!important}
.full-image-viewer{
  display:block;max-width:min(94vw,1600px);max-height:92dvh;width:auto;height:auto;object-fit:contain;
  border-radius:12px;box-shadow:0 24px 80px rgba(0,0,0,.5);
}
.full-image-close{
  position:fixed;top:calc(env(safe-area-inset-top) + 14px);right:16px;z-index:1;
  width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.94);
  color:#1f1b28;font-size:28px;line-height:1;box-shadow:0 8px 24px rgba(0,0,0,.3);
}
@media(max-width:760px){
  .full-image-backdrop{padding:calc(env(safe-area-inset-top) + 18px) 12px calc(env(safe-area-inset-bottom) + 18px)}
  .full-image-viewer{max-width:100%;max-height:calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 36px);border-radius:8px}
}


/* v22 — Web Push settings */
.notification-top-btn{min-width:44px;padding-inline:12px;font-size:18px}
.push-settings-modal{width:min(560px,100%)}
.push-settings-lead{color:var(--muted);line-height:1.5;margin:-5px 0 16px}
.push-support-note{padding:11px 13px;border-radius:13px;background:var(--surface-warm);color:var(--muted);font-size:13px;line-height:1.4;margin-bottom:16px}
.push-support-note.ok{background:#EEF9F0;color:#27653A}
.push-support-note.warn{background:#FFF5E8;color:#855316}
.push-settings-group{display:grid;gap:10px;padding:15px 0;border-top:1px solid var(--line)}
.push-settings-group>b{font-size:14px}
.push-settings-group small{color:var(--muted);line-height:1.4}
.push-check{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:700}
.push-check input{width:18px;height:18px;accent-color:var(--coral)}
.push-category-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 12px}
.push-settings-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.push-settings-foot{font-size:12px;color:var(--muted);line-height:1.45;margin:14px 0 0}
@media(max-width:760px){
  #pushSettingsBackdrop.modal-backdrop{padding:14px;align-items:center;justify-items:center}
  #pushSettingsBackdrop .push-settings-modal{
    width:min(560px,calc(100vw - 28px));height:auto;max-height:88dvh;
    border-radius:var(--radius-xl);overflow:auto;padding:24px 18px calc(24px + env(safe-area-inset-bottom))
  }
  .push-category-grid{grid-template-columns:1fr 1fr}
  .push-settings-actions{display:grid;grid-template-columns:1fr}
  .push-settings-actions .btn{width:100%}
}


/* v22.3 — favorite/reminder controls inside event details */
.event-detail-actions .favorite-detail-btn{background:#FFF4F7;color:#B72F52;border:1px solid #F3C6D2}
.event-detail-actions .favorite-detail-btn.active{background:#FFE6ED;color:#A51E45;border-color:#EEAFC0}
.event-detail-actions .reminder-detail-btn{background:#FFF8E9;color:#7A5812;border:1px solid #EAD49C}
.event-detail-actions .reminder-detail-btn.active{background:#FFF0C9;color:#664500;border-color:#DDBB63}
@media(max-width:760px){
  .event-detail-actions .favorite-detail-btn,
  .event-detail-actions .reminder-detail-btn{grid-column:span 2}
}


/* v22.4 — favorite is immediately available when an event opens from push/deep link */
.event-detail-favorite-float{
  position:absolute;top:16px;right:68px;z-index:6;width:42px;height:42px;border:0;border-radius:50%;
  display:grid;place-items:center;background:rgba(255,255,255,.94);color:#B72F52;font-size:25px;line-height:1;
  box-shadow:var(--shadow);cursor:pointer;transition:var(--ease);
}
.event-detail-favorite-float:hover{transform:scale(1.06);background:#fff}
.event-detail-favorite-float.active{background:#FFE6ED;color:#A51E45}
@media(max-width:760px){
  .event-detail-favorite-float{top:14px;right:66px;width:40px;height:40px;font-size:24px}
}

/* v22.5 — reminder chooser must stay above the event details modal */
#reminderBackdrop{
  z-index:3600;
}
@media(max-width:760px){
  #reminderBackdrop.modal-backdrop{
    padding:14px;
    align-items:center;
    justify-items:center;
  }
  #reminderBackdrop .reminder-modal{
    width:min(440px,calc(100vw - 28px));
    max-width:440px;
    height:auto;
    max-height:min(90dvh,720px);
    border-radius:22px;
    overflow:auto;
    padding:24px 18px calc(24px + env(safe-area-inset-bottom));
  }
}

/* v22.6 — keep the event-details close button floating while the mobile sheet scrolls */
@media(max-width:760px){
  .event-detail-close{
    position:fixed;
    top:calc(env(safe-area-inset-top) + 18px);
    right:22px;
    z-index:30;
  }
}

/* v22.7 — единый кабинет организатора */
.organizer-workspace{
  margin:28px 0 34px;
  padding:26px;
  border:1px solid var(--line);
  border-radius:var(--radius-xl);
  background:linear-gradient(135deg,#fffaf5 0%,#fff 52%,#f7f2ff 100%);
  box-shadow:var(--shadow-sm);
}
.organizer-workspace-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:24px;
}
.organizer-workspace-head h2{margin:3px 0 8px;font-size:28px}
.organizer-workspace-head p{margin:0;max-width:680px;color:var(--muted);line-height:1.5}
.organizer-workspace-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:9px;
  max-width:520px;
}
.organizer-workspace-actions .btn{min-height:42px}
.organizer-account-note{margin:20px 0 0}
.organizer-my-events-section{
  margin:0 0 34px;
  padding-top:6px;
}
.organizer-my-events-section .page-head{margin-top:0}
.organizer-howto{margin-top:30px}

@media(max-width:900px){
  .organizer-workspace-head{display:grid;grid-template-columns:1fr}
  .organizer-workspace-actions{justify-content:flex-start;max-width:none}
}
@media(max-width:760px){
  .organizer-workspace{padding:20px 16px;margin:20px 0 28px}
  .organizer-workspace-head h2{font-size:23px}
  .organizer-workspace-actions{display:grid;width:100%}
  .organizer-workspace-actions .btn{width:100%}
  .organizer-my-events-section .my-events-head{display:grid;gap:14px}
  .organizer-my-events-section .my-events-head .btn{width:100%}
}


/* v22.12 — keep the event-details close button visible while scrolling on desktop too */
@media(min-width:761px){
  .event-detail-close{
    position:sticky;
    top:16px;
    right:auto;
    display:block;
    margin:16px 16px -58px auto;
    z-index:30;
  }
}

/* v22.13 — keep the Add Event close button visible while its form scrolls */
#modalBackdrop #closeModal{
  position:sticky;
  top:16px;
  right:auto;
  display:block;
  margin:0 0 -36px auto;
  z-index:40;
}
@media(max-width:760px){
  #modalBackdrop #closeModal{
    top:calc(env(safe-area-inset-top) + 12px);
  }
}