/* PaperDropdown: same paper, ink, sizing and flag tiles as the login screen. */
.language-switch { position: relative; width: 190px; max-width: 100%; font: 700 15px/1.4 system-ui, sans-serif; color: #3a2c20; flex: 0 0 auto; z-index: 30; border: 0; margin: 0; padding: 0; }
.language-switch summary { box-sizing: border-box; min-height: 52px; display: flex; align-items: center; gap: 10px; cursor: pointer; list-style: none; border: 1.5px solid #3a2c20; border-radius: 14px 13px 15px 12px; padding: 13px 12px 13px 16px; background: #fffbf1; box-shadow: 0 2px 0 #3a2c201a; white-space: nowrap; }
.language-switch summary::-webkit-details-marker { display: none; }
.language-switch summary::after { content: ''; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); margin: -4px 5px 0 auto; transition: transform 180ms; }
.language-switch[open] summary { border-color: #b0552a; }
.language-switch[open] summary::after { transform: rotate(225deg); margin-top: 4px; }
.language-switch nav { box-sizing: border-box; position: absolute; right: 0; top: calc(100% + 6px); display: grid; width: 100%; max-height: min(360px, 65vh); overflow-y: auto; padding: 4px 0; border: 1.5px solid #3a2c20; border-radius: 14px; background: #fffbf1; box-shadow: 0 6px 14px #241a1040; }
.language-switch a { box-sizing: border-box; display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 10px 16px; border-bottom: 1px solid #3a2c2014; text-decoration: none; color: #3a2c20; font-weight: 600; }
.language-switch a:last-child { border-bottom: 0; }
.language-switch a:hover { background: #b0552a14; }
.language-switch a[aria-current] { color: #b0552a; font-weight: 900; }
.language-switch a[aria-current]::after { content: '✓'; margin-left: auto; }
.language-switch a:focus-visible, .language-switch summary:focus-visible { outline: 3px solid #b0552a; outline-offset: 2px; }
.language-flag { display: inline-block; flex: 0 0 22px; width: 22px; height: 14.67px; border: .5px solid #0003; border-radius: 3px; box-sizing: border-box; overflow: hidden; background: #d9cdb8; }
.language-flag[data-flag="ja"] { background: radial-gradient(circle, #bc002d 0 4px, transparent 4.3px), white; }
.language-flag[data-flag="fr"] { background: linear-gradient(90deg, #0055a4 33.33%, white 33.33% 66.67%, #ef4135 66.67%); }
.language-flag[data-flag="de"] { background: linear-gradient(#000 33.33%, #dd0000 33.33% 66.67%, #ffce00 66.67%); }
.language-flag[data-flag="en"] { background: linear-gradient(90deg, transparent 40%, #c8102e 40% 60%, transparent 60%), linear-gradient(transparent 40%, #c8102e 40% 60%, transparent 60%), linear-gradient(90deg, transparent 33%, white 33% 67%, transparent 67%), linear-gradient(transparent 33%, white 33% 67%, transparent 67%), linear-gradient(33deg, transparent 44%, white 44% 48%, #c8102e 48% 52%, white 52% 56%, transparent 56%), linear-gradient(-33deg, #012169 44%, white 44% 48%, #c8102e 48% 52%, white 52% 56%, #012169 56%); }
.directory-header { gap: 14px; flex-wrap: wrap; }
.directory-header .back-link { margin-left: auto; }
.locale-note { text-align: center; font: 13px/1.6 system-ui, sans-serif; opacity: .75; margin: 10px 16px 20px; }
html:not([lang="ja"]) body:not(.lp) { font-family: 'Trebuchet MS', Arial, sans-serif; }
/* Menus must extend beyond the rounded header, including on small phones. */
.site-header, .nav { overflow: visible; }
@media(max-width:700px) {
  .language-switch { width: 160px; font-size: 15px; }
  .language-switch summary { padding-left: 12px; }
  .directory-header .language-switch { margin-left: auto; }
}

@media(prefers-reduced-motion: reduce) { .language-switch summary::after { transition: none; } }

/* One-row mobile header; language names remain available in the popup. */
@media(max-width:700px) {
  .lp .nav { display: flex; flex-wrap: nowrap; height: 60px; padding: 0; gap: 8px; }
  .lp .nav-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; }
  .lp .nav .brand { flex: 1 1 auto; min-width: 0; gap: 6px; }
  .lp .nav .brand img.brand-logo { min-width: 0; max-width: 100%; width: auto; height: 24px; object-fit: contain; }
  .lp .nav .brand .brand-icon { flex-shrink: 0; }
  .lp .nav .language-switch { width: 44px; }
  .lp .nav .language-switch summary { min-height: 44px; padding: 0; justify-content: center; gap: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
  .lp .nav .language-switch summary .language-flag { flex-basis: 30px; width: 30px; height: 20px; border: 0; border-radius: 2px; }
  .lp .nav .language-switch summary .language-flag[data-flag="ja"] { background: radial-gradient(circle, #bc002d 0 6px, transparent 6.3px), white; }
  .lp .nav .language-current-label, .lp .nav .language-switch summary::after { display: none; }
  .lp .nav .language-switch nav { width: 190px; max-width: calc(100vw - 24px); }
  .lp .nav .nav-cta { flex: 0 0 auto; justify-content: center; text-align: center; min-height: 44px; box-sizing: border-box; padding: 8px 10px; letter-spacing: 0; }
}
@media(max-width:380px) {
  .lp .nav .brand .brand-icon { display: none; }
  .lp .nav .nav-cta { font-size: 12px; gap: 4px; padding-inline: 8px; }
}

.language-flag[data-flag="es"] { background: white url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2030%2020%22%3E%3Cpath%20fill%3D%22%23aa151b%22%20d%3D%22M0%200h30v20H0z%22%2F%3E%3Cpath%20fill%3D%22%23f1bf00%22%20d%3D%22M0%205h30v10H0z%22%2F%3E%3Cpath%20fill%3D%22%23aa151b%22%20d%3D%22M7%208h4v5H7z%22%2F%3E%3C%2Fsvg%3E") center / cover no-repeat; }

.language-flag[data-flag="zh-Hant"] { background: white url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2030%2020%22%3E%3Cpath%20fill%3D%22%23fe0000%22%20d%3D%22M0%200h30v20H0z%22%2F%3E%3Cpath%20fill%3D%22%23000095%22%20d%3D%22M0%200h15v10H0z%22%2F%3E%3Cg%20fill%3D%22white%22%3E%3Cpath%20d%3D%22m7.5%201%201%202%202-1-.3%202.2%202.3.8-2.3.8.3%202.2-2-1-1%202-1-2-2%201%20.3-2.2L2.5%205l2.3-.8L4.5%202l2%201z%22%2F%3E%3Ccircle%20cx%3D%227.5%22%20cy%3D%225%22%20r%3D%222%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") center / cover no-repeat; }

.language-flag[data-flag="ko"] { background: white url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2030%2020%22%3E%3Cpath%20fill%3D%22white%22%20d%3D%22M0%200h30v20H0z%22%2F%3E%3Cg%20transform%3D%22rotate%2830%2015%2010%29%22%3E%3Ccircle%20cx%3D%2215%22%20cy%3D%2210%22%20r%3D%225%22%20fill%3D%22%23cd2e3a%22%2F%3E%3Cpath%20d%3D%22M10%2010a5%205%200%200%200%2010%200%202.5%202.5%200%200%200-5%200%202.5%202.5%200%200%201-5%200%22%20fill%3D%22%230047a0%22%2F%3E%3C%2Fg%3E%3Cg%20stroke%3D%22%23000%22%20stroke-width%3D%22.9%22%3E%3Cpath%20d%3D%22m3%204%204-2M4%206l4-2M5%208l4-2M21%2014l4-2M22%2016l4-2M23%2018l4-2M3%2016l4%202M4%2014l4%202M5%2012l4%202M21%206l4%202M22%204l4%202M23%202l4%202%22%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E") center / cover no-repeat; }
