/* Additions to the Claude Design styles: language menu, forms, donate dialog,
   right-to-left languages and Japanese. */

/* Language menu (sits between the brand and the menu button) */
.site-header .wrap{gap:12px}
.site-header .brand{margin-inline-end:auto}
.lang-menu{order:3;position:relative;font-size:15px;font-weight:600}
#main-nav{order:2}
#menu-btn{order:4}
.lang-menu summary{list-style:none;display:flex;align-items:center;gap:6px;min-height:40px;padding:0 12px;border:1px solid #E2DED4;border-radius:999px;cursor:pointer;color:#1B2A57;background:#FFFFFF}
.lang-menu summary::-webkit-details-marker{display:none}
.lang-menu[open] summary{border-color:#1B2A57}
.lang-menu ul{position:absolute;inset-inline-end:0;top:calc(100% + 8px);z-index:40;margin:0;padding:8px;list-style:none;background:#FFFFFF;border:1px solid #E2DED4;border-radius:12px;box-shadow:0 12px 32px rgba(15,23,48,.16);display:grid;grid-template-columns:repeat(3,minmax(150px,1fr));gap:2px;width:max-content;max-width:calc(100vw - 32px);max-height:70vh;overflow:auto}
.lang-menu li a{display:block;padding:9px 12px;border-radius:8px;text-decoration:none;color:#1B2A57;font-weight:500}
.lang-menu li a:hover{background:#F7F5F0;color:#C8102E}
.lang-menu li a[aria-current]{background:#1B2A57;color:#FFFFFF}
.lang-menu li a[dir="rtl"]{text-align:right}
#main-nav{column-gap:20px}
@media (max-width:1280px){
  #menu-btn{display:flex}
  #main-nav{display:none;width:100%;flex-direction:column;align-items:stretch;gap:0}
  #main-nav.open{display:flex}
  #main-nav a{padding:12px 0;border-bottom:1px solid #E2DED4}
  #main-nav a.btn{border:0;margin-top:12px;padding:13px}
  .lang-menu{order:1}
  #menu-btn{order:2}
  #main-nav{order:3}
}
@media (max-width:860px){
  .lang-menu{order:1}
  .lang-menu summary span{display:none}
  #menu-btn{order:2}
  #main-nav{order:3}
  .lang-menu ul{grid-template-columns:repeat(2,minmax(0,1fr));width:calc(100vw - 32px)}
}

/* Form status lines */
.form-note{margin:0;font-size:14px;line-height:20px;font-weight:600}

/* Donation dialog (Zeffy) */
.donate-dialog{width:min(560px,calc(100vw - 32px));height:min(820px,calc(100vh - 32px));padding:0;border:0;border-radius:12px;overflow:hidden;background:#FFFFFF}
.donate-dialog::backdrop{background:rgba(15,23,48,.6)}
.donate-dialog iframe{width:100%;height:100%;border:0;display:block}
.donate-close{position:absolute;top:8px;inset-inline-end:8px;width:44px;height:44px;border:0;border-radius:12px;background:#FFFFFF;color:#1B2A57;font-size:28px;line-height:1;cursor:pointer;z-index:1}

/* Japanese: system CJK fonts, natural line breaks */
:lang(ja) body,:lang(ja) h1,:lang(ja) h2,:lang(ja) h3,:lang(ja) .btn,:lang(ja) button{font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","Noto Sans CJK JP","Noto Sans JP",Meiryo,system-ui,sans-serif}
:lang(ja) h1,:lang(ja) h2,:lang(ja) h3,:lang(ja) p{line-break:strict;word-break:auto-phrase;letter-spacing:0}

/* Right-to-left languages */
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,[dir="rtl"] .eyebrow{letter-spacing:0}
[dir="rtl"] h1{line-height:1.45}
[dir="rtl"] h2{line-height:1.55}
[dir="rtl"] .fund button,[dir="rtl"] .callout{text-align:right}
[dir="rtl"] ol,[dir="rtl"] ul{padding-left:0;padding-inline-start:22px}
[dir="rtl"] .quick-exit{right:auto;left:16px}
[dir="rtl"] .brand,[dir="rtl"] footer img{direction:ltr}
/* The design hides the skip link 9999px to the left; in right-to-left pages that
   side scrolls, so hide it off the right edge instead. */
[dir="rtl"] .skip{left:auto;right:-9999px}
[dir="rtl"] .skip:focus{right:8px}
