/* 中文注释：解析阶段即隐藏非当前语言的长文内容，避免首屏中英文同时出现。 */
html[data-interface-language="en"] [data-language-content="zh-CN"],
html[data-interface-language="en"] [data-language-content="ja"],
html[data-interface-language="zh-CN"] [data-language-content="en"],
html[data-interface-language="zh-CN"] [data-language-content="ja"],
html[data-interface-language="ja"] [data-language-content="en"],
html[data-interface-language="ja"] [data-language-content="zh-CN"],
html:not([data-interface-language]) [data-language-content="zh-CN"],
html:not([data-interface-language]) [data-language-content="ja"] {
    display: none !important;
}

/* 中文注释：日语优先使用操作系统自带的日文字体，避免 Inter 缺字时字形混杂。 */
html[lang="ja"] body,
html[lang="ja"] button,
html[lang="ja"] input,
html[lang="ja"] select,
html[lang="ja"] textarea {
    font-family: "Inter", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
}

:root {
    color-scheme: dark;
    --theme-accent: #ccff00;
    --theme-accent-rgb: 204 255 0;
    --theme-accent-hover: #d6ff33;
    --theme-accent-active: #b8e600;
    --theme-on-accent: #050505;
    --theme-creation-action: #ccff00;
    --theme-creation-action-rgb: 204 255 0;
    --theme-creation-action-hover: #d6ff33;
    --theme-creation-action-active: #b8e600;
    --theme-on-creation-action: #050505;
    --theme-bg-body: #030303;
    --theme-bg-body-rgb: 3 3 3;
    --theme-bg-chrome: #080808;
    --theme-bg-chrome-rgb: 8 8 8;
    --theme-bg-surface: #0a0a0a;
    --theme-bg-surface-rgb: 10 10 10;
    --theme-bg-panel: #0e0e0e;
    --theme-bg-panel-rgb: 14 14 14;
    --theme-bg-input: #111111;
    --theme-bg-input-rgb: 17 17 17;
    --theme-border: #2a2a2a;
    --theme-border-strong: #333333;
    --theme-text-primary: #ececec;
    --theme-text-heading: #ffffff;
    --theme-text-bright: #f5f5f5;
    --theme-text-strong: #dddddd;
    --theme-text-readable-muted: #9b9b9b;
    --theme-text-secondary: #cccccc;
    --theme-text-muted: #777777;
    --theme-status-error-text: #ff8b8b;
    --theme-status-error-rgb: 255 139 139;
    --theme-status-error-border: rgb(255 95 95 / 0.52);
    --theme-status-error-background: rgb(255 95 95 / 0.12);
    --theme-status-error-solid: #d92d20;
    --theme-status-error-on-solid: #ffffff;
    --theme-status-warning-text: #ffd18a;
    --theme-status-warning-rgb: 255 209 138;
    --theme-status-warning-border: rgb(255 176 0 / 0.52);
    --theme-status-warning-background: rgb(255 176 0 / 0.12);
    --theme-status-warning-solid: #b76e00;
    --theme-status-warning-on-solid: #111111;
    --theme-status-info-text: #b8d8ff;
    --theme-status-info-rgb: 184 216 255;
    --theme-status-info-border: rgb(105 166 255 / 0.5);
    --theme-status-info-background: rgb(44 105 180 / 0.24);
    --theme-status-info-solid: #0b6bcb;
    --theme-status-info-on-solid: #ffffff;
    --theme-shadow: #000000;
    --theme-shadow-rgb: 0 0 0;
    --theme-neutral-rgb: 255 255 255;
    --theme-bg-input-focus: #161616;
    --theme-bg-workspace: #050505;
    --theme-bg-grid-line: #1a1a1a;
    --theme-bg-panel-raised: #141414;
    --theme-bg-panel-low: #090909;
    --theme-bg-panel-soft: #0c0c0c;
    --theme-bg-panel-soft-rgb: 12 12 12;
    --theme-entry-shell: #0f0f0f;
    --theme-entry-segment: rgb(0 0 0 / 0.45);
    --theme-entry-hover: rgb(255 255 255 / 0.08);
    --theme-workspace-tab: #080808;
    --theme-workspace-tab-hover: #111111;
    --theme-workspace-tab-active: #1a1a1a;
    --theme-workspace-tab-border: #222222;
    --theme-workspace-tab-divider: #1a1a1a;
    --theme-card-control: rgb(0 0 0 / 0.6);
    --theme-card-control-tooltip: #000000;
    --theme-card-badge: rgb(50 50 50 / 0.75);
    --theme-floating-panel: rgb(0 0 0 / 0.5);
    --theme-floating-control: rgb(0 0 0 / 0.5);
    --theme-floating-control-soft: rgb(0 0 0 / 0.45);
    --theme-floating-menu: rgb(10 10 10 / 0.96);
    --theme-select-menu: rgb(10 10 10 / 0.97);
    --theme-editor-thumb: rgb(30 30 30 / 0.95);
    --theme-floating-text: #ffffff;
    --theme-floating-text-soft: #dddddd;
    --theme-floating-label: #f3f3f3;
    --theme-floating-muted: #888888;
    --theme-floating-tool-text: #aaaaaa;
    --theme-overlay-control: rgb(22 22 22 / 0.58);
    --theme-media-stage: #000000;
    --theme-media-editor: #050505;
    --theme-media-grid: #1a1a1a;
    --theme-media-grid-soft: rgb(255 255 255 / 0.03);
    --theme-media-border: #222222;
    --theme-media-fine-border: #1f1f1f;
    --theme-media-thumbnail-border: #333333;
    --theme-media-placeholder: linear-gradient(135deg, #0b0b0b 0%, #151515 100%);
    --theme-media-placeholder-default: radial-gradient(circle at top, rgb(204 255 0 / 0.12), transparent 48%), linear-gradient(135deg, #090909 0%, #151515 55%, #101010 100%);
    --theme-preset-tab-shell: #0b0b0b;
    --theme-preset-hover-border: #444444;
    --theme-preset-description: #888888;
    --theme-preset-summary: #5f5f5f;
    --theme-preset-placeholder-title: #bbbbbb;
    --theme-preset-empty-background: #080808;
    --theme-preset-empty-border: #252525;
    --theme-preset-empty-text: #666666;
    --theme-purchase-panel: #080808;
    --theme-purchase-raised: #111111;
    --theme-purchase-raised-hover: #161616;
    --theme-purchase-checkout: #000000;
    --theme-purchase-price-bar: #050505;
    --theme-purchase-border: #222222;
    --theme-purchase-border-strong: #333333;
    --theme-purchase-border-soft-hover: #444444;
    --theme-purchase-border-hover: #555555;
    --theme-purchase-label: #666666;
    --theme-purchase-faint: #444444;
    --theme-purchase-note: #6a6a6a;
    --theme-purchase-summary: #8d8d8d;
    --theme-purchase-soft-title: #f2f2f2;
    --theme-purchase-selection: #8f8f8f;
    --theme-purchase-footer: #9a938a;
    --theme-purchase-nav: #1a1a1a;
    --theme-purchase-badge-dark: #1d1d1d;
    --theme-purchase-segment: #090909;
    --theme-purchase-segment-text: #7d7d7d;
    --theme-purchase-price-border: #161616;
    --theme-node-canvas-surface: rgb(10 10 10 / 0.72);
    --theme-node-preview-surface: #080808;
    --theme-node-thumb-surface: #0a0a0a;
    --theme-creation-disabled-background: #333333;
    --theme-creation-disabled-text: #666666;
    --theme-scrollbar-thumb: #333333;
    --theme-scrollbar-thumb-hover: #555555;
    --theme-scrollbar-thumb-active: #ccff00;
    --scrollbar-size-standard: 5px;
    --scrollbar-size-compact: 3px;
    --scrollbar-radius-standard: 3px;
    --scrollbar-radius-compact: 2px;
    --theme-range-track: #1a1a1a;
    --theme-range-thumb: #000000;
    --theme-range-thumb-hover: #ccff00;
    --theme-range-thumb-disabled: #222222;
    --theme-range-thumb-disabled-border: #555555;
    --theme-unlimited-off-track: rgb(10 10 10 / 0.85);
    --theme-unlimited-off-thumb: rgb(204 255 0 / 0.55);
    --theme-unlimited-on-track: linear-gradient(90deg, rgb(204 255 0 / 0.24) 0%, rgb(204 255 0 / 0.42) 100%);
    --theme-unlimited-on-thumb: #ccff00;
    --theme-unlimited-disabled-track: rgb(255 255 255 / 0.08);
    --theme-unlimited-disabled-thumb: #b3b3b3;
    --theme-unlimited-disabled-text: rgb(220 220 220 / 0.88);
    --theme-unlimited-disabled-border: rgb(255 255 255 / 0.22);
    --theme-unlimited-disabled-background: rgb(255 255 255 / 0.05);
    --theme-upload-placeholder: #000000;
    --theme-upload-placeholder-border: #333333;
    --theme-generate-ratio-grid-border: #333333;
    --theme-generate-ratio-grid-gap: #2a2a2a;
    --theme-generate-ratio-option: #101010;
    --theme-generate-ratio-option-text: #9a9a9a;
    --theme-generate-ratio-hover-text: #dddddd;
    --theme-generate-ratio-disabled: #0d0d0d;
    --theme-generate-ratio-disabled-text: #666666;
    --theme-generate-ratio-icon: #666666;
    --theme-generate-ratio-auto-text: #777777;
    --theme-generate-prompt-text: #ffffff;
    --theme-generate-prompt-placeholder: #666666;
    --theme-generate-prompt-enhancing-text: rgb(255 255 255 / 0.5);
    --theme-generate-prompt-token-text: #f2f2f2;
    --theme-generate-prompt-token-close-text: rgb(255 255 255 / 0.68);
    --theme-generate-enhance-background: rgb(40 40 40 / 0.9);
    --theme-generate-enhance-border: #555555;
    --theme-generate-reference-description: #818181;
    --theme-workspace-title: #f5f5f5;
    --theme-workspace-card-title: #f2f2f2;
    --theme-workspace-folder-text: #eeeeee;
    --theme-workspace-meta: #9d9d9d;
    --theme-workspace-subtitle: #9b9b9b;
    --theme-workspace-empty-text: #8a8a8a;
    --theme-benefit-text: #f6d27a;
    --theme-benefit-hover-text: #fff0b2;
    --theme-benefit-border: rgb(255 215 120 / 0.45);
    --theme-benefit-border-hover: rgb(255 225 140 / 0.8);
    --theme-benefit-background: linear-gradient(90deg, rgb(255 215 120 / 0.18), rgb(255 245 200 / 0.08));
    --theme-benefit-pill-background: rgb(255 255 255 / 0.12);
    --theme-benefit-shadow: 0 0 10px rgb(255 215 120 / 0.12);
    --theme-benefit-shadow-hover: 0 0 16px rgb(255 215 120 / 0.5);
    --theme-benefit-sweep: linear-gradient(90deg, rgb(255 255 255 / 0) 0%, rgb(255 249 214 / 0.58) 48%, rgb(255 255 255 / 0) 100%);
    --theme-priority-action-text: var(--theme-accent);
    --theme-priority-action-hover-text: var(--theme-accent-hover);
    --theme-priority-action-border: rgb(var(--theme-accent-rgb) / 0.46);
    --theme-priority-action-border-hover: rgb(var(--theme-accent-rgb) / 0.72);
    --theme-priority-action-background: linear-gradient(90deg, rgb(var(--theme-accent-rgb) / 0.15), rgb(var(--theme-accent-rgb) / 0.06));
    --theme-priority-action-shadow: 0 0 10px rgb(var(--theme-accent-rgb) / 0.12);
    --theme-priority-action-shadow-hover: 0 0 16px rgb(var(--theme-accent-rgb) / 0.32);
    --theme-priority-status-text: var(--theme-priority-action-text);
    --theme-priority-status-border: var(--theme-priority-action-border);
    --theme-priority-status-background: var(--theme-priority-action-background);
    --theme-priority-status-shadow: var(--theme-priority-action-shadow);
    --acid-green: var(--theme-accent);
    --acid-green-glow: rgb(var(--theme-accent-rgb) / 0.15);
    --acid-green-strong-glow: rgb(var(--theme-accent-rgb) / 0.5);
}

html {
    scrollbar-color: var(--theme-scrollbar-thumb) transparent;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: var(--theme-scrollbar-thumb);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--theme-scrollbar-thumb-hover);
}

::-webkit-scrollbar-thumb:active {
    background: var(--theme-scrollbar-thumb-active);
}

/* 中文注释：首次中文词典准备期间显示中性首屏，最长等待由运行时控制。 */
html[data-language-pending="true"] body {
    visibility: hidden;
}

html[data-language-pending="true"]::before {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 2147483646;
    background: var(--theme-bg-body, #080808);
}

html[data-language-pending="true"]::after {
    content: "";
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 2147483647;
    width: 24px;
    height: 24px;
    margin: -12px 0 0 -12px;
    border: 2px solid rgb(var(--theme-neutral-rgb, 255 255 255) / 0.2);
    border-top-color: var(--theme-accent, #ccff00);
    border-radius: 50%;
    animation: site-language-pending-spin 0.7s linear infinite;
}

@keyframes site-language-pending-spin {
    to { transform: rotate(360deg); }
}

.site-language-switcher {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: 16px;
    vertical-align: middle;
    text-transform: none;
}

.site-language-switcher-trigger {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    min-height: 32px;
    padding: 5px 9px;
    border: 1px solid rgb(var(--theme-neutral-rgb) / 0.14);
    border-radius: 6px;
    background: rgb(var(--theme-bg-chrome-rgb) / 0.78);
    color: var(--theme-text-secondary);
    font: 600 11px/1.2 "Inter", sans-serif;
    cursor: pointer;
}

.site-language-switcher-trigger:hover,
.site-language-switcher-trigger:focus-visible,
.site-language-switcher.is-open .site-language-switcher-trigger {
    border-color: rgb(var(--theme-accent-rgb) / 0.5);
    color: var(--theme-accent);
    outline: none;
}

.site-language-switcher-icon {
    font-size: 14px;
    line-height: 1;
}

.site-language-switcher-menu {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 1300;
    width: max-content;
    min-width: 100%;
    padding: 6px;
    border: 1px solid rgb(var(--theme-neutral-rgb) / 0.14);
    border-radius: 8px;
    background: var(--theme-floating-panel, var(--theme-bg-chrome));
    box-shadow: 0 16px 38px rgb(var(--theme-shadow-rgb) / 0.45);
}

.site-language-switcher-menu[hidden] {
    display: none;
}

.site-language-switcher-option {
    display: flex;
    width: 100%;
    padding: 8px 10px;
    border: 0;
    border-radius: 5px;
    background: transparent;
    color: var(--theme-text-secondary);
    font: 600 12px/1.2 "Inter", sans-serif;
    text-align: left;
    cursor: pointer;
}

.site-language-switcher-option:hover,
.site-language-switcher-option:focus-visible,
.site-language-switcher-option.is-selected {
    background: rgb(var(--theme-accent-rgb) / 0.1);
    color: var(--theme-accent);
    outline: none;
}

.site-language-switcher-status {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 1299;
    width: 250px;
    padding: 0;
    color: var(--theme-text-secondary);
    font: 500 11px/1.5 "Inter", sans-serif;
    pointer-events: none;
}

.site-language-switcher-status:not(:empty) {
    top: calc(100% + 12px);
    padding: 8px 10px;
    border: 1px solid rgb(var(--theme-neutral-rgb) / 0.14);
    border-radius: 6px;
    background: var(--theme-floating-panel, var(--theme-bg-chrome));
}

/* 将语言与账户入口作为导航右侧的工具区，和站点主导航保持清晰分组。 */
.nav-utility-group {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-left: 18px;
    padding-left: 16px;
    border-left: 1px solid rgb(var(--theme-neutral-rgb) / 0.14);
    vertical-align: middle;
}

.nav-utility-group .site-language-switcher {
    margin-left: 0;
}

.nav-right .nav-utility-group .btn-upgrade {
    margin-left: 0 !important;
}

.legal-topbar-actions {
    display: flex;
    align-items: center;
    gap: 12px;
}

.legal-topbar-actions .site-language-switcher {
    margin-left: 0;
}

@media (max-width: 1280px) {
    .site-language-switcher {
        margin-left: 8px;
    }

    .site-language-switcher-label {
        max-width: 22px;
        overflow: hidden;
        white-space: nowrap;
    }

    .nav-utility-group {
        gap: 8px;
        margin-left: 10px;
        padding-left: 10px;
    }
}

@media (max-width: 720px) {
    .site-language-switcher-trigger {
        min-width: 32px;
        padding: 5px 7px;
    }

    .site-language-switcher-label {
        display: none;
    }

    .nav-utility-group {
        gap: 6px;
        margin-left: 8px;
        padding-left: 8px;
    }

    .legal-topbar-actions {
        width: 100%;
        justify-content: space-between;
    }
}
