:root{--ink:#1d1b2f;--mut:#6b6880;--bg:#faf8f5;--acc:#5b3cc4;--acc2:#e0529c;--card:#fff;--r:18px}
*{box-sizing:border-box}body{margin:0;font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--ink);background:var(--bg)}
a{color:var(--acc)}img{max-width:100%;display:block}
header.top{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;max-width:1200px;margin:auto}
.logo{font-weight:800;font-size:1.25rem;text-decoration:none;color:var(--ink);display:flex;gap:8px;align-items:center}
.logo i{width:30px;height:30px;border-radius:9px;background:linear-gradient(135deg,var(--acc),var(--acc2));display:inline-block}
nav a{margin-left:16px;text-decoration:none;color:var(--ink);font-weight:600}
.btn{background:var(--acc);color:#fff;border:0;border-radius:999px;padding:10px 18px;font-weight:700;cursor:pointer;text-decoration:none;display:inline-block;font-size:1rem}
.btn.ghost{background:#fff;color:var(--acc);border:2px solid #e4def7}
.hero{background:linear-gradient(120deg,#2b1a6b,#5b3cc4 45%,#e0529c);color:#fff;padding:48px 20px 90px;text-align:center;position:relative;overflow:hidden}
.hero h1{font-size:clamp(1.9rem,5vw,3.2rem);margin:0 0 8px;letter-spacing:-.02em}.hero p{opacity:.9;margin:0 auto;max-width:600px;font-size:1.1rem}
.hero .bubbles img{position:absolute;width:120px;border-radius:20px;opacity:.25;transform:rotate(-8deg)}
.search{max-width:1000px;margin:-60px auto 0;background:#fff;border-radius:24px;box-shadow:0 20px 50px rgba(40,20,90,.18);padding:18px;position:relative;z-index:2}
.row{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.search input[type=text],.search select,.search input[type=date]{font:inherit;padding:11px 14px;border:2px solid #ece8f6;border-radius:12px;background:#fff;min-width:0}
#loc{flex:1 1 220px}.field{display:flex;flex-direction:column;font-size:.78rem;font-weight:700;color:var(--mut);gap:4px;text-transform:uppercase;letter-spacing:.04em}
.row2{margin-top:12px}.chips{display:flex;gap:8px;overflow-x:auto;padding:12px 0 4px;scrollbar-width:none}
.chip{flex:0 0 auto;display:flex;align-items:center;gap:6px;border:2px solid #ece8f6;border-radius:999px;padding:4px 12px 4px 4px;cursor:pointer;font-weight:600;font-size:.9rem;background:#fff;user-select:none}
.chip img{width:30px;height:30px;border-radius:50%;object-fit:cover}.chip input{display:none}.chip:has(input:checked){border-color:var(--acc);background:#f1ecff}
.toggle{display:flex;align-items:center;gap:6px;font-weight:600}
main{max-width:1200px;margin:auto;padding:20px}
.bar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:14px 0;flex-wrap:wrap}
.seg{display:inline-flex;background:#ece8f6;border-radius:999px;padding:4px}.seg button{border:0;background:none;padding:8px 16px;border-radius:999px;font-weight:700;cursor:pointer;color:var(--mut)}.seg .on{background:#fff;color:var(--acc);box-shadow:0 2px 6px rgba(0,0,0,.08)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:22px}
.card{background:var(--card);border-radius:var(--r);overflow:hidden;text-decoration:none;color:inherit;box-shadow:0 4px 14px rgba(30,20,60,.07);transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(30,20,60,.14)}
.pic{position:relative;aspect-ratio:5/3}.pic img{width:100%;height:100%;object-fit:cover}
.tag,.free{position:absolute;top:10px;left:10px;background:rgba(255,255,255,.92);border-radius:999px;padding:3px 10px;font-size:.75rem;font-weight:700}.free{left:auto;right:10px;background:#06d6a0;color:#053}
.body{padding:14px 16px 16px}.body h3{margin:0 0 4px;font-size:1.08rem}.body p{margin:0 0 10px;color:var(--mut);font-size:.92rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.when{font-size:.92rem;display:flex;gap:6px;align-items:center}.when b{color:var(--acc)}.dist{margin-left:auto;background:#f1ecff;border-radius:8px;padding:1px 8px;font-size:.8rem;font-weight:700}
#map{height:70vh;border-radius:var(--r);z-index:1}.empty{color:var(--mut);padding:40px;text-align:center;grid-column:1/-1}
.pin img{width:38px;height:38px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.35);object-fit:cover}
.note{color:var(--mut);font-size:.85rem}
footer{text-align:center;color:var(--mut);font-size:.88rem;padding:40px 20px}
/* event page */
.ev-hero{max-width:1000px;margin:10px auto 0;border-radius:24px;overflow:hidden;position:relative;aspect-ratio:3/1}
.ev-hero img{width:100%;height:100%;object-fit:cover}
.ev{max-width:1000px;margin:auto;padding:20px;display:grid;grid-template-columns:1.5fr 1fr;gap:28px}
.ev h1{margin:.2em 0;font-size:clamp(1.6rem,4vw,2.4rem);letter-spacing:-.01em}
.facts{background:#fff;border-radius:var(--r);padding:18px;box-shadow:0 4px 14px rgba(30,20,60,.07)}
.facts dt{font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--mut);font-weight:700;margin-top:12px}.facts dt:first-child{margin-top:0}.facts dd{margin:2px 0 0}
#emap{height:220px;border-radius:14px;margin-top:16px}
.dates{display:flex;flex-wrap:wrap;gap:6px;padding:0;list-style:none}.dates li{background:#f1ecff;border-radius:10px;padding:4px 10px;font-weight:600;font-size:.9rem}
.form{max-width:680px;margin:auto;background:#fff;border-radius:var(--r);padding:24px;box-shadow:0 4px 14px rgba(30,20,60,.07)}
.form label{display:block;font-weight:700;margin-top:14px}.form input,.form select,.form textarea{width:100%;font:inherit;padding:10px 12px;border:2px solid #ece8f6;border-radius:12px;margin-top:4px}
@media(max-width:760px){.ev{grid-template-columns:1fr}.ev-hero{border-radius:0;aspect-ratio:2/1}nav a.hide{display:none}.search{margin:-60px 12px 0}.hero{padding:34px 16px 80px}}
[hidden]{display:none!important}
.tabs{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 14px;margin-bottom:12px;border-bottom:2px solid #f1ecff;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
.tabs::-webkit-scrollbar{display:none}
.tabs button{flex:0 0 auto;scroll-snap-align:start;display:flex;align-items:center;gap:7px;border:2px solid #ece8f6;background:#fff;border-radius:999px;padding:9px 16px;font:inherit;font-weight:700;cursor:pointer;color:var(--ink);white-space:nowrap}
.tabs button small{background:#f1ecff;color:var(--acc);border-radius:999px;padding:0 7px;font-size:.75rem}
.tabs button.on{background:linear-gradient(135deg,var(--acc),var(--acc2));color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(91,60,196,.3)}
.tabs button.on small{background:rgba(255,255,255,.25);color:#fff}
@media(min-width:768px){.tabs{flex-wrap:wrap;overflow-x:visible}.tabs button{padding:8px 13px}}