:root {
  color-scheme: light;
  --ink: #211d29;
  --muted: #77727e;
  --line: #e9e6ed;
  --paper: #fbfafc;
  --purple: #7546e8;
  --purple-dark: #5930c3;
  --serif: 'Segoe UI', -apple-system, BlinkMacSystemFont, sans-serif;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; -webkit-font-smoothing: antialiased; }
button, input, select { font: inherit; }
button { cursor: pointer; }
a { color: inherit; text-decoration: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.topbar { height: 76px; padding: 0 max(5.3vw, calc((100vw - 1280px)/2)); background: #fff; display: flex; align-items: center; gap: 58px; border-bottom: 1px solid #f0edf2; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-family: var(--serif); font-size: 24px; font-weight: 800; letter-spacing: -1.4px; }
.brand-mark { width: 28px; height: 28px; background: var(--purple); border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; gap: 2px; transform: rotate(-7deg); }
.brand-mark span { width: 3px; border-radius: 4px; background: white; display: block; }
.brand-mark span:nth-child(1) { height: 9px; transform: translateY(2px); }
.brand-mark span:nth-child(2) { height: 15px; }
.brand-mark span:nth-child(3) { height: 11px; transform: translateY(-2px); }
.main-nav { display: flex; align-items: center; align-self: stretch; gap: 34px; }
.nav-link { position: relative; border: 0; background: transparent; color: #77717f; font-size: 14px; font-weight: 600; padding: 0; }
.nav-link:hover, .nav-link.is-active { color: var(--ink); }
.nav-link.is-active::after { content: ''; position: absolute; left: 0; right: 0; bottom: -28px; height: 3px; background: var(--purple); border-radius: 4px 4px 0 0; }
.favorite-count { display: inline-flex; min-width: 19px; height: 19px; padding: 0 5px; margin-left: 4px; border-radius: 10px; align-items: center; justify-content: center; background: #f0ebff; color: var(--purple); font-size: 11px; }
.city-switch { margin-left: auto; display: flex; align-items: center; gap: 9px; color: #4a4552; background: transparent; border: 1px solid var(--line); border-radius: 11px; padding: 10px 13px; font-size: 13px; font-weight: 600; }
.city-switch svg { width: 17px; height: 17px; fill: none; stroke: #77717f; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.city-switch .chevron { width: 14px; height: 14px; }

.hero { min-height: 405px; position: relative; overflow: hidden; background: #17131f; color: #fff; padding: 65px max(5.3vw, calc((100vw - 1280px)/2)) 56px; }
.hero::before { content: ''; position: absolute; width: 620px; height: 620px; border: 1px solid rgba(203,185,255,.13); border-radius: 50%; right: 8%; top: -250px; }
.hero::after { content: ''; position: absolute; width: 470px; height: 470px; border: 1px solid rgba(203,185,255,.11); border-radius: 50%; right: 14%; top: -174px; }
.hero-glow { position: absolute; border-radius: 50%; filter: blur(2px); pointer-events: none; }
.hero-glow-one { width: 330px; height: 330px; background: radial-gradient(circle, rgba(112,68,231,.32), transparent 68%); right: 16%; top: 10px; }
.hero-glow-two { width: 250px; height: 250px; background: radial-gradient(circle, rgba(247,120,92,.16), transparent 70%); right: 2%; bottom: -160px; }
.hero-content { position: relative; z-index: 1; max-width: 735px; }
.eyebrow, .section-kicker { font-size: 10px; font-weight: 700; letter-spacing: 1.45px; }
.eyebrow { display: flex; align-items: center; gap: 9px; color: #c8c1d5; }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: #a88aff; box-shadow: 0 0 14px #a88aff; }
h1, h2, h3, p { margin-top: 0; }
.hero h1 { margin: 19px 0 10px; font-family: var(--serif); font-size: clamp(39px, 5vw, 59px); line-height: 1.08; letter-spacing: -2.7px; font-weight: 800; }
.hero h1 span { color: #bba4ff; }
.hero-subtitle { margin: 0; color: #b9b4c3; font-size: 15px; }
.mood-search { width: min(660px, 100%); height: 62px; padding: 7px; margin-top: 27px; display: flex; align-items: center; gap: 12px; border-radius: 15px; background: #fff; box-shadow: 0 12px 50px rgba(0,0,0,.16); }
.search-icon { width: 20px; height: 20px; margin-left: 12px; flex: 0 0 auto; fill: none; stroke: #88828f; stroke-width: 1.8; stroke-linecap: round; }
.mood-search input { min-width: 0; flex: 1; border: 0; outline: 0; color: var(--ink); font-size: 14px; background: transparent; }
.mood-search input::placeholder { color: #aaa5af; }
.mood-search button { height: 48px; padding: 0 18px; border: 0; border-radius: 10px; background: var(--purple); color: #fff; font-size: 13px; font-weight: 700; transition: background .2s, transform .2s; }
.mood-search button:hover { background: var(--purple-dark); transform: translateY(-1px); }
.mood-search button span { padding-left: 7px; font-size: 17px; }
.mood-search-hint { margin: 9px 0 0; color: #aaa4b6; font-size: 11px; line-height: 1.45; }
.suggestions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 13px; color: #aaa4b6; font-size: 11px; }
.suggestions button { border: 1px solid rgba(255,255,255,.18); color: #d3cddd; border-radius: 20px; padding: 6px 11px; background: rgba(255,255,255,.045); font-size: 11px; }
.suggestions button:hover { border-color: #a88aff; color: white; }
.mood-insights { width: min(660px, 100%); display: flex; flex-wrap: wrap; align-items: center; gap: 7px; margin-top: 13px; padding: 10px 12px; border: 1px solid rgba(201,184,255,.24); border-radius: 12px; background: rgba(126,89,220,.16); color: #e6dfff; font-size: 11px; line-height: 1.45; }
.mood-insights-label { color: #cfc1fb; font-weight: 700; white-space: nowrap; }
.mood-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.mood-chip { display: inline-flex; align-items: center; min-height: 23px; padding: 3px 8px; border-radius: 13px; background: rgba(255,255,255,.12); color: #fff; font-size: 10px; font-weight: 600; }
.mood-insights-note { width: 100%; margin: 0; color: #bdb4cf; font-size: 10px; }
.hero-note { position: absolute; z-index: 1; right: 10%; top: 135px; display: flex; align-items: center; gap: 12px; color: #e6dfff; font-family: var(--serif); font-size: 14px; font-weight: 700; line-height: 1.45; transform: rotate(8deg); }
.note-spark { color: #ffb883; font-size: 37px; font-weight: 400; }

.page-content { max-width: 1280px; margin: 0 auto; padding: 30px 36px 76px; }
.demo-banner { display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; border: 1px solid #eee4ff; border-radius: 11px; background: #f7f2ff; color: #645576; font-size: 11px; line-height: 1.55; }
.demo-banner strong { color: #513b73; }
.demo-icon { width: 17px; height: 17px; display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; border-radius: 50%; color: white; background: #8e6bd2; font-family: Georgia, serif; font-size: 12px; font-weight: 700; }
.demo-banner button { margin: -2px 0 0 auto; padding: 0 3px; border: 0; background: transparent; color: #8e7e9e; font-size: 20px; line-height: 1; }
.event-section { padding-top: 53px; }
.section-heading { display: flex; justify-content: space-between; align-items: end; margin-bottom: 23px; }
.section-kicker { color: #8b8492; margin-bottom: 9px; }
.section-heading h2, .how-intro h2 { font-family: var(--serif); font-size: clamp(25px, 3vw, 34px); line-height: 1.2; letter-spacing: -1.3px; margin: 0; font-weight: 800; }
.heading-spark { color: #f2a176; font-size: 22px; vertical-align: 5px; margin-left: 2px; }
.section-description { margin: 8px 0 0; color: var(--muted); font-size: 13px; }
.results-total { color: #8c8692; font-size: 12px; padding-bottom: 4px; white-space: nowrap; }
.results-total span:first-child { color: var(--ink); font-weight: 700; }
.filter-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; border-bottom: 1px solid var(--line); }
.category-chips { display: flex; align-items: center; gap: 7px; overflow-x: auto; scrollbar-width: none; padding: 0 0 12px; }
.category-chips::-webkit-scrollbar { display: none; }
.category-chip { flex: 0 0 auto; border: 1px solid transparent; border-radius: 20px; padding: 8px 13px; background: #f0edf3; color: #696371; font-size: 11px; font-weight: 600; transition: .18s ease; }
.category-chip:hover { border-color: #d9cafa; }
.category-chip.is-selected { background: #272230; color: #fff; }
.sort-wrap { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; padding-bottom: 12px; color: #8a8490; font-size: 11px; }
.sort-wrap select, .select-filter select { color: #403b46; border: 0; outline: 0; background: transparent; font-size: 11px; font-weight: 700; cursor: pointer; }
.advanced-filters { display: flex; align-items: center; gap: 10px; padding: 15px 0 18px; }
.select-filter, .price-filter, .free-filter { min-height: 36px; display: inline-flex; align-items: center; gap: 8px; padding: 0 11px; border: 1px solid var(--line); border-radius: 9px; background: white; color: #645f6a; font-size: 11px; }
.select-filter svg { width: 15px; height: 15px; fill: none; stroke: #8d8792; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.price-filter input { width: 68px; border: 0; outline: 0; color: var(--ink); font-size: 11px; }
.price-filter input::placeholder { color: #9b95a0; }
.price-filter input::-webkit-inner-spin-button { appearance: none; }
.free-filter { position: relative; cursor: pointer; user-select: none; }
.free-filter input { position: absolute; opacity: 0; }
.custom-checkbox { width: 14px; height: 14px; border: 1px solid #d2cdd6; border-radius: 4px; background: white; }
.free-filter input:checked + .custom-checkbox { border-color: var(--purple); background: var(--purple); }
.free-filter input:checked + .custom-checkbox::after { content: '✓'; color: white; display: block; text-align: center; font-size: 10px; line-height: 13px; }
.clear-filters { border: 0; color: #827a8b; background: transparent; font-size: 11px; }
.clear-filters:hover { color: var(--purple); }
.event-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.event-card { min-width: 0; position: relative; overflow: hidden; border-radius: 14px; border: 1px solid #ece9ef; background: #fff; box-shadow: 0 2px 8px rgba(37,28,48,.025); transition: transform .23s ease, box-shadow .23s ease; }
.event-card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(37,28,48,.09); }
.event-art { height: 174px; position: relative; overflow: hidden; display: flex; align-items: flex-end; padding: 14px; color: white; background: var(--art, linear-gradient(135deg,#47354e,#261e3d)); cursor: pointer; }
.event-cover { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.event-art::before, .event-art::after { z-index: 1; content: ''; position: absolute; pointer-events: none; border-radius: 50%; }
.event-art::before { width: 195px; height: 195px; border: 1px solid rgba(255,255,255,.25); top: -79px; right: -22px; box-shadow: 0 0 0 18px rgba(255,255,255,.045), 0 0 0 42px rgba(255,255,255,.035); }
.event-art::after { width: 110px; height: 110px; background: rgba(255,255,255,.1); filter: blur(1px); top: 20px; right: 42px; }
.art-shape { position: absolute; z-index: 1; width: 2px; height: 200px; background: rgba(255,255,255,.14); transform: rotate(31deg); right: 42%; top: -16px; }
.art-label { position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(255,255,255,.26); border-radius: 20px; padding: 6px 9px; background: rgba(20,15,28,.25); backdrop-filter: blur(7px); color: #fff; font-size: 9px; font-weight: 700; letter-spacing: .35px; text-transform: uppercase; }
.art-label-dot { width: 5px; height: 5px; border-radius: 50%; background: #f7b381; }
.card-heart { position: absolute; z-index: 2; top: 11px; right: 11px; width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; color: #fff; background: rgba(29,23,37,.2); backdrop-filter: blur(7px); }
.card-heart svg { width: 17px; height: 17px; fill: transparent; stroke: currentColor; stroke-width: 1.7; }
.card-heart.is-saved { color: #ff9aa7; background: white; }
.card-heart.is-saved svg { fill: #ff6079; stroke: #ff6079; }
.card-heart:hover { background: white; color: #ec526c; }
.card-body { padding: 14px 14px 13px; cursor: pointer; }
.card-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; color: #8c8492; font-size: 10px; }
.card-date { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.card-date svg { width: 13px; height: 13px; fill: none; stroke: #908996; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.card-area { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-align: right; }
.event-card h3 { min-height: 43px; margin: 0 0 4px; font-family: var(--serif); font-size: 15px; line-height: 1.4; letter-spacing: -.35px; font-weight: 750; }
.venue-name { overflow: hidden; margin: 0; color: #87818b; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.card-bottom { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-top: 15px; padding-top: 11px; border-top: 1px solid #f0edf1; }
.price-from { color: #817a87; font-size: 10px; }
.price-from strong { display: block; margin-top: 2px; color: var(--ink); font-family: var(--serif); font-size: 16px; letter-spacing: -.4px; }
.lowest-tag { display: inline-flex; align-items: center; gap: 5px; color: #368565; font-size: 9px; font-weight: 700; }
.lowest-tag span { width: 5px; height: 5px; border-radius: 50%; background: #51bd8b; }
.offer-count { color: #8d8793; font-size: 9px; }
.empty-state { padding: 72px 20px; text-align: center; }
.empty-illustration { width: 56px; height: 56px; display: grid; place-items: center; margin: 0 auto 17px; border-radius: 18px; background: #f0ebff; color: var(--purple); font-size: 29px; }
.empty-state h3 { margin-bottom: 7px; font-family: var(--serif); font-size: 20px; }
.empty-state p { color: var(--muted); font-size: 13px; }
.button-secondary { padding: 10px 14px; border: 1px solid #ddd4ec; border-radius: 9px; background: #fff; color: var(--purple); font-size: 12px; font-weight: 700; }

.how-section { display: grid; grid-template-columns: .9fr 1.4fr; gap: 50px; align-items: center; margin-top: 94px; padding: 38px 40px 40px; border-radius: 18px; background: #f2eff7; }
.how-intro .section-kicker { color: #8a7c9a; }
.how-intro h2 { font-size: 27px; }
.how-steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
.how-step { position: relative; }
.step-number { display: block; margin-bottom: 18px; color: #a29aaa; font-size: 10px; font-weight: 700; letter-spacing: .8px; }
.step-icon { width: 35px; height: 35px; display: grid; place-items: center; margin-bottom: 12px; border-radius: 11px; font-size: 20px; font-weight: 700; }
.step-icon.purple { background: #e0d5fc; color: #7546e8; }
.step-icon.orange { background: #ffe7d6; color: #d97837; }
.step-icon.green { background: #d9f0e4; color: #368565; }
.how-step h3 { margin: 0 0 6px; font-family: var(--serif); font-size: 13px; letter-spacing: -.2px; }
.how-step p { max-width: 155px; margin: 0; color: #817b88; font-size: 10px; line-height: 1.55; }

.footer { display: flex; align-items: center; gap: 19px; padding: 25px max(5.3vw, calc((100vw - 1280px)/2)); border-top: 1px solid #eeeaf1; background: white; }
.footer-brand { font-size: 20px; }
.footer-brand .brand-mark { width: 24px; height: 24px; border-radius: 8px; }
.footer p { margin: 0; color: #817a87; font-size: 11px; }
.footer-small { margin-left: auto; color: #a09aa4; font-size: 10px; }
.footer-admin { color: #a09aa4; font-size: 10px; }
.footer-admin:hover { color: var(--purple); }

.dialog-backdrop { position: fixed; z-index: 10; inset: 0; display: grid; place-items: center; padding: 22px; background: rgba(19,15,25,.64); backdrop-filter: blur(5px); }
.dialog-backdrop[hidden] { display: none; }
.event-dialog { position: relative; width: min(570px, 100%); max-height: min(84vh, 760px); overflow-y: auto; border-radius: 18px; background: white; box-shadow: 0 24px 90px rgba(0,0,0,.28); }
.dialog-close { position: absolute; z-index: 2; top: 14px; right: 14px; width: 36px; height: 36px; border: 1px solid rgba(255,255,255,.45); border-radius: 50%; color: white; background: rgba(22,17,28,.35); font-size: 23px; line-height: 1; }
.dialog-art { min-height: 205px; position: relative; overflow: hidden; display: flex; align-items: flex-end; padding: 23px; color: #fff; background: var(--art); }
.dialog-art::after { position: absolute; z-index: 1; inset: 0; content: ''; background: linear-gradient(0deg, rgba(20,16,28,.82), rgba(20,16,28,.04) 82%); pointer-events: none; }
.dialog-cover { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.dialog-art h2 { position: relative; z-index: 2; max-width: 420px; margin: 0; font-family: var(--serif); font-size: 30px; line-height: 1.15; letter-spacing: -1px; }
.dialog-body { padding: 24px; }
.dialog-info { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; margin-bottom: 23px; }
.info-tile { padding: 12px; border-radius: 10px; background: #f7f5f8; }
.info-tile span { display: block; margin-bottom: 5px; color: #8d8691; font-size: 9px; text-transform: uppercase; letter-spacing: .7px; }
.info-tile strong { font-size: 12px; }
.dialog-description { margin: 0 0 23px; color: #6f6974; font-size: 13px; line-height: 1.65; }
.dialog-section-title { display: flex; justify-content: space-between; align-items: baseline; margin: 0 0 11px; font-family: var(--serif); font-size: 17px; }
.dialog-section-title span { color: #8d8691; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif; font-size: 10px; font-weight: 500; }
.offer-list { display: grid; gap: 8px; }
.offer-row { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--line); border-radius: 11px; }
.seller-logo { width: 34px; height: 34px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; background: #f1ecff; color: #6c45cf; font-family: var(--serif); font-weight: 800; }
.seller-logo.kassir { color: #c04942; background: #fff0ee; }
.offer-info { flex: 1; min-width: 0; }
.offer-info strong { display: block; margin-bottom: 3px; font-size: 12px; }
.offer-info span { color: #8a8490; font-size: 10px; }
.offer-price { margin-right: 5px; font-family: var(--serif); font-size: 15px; font-weight: 800; white-space: nowrap; }
.offer-link { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 9px 11px; border-radius: 8px; background: #26212e; color: white; font-size: 10px; font-weight: 700; white-space: nowrap; }
.offer-link:hover { background: var(--purple); }
.offer-link.is-disabled { opacity: .55; cursor: default; }
.offer-link svg { width: 12px; height: 12px; fill: none; stroke: currentColor; stroke-width: 2; }
.price-disclaimer { margin: 12px 0 0; color: #9b949f; font-size: 9px; line-height: 1.5; }
.toast { position: fixed; z-index: 20; left: 50%; bottom: 26px; padding: 11px 16px; border-radius: 10px; color: white; background: #272230; box-shadow: 0 8px 30px rgba(0,0,0,.18); font-size: 12px; opacity: 0; transform: translate(-50%, 12px); pointer-events: none; transition: opacity .2s, transform .2s; }
.toast.is-visible { opacity: 1; transform: translate(-50%,0); }

@media (max-width: 1080px) {
  .event-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .hero-note { right: 7%; opacity: .8; }
  .how-section { grid-template-columns: 1fr; gap: 30px; }
  .how-steps { gap: 30px; }
}
@media (max-width: 760px) {
  .topbar { height: 65px; padding: 0 20px; gap: 24px; }
  .brand { font-size: 22px; }
  .brand-mark { width: 25px; height: 25px; }
  .main-nav { gap: 20px; }
  .nav-link { font-size: 12px; }
  .nav-link.is-active::after { bottom: -23px; }
  .city-switch { padding: 8px 9px; gap: 6px; font-size: 0; }
  .city-switch svg { width: 18px; }
  .city-switch .chevron { display: none; }
  .hero { min-height: 390px; padding: 50px 23px 44px; }
  .hero::before { right: -250px; top: -150px; }
  .hero::after { right: -190px; top: -80px; }
  .hero h1 { font-size: clamp(38px, 10vw, 52px); letter-spacing: -2px; }
  .hero-subtitle { max-width: 420px; font-size: 13px; line-height: 1.5; }
  .mood-search { height: 57px; gap: 7px; }
  .mood-search input { font-size: 12px; }
  .mood-search button { height: 43px; padding: 0 12px; font-size: 11px; }
  .mood-search-hint { font-size: 10px; }
  .mood-insights { font-size: 10px; }
  .hero-note { display: none; }
  .page-content { padding: 22px 20px 55px; }
  .event-section { padding-top: 40px; }
  .section-heading { align-items: end; gap: 12px; }
  .section-heading h2 { font-size: 26px; }
  .section-description { max-width: 270px; font-size: 11px; }
  .results-total { font-size: 10px; }
  .filter-bar { align-items: flex-start; flex-direction: column; gap: 0; }
  .category-chips { width: 100%; padding-bottom: 11px; }
  .sort-wrap { padding-bottom: 12px; }
  .advanced-filters { flex-wrap: wrap; gap: 8px; }
  .event-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .event-art { height: 145px; padding: 10px; }
  .card-body { padding: 11px; }
  .event-card h3 { font-size: 13px; min-height: 37px; }
  .card-meta { font-size: 9px; }
  .price-from strong { font-size: 14px; }
  .lowest-tag { font-size: 8px; }
  .offer-count { display: none; }
  .how-section { margin-top: 60px; padding: 28px 23px; }
  .how-intro h2 { font-size: 24px; }
  .how-steps { gap: 13px; }
  .how-step h3 { font-size: 11px; }
  .how-step p { font-size: 9px; }
  .footer { flex-wrap: wrap; gap: 11px; padding: 22px 20px; }
  .footer-small { width: 100%; margin-left: 0; }
}
.card-source { display: block; padding: 0 18px 15px; color: var(--muted, #736d85); font-size: 11px; text-decoration: underline; }
.card-source:hover { color: #7654bb; }
.image-credit { color: #736d85; font-size: 11px; overflow-wrap: anywhere; }
.source-credits { max-width: 1240px; margin: 24px auto; padding: 0 24px; color: #736d85; font-size: 12px; }
.source-credits summary { cursor: pointer; }
.source-credits ul { max-height: 280px; overflow: auto; line-height: 1.8; }
.source-credits a { color: inherit; }
@media (max-width: 430px) {
  .topbar { gap: 15px; padding: 0 15px; }
  .brand { gap: 7px; font-size: 20px; }
  .main-nav { gap: 14px; }
  .nav-link { font-size: 11px; }
  .favorite-count { min-width: 16px; height: 16px; font-size: 9px; }
  .city-switch { margin-left: auto; padding: 7px; }
  .hero { padding-left: 17px; padding-right: 17px; }
  .eyebrow { font-size: 8px; letter-spacing: 1px; }
  .hero h1 { font-size: 37px; }
  .hero-subtitle { font-size: 12px; }
  .mood-search { padding: 6px; }
  .mood-search input { font-size: 11px; }
  .mood-search button { padding: 0 9px; }
  .suggestions { font-size: 9px; gap: 6px; }
  .suggestions button { padding: 5px 8px; font-size: 9px; }
  .mood-insights { gap: 5px; padding: 9px 10px; }
  .mood-chip { min-height: 21px; padding: 3px 7px; font-size: 9px; }
  .page-content { padding-right: 15px; padding-left: 15px; }
  .demo-banner { font-size: 10px; }
  .section-heading h2 { font-size: 23px; }
  .section-kicker { font-size: 9px; }
  .event-grid { gap: 9px; }
  .event-art { height: 122px; }
  .art-label { padding: 5px 7px; font-size: 8px; }
  .card-heart { top: 7px; right: 7px; width: 29px; height: 29px; }
  .card-heart svg { width: 15px; }
  .card-body { padding: 9px; }
  .card-meta { align-items: flex-start; flex-direction: column; gap: 4px; }
  .card-area { text-align: left; }
  .event-card h3 { font-size: 12px; }
  .card-bottom { margin-top: 11px; }
  .price-from { font-size: 9px; }
  .price-from strong { font-size: 13px; }
  .lowest-tag { gap: 3px; font-size: 7px; }
  .lowest-tag span { width: 4px; height: 4px; }
  .how-section { padding: 25px 17px; }
  .how-steps { gap: 8px; }
  .step-number { margin-bottom: 12px; font-size: 9px; }
  .step-icon { width: 30px; height: 30px; margin-bottom: 9px; }
  .how-step h3 { min-height: 28px; font-size: 10px; }
  .dialog-backdrop { padding: 10px; }
  .event-dialog { border-radius: 15px; }
  .dialog-art { min-height: 170px; padding: 18px; }
  .dialog-art h2 { font-size: 25px; }
  .dialog-body { padding: 18px; }
  .offer-row { gap: 8px; padding: 9px; }
  .offer-price { font-size: 13px; }
  .offer-link { padding: 8px; font-size: 9px; }
}