@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/cormorant-garamond-cyrillic-italic.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/cormorant-garamond-latin-italic.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: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/cormorant-garamond-cyrillic-normal.woff2) format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Cormorant Garamond';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/cormorant-garamond-latin-normal.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;
}
/* Cyrillic companion faces load only for Ukrainian copy. Brand lettering stays intact. */
html[lang="uk"]{--font-display:'Cormorant Garamond',Georgia,serif}
html[lang="uk"] h2,html[lang="uk"] .calendar-number,html[lang="uk"] #waiting-date-number,html[lang="uk"] #waiting-date-month{font-family:var(--font-display)}
html[lang="uk"] .intro h1,html[lang="uk"] #calendar-dialog #calendar-title,html[lang="uk"] #waiting-note,html[lang="uk"] .footer-note,html[lang="uk"] .calendar-note{font-family:'Cormorant Garamond',Georgia,serif;font-style:italic}
.language-switch{display:inline-flex;align-items:center;gap:4px;align-self:center;flex:none;color:#f1e1bd;font:500 12px/24px 'Manrope',Arial,sans-serif;white-space:nowrap}
.language-switch button{min-width:40px;min-height:48px;padding:8px 4px;color:inherit;font:inherit;background:none;border:0;opacity:.6;cursor:pointer;text-underline-offset:6px;text-decoration-thickness:1px}
.language-switch button[aria-pressed="true"]{opacity:1;text-decoration:underline}
.language-switch button:hover{opacity:1}
.language-switch>span{opacity:.35}
.tree-navigation .language-switch,.tree-navigation .language-picker{margin-left:auto}
html[lang="uk"] #waiting-note{font-size:32px;line-height:40px;white-space:normal;max-width:100%;text-wrap:balance}
html[lang="uk"] .movie-copy .eyebrow{letter-spacing:.12em}
html[lang="uk"] #tree-heading{overflow-wrap:anywhere}
.language-picker{position:relative;flex:none;align-self:center;color:#f1e1bd}
.language-picker select{appearance:none;-webkit-appearance:none;display:block;width:64px;height:40px;padding:0 24px 0 12px;border:1px solid #f1e1bd55;border-radius:9999px;background:transparent;color:inherit;font:500 12px/24px var(--font-ui);cursor:pointer}
.language-picker svg{position:absolute;right:8px;top:12px;width:16px;height:16px;pointer-events:none}
.language-picker option{background:#12382c;color:#f1e1bd}
/* Desktop header controls share one size; mobile keeps its compact icon buttons. */
@media(min-width:601px){
 .tree-header .tree-navigation{justify-content:flex-start;gap:var(--space-16)}
 .header-actions #calendar,.header-actions .tree-link,.tree-header #share-tree{box-sizing:border-box;height:var(--control-height);min-height:var(--control-height);padding-block:0;font:500 14px/24px var(--font-ui)}
 .header-actions #calendar>svg,.header-actions .tree-link>svg,.tree-header #share-tree>svg{width:var(--icon-large);height:var(--icon-large)}
 .language-picker select{width:80px;height:var(--control-height);padding:0 32px 0 16px;font:500 14px/24px var(--font-ui)}
 .language-picker svg{right:12px;top:50%;transform:translateY(-50%)}
}
@media(max-width:600px){
 header:not(.tree-header) .brand{--logo-unit:.42px}
 header:not(.tree-header) .header-actions{gap:8px}
 header:not(.tree-header) #calendar{width:40px;height:40px;min-height:40px;padding:8px;flex:none}
 header:not(.tree-header) #calendar>span{display:none}
 header:not(.tree-header) #calendar svg{width:20px;height:20px}
 header:not(.tree-header) .tree-link{width:40px;height:40px;min-height:40px;padding:8px}
 header:not(.tree-header) .header-actions{align-items:center}
 .language-switch{font-size:11px}
 .language-switch button{min-height:40px;min-width:32px}
 .tree-header .tree-navigation{display:flex;align-items:center;gap:8px;width:100%}
 .tree-navigation .back-link{margin-right:auto}
 .tree-navigation .primary{min-height:40px;padding:8px 16px;font-size:12px}
 header.tree-header #share-tree{width:40px;height:40px;min-height:40px;padding:8px;flex:none;border:0;border-radius:50%}
 header.tree-header #share-tree>svg{width:20px;height:20px}
 header.tree-header #share-tree>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
 html[lang="uk"] .tree-header .primary{padding-inline:16px}
 html[lang="uk"] .movie-copy .eyebrow{letter-spacing:.08em}
 html[lang="uk"] #movie-title{overflow-wrap:anywhere}
}

@media(max-width:380px){
 header:not(.tree-header) .brand{--logo-unit:.4px}
 header:not(.tree-header) .header-actions{gap:8px}
}
/* Styled language menu (the native select stays hidden behind it). */
.language-picker.is-enhanced>select{display:none}
.language-trigger{display:inline-flex;align-items:center;justify-content:space-between;gap:6px;width:64px;height:40px;padding:0 10px 0 14px;border:1px solid #f1e1bd55;border-radius:9999px;background:transparent;color:inherit;font:500 12px/24px var(--font-ui);cursor:pointer;transition:border-color .2s,background .2s}
.language-trigger:hover,.language-trigger[aria-expanded="true"]{border-color:#f1e1bd;background:#f1e1bd14}
.language-picker .language-trigger svg{position:static;flex:none;transform:none;transition:transform .2s}
.language-trigger[aria-expanded="true"] svg{transform:rotate(180deg)}
.language-menu{position:absolute;z-index:40;top:calc(100% + 8px);right:0;min-width:176px;margin:0;padding:6px;list-style:none;border:1px solid #f1e1bd26;border-radius:16px;background:#0f3226f2;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);box-shadow:0 16px 40px #0008;animation:language-menu-in .16s ease-out}
.language-menu[hidden]{display:none}
.language-menu [role=option]{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;padding:0 12px 0 14px;border-radius:10px;color:#d9d3c1;font:400 14px/24px var(--font-ui);cursor:pointer;outline:none}
.language-menu [role=option]:hover,.language-menu [role=option]:focus-visible{background:#f1e1bd14;color:#f1e1bd}
.language-menu [role=option] svg{position:static;transform:none;width:18px;height:18px;color:#e9c77d;visibility:hidden}
.language-menu [role=option][aria-selected="true"]{color:#f1e1bd;font-weight:500}
.language-menu [role=option][aria-selected="true"] svg{visibility:visible}
@keyframes language-menu-in{from{opacity:0;transform:translateY(-4px)}}
@media(min-width:601px){.language-trigger{width:80px;height:var(--control-height,48px);padding:0 12px 0 16px;font-size:14px}}
@media(prefers-reduced-motion:reduce){.language-menu{animation:none}.language-trigger svg{transition:none}}
/* The trigger grows with "УКР" instead of squeezing the chevron against the edge. */
.language-trigger{width:auto;min-width:72px;gap:4px;padding:0 10px 0 14px;justify-content:center}
@media(min-width:601px){.language-trigger{min-width:88px;gap:6px;padding:0 14px 0 18px}}
/* Cormorant sets old-style figures: a hanging 7 or 9 ran into the month below it. */
html[lang="uk"] #waiting-date-number{font-variant-numeric:lining-nums}
/* Cormorant sets old-style figures by default (7, 9, 13 hang below the line into the film title): lining figures everywhere in Ukrainian. */
html[lang="uk"],html[lang="uk"] *{font-variant-numeric:lining-nums}
