@import url("/control-alignment.css");
/* Bootstrap Icons（MIT），由 npm run icons:generate 生成。 */
@font-face {
  font-family: SiteArrowIcons;
  src: url("/vendor/bootstrap-icons/site-arrows.woff?v=3") format("woff");
  font-display: block;
  font-style: normal;
  font-weight: 100 900;
  unicode-range: U+2192, U+2794, U+279C, U+279D, U+279E, U+279F, U+27A0, U+27A1, U+27F6, U+21D2, U+21E8, U+2190, U+2B05, U+27F5, U+21D0, U+21E6, U+2191, U+2B06, U+21E7, U+2193, U+2B07, U+21E9, U+2197, U+2196, U+2198, U+2199, U+2194, U+21D4, U+2195, U+2039, U+276E, U+25C0, U+25C1, U+25C4, U+25C5, U+203A, U+276F, U+2303, U+25B2, U+25B3, U+25B4, U+25B5, U+2304, U+25BC, U+25BD, U+25BE, U+25BF, U+25B6, U+25B7, U+25BA, U+25BB;
}
@font-face {
  font-family: "Site Icons";
  src: url("/vendor/bootstrap-icons/bootstrap-icons.woff2") format("woff2"),
       url("/vendor/bootstrap-icons/bootstrap-icons.woff") format("woff");
  font-display: block;
  font-style: normal;
  font-weight: 400;
}
:where(html, button, input, select, textarea) {
  font-family: SiteArrowIcons, system-ui, -apple-system, "Microsoft YaHei", sans-serif;
}
.site-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 1em;
  height: 1em;
  vertical-align: -.125em;
}
.site-icon::before {
  font-family: "Site Icons" !important;
  font-style: normal;
  font-weight: 400 !important;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
}
.site-icon-arrow-left::before { content: "\f12f"; }
.site-icon-arrow-right::before { content: "\f138"; }
.site-icon-arrow-up::before { content: "\f148"; }
.site-icon-arrow-down::before { content: "\f128"; }
.site-icon-arrow-up-right::before { content: "\f144"; }
.site-icon-arrow-up-left::before { content: "\f13f"; }
.site-icon-arrow-down-right::before { content: "\f123"; }
.site-icon-arrow-down-left::before { content: "\f11e"; }
.site-icon-arrow-left-right::before { content: "\f12b"; }
.site-icon-arrow-down-up::before { content: "\f127"; }
.site-icon-chevron-left::before { content: "\f284"; }
.site-icon-chevron-right::before { content: "\f285"; }
.site-icon-chevron-up::before { content: "\f286"; }
.site-icon-chevron-down::before { content: "\f282"; }
.site-icon-play-circle::before { content: "\f4f3"; }
.site-icon-check2::before { content: "\f272"; }
.site-icon-x-lg::before { content: "\f659"; }
.site-icon-download::before { content: "\f30a"; }
.site-icon-chat-dots::before { content: "\f24a"; }
.site-icon-arrows-move::before { content: "\f14e"; }
.site-icon-box-seam::before { content: "\f1c7"; }
.site-icon-lightning-charge::before { content: "\f46d"; }
.site-icon-display::before { content: "\f302"; }
.site-icon-moon::before { content: "\f497"; }
.site-icon-plug::before { content: "\f4f7"; }
.site-icon-hand-index-thumb::before { content: "\f402"; }
.site-icon-plus::before { content: "\f4fe"; }
.site-icon-dash::before { content: "\f2ea"; }
/* Same compact outline as the menu; inherit button/link colors, including hover. */
.site-icon-arrow-up-right::before {
  content: "";
  display: block;
  width: 14px;
  height: 14px;
  background-color: currentColor;
  -webkit-mask: url("/up-right.svg") center / contain no-repeat;
  mask: url("/up-right.svg") center / contain no-repeat;
}
/* 三站表单共用：不替换原生类型、校验、选择弹层或键盘行为。 */
@media screen {
  :root {
    --control-accent: #345844;
    --control-border: #b9c5b6;
    --control-paper: #fffefb;
    --control-ink: #293e33;
    --control-muted: #687568;
    --control-disabled: #eeeee8;
    --control-error: #ac3c32;
  }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, select, textarea):where(:not([type="checkbox"], [type="radio"], [type="range"], [type="color"], [type="hidden"], [type="submit"], [type="reset"], [type="button"], [type="image"])) {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    min-height: 46px;
    padding: 11px 13px;
    border: 1px solid var(--control-border) !important;
    border-radius: 12px !important;
    background-color: var(--control-paper) !important;
    color: var(--control-ink) !important;
    font-size: 16px;
    line-height: 1.5;
    box-shadow: none;
    transition: border-color .16s ease, background-color .16s ease;
  }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) textarea { resize: vertical; min-height: 120px; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, textarea)::placeholder { color: var(--control-muted); opacity: 1; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, select, textarea):focus-visible {
    border-color: var(--control-accent) !important;
    outline: 2px solid var(--control-accent) !important;
    outline-offset: 2px !important;
    box-shadow: none !important;
  }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, select, textarea):disabled {
    color: var(--control-muted) !important;
    background-color: var(--control-disabled) !important;
    border-color: var(--control-border) !important;
    opacity: 1;
    cursor: not-allowed;
  }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, textarea)[readonly]:not(:disabled) { background-color: var(--control-disabled) !important; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) select { cursor: pointer; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) select option { background-color: var(--control-paper); color: var(--control-ink); }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) select option:checked { background-color: var(--control-disabled); color: var(--control-ink); }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) select option:disabled { color: var(--control-muted); }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) select:where([multiple], [size]:not([size="1"])) { min-height: 100px; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) input[type="range"] { accent-color: var(--control-accent); min-height: 44px; padding: 0; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, select, textarea):is([aria-invalid="true"], :user-invalid) { border-color: var(--control-error) !important; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, select, textarea):is([aria-invalid="true"], :user-invalid):focus-visible { outline-color: var(--control-error) !important; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) input:is([type="checkbox"], [type="radio"]) {
    appearance: auto;
    -webkit-appearance: auto;
    accent-color: var(--control-accent);
    width: 20px !important;
    height: 20px;
    min-height: 20px !important;
    padding: 0;
    flex: 0 0 20px;
    margin: .25em 0 0;
    cursor: pointer;
  }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) input:is([type="checkbox"], [type="radio"]):disabled { cursor: not-allowed; accent-color: var(--control-muted); }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) button:disabled { cursor: not-allowed; opacity: .55; transform: none !important; box-shadow: none !important; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) button:focus-visible { outline: 2px solid var(--control-accent) !important; outline-offset: 3px !important; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) input[type="file"] { height: auto; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) input[type="file"]:disabled::file-selector-button { cursor: not-allowed; opacity: .6; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) input[type="file"]::file-selector-button {
    font: inherit;
    padding: 8px 12px;
    margin-inline-end: 12px;
    border: 1px solid var(--control-border);
    border-radius: 8px;
    background: var(--control-disabled);
    color: var(--control-ink);
    cursor: pointer;
  }
  /* 标签与图标占独立网格行，不依赖标签字数或绝对定位猜测高度。 */
  body .site-select {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    row-gap: 8px;
    min-width: 0;
    max-width: 100%;
  }
  body .site-select > select:not([multiple], [size]) {
    grid-area: var(--select-row, 2) / 1;
    appearance: none;
    -webkit-appearance: none;
    width: 100%;
    padding-inline-end: 40px !important;
    margin-block: 0 !important;
  }
  body .site-select::after {
    content: "\f282";
    font: 400 13px/1 "Site Icons";
    grid-area: var(--select-row, 2) / 1;
    align-self: center;
    justify-self: end;
    margin-inline-end: 15px;
    color: var(--control-muted);
    pointer-events: none;
  }
  body .site-select { --select-row: 1; row-gap: 0; align-self: start; }
  body .site-select > select { min-width: 0; max-width: 100%; }
  body .site-select:has(> select:is([multiple], [size]))::after { content: none; }
  body .site-select[hidden], body .site-select:has(> select[hidden]) { display: none !important; }
  body :is(.hub-tools, .admin-filters) > .site-select { flex: 1 1 160px; }
  body .phone-input > .site-select { flex: 0 1 45%; }
  body .international-phone > .site-select { flex: 0 1 145px; }
  body .international-phone > .site-select > select { width: 100%; max-width: 100%; }
  body :is(.phone-input, .international-phone) > .site-select > select { height: 100%; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) label:has(> input:is([type="checkbox"], [type="radio"])) {
    display: flex; align-items: flex-start; gap: 10px; min-height: 44px; line-height: 1.6; cursor: pointer;
  }
  body .site-number { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 6px; min-width: 0; }
  body .site-number > input[type="number"] { appearance: textfield; -moz-appearance: textfield; text-align: center; width: 100%; margin: 0; font-variant-numeric: tabular-nums; padding-inline: 4px; }
  body .site-number > input::-webkit-inner-spin-button, body .site-number > input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
  body .site-number > button {
    display: grid;
    place-items: center;
    width: 44px;
    min-height: 46px;
    padding: 0;
    margin: 0;
    border: 1px solid var(--control-border);
    border-radius: 12px;
    background: var(--control-paper);
    color: var(--control-accent);
    font-size: 18px;
    box-shadow: none;
    touch-action: manipulation;
  }
  /* 自定义下拉弹层：原生 select 只作状态与事件总线，弹层、键盘与焦点由字体图标菜单接管。 */
  /* Language names and the selection check need their own width on narrow headers. */
  body .field > .field-label { display: block; margin: 0 0 8px; font-size: 13px; font-weight: 650; }
  body label.field:has(> select) > span { margin-bottom: 0; }
}
@media screen and (hover: hover) and (pointer: fine) {
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, select, textarea):where(:not(:disabled, [readonly], [aria-invalid="true"], :user-invalid)):hover { border-color: var(--control-accent) !important; }
  body .site-number > button:not(:disabled):hover { border-color: var(--control-accent); background: var(--control-disabled); }
}
@media screen and (prefers-reduced-motion: reduce) {
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, select, textarea) { transition: none; }
}
@media screen and (max-width: 480px) {
  body :is(.phone-input, .international-phone) > .site-select { flex-basis: 100%; width: 100%; }
}
@media (forced-colors: active) {
  body :is(main, dialog, .cms-workspace, [role="dialog"]) select,
  body .site-select > select { appearance: auto !important; -webkit-appearance: auto !important; padding-inline-end: 13px !important; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) label:has(> select)::after,
  body .site-select::after { display: none !important; }
  body :is(main, dialog, .cms-workspace, [role="dialog"]) :is(input, select, textarea, button):focus-visible { outline-color: Highlight !important; }
}
/* 折叠控件保留原生键盘语义，统一以字体图标表示展开方向。 */
body details > summary {
  display: block;
  position: relative;
  list-style: none;
  min-height: 44px;
  box-sizing: border-box;
  padding-inline-end: 2.25rem !important;
  align-content: center;
  cursor: pointer;
  overflow-wrap: anywhere;
}
body details > summary::-webkit-details-marker { display: none; }
body details > summary::marker { content: ""; }
body details > summary::after,
body details[open] > summary::after {
  content: "\f282" !important;
  font: 400 13px/1 "Site Icons" !important;
  position: absolute;
  inset-inline-end: .5rem;
  top: 50%;
  width: 1em;
  height: 1em;
  transform: translateY(-50%);
  transition: transform .18s ease;
  pointer-events: none;
}
body details[open] > summary::after { transform: translateY(-50%) rotate(180deg); }
body details > summary:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  body details > summary::after { transition: none; }
}