.events-page .silk { filter: saturate(.9) brightness(.66); }
.events-page .cut { top: 57%; opacity: .24; }
.events-page .nav a[aria-current="page"] { color: #fff; }
.events-main { max-width: 1160px; padding-bottom: 90px; }
.events-mini-player.error .mini-dot { background: #6f6874; }

.events-hero { min-height: 62vh; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(280px, .65fr); align-items: center; gap: clamp(42px, 8vw, 110px); padding: 8vh 0 10vh; border: 0; }
.events-hero h1 { margin: 0; color: transparent; background: var(--silver-grad); background-clip: text; font: 800 clamp(4.7rem, 12vw, 10.4rem)/.72 var(--sans); letter-spacing: -.085em; text-transform: uppercase; filter: drop-shadow(0 18px 38px #000); -webkit-background-clip: text; }
.events-hero h1 span { font-size: .44em; letter-spacing: -.055em; }
.events-intro { max-width: 440px; padding: 28px 0 28px 28px; border-left: 1px solid #d7d1df73; color: #ddd6e4; }
.events-intro p { margin: 0 0 18px; font-size: 1.06rem; line-height: 1.6; }
.events-intro p:last-child { margin-bottom: 0; }
.events-intro a { color: #fff; text-underline-offset: 4px; }

.events-board { padding: 0; border: 1px solid #a49dac6b; background: linear-gradient(145deg, #12051ee8, #08010ef5 70%); box-shadow: 18px 22px 0 #0300075c; }
.feed-rail { display: grid; grid-template-columns: auto auto 1fr auto; align-items: center; gap: 10px 18px; min-height: 48px; padding: 12px 22px; border-bottom: 1px solid #aaa2b265; background: repeating-linear-gradient(90deg, #ffffff08 0 1px, transparent 1px 7px), #07010dd4; color: #bcb3c7; font: .67rem/1.4 Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; }
.feed-rail strong { color: #f2edf6; font-weight: 700; }
.feed-rail a { color: #fff; text-underline-offset: 3px; }
.feed-light { width: 8px; height: 8px; border-radius: 50%; background: #8c8494; box-shadow: 0 0 0 4px #8c849415; }
.feed-rail.is-live .feed-light { background: #54e390; box-shadow: 0 0 14px #54e390b8; }
.feed-rail.is-error .feed-light { background: #ff5b7f; }

.events-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; padding: clamp(32px, 5vw, 56px) clamp(24px, 5vw, 56px) 26px; }
.events-heading h2 { margin: 0; color: #f4f0f7; background: none; font: 800 clamp(3rem, 7vw, 6.5rem)/.84 var(--sans); letter-spacing: -.07em; text-transform: uppercase; -webkit-text-fill-color: currentColor; }
#event-count { max-width: 230px; margin: 0; color: #aaa0b4; font: .7rem/1.5 Consolas, monospace; letter-spacing: .08em; text-align: right; text-transform: uppercase; }

.event-controls { display: grid; grid-template-columns: 1fr minmax(260px, .42fr); gap: 20px; align-items: end; padding: 0 clamp(24px, 5vw, 56px) 30px; }
.event-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.event-filters button { padding: 11px 14px; color: #bfb6c9; background: #ffffff08; border: 1px solid #aaa2b24d; font: 700 .66rem var(--sans); letter-spacing: .07em; text-transform: uppercase; cursor: pointer; }
.event-filters button:hover, .event-filters button.is-active { color: #100419; background: var(--silver-grad); border-color: #fff; }
.event-search { display: grid; gap: 6px; color: #a89caf; font: 700 .61rem Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
.event-search input { min-width: 0; width: 100%; padding: 12px 13px; color: #f5eff8; background: #050009a6; border: 1px solid #aaa2b26b; border-radius: 0; font: .88rem var(--sans); }
.event-search input:focus { outline: 2px solid #d8d2e3; outline-offset: 2px; }

.event-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; padding: 1px; background: #bcb4c042; }
.event-card { --event-mark: linear-gradient(90deg, #d8d9e2, #fff, #858394); position: relative; display: grid; grid-template-columns: 112px 1fr; min-width: 0; min-height: 270px; background: linear-gradient(135deg, #2a1438f2, #0a0212f7 70%); overflow: hidden; }
.event-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
.event-card::before { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(120deg, #ffffff15, transparent 28%), repeating-linear-gradient(115deg, #ffffff06 0 1px, transparent 1px 9px); }
.event-card::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 5px; background: var(--event-mark); }
.event-card[data-type="music"], .event-card[data-type="nightlife"] { --event-mark: linear-gradient(90deg, #7319db, #d68cff, #541094); }
.event-card[data-type="screen"] { --event-mark: linear-gradient(90deg, #bab7bd, #5e5c61, #f5f2f7); }
.event-card[data-type="community"] { --event-mark: linear-gradient(90deg, #a47a47, #e0c497, #8c6235); }
.event-card[data-type="skate"], .event-card[data-type="sport"] { --event-mark: linear-gradient(90deg, #ff305c, #ff9258, #bf1341); }
.event-date { position: relative; z-index: 1; display: flex; flex-direction: column; padding: 30px 18px; color: #c9c0d1; border-right: 1px solid #b9b2c13d; font: .68rem/1.35 Consolas, monospace; letter-spacing: .08em; text-transform: uppercase; }
.event-date b { display: block; color: #fff; font: 800 2.55rem/.9 var(--sans); letter-spacing: -.08em; }
.event-date strong { margin-top: 6px; color: #f1edf4; font-size: .72rem; }
.event-date time:last-child { margin-top: auto; color: #fff; font-size: .75rem; }
.event-copy { position: relative; z-index: 1; display: flex; flex-direction: column; min-width: 0; padding: 28px 26px 24px; }
.event-kicker { margin: 0 0 9px; color: #a99caf; font: 700 .61rem/1.4 Consolas, monospace; letter-spacing: .1em; text-transform: uppercase; }
.event-copy h3 { margin: 0 0 12px; color: #f6f1f8; font: 700 clamp(1.45rem, 3vw, 2.2rem)/.96 var(--serif); }
.event-title-button { padding: 0; color: inherit; background: none; border: 0; font: inherit; line-height: inherit; text-align: left; cursor: pointer; }
.event-title-button:hover { text-decoration: underline; text-underline-offset: 4px; }
.event-summary { display: -webkit-box; margin: 0 0 18px; overflow: hidden; color: #cfc6d5; font-size: .88rem; line-height: 1.5; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.event-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: auto 0 0; color: #b7acbf; font: .64rem/1.4 Consolas, monospace; text-transform: uppercase; }
.event-action { align-self: flex-start; margin-top: 17px; padding: 0 0 3px; color: #fff; background: none; border: 0; border-bottom: 1px solid #fff8; font: 800 .72rem var(--sans); letter-spacing: .08em; text-decoration: none; text-transform: uppercase; cursor: pointer; }
.event-action:hover { border-color: #fff; }
.event-empty { grid-column: 1 / -1; margin: 0; padding: 70px 30px; color: #c9bfce; text-align: center; line-height: 1.6; }
.event-more { display: block; width: calc(100% - clamp(48px, 10vw, 112px)); margin: 28px auto; padding: 14px; color: #f4eff7; background: transparent; border: 1px solid #aaa2b26b; font: 800 .68rem var(--sans); letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.event-more[hidden] { display: none; }
.event-more:hover { color: #100419; background: var(--silver-grad); }

.events-footer { display: grid; grid-template-columns: 1fr auto; gap: 26px 40px; align-items: center; margin-top: 46px; padding: 24px 28px; border-top: 4px solid #9e98a5; border-bottom: 1px solid #9e98a56b; background: #090211d9; }
.events-footer > div { display: flex; align-items: baseline; gap: 18px; }
.events-footer strong { color: #fff; font-size: 1.05rem; letter-spacing: .05em; }
.events-footer span { color: #aca2b4; font: .68rem Consolas, monospace; text-transform: uppercase; }
.events-footer nav { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 18px; }
.events-footer a { color: #fff; font-size: .76rem; text-underline-offset: 4px; }

.event-dialog { --event-mark: linear-gradient(90deg, #d8d9e2, #fff, #858394); width: min(680px, calc(100% - 28px)); max-height: 88dvh; padding: clamp(26px, 6vw, 58px); color: #eee8f3; background: linear-gradient(140deg, #2a1438, #0a0212 72%); border: 1px solid #d5cedb; box-shadow: 0 30px 120px #000c; }
.event-dialog[data-type="music"], .event-dialog[data-type="nightlife"] { --event-mark: linear-gradient(90deg, #7319db, #d68cff, #541094); }
.event-dialog[data-type="community"] { --event-mark: linear-gradient(90deg, #a47a47, #e0c497, #8c6235); }
.event-dialog[data-type="skate"], .event-dialog[data-type="sport"] { --event-mark: linear-gradient(90deg, #ff305c, #ff9258, #bf1341); }
.event-dialog::before { content: ""; display: block; width: 90px; height: 6px; margin-bottom: 28px; background: var(--event-mark); }
.event-dialog::backdrop { background: #07010dd4; backdrop-filter: blur(8px); }
.event-dialog-close { float: right; padding: 7px 0; color: #c9c0d1; background: none; border: 0; font: .72rem var(--sans); text-transform: uppercase; cursor: pointer; }
.event-dialog-code { margin: 0 0 10px; color: #afa2b8; font: 700 .65rem Consolas, monospace; letter-spacing: .12em; text-transform: uppercase; }
.event-dialog h2 { clear: both; margin: 0 0 12px; color: #fff; background: none; font: 800 clamp(2.8rem, 8vw, 5.8rem)/.86 var(--sans); letter-spacing: -.065em; text-transform: uppercase; -webkit-text-fill-color: currentColor; }
.event-dialog-when { color: #e0d4e8; font: 700 .78rem/1.5 Consolas, monospace; letter-spacing: .05em; text-transform: uppercase; }
#event-detail-summary { color: #d8cedd; line-height: 1.65; }
.event-dialog-facts { display: grid; grid-template-columns: 90px 1fr; margin: 28px 0; border-top: 1px solid #c4bdca4d; }
.event-dialog-facts dt, .event-dialog-facts dd { margin: 0; padding: 9px 0; border-bottom: 1px solid #c4bdca38; }
.event-dialog-facts dt { color: #a99caf; font: .65rem Consolas, monospace; text-transform: uppercase; }
.event-dialog-facts dd { color: #f2edf4; font-size: .86rem; }
.event-dialog-actions { display: flex; flex-wrap: wrap; gap: 12px 22px; }
.event-dialog-actions a, .event-dialog-share { padding: 9px 0; color: #fff; background: none; border: 0; border-bottom: 1px solid #ffffff7d; font: 800 .69rem var(--sans); letter-spacing: .06em; text-decoration: none; text-transform: uppercase; cursor: pointer; }
.event-dialog-share { margin-top: 12px; }
.event-dialog-feedback { min-height: 1.4em; margin: 14px 0 0; color: #cabed1; font-size: .8rem; }

@media (max-width: 850px) {
  .events-hero { min-height: auto; grid-template-columns: 1fr; padding-top: 10vh; }
  .events-intro { max-width: 620px; }
  .event-controls, .events-footer { grid-template-columns: 1fr; }
  .events-footer nav { justify-content: flex-start; }
}
@media (max-width: 720px) {
  .event-grid { grid-template-columns: 1fr; }
  .feed-rail { grid-template-columns: auto 1fr auto; }
  #feed-updated { display: none; }
}
@media (max-width: 520px) {
  .events-main { padding-inline: 14px; }
  .events-page .top { padding-inline: 14px; }
  .events-page .nav { gap: 11px; font-size: .62rem; }
  .events-hero h1 { font-size: 20vw; }
  .events-intro { padding-left: 20px; }
  .events-heading { display: block; }
  #event-count { margin-top: 16px; text-align: left; }
  .event-controls { grid-template-columns: 1fr; }
  .event-filters { display: grid; grid-template-columns: 1fr 1fr; }
  .event-card { grid-template-columns: 86px 1fr; min-height: 290px; }
  .event-date { padding-inline: 13px; }
  .event-copy { padding-inline: 19px; }
  .events-footer > div { display: grid; gap: 5px; }
}
