/* ─── Fonts ───────────────────────────────────────────────────────────────────
   DM Sans is self-hosted to eliminate the Google Fonts critical-path waterfall
   (HTML → fonts.googleapis.com CSS → fonts.gstatic.com woff2 = 3 serial hops,
   ~600ms). Variable font covers all weights 400-800 in a single file per
   subset. The shell HTML preloads the latin file so it downloads in parallel
   with the bundle.

   YKY 2026 Palette (from poster artwork):
   DARK:  bg #0d0812 · text #f0e4cc · orange #e8920a · lavender borders
   LIGHT: bg #f5f0f8 · text #1a0d00 · orange #b86800
   ──────────────────────────────────────────────────────────────────────────── */
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(dm-sans-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
  src: url(dm-sans-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ─── WP full-page takeover ──────────────────────────────────────────────────*/
html, body {
  background: #0d0812 !important;
  margin: 0 !important; padding: 0 !important;
  height: 100% !important; overflow: hidden !important;
}
html[data-theme="light"], body:has(#ykyo-schedule-root [data-theme="light"]) {
  background: #f5f0f8 !important;
}
#page, #main, #content, .site, .wp-site-blocks {
  background: inherit !important; margin: 0 !important; padding: 0 !important;
}
#ykyo-schedule-root {
  display: block !important; height: 100vh !important; height: 100dvh !important;
  width: 100vw !important; overflow: hidden !important;
}
#ykyo-schedule-root * { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

/* Scrollbars */
#ykyo-schedule-root ::-webkit-scrollbar { height: 4px; width: 4px; background: #0d0812; }
#ykyo-schedule-root ::-webkit-scrollbar-thumb { background: #5a8038; border-radius: 4px; }
#ykyo-schedule-root [data-theme="light"] ::-webkit-scrollbar { background: #f5f0f8; }
#ykyo-schedule-root [data-theme="light"] ::-webkit-scrollbar-thumb { background: rgba(90,128,56,0.35); }

/* ─── Animations ─────────────────────────────────────────────────────────────*/
@keyframes pulse-amber { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.6;transform:scale(1.3)} }
@keyframes pulse-live { 0%,100%{opacity:1;box-shadow:0 0 4px rgba(255,59,48,0.6)} 50%{opacity:0.7;box-shadow:0 0 10px rgba(255,59,48,0.9)} }
@keyframes spin    { to { transform: rotate(360deg); } }
@keyframes fadeIn  { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideUp { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes slideUpCentered { from { transform: translate(-50%, 100%); } to { transform: translate(-50%, 0); } }
@keyframes toastProgress { from { width: 100%; } to { width: 0%; } }
@keyframes scaleIn { from { opacity: 0; transform: translate(-50%, -50%) scale(0.95); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
@keyframes mobileCardIn { from { opacity: 0; transform: scale(0.96) translateY(-8px); } to { opacity: 1; transform: scale(1) translateY(0); } }
@keyframes cardSlideInRight { from { opacity: 0; transform: translateX(80px) scale(0.94); } to { opacity: 1; transform: translateX(0) scale(1); } }
@keyframes cardSlideInLeft { from { opacity: 0; transform: translateX(-80px) scale(0.94); } to { opacity: 1; transform: translateX(0) scale(1); } }
@keyframes swipeHint { 0%{transform:translateX(0)} 20%{transform:translateX(-14px)} 50%{transform:translateX(6px)} 70%{transform:translateX(-3px)} 100%{transform:translateX(0)} }
@keyframes liveChange { 0%{box-shadow:0 0 0 0 rgba(255,70,60,0.5)} 30%{box-shadow:0 0 12px 4px rgba(255,70,60,0.35)} 100%{box-shadow:0 0 0 0 transparent} }
@keyframes vineGrow { to { stroke-dashoffset: 0; } }
@keyframes leafSprout { from { opacity: 0; transform: scale(0.3) rotate(-30deg); } to { opacity: 1; transform: scale(1) rotate(0deg); } }
@keyframes blossomPop {
  0%   { opacity: 0; transform: scale(0); }
  60%  { opacity: 1; transform: scale(1.3); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes petalSpin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
/* Vine ink-settle animation — stem materialises from blurry/faint to solid */
@keyframes inkSettle { 0%{filter:blur(2.5px);opacity:0.08} 50%{filter:blur(0.8px);opacity:0.3} 100%{filter:blur(0);opacity:0.45} }
/* Live card breathing glow — slow 3s pulse using CSS custom property for category color */
@keyframes cardBreath {
  0%, 100% { box-shadow: 0 4px 20px var(--card-glow), inset 0 1px 0 rgba(255,255,255,0.06); }
  50%      { box-shadow: 0 4px 28px var(--card-glow-bright), inset 0 1px 0 rgba(255,255,255,0.06); }
}
/* Empty state mascot gentle float */
@keyframes mascotFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-6px); }
}

/* ─── Mobile: allow native pull-to-refresh ──────────────────────────────────*/
@media (max-width: 767px) {
  html, body { overflow: visible !important; }
}

/* ─── Film grain texture — festival poster atmosphere ───────────────────────*/
.yy-mobile-scroll { position: relative; }
.yy-mobile-scroll::after {
  content: ""; position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  pointer-events: none; z-index: 50;
  opacity: 0.03;
  background-image: url("data:image/svg+xml,%3Csvg viewBox=%270 0 256 256%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cfilter id=%27n%27%3E%3CfeTurbulence type=%27fractalNoise%27 baseFrequency=%270.7%27 numOctaves=%274%27 stitchTiles=%27stitch%27/%3E%3C/filter%3E%3Crect width=%27100%25%27 height=%27100%25%27 filter=%27url%28%23n%29%27/%3E%3C/svg%3E");
  background-size: 256px 256px;
}
#ykyo-schedule-root [data-theme="light"] .yy-mobile-scroll::after { opacity: 0.018; }

/* ─── Category filter scrollbar ─────────────────────────────────────────────*/
.cat-filter::-webkit-scrollbar { display: none; }

/* ─── Nav drawer links ───────────────────────────────────────────────────────*/
.yy-nav-link {
  display: block; padding: 14px 28px;
  font-size: 18px; font-weight: 700; color: rgba(240,228,210,0.88);
  font-family: 'DM Sans', sans-serif; text-decoration: none;
  letter-spacing: -0.015em; line-height: 1;
  transition: color 0.15s, background 0.15s, padding-left 0.2s;
  border-bottom: 1px solid rgba(184,156,216,0.08);
  position: relative;
}
#ykyo-schedule-root [data-theme="light"] .yy-nav-link {
  color: rgba(26,13,0,0.85);
  border-bottom-color: rgba(122,88,168,0.1);
}
.yy-nav-link:last-child { border-bottom: none; }
.yy-nav-link::before {
  content:''; position: absolute; left:0; top:0; bottom:0; width:2px;
  background: rgba(232,146,10,0); transition: background 0.15s;
}
.yy-nav-link:hover { color:rgba(240,228,210,1); background:rgba(232,146,10,0.08); padding-left:34px; }
#ykyo-schedule-root [data-theme="light"] .yy-nav-link:hover {
  color:rgba(26,13,0,1); background:rgba(184,104,0,0.07);
}
.yy-nav-link:hover::before { background: rgba(232,146,10,0.8); }

.yy-lang-link {
  padding: 6px 14px; border-radius: 20px; font-size: 11px; font-weight: 700;
  color: rgba(240,228,210,0.5); font-family: 'DM Sans', sans-serif; text-decoration: none;
  border: 1px solid rgba(184,156,216,0.2); background: rgba(184,156,216,0.05);
  letter-spacing: 0.04em; transition: color 0.15s, border-color 0.15s, background 0.15s;
}
#ykyo-schedule-root [data-theme="light"] .yy-lang-link {
  color:rgba(90,58,138,0.75); border-color:rgba(90,58,138,0.25); background:rgba(90,58,138,0.06);
}
.yy-lang-link:hover { color:rgba(240,228,210,0.95); border-color:rgba(232,146,10,0.5); background:rgba(232,146,10,0.12); }
#ykyo-schedule-root [data-theme="light"] .yy-lang-link:hover {
  color:rgba(90,58,138,1); border-color:rgba(90,58,138,0.5); background:rgba(90,58,138,0.12);
}

.yy-social-link {
  display: flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 7px;
  font-size: 11px; font-weight: 600; color: rgba(240,228,210,0.45);
  font-family: 'DM Sans', sans-serif; text-decoration: none;
  border: 1px solid rgba(184,156,216,0.12); letter-spacing: 0.02em;
  transition: color 0.15s, border-color 0.15s, background 0.15s;
}
#ykyo-schedule-root [data-theme="light"] .yy-social-link {
  color:rgba(90,58,138,0.6); border-color:rgba(90,58,138,0.2);
}
.yy-social-link:hover { color:rgba(240,228,210,0.85); border-color:rgba(232,146,10,0.35); background:rgba(232,146,10,0.07); }
#ykyo-schedule-root [data-theme="light"] .yy-social-link:hover {
  color:rgba(90,58,138,0.95); border-color:rgba(90,58,138,0.4); background:rgba(90,58,138,0.08);
}

/* ─── Event description (WP HTML) ────────────────────────────────────────────*/
.event-description {
  font-family: 'DM Sans', sans-serif; font-size: 14px; line-height: 1.75;
  color: #f0e4cc;
  overflow-wrap: break-word; word-break: break-word;
}
#ykyo-schedule-root [data-theme="light"] .event-description { color: #1a0d00 !important; }
.event-description p { margin: 0 0 1em; }
.event-description p:last-child { margin-bottom: 0; }
.event-description strong, .event-description b { font-weight: 700; }
.event-description em, .event-description i { font-style: italic; opacity: 0.85; }
.event-description a { color: #e8920a; text-decoration: underline; text-underline-offset: 3px; }
#ykyo-schedule-root [data-theme="light"] .event-description a { color: #b86800 !important; }
.event-description a:hover { color: #f0a030; }
.event-description ul, .event-description ol { margin: 0 0 1em 1.4em; padding: 0; }
.event-description li { margin-bottom: 0.3em; }
.event-description img { max-width: 100%; border-radius: 8px; margin: 8px 0; }
.event-description h1,.event-description h2,.event-description h3,
.event-description h4,.event-description h5,.event-description h6 {
  margin: 1em 0 0.4em; line-height: 1.3;
}

/* ─── Dialog color overrides — prevent WP theme from dimming ────────────────*/
#ykyo-schedule-root [data-yy-dialog] {
  color: #f0e4cc !important;
  -webkit-text-fill-color: #f0e4cc !important;
}
#ykyo-schedule-root [data-yy-dialog] div,
#ykyo-schedule-root [data-yy-dialog] span,
#ykyo-schedule-root [data-yy-dialog] p,
#ykyo-schedule-root [data-yy-dialog] h2,
#ykyo-schedule-root [data-yy-dialog] h3,
#ykyo-schedule-root [data-yy-dialog] button,
#ykyo-schedule-root [data-yy-dialog] a,
#ykyo-schedule-root [data-yy-dialog] input {
  -webkit-text-fill-color: currentColor !important;
  filter: none !important;
}
#ykyo-schedule-root [data-theme="light"] [data-yy-dialog] {
  color: #1a0d00 !important;
  -webkit-text-fill-color: #1a0d00 !important;
}

/* ─── Title color overrides — prevent WP theme from dimming ─────────────────*/
[data-mobile-title] {
  color: #f0e4cc !important;
  -webkit-text-fill-color: #f0e4cc !important;
  opacity: 1 !important;
}
#ykyo-schedule-root [data-theme="light"] [data-mobile-title] {
  color: #1a0d00 !important;
  -webkit-text-fill-color: #1a0d00 !important;
  opacity: 1 !important;
}
[data-yy-modal-title] {
  color: #f0e4cc !important;
  -webkit-text-fill-color: #f0e4cc !important;
  opacity: 1 !important;
}
#ykyo-schedule-root [data-theme="light"] [data-yy-modal-title] {
  color: #1a0d00 !important;
  -webkit-text-fill-color: #1a0d00 !important;
  opacity: 1 !important;
}


