/* One control/menu vocabulary for the studio, administration and navigation. */
.ui-select{position:relative;display:block;min-width:0;width:100%;font:inherit}
select.ui-select-native{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;opacity:0!important;pointer-events:none!important;margin:0!important}
.ui-select-trigger{display:flex;align-items:center;justify-content:space-between;gap:16px;min-width:0;width:100%;min-height:48px;padding:13px 14px;background:var(--bg);color:var(--text);border:1px solid var(--control-line);border-radius:var(--radius-control);font:400 16px/1.65 var(--font);text-align:start;cursor:pointer;transition:border-color 160ms,background-color 160ms}
.ui-select-trigger:hover:not(:disabled){border-color:var(--muted);background:var(--surface)}
.ui-select-trigger:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
.ui-select-trigger[aria-expanded=true]{border-color:var(--lime)}
.ui-select-trigger:disabled{cursor:not-allowed;color:var(--muted);background:var(--surface2);border-color:var(--line)}
.ui-select-trigger[aria-invalid=true]{border-color:var(--error)}
.ui-select-value{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:inherit}
.ui-select-icon{width:17px;height:17px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;color:var(--muted);transition:transform 160ms ease-out}
.ui-select-trigger[aria-expanded=true]>.ui-select-icon{transform:rotate(180deg);color:var(--lime)}
.ui-dropdown-panel{background:var(--surface);color:var(--text);border:1px solid var(--control-line);border-radius:var(--radius-control);padding:6px;box-shadow:0 3px 8px #0003;font:400 14px/1.5 var(--font);color-scheme:inherit}
.ui-select-list,.ui-floating-menu{position:fixed!important;inset:auto!important;margin:0!important;overflow-y:auto;overscroll-behavior:contain;z-index:80;max-width:calc(100vw - 24px);box-sizing:border-box}
.ui-select-list{outline:none}
.ui-select-option{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:42px;padding:10px 12px;border-radius:4px;cursor:pointer;overflow-wrap:anywhere}
.ui-select-option>span{min-width:0}
.ui-select-option>.ui-select-icon{width:16px;height:16px;visibility:hidden;color:var(--lime)}
.ui-select-option[aria-selected=true]{color:var(--lime);background:color-mix(in srgb,var(--lime) 10%,var(--surface));font-weight:600}
.ui-select-option[aria-selected=true]>.ui-select-icon{visibility:visible}
.ui-select-option.is-active{background:var(--surface2);outline:1px solid var(--control-line);outline-offset:-1px}
.ui-select-option[aria-disabled=true]{color:var(--muted);cursor:not-allowed;opacity:.65}
.ui-select-group{padding:12px 12px 6px;color:var(--muted);font-size:12px;font-weight:600}
.ui-select-error{display:block;color:var(--error);font-size:12px;margin-top:8px;line-height:1.5}
.ui-dropdown-panel a{border-radius:4px;min-height:42px}.ui-dropdown-panel a:hover,.ui-dropdown-panel a:focus-visible{background:var(--surface2);color:var(--lime);outline-offset:-2px}.ui-dropdown-panel a[aria-current=true]{background:color-mix(in srgb,var(--lime) 10%,var(--surface));color:var(--lime)}
.admin-shell-page .ui-select-trigger{font-size:13px;min-height:44px;padding:11px 12px}
.admin-user-popover.ui-dropdown-panel{padding:18px;border-color:var(--control-line);border-radius:var(--radius-control);box-shadow:0 3px 8px #0003}
.ui-floating-menu.admin-user-popover{min-width:250px}
@media(prefers-reduced-motion:no-preference){.ui-select-list{animation:ui-select-arrive 140ms cubic-bezier(.16,1,.3,1)}@keyframes ui-select-arrive{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}}
@media(max-width:700px){.admin-shell-page .ui-select-trigger{font-size:16px;min-height:48px}.ui-select-option{min-height:46px}.ui-dropdown-panel{font-size:14px}}
@media(prefers-reduced-motion:reduce){.ui-select-trigger,.ui-select-icon{transition:none}.ui-dropdown-panel{animation:none!important}}
/* Country flags supplement native language names; they never replace text labels. */
.language-menu{flex-shrink:0}
.language-menu summary{min-height:44px;padding:8px 10px;border:1px solid transparent;border-radius:var(--radius-control);gap:8px;font-size:12px;line-height:1.5;color:var(--text);transition:background-color 160ms,border-color 160ms}
.language-menu summary:hover{background:var(--surface2);border-color:var(--line)}
.language-menu[open] summary{background:var(--surface2);border-color:var(--control-line)}
.language-flag{display:block;flex:0 0 auto;width:24px;height:16px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px #ffffff26}
.language-current{white-space:nowrap;font-weight:600}.language-code{display:none;font-weight:650}
.language-current[lang=zh-CN]{font-family:'Noto Sans SC','PingFang SC','Microsoft YaHei',sans-serif}
.language-menu summary>.icon-chevron-down{display:block;width:12px;height:12px;color:var(--muted);transition:transform 180ms var(--ease-out),color 180ms}
.language-menu[open] summary>.icon-chevron-down{color:var(--lime);transform:rotate(180deg)}
.language-options{min-width:min(224px,calc(100vw - 24px));padding:6px;border-color:var(--control-line)}
.language-options a{display:flex;align-items:center;justify-content:flex-start;gap:12px;padding:12px;min-height:48px;font-size:14px;line-height:1.5;transition:background-color 140ms,color 140ms}
.language-options .language-name{flex:1;white-space:nowrap}.language-check-space{width:16px;flex-shrink:0}
.language-options a>.icon-check{width:16px;height:16px;margin-left:auto;color:var(--lime)}
.language-options a:focus-visible{outline:2px solid var(--lime);outline-offset:-2px}
.language-options a[aria-current=true]{font-weight:650}
.footer-languages .language-menu summary{min-width:168px;justify-content:flex-start;border-color:var(--control-line);background:var(--surface)}
.footer-languages summary>.icon-chevron-down{margin-left:auto}.footer-languages .language-options a{padding:12px;text-decoration:none}
.footer-languages .language-options:not(.ui-floating-menu){top:auto;bottom:calc(100% + 6px);left:0;right:auto}
@media(prefers-reduced-motion:no-preference){
 .language-menu[open] .language-options{animation:language-arrive 180ms var(--ease-out) both}
 .language-menu[open] .language-options[data-placement=above]{animation-name:language-arrive-above}
 @keyframes language-arrive{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
 @keyframes language-arrive-above{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
}
@media(max-width:1100px){.nav .language-current{display:none}.nav .language-code{display:inline}.nav .language-menu summary{gap:7px;padding:8px;min-width:0}}
@media(max-width:620px){.admin-topbar .language-current{display:none}.admin-topbar .language-code{display:inline}.admin-topbar .language-flag{width:21px;height:14px}}
@media(prefers-reduced-motion:reduce){.language-menu summary,.language-menu summary>.icon-chevron-down,.language-options a{transition:none}.language-menu .language-options{animation:none!important}}

.language-options:not(.ui-floating-menu){max-height:min(440px,calc(100svh - 100px));overflow-y:auto;overscroll-behavior:contain}

/* Header language trigger: flag only; readable language names remain in the menu. */
.nav .language-menu>summary{width:44px;min-width:44px;min-height:44px;padding:10px;gap:0;justify-content:center}
.nav .language-menu>summary :is(.language-current,.language-code,.icon-chevron-down){display:none}
.nav .language-menu>summary .language-flag{width:24px;height:16px}

/* Header: condensed performance lettering and angular red studio action. */
.nav{gap:28px}
.nav .primary-nav{gap:24px;font-family:'Barlow Condensed',var(--font);font-size:20px;font-weight:700;line-height:1.2;letter-spacing:.015em;color:#d5cfd2}
.nav .primary-nav>a,.nav .guide-menu>summary{min-height:44px;display:flex;align-items:center;transition:color 160ms}
.nav .guide-menu>summary{font:inherit;gap:6px}
.nav .primary-nav>a:hover,.nav .guide-menu>summary:hover,.nav .guide-menu[open]>summary{color:#fff}
.nav .primary-nav>[aria-current=page]{color:#ff6571;text-decoration-thickness:2px;text-underline-offset:9px}
.nav .primary-nav .guide-options{font:400 14px/1.5 var(--font);letter-spacing:0}
html[lang=zh-CN] .nav .primary-nav{font-family:var(--font);font-size:15px;font-weight:700;letter-spacing:.025em}
html:is([lang=ja],[lang=ko],[lang=ru]) .nav .primary-nav{font-family:var(--font);font-size:14px;font-weight:700;letter-spacing:0}
.nav .nav-actions{gap:12px;flex-shrink:0}
.nav .nav-create{position:relative;isolation:isolate;min-height:40px;height:40px;padding:8px 12px;gap:10px;border:0;border-radius:2px;background:transparent;color:#fff;font:700 16px/1.3 'Barlow Condensed',var(--font);letter-spacing:.02em;white-space:nowrap;transition:transform 180ms var(--ease-out)}
.nav .nav-create::before{content:'';position:absolute;inset:0;z-index:-1;background:#d71932;clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);transition:background-color 180ms}
.nav .nav-create>.icon{width:18px;height:18px;padding:0;border:0;box-sizing:border-box;transition:transform 180ms var(--ease-out)}
.nav .nav-create:hover{background:transparent;color:#fff;transform:translateY(-1px)}
.nav .nav-create:hover::before{background:#b81129}
.nav .nav-create:hover>.icon{transform:translate(2px,-2px)}
.nav .nav-create:active{transform:translateY(0)}
body[data-locale=en] .nav .nav-create{font-family:'Airap Display',var(--font);font-size:17px;font-weight:400;letter-spacing:.01em}
html:is([lang=zh-CN],[lang=ja],[lang=ko],[lang=ru]) .nav .nav-create{font-family:var(--font);font-size:13px;font-weight:700;letter-spacing:.01em}
.nav .language-menu>summary,.nav .account-menu>summary,.nav .menu-toggle,.nav .account-login{border:0;border-radius:3px;background:transparent;box-shadow:none;transition:background-color 160ms,color 160ms}
.nav .language-menu>summary:hover,.nav .language-menu[open]>summary,.nav .account-menu>summary:hover,.nav .account-menu[open]>summary,.nav .menu-toggle:hover,.nav .account-login:hover{background:#ffffff08;border:0;color:#fff}
.nav .account-menu>summary{padding:3px 7px 3px 3px;gap:5px}
.nav .account-avatar{border:0;box-shadow:none;background:#3a1b26}
.nav .language-menu>summary .language-flag{box-shadow:none}
.nav .account-login{padding:10px 13px;gap:8px;font-size:13px;font-weight:700;line-height:1.4}
.nav .menu-toggle{width:44px;height:44px;align-items:center;justify-content:center}
@media(min-width:1001px) and (max-width:1250px){.nav{gap:20px;padding-inline:3%}.nav .primary-nav{gap:18px}.nav .brand-logo{width:205px}.nav .nav-actions{gap:8px}.nav .nav-create{gap:10px;padding-inline:12px}.nav .community-nav>.icon-arrow-up-right{display:none}}
@media(max-width:1000px){.nav{gap:16px}.nav .primary-nav{gap:0}.nav .primary-nav>a,.nav .primary-nav .guide-menu>summary{font:700 18px/1.4 var(--font);letter-spacing:0;min-height:52px}.nav .nav-actions{gap:8px}.nav .account-menu>summary{padding:3px}.nav .account-menu>summary>.icon{display:none}.nav .account-login{padding:10px}.nav .account-login-label{display:none}.nav .account-login>.icon{display:block}}
@media(max-width:760px){.nav{padding-inline:5%;gap:8px}.nav .nav-actions{gap:6px}.nav .account-login{font-size:13px;padding:10px}.nav .language-menu>summary{padding:9px}.nav .brand-logo{width:174px}}
@media(max-width:370px){.nav .brand-logo{width:140px}.nav .nav-actions{gap:4px}.nav .language-menu>summary{width:44px;min-width:44px;padding:9px}}
@media(prefers-reduced-motion:reduce){.nav .primary-nav>a,.nav .guide-menu>summary,.nav .nav-create,.nav .nav-create::before,.nav .nav-create>.icon,.nav .language-menu>summary,.nav .account-menu>summary,.nav .menu-toggle,.nav .account-login{transition:none}.nav .nav-create:hover,.nav .nav-create:hover>.icon{transform:none}}

/* A single account entry: guests enter via sign-in; members use their avatar. */
.nav .nav-account[hidden],.nav .nav-create[hidden]{display:none!important}
.nav .nav-create[data-guest-studio]{display:inline-flex}
@media(max-width:600px){
 .nav .nav-create[data-guest-studio]{width:44px;min-width:44px;min-height:44px;height:44px;padding:8px;gap:0;justify-content:center}
 .nav .nav-create-label{display:none}
 .nav .nav-create[data-guest-studio]>.icon{width:18px;height:18px;padding:0;border:0;box-sizing:border-box}
}