html[data-content-locale] { letter-spacing: 0; }
.sg-content-language { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; max-width: 100%; padding: 6px 12px; margin: 0; font: 14px/1.5 system-ui, sans-serif; letter-spacing: 0; }
.sg-content-language select { width: auto; min-width: 120px; min-height: 36px; max-width: 100%; border: 1px solid #7c8790; border-radius: 4px; padding: 4px 24px 4px 8px; font: inherit; background: #15252c; color: #f7f7f4; }
.sg-content-language a { color: inherit; width: auto; height: auto; font: inherit; padding: 3px 0; text-underline-offset: 3px; }
.sg-content-language[hidden] { display: none !important; }
html[data-content-group=relations] header { flex-wrap: wrap; }
html[data-content-group=relations] .toolbar, html[data-content-group=relations] .tabs { flex-wrap: wrap; }
html[data-content-group=relations] h1 { font-size: 32px; letter-spacing: 0; }
html[data-content-group=relations] button { overflow-wrap: anywhere; }
html[data-content-locale=en] .edge-label text { font-size: 14px; }
html[data-content-group=luoyang] .sg-content-language { position: fixed; z-index: 34; right: max(8px, env(safe-area-inset-right)); bottom: max(8px, env(safe-area-inset-bottom)); width: auto; max-width: calc(100% - 16px); margin: 0; background: #142329ed; color: #f7f7f4; border: 1px solid #92a29f; border-radius: 4px; }
html[data-content-group=luoyang] .sg-content-language .sg-language-links { display: none; }
html[data-content-group=luoyang] .caption { bottom: 60px; }
html[data-content-group=luoyang] footer { bottom: 60px; max-width: calc(100% - 24px); white-space: normal; text-align: center; }
html[data-content-group=luoyang] .compass { bottom: 70px; }
html[data-content-group=luoyang] .toolbar h1 { white-space: normal; }
html[data-content-group=luoyang] body:has(> iframe) { grid-template-rows: minmax(44px, auto) minmax(0, 1fr); }
html[data-content-group=luoyang] body:has(> iframe) > nav:not(.sg-content-language) { flex-wrap: wrap; }
html[data-content-group=luoyang] body:has(> iframe) > nav strong, html[data-content-group=luoyang] body:has(> iframe) > nav small { white-space: normal; overflow-wrap: anywhere; }
html[data-content-group=knowledge] h1 { font-size: 32px; line-height: 1.3; overflow-wrap: break-word; letter-spacing: 0; }
html[data-content-group=knowledge] nav { flex-wrap: wrap; }
html[data-content-group=knowledge] .sg-content-language { color: inherit; }
.sg-source-gloss { margin: 12px 0 20px; }
.sg-source-gloss small { font-size: 13px; }
.sg-source-gloss p { margin-top: 6px; }
@media (max-width: 650px) {
  html[data-content-group=relations] h1 { font-size: 24px; }
  html[data-content-group=luoyang] header { flex-wrap: wrap; }
  .sg-content-language { font-size: 13px; gap: 6px; }
  .sg-content-language .sg-language-links { display: flex; gap: 10px; flex-wrap: wrap; }
}
@media (max-width: 600px) {
  html[data-content-group=luoyang] body[data-sample-runtime] { height: 100dvh; display: grid; grid-template-rows: auto minmax(0, 1fr); }
  html[data-content-group=luoyang] body[data-sample-runtime] > header { height: auto; min-height: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: none; gap: 6px; padding: 8px; }
  html[data-content-group=luoyang] body[data-sample-runtime] > header > strong { grid-column: 1 / -1; grid-row: auto; min-width: 0; white-space: normal; overflow-wrap: anywhere; font-size: 18px; line-height: 1.35; }
  html[data-content-group=luoyang] body[data-sample-runtime] > header > :is(select, #configuration, #role) { grid-column: 1 / -1; grid-row: auto; min-width: 0; max-width: 100%; width: 100%; }
  html[data-content-group=luoyang] body[data-sample-runtime] > header > :is(button, #enter, #leave, #play, #reset, #confirm) { grid-column: auto; grid-row: auto; min-width: 0; padding: 6px; white-space: normal; overflow-wrap: anywhere; }
  html[data-content-group=luoyang] body[data-sample-runtime] > header > #confirm { grid-column: 1 / -1; }
  html[data-content-group=luoyang] body[data-sample-runtime] > header > #state { grid-column: 1 / -1; grid-row: auto; width: auto; min-width: 0; margin: 0; white-space: normal; overflow-wrap: anywhere; }
  html[data-content-group=luoyang] body[data-sample-runtime] > main#viewport { height: auto; min-height: 0; overflow: hidden; }
}