.language-button { display: inline-flex !important; align-items: center; justify-content: center; white-space: nowrap; min-width: 66px; min-height: 40px; padding: 8px 11px; }
.language-menu { width: min(550px,calc(100% - 28px)); border: 1px solid var(--line); border-radius: 24px; background: var(--paper); padding: 24px; max-height: calc(100dvh - 32px); overflow-y: auto; color: var(--ink); }
.language-menu::backdrop { background: rgba(7,19,22,.52); backdrop-filter: blur(5px); }
.language-menu h2 { font: 500 2.2rem/1.15 var(--serif); margin: 0; }
.language-intro { margin: 10px 0 0; color: var(--muted); font-size: .9rem; line-height: 1.65; }
.language-options { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 22px; }
.language-options button { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 58px; padding: 12px 17px; border: 1px solid var(--line); border-radius: 14px; background: white; font: 650 .97rem var(--sans); color: var(--ink); text-align: left; cursor: pointer; }
.language-options button small { color: var(--jade-dark); font-size: .68rem; font-weight: 750; letter-spacing: .06em; text-transform: uppercase; }
.language-options button.is-coming { background: rgba(255,255,255,.48); color: #53635f; }
.language-options button.is-coming small { color: #778681; }
.language-options button:hover,.language-options button[aria-pressed="true"] { border-color: var(--jade-dark); background: #e7f2eb; }
.language-status { margin: 16px 0 0; padding: 12px 14px; border-left: 3px solid var(--jade-dark); border-radius: 0 10px 10px 0; background: rgba(134,224,205,.15); color: #31564b; font-size: .86rem; line-height: 1.6; }
.language-status[hidden] { display: none; }
.translation-notice { padding: 10px max(20px,calc((100vw - 1280px)/2)); font: 500 .875rem/1.65 var(--sans); color: #2f5449; background: #e6eee4; border-bottom: 1px solid #cadbcf; }
.language-menu[aria-busy="true"] .language-options { opacity: .55; pointer-events: none; }
.footer-bottom [data-language] { font: inherit; color: inherit; }
html:not(:lang(en)) .product-name,html:not(:lang(en)) .product-card h3 { overflow-wrap: anywhere; }
html:lang(vi) { --sans: "Segoe UI",Arial,sans-serif; --serif: Georgia,"Times New Roman",serif; }
.translation-notice[hidden] { display: none; }
html:lang(ja) { --sans: "Yu Gothic","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif; --serif: "Yu Mincho","Hiragino Mincho ProN",serif; }
html:lang(th) { --sans: "Leelawadee UI","Noto Sans Thai",Tahoma,sans-serif; --serif: "Leelawadee UI","Noto Serif Thai",serif; }
html:lang(ja) h1,html:lang(ja) h2,html:lang(th) h1,html:lang(th) h2 { letter-spacing: 0; line-height: 1.35; }
html:not(:lang(en)) .desktop-nav { display: none; }
html:not(:lang(en)) .nav-actions { margin-left: auto; }
html:not(:lang(en)) .menu-button { display: inline-grid; place-items: center; }
html:not(:lang(en)) .mobile-panel { position: fixed; z-index: 49; inset: 108px 0 0; display: block; padding: 24px; background: rgba(246,244,239,.98); opacity: 0; pointer-events: none; transform: translateY(-10px); }
html:not(:lang(en)) .mobile-panel.is-open { opacity: 1; pointer-events: auto; transform: none; }
html:not(:lang(en)) .mobile-links { display: grid; gap: 6px; }
html:not(:lang(en)) .mobile-links a { padding: 14px 6px; border-bottom: 1px solid var(--line); font: 500 1.35rem/1.4 var(--serif); }
@media(min-width:1121px) and (max-width:1450px) { .nav-actions .button { display: none; } }
@media(max-width:820px) { html:not(:lang(en)) .mobile-panel { inset: 70px 0 0; } }
@media(max-width:580px) { .language-button { padding: 7px; font-size: .73rem; max-width: 100px; overflow: hidden; } .language-menu { padding: 20px; } .language-options { gap: 8px; } }
