/* SNOW Daily editions (i18n.js): language menu, edition line, English-only notices */

/* hold the page for a moment while the dictionary loads, so English does not flash first */
html.i18n-pending main, html.i18n-pending .site-header nav { visibility: hidden; }

/* language menu, beside the light/dark toggle */
.sd-lang { position: relative; }
.sd-lang__btn { height: 2.5rem; padding-inline: 0.55rem; display: inline-flex; align-items: center; gap: 0.35rem; border-radius: var(--radius-md); color: var(--color-text-muted); font: 500 0.72rem/1 var(--ab-sans); letter-spacing: 0.12em; transition: background var(--transition), color var(--transition); }
.sd-lang__btn:hover, .sd-lang__btn[aria-expanded='true'] { background: var(--color-surface-offset); color: var(--color-text); }
.sd-lang__menu { position: absolute; right: 0; top: calc(100% + 6px); z-index: 60; min-width: 10.5rem; margin: 0; padding: 0.35rem; list-style: none; background: var(--color-surface, #fff); border: 1px solid var(--color-border, rgba(0,0,0,.12)); border-radius: var(--radius-md); box-shadow: 0 10px 30px rgba(0,0,0,.14); }
.sd-lang__menu a { display: block; padding: 0.5rem 0.7rem; border-radius: calc(var(--radius-md) - 2px); color: var(--color-text); text-decoration: none; font: 400 0.92rem/1.2 var(--ab-sans); }
.sd-lang__menu a:hover, .sd-lang__menu a:focus-visible { background: var(--color-surface-offset); outline: none; }
.sd-lang__menu a[aria-checked='true'] { font-weight: 600; }
/* each language name in a face made for its own script, whatever edition is showing (28 Oct 2026): in the Japanese and
   Chinese editions the menu inherited the CJK fonts, which draw Latin and Cyrillic wide and unevenly spaced ("Русский") */
.sd-lang__menu a:is([lang='en'], [lang='de'], [lang='fr'], [lang='it'], [lang='ru']) { font-family: 'Jost', 'Futura', 'Century Gothic', 'Segoe UI', 'Helvetica Neue', Arial, sans-serif; letter-spacing: 0; }
.sd-lang__menu a[lang='ja'] { font-family: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', 'Meiryo', 'Noto Sans JP', sans-serif; }
.sd-lang__menu a[lang='zh'] { font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', sans-serif; }
.sd-lang__menu a[aria-checked='true']::after { content: '✓'; float: right; margin-left: 1rem; }

/* the edition line, newspaper style, above "Where is the snow?" */
/* a little more air above and below the edition name (owner, 3 Nov 2026) */
.sd-edition { display: flex; align-items: center; gap: clamp(0.8rem, 2vw, 1.6rem); margin: calc(var(--space-6, 1.5rem) + 0.5rem) 0 0.5rem; color: var(--ab-ink); }
.sd-edition__rule { flex: 1; height: 5px; border-block: 1px solid var(--ab-rule); }
/* the edition name at the size of the home headline (owner, 3 Nov 2026) */
.sd-edition__name { font: 500 clamp(1.45rem, 1rem + 1.5vw, 2.3rem)/1.1 var(--ab-sans); letter-spacing: 0.3em; margin-right: -0.3em; text-transform: uppercase; white-space: nowrap; }
.sd-edition:has(~ #answerHome[hidden]) { display: none; }
/* the greeting has no rule at its top, so the gap below the edition name needs 10 px more to match the gap above */
.sd-edition + #homeHello { margin-top: calc(var(--space-6, 1.5rem) + 0.5rem); }   /* same gap below the name as above it */   /* hidden only when the answer board is (the greeting is often hidden) */
html[lang='ja'] .sd-edition__name, html[lang='zh-Hans'] .sd-edition__name { letter-spacing: 0.24em; font-weight: 600; }
@media (max-width: 480px) { .sd-edition__name { letter-spacing: 0.18em; margin-right: -0.18em; } }
@media (max-width: 380px) { .sd-edition__name { letter-spacing: 0.08em; margin-right: -0.08em; } }

/* English-only pages */
.sd-only-en { margin: var(--space-3, .75rem) 0 var(--space-5, 1.25rem); padding: 0.7rem 0.9rem; border-left: 3px solid var(--ab-ink); background: var(--color-surface-offset); color: var(--color-text); font-size: var(--text-sm, .9rem); }

/* translated editions: news headlines and top stories link to English articles, so they are left out. i18n.js moves the
   snow forecast and the 30-day table into the centre column: 24 h + 7 days | forecast + 30 days | events, three even columns.
   html.sd-nonews: the same layout on the English home page, for a signed-in reader who has switched the news off (app.js) */
html[data-edition] .col--main > .panel--flush, html.sd-nonews .col--main > .panel--flush { display: none; }   /* top stories and the news list */
@media (min-width: 1241px) {
  html[data-edition] .layout, html.sd-nonews .layout { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html[data-edition] .col--main, html.sd-nonews .col--main { height: auto; min-height: 0; }   /* the centre column now holds tables, so it counts towards the row height */
  html[data-edition] .col--main .panel--forecast, html.sd-nonews .col--main .panel--forecast { flex: 0 1 auto; display: flex; flex-direction: column; min-height: 0; }
  html[data-edition] .col--main .panel--forecast .table-scroll, html.sd-nonews .col--main .panel--forecast .table-scroll { flex: 1 1 auto; overflow-y: auto; min-height: 0; }
  html[data-edition] .col--main .panel--forecast .snow-table thead th, html.sd-nonews .col--main .panel--forecast .snow-table thead th { position: sticky; top: 0; z-index: 1; }
}
@media (max-width: 860px) { html[data-edition] .col--main, html.sd-nonews .col--main { order: 0; } }

/* scripts the site fonts do not cover: use good system faces */
html[lang='ja'] { --ab-page: 'Hiragino Mincho ProN', 'Yu Mincho', 'Noto Serif JP', serif; --ab-serif: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', 'Noto Sans JP', system-ui, sans-serif; --ab-sans: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', 'Noto Sans JP', system-ui, sans-serif; }
html[lang='ja'] body { font-family: 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', 'Yu Gothic', 'Noto Sans JP', system-ui, sans-serif; }
html[lang='ja'] .answer-board .ab-question, html[lang='ja'] em, html[lang='ja'] i { font-style: normal; }
html[lang='zh-Hans'] { --ab-page: 'Songti SC', 'STSong', 'Noto Serif SC', 'Source Han Serif SC', 'SimSun', serif; --ab-serif: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', system-ui, sans-serif; --ab-sans: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', system-ui, sans-serif; }
html[lang='zh-Hans'] body { font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', system-ui, sans-serif; }
html[lang='zh-Hans'] .answer-board .ab-question, html[lang='zh-Hans'] em, html[lang='zh-Hans'] i { font-style: normal; }
html[lang='ru'] { --ab-serif: 'Libre Franklin', 'Jost', system-ui, sans-serif; }