﻿:root {
  --bg-top: #120a0b;
  --bg-bottom: #030303;
  --ink: #f8eeee;
  --ink-filter: brightness(0) saturate(100%) invert(94%) sepia(8%) saturate(540%) hue-rotate(297deg) brightness(109%) contrast(94%);
  --muted: #d1bbbb;
  --line: #9a4f24;
  --timeline-accent: #f3c5b0;
  --card: rgba(255, 252, 245, 0.8);
  --shadow: rgba(34, 18, 9, 0.12);
  --card-height: 132px;
}

* { box-sizing: border-box; }
button { touch-action: manipulation; }

body {
  margin: 0;
  min-height: 100vh;
  font-family: "DM Sans", "Segoe UI", sans-serif;
  color: var(--ink);
  background: radial-gradient(ellipse at 50% 43%, rgba(255, 255, 255, 0.475) 0%, rgba(255, 255, 255, 0.23) 34%, rgba(255, 255, 255, 0.065) 58%, transparent 82%), linear-gradient(180deg, var(--bg-top), var(--bg-bottom));
  overflow-x: hidden;
}
body.is-modal-open { overflow: hidden; overscroll-behavior: none; }

body::before, body::after { content: ""; position: fixed; z-index: 0; inset: -25vmax; pointer-events: none; filter: blur(58px); will-change: transform, background-position; }
body::before { background: radial-gradient(ellipse 19rem 26rem at 23% 30%, rgba(179, 67, 42, 0.3) 0 44%, transparent 70%), radial-gradient(ellipse 25rem 18rem at 78% 62%, rgba(255, 207, 183, 0.22) 0 42%, transparent 69%), radial-gradient(ellipse 15rem 21rem at 51% 83%, rgba(124, 47, 29, 0.27) 0 48%, transparent 73%); animation: lava-drift-one 15s ease-in-out infinite alternate; }
body::after { background: radial-gradient(ellipse 17rem 14rem at 70% 22%, rgba(244, 177, 145, 0.24) 0 43%, transparent 70%), radial-gradient(ellipse 20rem 28rem at 29% 69%, rgba(150, 61, 38, 0.24) 0 45%, transparent 72%), radial-gradient(ellipse 13rem 17rem at 88% 85%, rgba(255, 244, 230, 0.16) 0 39%, transparent 70%); animation: lava-drift-two 18s ease-in-out infinite alternate; }

.mobile-edge-fade { display: none; }
.safari-edge-fade { display: block; position: fixed; z-index: 8; left: 0; right: 0; height: 5rem; opacity: 0; pointer-events: none; transition: opacity 280ms ease; }
.hero { position: relative; }
.hamburger-menu { position: fixed; z-index: 22; top: 2.8rem; right: 3.1rem; display: grid; width: 3.1rem; height: 3.1rem; padding: 0; background: #b33a2e; border: 2px solid #17130f; border-radius: 50%; box-shadow: 3px 3px 0 #17130f; cursor: pointer; place-items: center; }
.hamburger-menu:hover, .hamburger-menu:focus-visible { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #17130f; }
.hamburger-menu:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.hamburger-menu img { width: 70%; height: 70%; object-fit: contain; }
.site-menu-backdrop[hidden], .site-menu[hidden] { display: none; }
.site-menu-backdrop { position: fixed; z-index: 20; inset: 0; opacity: 0; background: rgba(0, 0, 0, 0.52); transition: opacity 220ms ease; }
.site-menu-backdrop.is-open { opacity: 1; }
.site-menu { position: fixed; z-index: 21; top: 0; right: 0; bottom: 0; display: flex; flex-direction: column; width: min(23rem, 88vw); padding: 1.25rem; color: #17130f; background: #f4edda; border-left: 2px solid #17130f; box-shadow: -7px 0 0 #17130f; opacity: 0; transform: translateX(100%); transition: opacity 220ms ease, transform 220ms cubic-bezier(0.22, 1, 0.36, 1); overflow-y: auto; overflow-anchor: none; scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: rgba(23, 19, 15, 0.55) transparent; }
.site-menu::-webkit-scrollbar { width: 6px; }
.site-menu::-webkit-scrollbar-track { background: transparent; }
.site-menu::-webkit-scrollbar-thumb { background: rgba(23, 19, 15, 0.55); border-radius: 999px; }
.site-menu::-webkit-scrollbar-thumb:hover { background: rgba(23, 19, 15, 0.8); }
.site-menu.is-open { opacity: 1; transform: translateX(0); }
.site-menu-close { align-self: flex-end; flex: 0 0 2.5rem; width: 2.5rem; height: 2.5rem; padding: 0; color: #17130f; font: 2rem/1 "DM Sans", sans-serif; background: transparent; border: 0; cursor: pointer; }
.site-menu-close:focus-visible { outline: 2px solid #17130f; outline-offset: 2px; }
.site-menu-links { display: grid; align-content: start; gap: 0.8rem; margin-top: 3rem; }
.site-menu-section { border-bottom: 2px solid #17130f; }
.site-menu-section summary { display: flex; align-items: center; justify-content: space-between; padding: 0.65rem 0; color: #17130f; font: 2.25rem/1 "Bebas Neue", Impact, sans-serif; letter-spacing: 0.04em; cursor: pointer; list-style: none; }
.site-menu-section summary::-webkit-details-marker { display: none; }
.site-menu-section summary::after { content: "+"; font: 1.8rem/1 "DM Mono", monospace; }
.site-menu-section[open] summary::after { content: "−"; }
.site-menu-section summary:hover, .site-menu-section summary:focus-visible { color: #b33a2e; }
.site-menu-section summary:focus-visible { outline: 2px solid #17130f; outline-offset: 3px; }
.site-menu-section-content { max-height: 0; overflow: hidden; padding: 0; color: #17130f; font-size: 0.92rem; line-height: 1.5; opacity: 0; transform: translateY(-0.35rem); transition: max-height 280ms cubic-bezier(0.22, 1, 0.36, 1), opacity 180ms ease, transform 280ms cubic-bezier(0.22, 1, 0.36, 1), padding-bottom 280ms cubic-bezier(0.22, 1, 0.36, 1); }
.site-menu-section.is-expanded .site-menu-section-content { max-height: 60rem; padding-bottom: 1rem; opacity: 1; transform: translateY(0); }
.site-menu { overscroll-behavior: contain; }
.site-menu-section-content p { margin: 0; }
.site-menu-faq-item { display: grid; gap: 0.3rem; }
.site-menu-faq-item h3 { margin: 1rem 0 0 0; font: 1.15rem/1.1 "Bebas Neue", Impact, sans-serif; letter-spacing: 0.04em; }
.page { position: relative; z-index: 1; width: min(960px, 92vw); margin: 0 auto; padding: 2.5rem 0 3rem; }
.back-to-top { position: fixed; top: 0; z-index: 999999; right: 1rem; display: flex; align-items: flex-start; gap: 0.35rem; }
.back-to-top[hidden] { display: none; }
.back-to-top-bubble { width: clamp(2.34rem, calc(3.6vw + 0.9rem), 4.14rem); height: clamp(2.34rem, calc(3.6vw + 0.9rem), 4.14rem); padding: 0 0 0.15rem; color: var(--ink); font: 2rem/1 "DM Mono", monospace; background: #b33a2e; border: 2px solid #17130f; border-radius: 50%; box-shadow: 3px 3px 0 #17130f; cursor: pointer; transition: transform 140ms ease, box-shadow 140ms ease; }
.back-to-top-bubble:hover, .back-to-top-bubble:focus-visible { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #17130f; }
.back-to-top-icon.is-arrow { transform: rotate(-90deg); }
.back-to-top-bubble:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.hero { margin-bottom: 2rem; }
.eyebrow, .event-when { font-family: "DM Mono", monospace; }
.eyebrow { margin: 0; font-size: 0.8rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--muted); }
h1, .event-title { font-family: "Bebas Neue", Impact, sans-serif; letter-spacing: 0.035em; }
h1 { margin: 0.3rem 0; font-size: clamp(2.6rem, 4vw + 1rem, 4.6rem); line-height: 0.9; }
.meta { margin: 0; color: var(--muted); font-size: smaller; font-family: "DM Sans", "Segoe UI", sans-serif; }
.guide-description { margin: 0.6rem 0; max-width: 45rem; color: var(--muted); font-size: smaller; line-height: 1.4; }
.guide-description-detail { display: block; text-align: justify; font-family: "DM Sans", "Segoe UI", sans-serif; }

.guide-description-intro { display: block; font-family: "DM Sans", "Segoe UI", sans-serif; letter-spacing: 0.03em; }
.search-wrap { position: relative; width: min(100%, 31rem); margin-top: 0.9rem; }
.event-search { display: block; width: 100%; padding: 0.65rem 2.5rem 0.65rem 0.8rem; color: #17130f; font: 0.95rem "DM Sans", "Segoe UI", sans-serif; background: var(--ink); border: 2px solid #17130f; border-radius: 0; box-shadow: 3px 3px 0 #17130f; }
.event-search::placeholder { color: #6c5b53; }
.event-search:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.event-search::-webkit-search-cancel-button { appearance: none; }
.clear-search { position: absolute; top: 50%; right: 0.55rem; width: 1.5rem; height: 1.5rem; padding: 0; transform: translateY(-50%); color: #17130f; font: 1.5rem/1 "DM Sans", "Segoe UI", sans-serif; background: transparent; border: 0; cursor: pointer; }
.clear-search:focus-visible { outline: 2px solid #17130f; outline-offset: 2px; }
.tag-filters { margin-top: 0.9rem; padding: 0; display: flex; justify-content: flex-start; flex-wrap: wrap; gap: 0.5rem; }
.tag-filter-btn { width: 3.1rem; height: 3.1rem; border: 0; background: transparent; font-size: 1.6rem; cursor: pointer; display: grid; place-items: center; transition: transform 140ms ease, opacity 140ms ease; }
.tag-filter-btn:hover, .tag-filter-btn:focus-visible { transform: translateY(-1px); outline: none; }
.tag-filter-btn:focus-visible { outline: 1px solid var(--ink); outline-offset: 3px; }
.tag-filter-btn.is-include { opacity: 1; }
.tag-filter-btn.is-exclude { opacity: 0.35; }
.calendar-icon { display: none; }
.calendar-filter-button { display: none; }
.tag-icon { width: 1.05rem; height: 1.05rem; object-fit: contain; vertical-align: middle; }
.tag-filter-btn .tag-icon { width: 1.5rem; height: 1.5rem; }
.tag-icon { filter: var(--ink-filter); }
.event-tags .tag-icon { filter: invert(55%) sepia(71%) saturate(473%) hue-rotate(68deg) brightness(92%) contrast(91%); }
.tag-filter-btn--price.is-paid .tag-icon, .event-tags .tag-icon--paid { filter: invert(31%) sepia(88%) saturate(1482%) hue-rotate(344deg) brightness(94%) contrast(91%); }
.tag-filter-btn--price.is-free .tag-icon, .event-tags .tag-icon--free { filter: invert(55%) sepia(71%) saturate(473%) hue-rotate(68deg) brightness(92%) contrast(91%); }
.tag-filter-btn--music.is-include .tag-icon, .tag-filter-btn--food.is-include .tag-icon, .tag-filter-btn--educational.is-include .tag-icon, .tag-filter-btn--screening.is-include .tag-icon { filter: invert(55%) sepia(71%) saturate(473%) hue-rotate(68deg) brightness(92%) contrast(91%); }
.tag-filter-btn--music.is-exclude .tag-icon, .tag-filter-btn--food.is-exclude .tag-icon, .tag-filter-btn--educational.is-exclude .tag-icon, .tag-filter-btn--screening.is-exclude .tag-icon { filter: invert(31%) sepia(88%) saturate(1482%) hue-rotate(344deg) brightness(94%) contrast(91%); }
.timeline-wrap { position: relative; }
.day-groups { display: grid; gap: 1.1rem; }
.day-group { display: grid; gap: 0.7rem; }
.day-header { margin: 0; padding-left: 2.4rem; padding-top: 1.5rem; font-size: 1.05rem; letter-spacing: 0.04em; text-transform: uppercase; color: var(--timeline-accent); }
.event-line { position: relative; margin: 0; padding: 0; list-style: none; display: grid; gap: 1rem; }
.event-item:not(:last-child)::after { content: ""; position: absolute; top: 1.425rem; bottom: -2.425rem; left: calc(1.025rem - 1.5px + 1px); width: 2px; border-radius: 999px; background: var(--timeline-accent); z-index: 0; }
.event-item { position: relative; padding-left: 2.4rem; display: flex; align-items: flex-start; }
.event-item.is-initially-hidden { opacity: 0; }
.event-item.is-initially-hidden.is-fading-in { animation: rise 420ms ease forwards; }
.dot { position: absolute; top: 1rem; left: 0.6rem; width: 0.85rem; height: 0.85rem; border-radius: 50%; background: var(--timeline-accent); border: 3px solid var(--timeline-accent); z-index: 2; }
.event-card { position: relative; display: grid; grid-template-columns: var(--card-height) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr); width: 100%; max-width: 100%; height: var(--card-height); color: #17130f; background-color: #f4edda; background-image: repeating-radial-gradient(circle at 0 0, rgba(0, 0, 0, 0.09) 0 0.7px, transparent 0.8px 3px), linear-gradient(120deg, rgba(255, 255, 255, 0.5), transparent 55%); border: 2px solid #17130f; border-radius: 0; overflow: hidden; clip-path: polygon(0 0.9%, 8% 0.35%, 17% 1.05%, 29% 0.2%, 42% 0.95%, 55% 0.3%, 68% 0.85%, 81% 0.2%, 92% 0.7%, 100% 0.35%, 100% 99.35%, 91% 99.05%, 78% 99.75%, 64% 98.9%, 50% 99.6%, 36% 99%, 22% 99.85%, 9% 99.1%, 0 99.5%); box-shadow: none; filter: drop-shadow(6px 6px 0 #17130f); }
.event-item:nth-child(3n + 1) .event-card { clip-path: polygon(0 0.3%, 10% 0.95%, 23% 0.2%, 35% 0.85%, 49% 0.1%, 62% 0.75%, 76% 0.2%, 89% 0.9%, 100% 0.3%, 100% 99.7%, 88% 99%, 74% 99.8%, 60% 99.2%, 47% 99.65%, 32% 98.9%, 18% 99.55%, 6% 99.05%, 0 99.7%); }
.event-item:nth-child(3n + 2) .event-card { clip-path: polygon(0 0.75%, 7% 0.2%, 20% 0.95%, 34% 0.3%, 47% 0.85%, 59% 0.15%, 73% 1%, 86% 0.2%, 100% 0.75%, 100% 99.25%, 94% 99.8%, 82% 99%, 69% 99.7%, 55% 98.9%, 41% 99.55%, 27% 99%, 14% 99.85%, 0 99.25%); }
.event-card.no-image { grid-template-columns: 1fr; }
.event-card.is-expanded { grid-template-rows: auto; height: auto; min-height: var(--card-height); overflow: visible; }
.event-card-shell { position: relative; display: inline-block; max-width: 80%; min-width: 50%; }
.event-card-link { display: block; color: inherit; text-decoration: none; }
.poster-modal-backdrop[hidden], .poster-modal[hidden] { display: none; }
.poster-modal-backdrop { position: fixed; z-index: 9; inset: 0; opacity: 1; background: rgba(35, 35, 35, 0); backdrop-filter: blur(0); touch-action: none; transition: background-color 180ms ease, backdrop-filter 180ms ease; }
.poster-modal-backdrop.is-open { background: rgba(35, 35, 35, 0.72); backdrop-filter: blur(4px); }
.event-card-link:hover .event-card, .event-card-link:focus-visible .event-card, .event-item.is-keyboard-active .event-card { transform: translate(2px, 2px) rotate(0); filter: drop-shadow(3px 3px 0 #17130f); }
.poster-modal-stack { position: relative; display: grid; width: min(58rem, 100%); gap: 0.75rem; transform: translateY(-4vh); }
.poster-modal-actions { display: flex; align-items: center; justify-content: center; gap: 1rem; opacity: 0; pointer-events: none; transform: translateY(8px) scale(0.96); transition: opacity 180ms ease, transform 180ms cubic-bezier(0.22, 1, 0.36, 1); }
.poster-modal-actions.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }
#posterModalActions { display: none; }
.poster-modal-action { display: grid; place-items: center; width: 3.1rem; height: 3.1rem; padding: 0; background-color: #b33a2e; background-image: repeating-radial-gradient(circle at 0 0, rgba(0, 0, 0, 0.09) 0 0.7px, transparent 0.8px 3px), linear-gradient(120deg, rgba(255, 255, 255, 0.25), transparent 55%); border: 2px solid #17130f; border-radius: 50%; box-shadow: 3px 3px 0 #17130f; cursor: pointer; transition: transform 140ms ease, box-shadow 140ms ease, background-color 180ms ease; }
.poster-modal-action.is-copied, .poster-modal-action.is-going, .poster-modal-action.is-attending { background-color: #59a84f; }
.poster-modal-action-icon { width: 70%; height: 70%; object-fit: contain; pointer-events: none; }
.poster-modal-action:nth-child(2) .poster-modal-action-icon { width: 64%; height: 64%; transform: translateX(-2px); }
.poster-modal-action:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #17130f; }
.poster-modal-action:focus-visible { outline: 2px solid #17130f; outline-offset: 3px; }
.poster-modal { position: fixed; z-index: 10; inset: 0; display: grid; place-items: center; padding: clamp(0.75rem, 4vw, 2rem); overscroll-behavior: none; }
.poster-modal-card { position: relative; width: min(58rem, 100%); padding: clamp(1rem, 3vw, 1.5rem); color: #17130f; background-color: #f4edda; background-image: repeating-radial-gradient(circle at 0 0, rgba(0, 0, 0, 0.09) 0 0.7px, transparent 0.8px 3px), linear-gradient(120deg, rgba(255, 255, 255, 0.5), transparent 55%); border: 2px solid #17130f; box-shadow: 7px 7px 0 #17130f; opacity: 0; transform: translateY(8px) scale(0.96); transition: opacity 180ms ease, transform 180ms cubic-bezier(0.22, 1, 0.36, 1); }
.poster-modal.is-open .poster-modal-card { opacity: 1; transform: translateY(0) scale(1); }
.poster-modal-title { margin: 0; padding-right: 2rem; font: 1.65rem/1.05 "Bebas Neue", Impact, sans-serif; letter-spacing: 0.035em; overflow-wrap: anywhere; }
.poster-modal-when { margin: 0.35rem 0 0.8rem; padding-right: 2rem; color: #b33a2e; font: 0.83rem/1.35 "DM Mono", monospace; letter-spacing: 0.04em; overflow-wrap: anywhere; }
.poster-modal-body { min-height: 30vh; padding: 0.75rem; color: #17130f; }
.poster-modal-body::after { content: ""; display: block; clear: both; }
.poster-modal-image { border: 2px solid #17130f; float: left; display: block; width: auto; height: auto; max-width: min(42%, 18rem); max-height: 30vh; margin: 0 1rem 0.55rem 0; object-fit: contain; cursor: zoom-in; }
.poster-modal-description { margin: 0; color: #17130f; font-size: 0.88rem; line-height: 1.45; white-space: pre-line; }
.poster-modal-attendance { opacity: 0; pointer-events: none; transform: translateY(8px) scale(0.96); transition: opacity 280ms ease, transform 280ms cubic-bezier(0.22, 1, 0.36, 1); position: absolute; z-index: 2; top: -3.1rem; left: -2px; display: flex; align-items: center; justify-content: center; min-width: 4.2rem; height: 2.55rem; padding: 0 0.55rem; gap: 0.4rem; color: #17130f; font: 700 0.9rem/1 "DM Mono", monospace; background: #939393; border: 2px solid #17130f; border-radius: 999px; }
.poster-modal-attendance.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }
.poster-modal-attendance.is-closing { opacity: 0; pointer-events: none; transform: translateY(8px) scale(0.96); }
.poster-modal-attendance.is-closing { animation: none; }
.poster-modal-attendance.is-bouncing { animation: attendance-pill-hop 240ms ease-out; }
.poster-modal-attendance img { width: 1.35rem; height: 1.35rem; object-fit: contain; }
.poster-modal-date { position: absolute; z-index: 2; top: -2.4rem; left: 50%; margin: 0; color: var(--ink); font: 1.65rem/1.05 "Bebas Neue", Impact, sans-serif; letter-spacing: 0.035em; text-shadow: 2px 2px 0 #17130f; white-space: nowrap; opacity: 0; pointer-events: none; transform: translateX(-50%) translateY(8px) scale(0.96); transition: opacity 280ms ease, transform 280ms cubic-bezier(0.22, 1, 0.36, 1); }
.poster-modal-date.is-visible { opacity: 1; pointer-events: none; transform: translateX(-50%) translateY(0) scale(1); }
.poster-modal-date.is-closing { opacity: 0; pointer-events: none; transform: translateX(-50%) translateY(8px) scale(0.96); }
.poster-modal-report { opacity: 0; pointer-events: none; transform: translateY(8px) scale(0.96); transition: opacity 280ms ease, transform 280ms cubic-bezier(0.22, 1, 0.36, 1); position: absolute; z-index: 2; top: -3.1rem; right: -2px; display: grid; width: 2.55rem; height: 2.55rem; padding: 0; background: #939393; border: 2px solid #17130f; border-radius: 50%; box-shadow: 2px 2px 0 #17130f; place-items: center; cursor: pointer; }
.poster-modal-report.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }
.poster-modal-report.is-closing { opacity: 0; pointer-events: none; transform: translateY(8px) scale(0.96); }
.poster-modal-report img { width: auto; height: 1.35rem; object-fit: contain; transform: translateX(1px); }
.poster-modal-report:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #17130f; }
.bug-report-modal[hidden] { display: none; }
.bug-report-modal { position: fixed; z-index: 12; inset: 0; display: grid; padding: 1rem; background: rgba(35, 35, 35, 0.72); place-items: center; }
.bug-report-card { display: grid; width: min(22rem, 100%); min-height: 28rem; gap: 0.9rem; padding: clamp(1.25rem, 4vw, 2rem); color: #17130f; background: #f4edda; border: 2px solid #17130f; box-shadow: 7px 7px 0 #17130f; }
.bug-report-card label { font: 1.45rem/1.05 "Bebas Neue", Impact, sans-serif; letter-spacing: 0.035em; }
.bug-report-card textarea { width: 100%; min-height: 12rem; padding: 0.75rem; resize: vertical; color: #17130f; font: 0.9rem/1.4 "DM Sans", sans-serif; background: #fffdf7; border: 2px solid #17130f; }
.bug-report-actions { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-top: auto; }
.bug-report-button { min-height: 2.8rem; padding: 0.45rem 1rem; color: #17130f; font: 700 0.82rem/1 "DM Sans", sans-serif; background-image: repeating-radial-gradient(circle at 0 0, rgba(0, 0, 0, 0.09) 0 0.7px, transparent 0.8px 3px), linear-gradient(120deg, rgba(255, 255, 255, 0.25), transparent 55%); border: 2px solid #17130f; border-radius: 999px; box-shadow: 3px 3px 0 #17130f; cursor: pointer; }
.bug-report-button:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #17130f; }
.bug-report-cancel { background: #939393; }
.bug-report-submit { margin-left: auto; background: #b33a2e; }
.bug-report-thanks[hidden] { display: none; }
.bug-report-thanks { position: fixed; z-index: 13; top: 50%; left: 50%; padding: 0.8rem 1.1rem; color: #17130f; font: 700 0.9rem/1 "DM Mono", monospace; background: #59a84f; border: 2px solid #17130f; border-radius: 999px; box-shadow: 3px 3px 0 #17130f; pointer-events: none; transform: translate(-50%, -50%); }
.bug-report-thanks.is-visible { animation: bug-report-thanks 2.8s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
.poster-modal-close { position: absolute; z-index: 1; top: 0.55rem; right: 0.65rem; width: 2rem; height: 2rem; padding: 0; color: #b33a2e; font: 1.8rem/1 "DM Sans", "Segoe UI", sans-serif; background: transparent; border: 0; outline: 0; cursor: pointer; }
.poster-modal-image[hidden] { display: none; }
.poster-modal.is-image-only .poster-modal-card { width: fit-content; max-width: 100%; padding: 0; background: transparent; border: 0; filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.45)); }
.poster-modal.is-image-only .poster-modal-title, .poster-modal.is-image-only .poster-modal-when, .poster-modal.is-image-only .poster-modal-description { display: none; }
.poster-modal.is-image-only .poster-modal-body { min-height: 0; padding: 0; background: transparent; border: 0; }
.poster-modal.is-image-only .poster-modal-image { float: none; width: auto; height: auto; max-width: calc(100vw - 2rem); max-height: calc(100vh - 2rem); margin: 0; border: 0; border-radius: 6px; cursor: default; object-fit: contain; }
.poster-modal.is-image-only .poster-modal-close { display: none; }
.event-item:nth-child(3n + 1) .event-card-link:hover .event-card, .event-item:nth-child(3n + 1) .event-card-link:focus-visible .event-card, .event-item:nth-child(3n + 1).is-keyboard-active .event-card { transform: translate(2px, 2px) rotate(-0.25deg); }
.event-item:nth-child(3n + 2) .event-card-link:hover .event-card, .event-item:nth-child(3n + 2) .event-card-link:focus-visible .event-card, .event-item:nth-child(3n + 2).is-keyboard-active .event-card { transform: translate(2px, 2px) rotate(0.2deg); }
.event-item:nth-child(3n) .event-card-link:hover .event-card, .event-item:nth-child(3n) .event-card-link:focus-visible .event-card, .event-item:nth-child(3n).is-keyboard-active .event-card { transform: translate(2px, 2px) rotate(-0.15deg); }
.event-card-link:focus-visible { outline: none; }
.event-card-link.missing-link { cursor: default; }
.event-image-wrap { height: 100%; background: #17130f; border-right: 2px solid #17130f; }
.event-card.is-expanded .event-image-wrap { align-self: start; height: var(--card-height); }
.event-image { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0 4px 4px 0; }
.event-content { display: flex; flex-direction: column; height: 100%; min-width: 0; min-height: 0; padding: 0.9rem 1rem; padding-right: 3.2rem; max-width: none; overflow: hidden; }
.event-card.is-expanded .event-content { height: auto; overflow: visible; }
.event-titleline { display: flex; align-items: baseline; justify-content: space-between; gap: 0.55rem; }
.event-meta-inline { display: flex; align-items: center; gap: 0.45rem; flex-shrink: 0; }
.event-tags { position: absolute; top: 0.9rem; right: calc(100%); margin: 0; display: flex; align-items: center; justify-content: flex-end; gap: 0.4rem; min-height: 1.05rem; white-space: nowrap; }
.event-tags[hidden] { display: none; }
.event-tags-mobile { display: none; }
.event-when-text { display: inline-block; white-space: nowrap; }
.event-title-text { display: inline-block; white-space: nowrap; }
.event-when { min-width: 0; margin: 0; overflow: hidden; color: #b33a2e; font-size: 0.83rem; letter-spacing: 0.06em; text-align: left; text-overflow: ellipsis; text-transform: none; white-space: nowrap; }
.event-title { flex: 0 0 auto; margin: 0.25rem 0 0.35rem; font-size: 1.35rem; line-height: 0.95; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.event-when.is-scrolling, .event-title.is-scrolling { overflow: hidden; text-overflow: clip; }
.event-when.is-scrolling.is-marquee-active, .event-title.is-scrolling.is-marquee-active { animation: scroll-event-when-edge var(--scroll-duration) linear 2.5s infinite; }
.event-when-track, .event-title-track { display: inline-flex; gap: 20px; width: max-content; white-space: nowrap; }
.event-when.is-scrolling.is-marquee-active .event-when-track, .event-title.is-scrolling.is-marquee-active .event-title-track { animation: scroll-event-when var(--scroll-duration) linear 2.5s infinite; }
.event-description { flex: 1 1 0; min-height: 0; margin: 0.25rem 0 0; color: black; font-size: 0.84rem; line-height: 1.35; overflow: hidden; }
.event-card.is-expanded .event-description { flex: none; overflow: visible; }
.event-description-toggle { display: inline; padding: 0; border: 0; color: #9a4f24; font: 500 0.78rem "DM Mono", monospace; text-decoration: underline; text-underline-offset: 0.18em; background: transparent; cursor: pointer; }
.event-description-toggle:hover, .event-description-toggle:focus-visible { color: #17130f; }
.event-description-toggle:focus-visible { outline: 2px solid #17130f; outline-offset: 3px; }
@keyframes rise { from { opacity: 0; } to { opacity: 1; } }
@keyframes lava-drift-one { 0% { transform: translate3d(-8%, -6%, 0) scale(0.9) rotate(-7deg); } 48% { transform: translate3d(10%, 8%, 0) scale(1.16, 0.86) rotate(7deg); } 100% { transform: translate3d(-3%, 14%, 0) scale(0.87, 1.17) rotate(-4deg); } }
@keyframes reveal-description { from { opacity: 0; transform: translateY(-0.35rem); } to { opacity: 1; transform: translateY(0); } }
@keyframes conceal-description { from { opacity: 1; transform: translateY(0); } to { opacity: 0; transform: translateY(-0.35rem); } }
@keyframes scroll-event-when { 0%, 12% { transform: translateX(0); } 100% { transform: translateX(calc(-1 * var(--scroll-distance))); } }
@keyframes scroll-event-when-edge {
  0%, 12%, 100% {
    -webkit-mask-image: linear-gradient(to right, black, black calc(100% - 0.45rem), transparent);
    mask-image: linear-gradient(to right, black, black calc(100% - 0.45rem), transparent);
  }
  13%, 99% {
    -webkit-mask-image: linear-gradient(to right, transparent, black 0.45rem, black calc(100% - 0.45rem), transparent);
    mask-image: linear-gradient(to right, transparent, black 0.45rem, black calc(100% - 0.45rem), transparent);
  }
}
.calendar-filter-button { display: none; }
.calendar-picker-backdrop[hidden], .calendar-picker[hidden] { display: none; }
.calendar-picker-backdrop { position: fixed; z-index: 20; inset: 0; background: rgba(0, 0, 0, 0.58); }
.calendar-picker { position: fixed; z-index: 21; top: 50%; left: 50%; width: min(22rem, calc(100vw - 2rem)); padding: 1rem; color: #17130f; background: #f4edda; border: 2px solid #17130f; box-shadow: 6px 6px 0 #17130f; transform: translate(-50%, -50%); }
.calendar-picker-header { display: grid; grid-template-columns: 2rem 1fr 2rem; align-items: center; gap: 0.5rem; }
.calendar-picker-title { margin: 0; text-align: center; font: 1.5rem/1 "Bebas Neue", Impact, sans-serif; letter-spacing: 0.04em; }
.calendar-picker-nav, .calendar-picker-clear, .calendar-picker-done { min-height: 2rem; color: #17130f; font: 700 0.8rem "DM Sans", sans-serif; background: transparent; border: 1px solid #17130f; cursor: pointer; }
.calendar-picker-nav:disabled, .calendar-picker-clear:disabled { opacity: 0.25; cursor: default; }
.calendar-picker-day:disabled { color: #9b9289; opacity: 1; cursor: default; }
.calendar-picker-weekdays { display: grid; grid-template-columns: repeat(7, 1fr); gap: 0.2rem; }
.calendar-picker-grid { display: grid; grid-template-columns: repeat(7, 1fr); grid-template-rows: repeat(6, 2.8rem); row-gap: 0.2rem; }
.calendar-picker-weekdays { margin-top: 1rem; color: #6c5b53; font: 700 0.7rem "DM Mono", monospace; text-align: center; }
.calendar-picker-weekday { width: 1.75rem; height: 1.75rem; padding: 0; color: inherit; font: inherit; background: transparent; border: 0; border-radius: 50%; cursor: pointer; justify-self: center; }
.calendar-picker-weekday.is-selected { color: var(--ink); background: #b33a2e; }
.calendar-picker-weekday:focus-visible { outline: 2px solid #17130f; outline-offset: 2px; }
.calendar-picker-grid { margin-top: 0.35rem; }
.calendar-picker-day { aspect-ratio: 1; padding: 0; color: #9b9289; font: 700 0.85rem "DM Sans", sans-serif; background: transparent; border: 0; border-radius: 50%; cursor: pointer; }
.calendar-picker-day:not(:disabled):focus-visible, .calendar-picker-day:not(:disabled):hover { outline: none; }
.calendar-picker-day.has-events { color: #17130f; }
.calendar-picker-day.is-selected { color: var(--ink); background: #b33a2e; }
.calendar-picker-day.is-selected:disabled { opacity: 1; }
.calendar-picker-day.is-range-selection { border-radius: 0; }
.calendar-picker-day.is-range-row-start { border-radius: 999px 0 0 999px; }
.calendar-picker-day.is-range-row-end { border-radius: 0 999px 999px 0; }
.calendar-picker-day.is-range-row-start.is-range-row-end { border-radius: 999px; }
.calendar-picker-actions { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 1rem; }
.calendar-picker-done { padding-inline: 0.8rem; color: var(--ink); background: #b33a2e; }
@keyframes attendance-pill-hop { 0%, 100% { transform: translateY(0); } 45% { transform: translateY(-0.24rem); } }
@keyframes back-to-top-tap { 0% { transform: scale(1); } 40% { transform: scale(0.84); } 72% { transform: scale(1.09); } 100% { transform: scale(1); } }
@keyframes mobile-edge-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes mobile-edge-fade-out { from { opacity: 1; } to { opacity: 0; } }
@keyframes poster-modal-actions-enter { from { opacity: 0; transform: translate(-50%, 150%); } to { opacity: 1; transform: translateX(-50%); } }
@keyframes poster-modal-actions-exit { from { opacity: 1; transform: translateX(-50%); } to { opacity: 0; transform: translate(-50%, calc(100vh + var(--mobile-event-action-size))); } }
@keyframes copied-toast { 0% { opacity: 1; transform: translate3d(calc(-50% + var(--poster-swipe-offset, 0px)), calc(100% + 7rem), 0); } 20% { opacity: 1; transform: translate3d(calc(-50% + var(--poster-swipe-offset, 0px)), 0, 0); } 75% { opacity: 1; transform: translate3d(calc(-50% + var(--poster-swipe-offset, 0px)), 0, 0); } 100% { opacity: 1; transform: translate3d(calc(-50% + var(--poster-swipe-offset, 0px)), calc(100% + 7rem), 0); } }
@keyframes bug-report-thanks { 0%, 100% { opacity: 0; transform: translate(-50%, calc(-50% + 1rem)) scale(0.92); } 15%, 80% { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
@keyframes tag-filter-bump { 0% { transform: scale(1); } 45% { transform: scale(1.2); } 100% { transform: scale(1); } }
@keyframes poster-expand { from { transform: scale(var(--poster-expand-scale, 1.18)); } to { transform: scale(1); } }
@keyframes poster-collapse { from { transform: scale(1); } to { transform: scale(var(--poster-collapse-scale, 1.18)); } }
@keyframes soften-description-toggle { from { opacity: 0; transform: translateY(0.2rem); } to { opacity: 1; transform: translateY(0); } }
@keyframes lava-drift-two { 0% { transform: translate3d(9%, 7%, 0) scale(1.12, 0.88) rotate(6deg); } 52% { transform: translate3d(-11%, -7%, 0) scale(0.84, 1.16) rotate(-7deg); } 100% { transform: translate3d(5%, -12%, 0) scale(1.16, 0.9) rotate(4deg); } }
@media (prefers-reduced-motion: reduce) { body::before, body::after { animation: none; } }
@media (min-width: 621px) {
  .back-to-top { display: none; }
  #posterModalActions.is-visible { position: fixed; z-index: 11; left: 50%; display: flex; transform: translateX(-50%); }
  #copiedToast { position: fixed; z-index: 12; bottom: 7rem; left: 50%; padding: 0.55rem 0.9rem; color: #17130f; font: 700 0.85rem/1 "DM Mono", monospace; background: #59a84f; border: 2px solid #17130f; border-radius: 999px; box-shadow: 3px 3px 0 #17130f; pointer-events: none; }
  #copiedToast.is-visible { animation: copied-toast 3.6s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
  .tag-filters { position: relative; width: min(100%, 31rem); align-items: center; }
  .calendar-filter-button { position: absolute; top: 0; right: 0; display: grid; width: 2.3rem; height: 3.1rem; margin: 0; padding: 0; background: transparent; border: 0; place-items: center; cursor: pointer; }
  .calendar-filter-button img { width: 1.5rem; height: 1.5rem; object-fit: contain; filter: var(--ink-filter); }
}
@media (max-width: 620px) {
  html { background: radial-gradient(ellipse at 50% 43%, rgba(255, 255, 255, 0.475) 0%, rgba(255, 255, 255, 0.23) 34%, rgba(255, 255, 255, 0.065) 58%, transparent 82%), linear-gradient(180deg, var(--bg-top), var(--bg-bottom)); }
  html, body { overscroll-behavior-y: none; }
  .mobile-edge-fade { position: fixed; z-index: 8; right: 0; left: 0; display: block; height: 1.0rem; opacity: 0; pointer-events: none; transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; will-change: opacity; transition: opacity 280ms ease; }
  .mobile-edge-fade.is-active { opacity: 1; }
  .mobile-edge-fade.is-fading-in { animation: mobile-edge-fade-in 280ms ease forwards; }
  .mobile-edge-fade.is-fading-out { animation: mobile-edge-fade-out 280ms ease forwards; }
  .mobile-edge-fade-top { top: 0; background: linear-gradient(to bottom, #fff 0%, rgba(255, 255, 255, 0) 100%); }
  .mobile-edge-fade-bottom { bottom: 0; background: linear-gradient(to top, #fff 0%, rgba(255, 255, 255, 0) 100%); }
  :root { --mobile-card-gap: 0.45rem; --mobile-back-to-top-size: 3.7008rem; --mobile-event-action-size: 3.5rem; --mobile-event-action-bottom: 2rem; }
  body::before, body::after { display: none; }
  .safari-edge-fade { display: block; position: fixed; z-index: 8; left: 0; right: 0; height: 4.5rem; opacity: 0; pointer-events: none; transition: opacity 280ms ease; }
  .safari-edge-fade.is-active { opacity: 1; }
  .safari-edge-fade-top { top: 0; background: linear-gradient(to bottom, #fff 0%,  rgba(255, 255, 255, 0) 100%); }
  .safari-edge-fade-bottom { bottom: 0; background: linear-gradient(to top, #fff 0%, rgba(255, 255, 255, 0) 100%); }
  .mobile-edge-fade-top, .safari-edge-fade-top { -webkit-mask-image: linear-gradient(to bottom, black 0%, transparent 100%); mask-image: linear-gradient(to bottom, black 0%, transparent 100%); }
  .mobile-edge-fade-bottom, .safari-edge-fade-bottom { -webkit-mask-image: linear-gradient(to top, black 0%, transparent 100%); mask-image: linear-gradient(to top, black 0%, transparent 100%); }
  .page { width: min(700px, 94vw); padding-top: 1.8rem; }
  .site-menu { width: min(18.4rem, 70.4vw); }
  .hamburger-menu { position: absolute; top: 0.3rem; right: 0; z-index: 2; }
  .page.is-pulling { will-change: transform; }
  .back-to-top { z-index: 8; top: 2.1rem; right: auto; left: 50%; gap: 0; pointer-events: none; transform: translate3d(-50%, calc(-5.6rem - env(safe-area-inset-top, 0px)), 0); transition: transform 540ms cubic-bezier(0.22, 1, 0.36, 1); }
  .back-to-top.is-visible { opacity: 1; pointer-events: auto; transform: translate3d(-50%, 0, 0); }

  .back-to-top-bubble { display: grid; position: relative; width: 3.1rem; height: 3.1rem; padding: 0; font-size: 3.0096rem; line-height: 1; box-shadow: 1px 3px 0 #17130f; place-items: center; transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1), opacity 120ms ease; }
  .back-to-top-bubble.is-tap-bouncing { animation: back-to-top-tap 280ms cubic-bezier(0.22, 1, 0.36, 1); }
  .back-to-top-icon { display: grid; grid-area: 1 / 1; width: 100%; height: 100%; place-items: center; text-align: center; transition: opacity 180ms ease, transform 240ms cubic-bezier(0.22, 1, 0.36, 1); }
  .back-to-top-icon.is-arrow { width: 70%; height: 70%; object-fit: contain; transform: rotate(-90deg); }
  .back-to-top-icon.is-entering { opacity: 0; transform: scale(0.65) rotate(90deg); }
  .back-to-top-icon.is-leaving { opacity: 0; transform: scale(0.65) rotate(-90deg); }
    .hero { margin-bottom: 0.9rem; }
  .guide-description, .guide-description-intro { letter-spacing: 0.035em; }
  .guide-description-intro {}
  .event-search { padding-right: 3.2rem; font-size: 16px; }
  .bug-report-card textarea { font-size: 16px; }
  .clear-search { right: 0.35rem; width: 2.1rem; height: 2.1rem; font-size: 2.1rem; }
  .tag-filter-btn:first-child { width: 2.3rem; justify-items: start; }
  .tag-filter-btn.is-tapped { animation: tag-filter-bump 240ms cubic-bezier(0.22, 1, 0.36, 1); }
  .tag-filters { column-gap: 0.25rem; flex-wrap: nowrap; }
  .calendar-filter-button { display: grid; width: 2.3rem; height: 3.1rem; margin-left: auto; padding: 0; background: transparent; border: 0; place-items: center; cursor: pointer; }
  .calendar-filter-button img { width: 1.5rem; height: 1.5rem; object-fit: contain; filter: var(--ink-filter); }
  .timeline-wrap { width: 100vw; margin-left: calc(50% - 50vw); }
  .event-item { padding-left: 0; flex-wrap: wrap; }
  .event-line { gap: 0; }
  .event-item:not(:last-child)::after, .dot { display: none; }
  .day-header { padding-top: 0; padding-inline: 0; text-align: center; }
  .event-card-shell { width: 100%; min-width: 0; max-width: none; }
  .event-card { --card-height: 128.25px; grid-template-columns: calc(var(--card-height) * 0.828) minmax(0, 1fr); }
  .event-card.no-image { grid-template-columns: 1fr; grid-template-rows: auto; height: auto; min-height: 0; }
  .event-card.no-image .event-content { height: auto; }
  .event-card.no-image .event-description { flex: 0 0 auto; }
  .event-card.is-mobile-accordion { isolation: isolate; overflow: hidden; transition: height 280ms cubic-bezier(0.4, 0, 0.2, 1); }
  .event-card.is-mobile-accordion.is-expanded { overflow: hidden; }
  .event-card.is-mobile-accordion .event-image-wrap { position: relative; z-index: 1; overflow: hidden; padding-left: 0; background: transparent; border-right: 0; transition: padding-left 280ms cubic-bezier(0.4, 0, 0.2, 1); }
  .event-card.is-mobile-accordion .event-content { position: relative; z-index: 2; }
  .event-card.is-mobile-accordion .event-image { border-radius: 0 4px 4px 0; filter: drop-shadow(3px 0 4px rgba(23, 19, 15, 0.1944)); transition: filter 180ms ease, border-radius 280ms cubic-bezier(0.4, 0, 0.2, 1); }
  .event-card.is-mobile-accordion.is-expanded .event-image-wrap { align-self: center; height: var(--card-height); padding-left: var(--mobile-card-gap); border-radius: 4px; overflow: hidden; }
  .event-card.is-mobile-accordion.is-expanded .event-image { border-radius: 4px; -webkit-clip-path: inset(0 round 4px); clip-path: inset(0 round 4px); object-fit: contain; filter: drop-shadow(0 2px 5px rgba(23, 19, 15, 0.22)); animation: poster-expand 280ms cubic-bezier(0.4, 0, 0.2, 1); }
  .event-card.is-mobile-accordion.is-expanded.is-image-collapsing .event-image-wrap { overflow: hidden; padding-left: 0; }
  .event-card.is-mobile-accordion.is-expanded.is-image-collapsing .event-image { filter: drop-shadow(3px 0 4px rgba(23, 19, 15, 0)); animation: poster-collapse 280ms cubic-bezier(0.4, 0, 0.2, 1) forwards; }
  .event-image-wrap { align-self: start; height: var(--card-height); }
  .event-tags-desktop { display: none; }
  .event-tags-mobile { position: static; display: flex; justify-content: flex-start; margin: -0.25rem 0 0.0625rem; }
  .event-tags-mobile, .event-when { flex: 0 0 auto; }
  .event-attendance-summary { display: inline-flex; align-items: center; margin-left: auto; gap: 0.25rem; color: #17130f; font: 700 0.75rem/1 "DM Mono", monospace; }
  .event-attendance-summary img { width: 0.9rem; height: 0.9rem; object-fit: contain; }
  .event-tags .tag-icon { width: 0.7875rem; height: 0.7875rem; filter: invert(55%) sepia(71%) saturate(473%) hue-rotate(68deg) brightness(92%) contrast(91%); }
  .event-tags .tag-icon--paid { filter: invert(31%) sepia(88%) saturate(1482%) hue-rotate(344deg) brightness(94%) contrast(91%); }
  .event-tags .tag-icon--free { filter: invert(55%) sepia(71%) saturate(473%) hue-rotate(68deg) brightness(92%) contrast(91%); }
  .event-content { padding-top: 0.5rem; padding-bottom: var(--mobile-card-gap); padding-right: var(--mobile-card-gap); padding-left: var(--mobile-card-gap); }
  .event-description-toggle { font-size: inherit; line-height: inherit;  }
  .event-description { margin-top: 0.125rem; font-size: 0.75rem; }
  .event-description-toggle.is-transitioning { animation: soften-description-toggle 180ms cubic-bezier(0.22, 1, 0.36, 1); }
  .event-when.is-scrolling, .event-title.is-scrolling {
    overflow: hidden;
    text-overflow: clip;

  }
  .event-when.is-scrolling.is-marquee-active, .event-title.is-scrolling.is-marquee-active { animation: scroll-event-when-edge var(--scroll-duration) linear 2.5s infinite; }
  .event-when-text { font: inherit; letter-spacing: inherit; }

  .event-title-text { font: inherit; letter-spacing: inherit; }
  .event-when-track, .event-title-track { display: inline-flex; gap: 20px; width: max-content; white-space: nowrap; }
  .event-when.is-scrolling.is-marquee-active .event-when-track, .event-title.is-scrolling.is-marquee-active .event-title-track { animation: scroll-event-when var(--scroll-duration) linear 2.5s infinite; }

  .event-title { margin-bottom: 0.075rem; }
  .event-when { overflow: visible; text-overflow: clip; white-space: normal; }
  .event-when, .event-when-text { -webkit-text-size-adjust: none; text-size-adjust: none; }
  .event-card { box-shadow: none; filter: none; }
  .event-card-link:hover .event-card, .event-card-link:focus-visible .event-card, .event-item.is-keyboard-active .event-card { transform: none; box-shadow: none; }
  .event-item:nth-child(3n + 1) .event-card-link:hover .event-card, .event-item:nth-child(3n + 1) .event-card-link:focus-visible .event-card, .event-item:nth-child(3n + 1).is-keyboard-active .event-card { transform: rotate(-0.25deg); }
  .event-item:nth-child(3n + 2) .event-card-link:hover .event-card, .event-item:nth-child(3n + 2) .event-card-link:focus-visible .event-card, .event-item:nth-child(3n + 2).is-keyboard-active .event-card { transform: rotate(0.2deg); }
.event-item:nth-child(3n) .event-card-link:hover .event-card, .event-item:nth-child(3n) .event-card-link:focus-visible .event-card, .event-item:nth-child(3n).is-keyboard-active .event-card { transform: rotate(-0.15deg); }

  .poster-modal-body { min-height: 0; }
  .poster-modal-backdrop { opacity: 0; background: rgba(35, 35, 35, 0.72); backdrop-filter: blur(4px); transition: opacity 280ms ease, backdrop-filter 280ms ease; }
  .poster-modal-backdrop.is-open { opacity: 1; }
  .poster-modal { display: grid; place-items: center; box-sizing: border-box; overflow-y: auto; padding: 3.75rem 0.75rem calc(5.5rem + env(safe-area-inset-bottom, 0px)); touch-action: pan-y; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; }
  .poster-modal-stack { width: 100%; transform: translateY(-5vh); }
  .poster-modal-card { width: 100%; touch-action: pan-y; transition-duration: 280ms; }
  .poster-modal-image { margin: 0 var(--mobile-card-gap) calc(var(--mobile-card-gap) - 0.2rem) 0; }
  .poster-modal.is-landscape .poster-modal-image { float: none; width: 100%; max-width: 100%; height: auto; margin: 0 0 var(--mobile-card-gap); }
  #posterModalActions.is-visible, #posterModalActions.is-closing { position: fixed; z-index: 11; bottom: var(--mobile-event-action-bottom); left: 50%; display: flex; align-items: center; gap: var(--mobile-card-gap); transform: translateX(-50%); }
  #posterModalActions.is-visible { animation: poster-modal-actions-enter 280ms cubic-bezier(0.22, 1, 0.36, 1); }
  #posterModalActions.is-closing { animation: poster-modal-actions-exit 280ms cubic-bezier(0.22, 1, 0.36, 1) forwards; }
  #copiedToast { position: fixed; z-index: 12; bottom: 7rem; left: 50%; padding: 0.55rem 0.9rem; color: #17130f; font: 700 0.85rem/1 "DM Mono", monospace; background: #59a84f; border: 2px solid #17130f; border-radius: 999px; box-shadow: 3px 3px 0 #17130f; pointer-events: none; }
  #copiedToast.is-visible { animation: copied-toast 3.6s cubic-bezier(0.22, 1, 0.36, 1) forwards; }
  .poster-modal-action { display: grid; place-items: center; margin: 0 1.55rem; width: var(--mobile-event-action-size); height: var(--mobile-event-action-size); padding: 0; flex: 0 0 var(--mobile-event-action-size); background-color: #b33a2e; background-image: repeating-radial-gradient(circle at 0 0, rgba(0, 0, 0, 0.09) 0 0.7px, transparent 0.8px 3px), linear-gradient(120deg, rgba(255, 255, 255, 0.25), transparent 55%); border: 2px solid #17130f; border-radius: 50%; box-shadow: 3px 3px 0 #17130f; cursor: pointer; transition: transform 140ms ease, box-shadow 140ms ease, background-color 180ms ease; }
  .poster-modal-action.is-copied { background-color: #59a84f; }
  .poster-modal-action.is-going { background-color: #59a84f; }
  .poster-modal-action.is-attending { background-color: #59a84f; }
  .poster-modal-attendance, .poster-modal-report { background-color: #939393; background-image: repeating-radial-gradient(circle at 0 0, rgba(0, 0, 0, 0.09) 0 0.7px, transparent 0.8px 3px), linear-gradient(120deg, rgba(255, 255, 255, 0.25), transparent 55%); }
  .poster-modal-action-icon { width: 70%; height: 70%; object-fit: contain; pointer-events: none; }
  .poster-modal-action:nth-child(2) .poster-modal-action-icon { width: 64%; height: 64%; transform: translateX(-2px); }
  .poster-modal-action:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 #17130f; }
  .poster-modal-action:focus-visible { outline: 2px solid #17130f; outline-offset: 3px; }
  .poster-modal-title, .poster-modal-date { font-size: 1.45rem; }
  .poster-modal-image, .poster-modal.is-image-only .poster-modal-image { border-radius: 4px; }
}

.poster-lightbox[hidden] { display: none; }
.poster-lightbox { position: fixed; z-index: 11; inset: 0; display: grid; place-items: center; padding: clamp(0.75rem, 4vw, 2rem); opacity: 0; background: rgba(0, 0, 0, 0); backdrop-filter: blur(0); transition: opacity 180ms ease, background-color 180ms ease, backdrop-filter 180ms ease; }
.poster-lightbox.is-open { opacity: 1; background: rgba(0, 0, 0, 0.36); backdrop-filter: blur(4px); }
.poster-lightbox-image { max-width: calc(100vw - 2rem); max-height: calc(100vh - 2rem); border-radius: 6px; object-fit: contain; filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.45)); }
