@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 500 700; font-display: swap; src: url(../assets/fonts/26f556484859.woff2) format('woff2'); unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F; }
@font-face { font-family: 'Oswald'; font-style: normal; font-weight: 500 700; font-display: swap; src: url(../assets/fonts/a8499adef0c0.woff2) format('woff2'); unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
html:lang(ru) {
  --f-display: "Archivo", "Oswald", "Arial Narrow", sans-serif;
  --f-logo: "Karantina", "Archivo", "Oswald", Impact, sans-serif;
}
html:lang(zh-Hant) { --cjk: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei"; }
html:lang(zh-Hans) { --cjk: "PingFang SC", "Noto Sans SC", "Microsoft YaHei"; }
html:lang(ja) { --cjk: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic", Meiryo; }
html:lang(ko) { --cjk: "Apple SD Gothic Neo", "Noto Sans KR", "Malgun Gothic"; }
html:lang(zh-Hant), html:lang(zh-Hans), html:lang(ja), html:lang(ko) {
  --f-display: "Archivo", var(--cjk), "Arial Black", sans-serif;
  --f-logo: "Karantina", "Archivo", var(--cjk), Impact, sans-serif;
  --f-ui: "Inter Tight", "Inter", var(--cjk), system-ui, sans-serif;
  --f-mono: "Inter Tight", "Inter", var(--cjk), system-ui, sans-serif;
  --pxl: "Pixelify Sans", "Inter Tight", var(--cjk), system-ui, sans-serif;
}
html:lang(zh-Hant) body, html:lang(zh-Hans) body, html:lang(ja) body, html:lang(ko) body { word-break: normal; line-break: strict; }
html:lang(zh-Hant) .label, html:lang(zh-Hans) .label, html:lang(ja) .label, html:lang(ko) .label { letter-spacing: .06em; }
html:lang(zh-Hant) .split .w, html:lang(zh-Hans) .split .w, html:lang(ja) .split .w { display: inline; white-space: normal; }
html:not([lang="en"]) :is(h1, h2, h3, h4, p, li, summary) { overflow-wrap: break-word; }
html:is(:lang(de), :lang(fr), :lang(it), :lang(es), :lang(pt), :lang(ru), :lang(tr), :lang(id), :lang(vi)) :is(h1, h2, h3, h4, p, li) { hyphens: auto; }

.langbar { position: absolute; left: 0; right: 0; z-index: 90; background: rgba(14, 10, 10, .96); border-bottom: 1px solid rgba(255, 42, 20, .45); box-shadow: 0 0 18px rgba(255, 42, 20, .18); color: #f3e9e4; font-family: var(--f-ui, system-ui, sans-serif); opacity: 0; transform: translateY(-6px); transition: opacity .35s ease, transform .35s ease; }
.langbar.is-on { opacity: 1; transform: none; }
.langbar__in { position: relative; max-width: 1200px; margin: 0 auto; display: flex; align-items: center; flex-wrap: wrap; gap: 10px 18px; padding: 10px 52px 10px 16px; font-size: 15px; line-height: 1.4; }
.langbar__msg { flex: 1 1 auto; min-width: 0; }
.langbar__go { background: var(--red, #ff2a14); color: #fff; font-weight: 700; padding: 7px 14px; text-decoration: none; letter-spacing: .04em; white-space: nowrap; }
.langbar__go:hover { filter: brightness(1.1); }
.langbar__tg { color: #f3e9e4; text-decoration: none; border-bottom: 1px solid rgba(243, 233, 228, .35); padding-bottom: 1px; white-space: nowrap; }
.langbar__tg:hover { border-bottom-color: currentColor; }
.langbar__x { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); background: none; border: 0; color: #f3e9e4; opacity: .6; font-size: 18px; line-height: 1; cursor: pointer; padding: 6px 8px; }
.langbar__x:hover { opacity: 1; }
@media (max-width: 640px) {
  .langbar__in { font-size: 14px; gap: 10px 14px; }
  .langbar__msg { flex-basis: 100%; }
  .langbar__x { top: 8px; transform: none; }
}

.foot:has(.langpick[open]) { position: relative; z-index: 400; overflow-x: clip; overflow-y: visible; }
.lang-head + .langpick > .langpick__list { top: calc(100% + 8px); bottom: auto; left: auto; right: 0; }
.lang-head + .langpick > summary > span { display: none; }
.lang-note { flex-basis: 100%; text-transform: none; letter-spacing: .02em; }
.langpick { position: relative; display: inline-block; }
.langpick > summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 8px; }
.langpick > summary::-webkit-details-marker { display: none; }
.langpick > summary::after { content: "▾"; opacity: .7; }
.langpick > summary b { font-weight: 600; color: var(--ink, #f3e9e4); }
.langpick__list { position: absolute; left: 0; bottom: calc(100% + 8px); z-index: 400; display: grid; grid-template-columns: repeat(2, max-content); column-gap: 4px; max-width: calc(100vw - 32px); padding: 6px 0; background: #0e0a0a; border: 1px solid rgba(255, 42, 20, .45); box-shadow: 0 10px 30px rgba(0, 0, 0, .6); }
.langpick__list a { display: block; padding: 8px 14px; font-size: 14px; letter-spacing: 0; text-transform: none; color: #f3e9e4; text-decoration: none; white-space: nowrap; }
.langpick__list a:hover { background: rgba(255, 42, 20, .12); }
.langpick__list a[aria-current] { color: var(--red, #ff2a14); }
