html,
body {
  height: 100%;
  min-height: 100%;
  margin: 0;
  padding: 0;
}
body {
  /* body 背景由 data-theme 控制；这里用默认的图 */
  background: var(--body-bg) var(--body-bg-image, url(../images/judge0_background.png)) no-repeat;
  background-size: cover;
  height: 100%;
  width: 100%;
  size: 100%;
  overflow: hidden;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
}
.ui[class*="left action"].input > .dropdown {
  border-radius: 0 0.28571429rem 0.28571429rem 0;
}
.ui.selection.dropdown {
  width: 205px;
  overflow: visible !important;
  max-height: none;

}
.lm_header .lm_tab {
  padding-bottom: 3px;
  height: 16px;
  text-align: center;
  font-family: "Helvetica Neue", monospace, monospace, "Droid Sans Fallback";
  font-size: 14px;
}
.lm_header .lm_tab.lm_active {
  box-shadow: none;
  padding-bottom: 3px;
}
#site-navigation {
  border-radius: 0;
  margin: 0;
  background: var(--nav-bg) !important;
  border-bottom: 1px solid var(--nav-border);
  height: 60px;
}
#navigation-message {
  font-size: 1.2em;
  white-space: nowrap;
  overflow: hidden;
}
@keyframes slide {
  0% {
    transform: translateX(570px);
  }
  100% {
    transform: translateX(-100%);
  }
}
@-webkit-keyframes slide {
  0% {
    transform: translateX(570px);
  }
  100% {
    transform: translateX(-100%);
  }
}
.navigation-message-text {
  white-space: nowrap;
  -moz-animation: slide 60s linear infinite;
  -webkit-animation: slide 60s linear infinite;
  animation: slide 60s linear infinite;
}
.navigation-message-text:hover {
  -moz-animation-play-state: paused;
  -webkit-animation-play-state: paused;
  animation-play-state: paused;
}
#navigation-message a {
  color: var(--accent);
  font-weight: bold;
}
#site-icon {
  width: 30px;
  height: 30px;
  vertical-align: middle;
}
#site-header {
  padding-left: 10px;
  padding-top: 0;
  padding-bottom: 0;
}
#site-header h2 {
  display: inline;
  vertical-align: middle;
  font-family: "Exo 2", sans-serif;
  color: var(--nav-text);
}
#site-content {
  height: calc(100% - 60px - 19px);
}
#site-modal .header {
  color: var(--danger);
}
#site-footer,
#status-line,
#donate-line {
  background-color: var(--footer-bg) !important;
  bottom: 0;
  text-align: center;
  font-family: "Helvetica Neue", monospace, monospace, "Droid Sans Fallback";
  font-size: 13px;
  height: 19px;
  padding-left: 16px;
  padding-right: 16px;
  position: fixed;
}
#site-footer {
  color: var(--footer-text);
  left: 0;
  text-align: center;
  width: 100%;
}
#faqtext {
  color: #000;
  float: left;
  left: 0;
  text-align: left;
  font-size: 16px;
  width: fit-content;
  font-weight: 700;
}
#site-footer a {
  color: var(--footer-link);
  font-weight: bold;
}
#site-footer a:hover {
  color: var(--footer-link-hover);
}
#donate-line {
  float: left;
  left: 0;
  text-align: left;
  width: fit-content;
}
#status-line {
  color: var(--footer-text);
  float: left;
  left: 0;
  text-align: left;
  width: fit-content;
}
#server-stat-info {
  color: #000;
  float: left;
  left: 0;
  text-align: left;
  font-size: 16px;
  width: fit-content;
  font-weight: 700;
}
#sites-info {
  color: #000;
  float: left;
  left: 0;
  text-align: left;
  font-size: 16px;
  width: fit-content;
  font-weight: 700;
}
#site-modal .content {
  color: #000;
  float: left;
  left: 0;
  text-align: left;
  font-size: 16px;
  width: fit-content;
  font-weight: 700;
}
#editor-status-line {
  /* 绝对定位脱离 #site-footer 的 inline 排版，避免被 author-area "© 2016-2026..." 文字覆盖 */
  position: fixed;
  bottom: 19px;            /* 浮在 footer 之上 */
  left: 0;
  z-index: 99;
  font-family: monospace;
  font-size: 13px;
  font-weight: bold;
  color: #4ec9b0;          /* monaco 主题色，vim NORMAL/INSERT 醒目 */
  background: rgba(0, 0, 0, 0.4);
  padding: 2px 12px;
  border-left: 3px solid #4ec9b0;
  border-radius: 0 3px 3px 0;
  min-width: 100px;
  text-align: center;
  pointer-events: none;    /* 不挡点击 */
  letter-spacing: 1px;
}
#editor-status-line:empty {
  display: none;           /* normal 模式下隐藏（不显示空状态） */
}

/* ===== 快捷键设置（已注释，暂不启用） =====
#keymap-table .keymap-key {
  display: inline-block;
  min-width: 5em;
  padding: 2px 8px;
  background: rgba(78, 201, 176, 0.15);
  color: #4ec9b0;
  border-radius: 3px;
  font-family: monospace;
  font-size: 12px;
  text-align: center;
}
#keymap-table .keymap-key.is-recording {
  background: rgba(255, 80, 80, 0.25);
  color: #ff5050;
  animation: keymap-blink 0.8s ease-in-out infinite alternate;
}
#keymap-table tr.is-recording-row {
  background: rgba(255, 80, 80, 0.05) !important;
}
@keyframes keymap-blink {
  from { opacity: 0.4; }
  to   { opacity: 1; }
}
*/
#expire-selection.shake{
    animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) both;
    transform: translate3d(0, 0, 0);
    backface-visibility: hidden;
    perspective: 200px;
}
#editor-status-line input[type="text"] {
  background: transparent;
  border: 0;
  color: var(--footer-text);
  font-family: monospace;
  outline: 0;
}
#editor-status-line input[type="text"]::selection {
  background-color: #cce2ff;
  color: #fff;
}
.blink {
  animation: blinker 1s linear infinite;
}
@keyframes blinker {
  50% {
    background: #ffd700;
  }
}
.dot {
  background: var(--footer-bg);
  position: absolute;
  border-radius: 50px;
  width: 5px;
  height: 5px;
  right: 7.5px;
  top: 7.5px;
}
.no-left-padding {
  padding-left: 0 !important;
}
input[type="text"] {
  width: 140px !important;
}
.slide-btn {
  width: 100px;
  display: inline-block;
  border: 1px solid;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  border-radius: 5px;
  position: relative;
  overflow: hidden;
  cursor: pointer;
}
.slide-btn .inner-on,
.slide-btn .inner-off {
  width: 151px;
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  left: 0;
  cursor: pointer;
  transition: left 0.5s;
}
.inner-on .left,
.inner-off .left {
  width: 50px;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background: #58b058;
  text-align: center;
  display: inline-block;
  padding: 4px 0;
}
.inner-on .space,
.inner-off .space {
  width: 51px;
  display: inline-block;
  box-sizing: border-box;
  padding: 4px 0;
  color: #fff;
  background-color: #f5f5f5;
  border-left: 1px solid #ccc;
  border-right: 1px solid #ccc;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background-image: linear-gradient(to bottom, #fff, #e6e6e6);
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
}
.inner-on .right,
.inner-off .right {
  width: 50px;
  color: #fff;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
  background: #f9a123;
  text-align: center;
  display: inline-block;
  padding: 4px 0;
}

/* ============================================
   主题切换按钮（基于 Semantic UI dropdown）
   ============================================ */
#theme-dropdown .menu .item {
  display: flex !important;
  align-items: center;
  gap: 6px;
}
#theme-dropdown .menu .item.current {
  color: var(--accent) !important;
  font-weight: 600 !important;
}
#theme-dropdown .menu .header {
  font-size: 0.78rem !important;
  text-transform: none !important;
  letter-spacing: 0.04em;
}

/* ============================================
   IDE 主题系统（4 风格 × 2 模式 = 8 主题）
   - 经典 (Classic) / 唐 (Tang) / 宋 (Song) / 晋 (Jin)
   - 黑 (Dark) / 白 (Light)
   - 通过 :root[data-theme] 切换
   ============================================ */

/* 经典 · 深色（默认，保持原设计） */
:root,
:root[data-theme="classic-dark"] {
  --body-bg: #1e1e1e;
  --body-bg-image: url(../images/judge0_background.png);
  --nav-bg: #1e1e1e;
  --nav-text: #ffffff;
  --nav-border: rgba(255, 255, 255, 0.08);
  --footer-bg: #0e6eb8;
  --footer-text: #ffffff;
  --footer-link: #41a5f1;
  --footer-link-hover: #a0d2f8;
  --accent: #41a5f1;
  --hover-bg: rgba(255, 255, 255, 0.08);
  --menu-bg: #2d2d2d;
  --menu-text: #e0e0e0;
  --menu-header: #909090;
  --danger: #db2828;
  --semantic-border: rgba(255, 255, 255, 0.1);
  --btn-text: #ffffff;
}

/* 经典 · 浅色 */
:root[data-theme="classic-light"] {
  --body-bg: #f5f5f5;
  --body-bg-image: none;
  --nav-bg: #ffffff;
  --nav-text: #1a1a1a;
  --nav-border: rgba(0, 0, 0, 0.1);
  --footer-bg: #0e6eb8;
  --footer-text: #ffffff;
  --footer-link: #0e6eb8;
  --footer-link-hover: #41a5f1;
  --accent: #0e6eb8;
  --hover-bg: rgba(0, 0, 0, 0.05);
  --menu-bg: #ffffff;
  --menu-text: #1a1a1a;
  --menu-header: #707070;
  --danger: #db2828;
  --semantic-border: rgba(0, 0, 0, 0.1);
  --btn-text: #ffffff;
}

/* ────────────────────────────────────────────
   唐 Tang — 盛唐宫廷：金(gold) 主色 · 朱砂(vermillion) 点缀 · 墨(ink) 中性
   依据设计方案 tang/colors_and_type.css 的精确色阶
   ──────────────────────────────────────────── */

/* 唐 · 黑（墨底 · 明金 · 深朱页脚） */
:root[data-theme="tang-dark"] {
  --body-bg: #141210;            /* ink 底 */
  --body-bg-image: none;
  --nav-bg: #1E1C18;             /* surface：较底色微亮，形成导航层次 */
  --nav-text: #F5F0E6;           /* ink-50 */
  --nav-border: #3A3630;         /* dark border */
  --footer-bg: #7E231A;          /* vermillion-700 深朱页脚 */
  --footer-text: #F5F0E6;
  --footer-link: #E5B830;        /* gold-400 */
  --footer-link-hover: #F0CC52;  /* gold-300 */
  --accent: #E5B830;             /* gold-400 主强调 */
  --hover-bg: rgba(229, 184, 48, 0.14);
  --menu-bg: #1E1C18;
  --menu-text: #F5F0E6;
  --menu-header: #A89F90;        /* ink-300 */
  --danger: #D4574B;             /* vermillion-400 */
  --semantic-border: rgba(229, 184, 48, 0.22);
  --btn-text: #1A1612;
  font-family: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
}

/* 唐 · 白（宣纸暖白 · 沉金 · 朱砂页脚） */
:root[data-theme="tang-light"] {
  --body-bg: #F5F0E6;            /* ink-50 宣纸暖白 */
  --body-bg-image: none;
  --nav-bg: #FDFBF5;             /* card 最浅面，导航微微浮起 */
  --nav-text: #1A1612;           /* ink-900 */
  --nav-border: #D1C8B5;         /* ink-200 */
  --footer-bg: #B5372B;          /* vermillion-500 朱砂页脚 */
  --footer-text: #FDF6E8;
  --footer-link: #F0CC52;        /* gold-300 在朱底上发光 */
  --footer-link-hover: #FDF0C4;  /* gold-100 */
  --accent: #A67C12;             /* gold-600：奶油底上更高对比 */
  --hover-bg: rgba(196, 152, 26, 0.10);
  --menu-bg: #FDFBF5;
  --menu-text: #1A1612;
  --menu-header: #7E7668;        /* ink-400 */
  --danger: #A83025;             /* error-600 */
  --semantic-border: rgba(196, 152, 26, 0.25);
  --btn-text: #1A1612;
  font-family: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
}

/* ────────────────────────────────────────────
   宋 Song — 文人雅致：靛青(indigo) 主色 · 青瓷(celadon) 点缀 · 陶土(clay)
   依据设计方案 song/colors_and_type.css
   ──────────────────────────────────────────── */

/* 宋 · 黑（暖墨底 · 靛青 · 青瓷页脚链接） */
:root[data-theme="song-dark"] {
  --body-bg: #1A1814;
  --body-bg-image: none;
  --nav-bg: #23201A;             /* surface */
  --nav-text: #E8E2D8;
  --nav-border: #35302A;
  --footer-bg: #33495F;          /* indigo-700 深靛页脚 */
  --footer-text: #E8E2D8;
  --footer-link: #8BA5CB;        /* indigo-300 */
  --footer-link-hover: #B5C7DF;  /* indigo-200 */
  --accent: #6384AE;             /* indigo-400 */
  --hover-bg: rgba(99, 132, 174, 0.14);
  --menu-bg: #282420;            /* card */
  --menu-text: #E8E2D8;
  --menu-header: #B0A898;
  --danger: #C5645D;             /* error-400 */
  --semantic-border: rgba(99, 132, 174, 0.20);
  --btn-text: #ffffff;
  font-family: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
}

/* 宋 · 白（宣纸米黄 · 靛青 · 青瓷点缀） */
:root[data-theme="song-light"] {
  --body-bg: #F7F3EC;
  --body-bg-image: none;
  --nav-bg: #FAF7F2;            /* popover 最浅面 */
  --nav-text: #2C2C2C;
  --nav-border: #D8CFBF;        /* warm-200 */
  --footer-bg: #4A6B8A;         /* indigo-500 */
  --footer-text: #F0EBE2;
  --footer-link: #ADD3CF;       /* celadon-200 */
  --footer-link-hover: #D5E8E6; /* celadon-100 */
  --accent: #4A6B8A;            /* indigo-500 */
  --hover-bg: rgba(74, 107, 138, 0.08);
  --menu-bg: #FAF7F2;
  --menu-text: #2C2C2C;
  --menu-header: #7A7268;
  --danger: #BC5650;           /* error-500 */
  --semantic-border: rgba(74, 107, 138, 0.20);
  --btn-text: #ffffff;
  font-family: 'Noto Serif SC', 'Songti SC', 'STSong', serif;
}

/* ────────────────────────────────────────────
   晋 Jin — 清简明快：青绿(teal) 主色 · 朱砂(cinnabar) 点缀 · 暖褐中性
   依据设计方案 jin/colors_and_type.css（无衬线正文字体）
   ──────────────────────────────────────────── */

/* 晋 · 黑（暖褐底 · 青绿 · 深青页脚） */
:root[data-theme="jin-dark"] {
  --body-bg: #3E3730;
  --body-bg-image: none;
  --nav-bg: #4A413A;            /* card：暖褐上层 */
  --nav-text: #F2ECE2;
  --nav-border: #5A4D42;
  --footer-bg: #336872;         /* teal-700 深青页脚 */
  --footer-text: #F2ECE2;
  --footer-link: #A0CAD1;       /* teal-300 */
  --footer-link-hover: #C6E0E4; /* teal-200 */
  --accent: #74B1BA;            /* teal-400 */
  --hover-bg: rgba(116, 177, 186, 0.14);
  --menu-bg: #4A413A;
  --menu-text: #F2ECE2;
  --menu-header: #D2C3B4;
  --danger: #E49484;            /* cinnabar-400 */
  --semantic-border: rgba(116, 177, 186, 0.20);
  --btn-text: #1A1612;
  font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* 晋 · 白（暖米底 · 青绿 · 纯白导航） */
:root[data-theme="jin-light"] {
  --body-bg: #F9F6F0;           /* neutral-50 */
  --body-bg-image: none;
  --nav-bg: #FFFFFF;            /* card 纯白，干净上浮 */
  --nav-text: #3E3730;          /* neutral-900 */
  --nav-border: #E4DACF;        /* neutral-200 */
  --footer-bg: #5298A3;         /* teal-500 */
  --footer-text: #F2ECE2;
  --footer-link: #F5D5CE;       /* cinnabar-200 暖色链接 */
  --footer-link-hover: #FFFFFF;
  --accent: #3F7F8C;            /* teal-600：米底上更高对比 */
  --hover-bg: rgba(82, 152, 163, 0.08);
  --menu-bg: #FFFFFF;
  --menu-text: #3E3730;
  --menu-header: #A28C76;       /* neutral-500 */
  --danger: #D74F4F;            /* error-600 */
  --semantic-border: rgba(82, 152, 163, 0.20);
  --btn-text: #ffffff;
  font-family: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* ============================================
   GoldenLayout 面板标签栏主题覆盖
   goldenlayout-dark-theme.css 硬编码了深色值，
   必须在浅色（及定制深色）主题中逐一覆盖
   ============================================ */

/* ── 经典 · 黑（保持深色，微调以匹配 VS Code）── */
:root[data-theme="classic-dark"] .lm_goldenlayout { background: #1e1e1e; }
:root[data-theme="classic-dark"] .lm_content      { background: #1e1e1e; }
:root[data-theme="classic-dark"] .lm_header       { background: #252526; }
:root[data-theme="classic-dark"] .lm_header .lm_tab,
:root[data-theme="classic-dark"] .lm_header .lm_tab:hover
                                           { background: #2d2d2d; color: #cccccc; }
:root[data-theme="classic-dark"] .lm_header .lm_tab.lm_active
                                           { background: #1e1e1e; color: #ffffff; }
:root[data-theme="classic-dark"] .lm_selected .lm_header { background-color: #094771; }

/* ── 经典 · 白 ── */
:root[data-theme="classic-light"] .lm_goldenlayout { background: #f0f0f0; }
:root[data-theme="classic-light"] .lm_content      { background: #f0f0f0; }
:root[data-theme="classic-light"] .lm_header       { background: #ececec; }
:root[data-theme="classic-light"] .lm_header .lm_tab,
:root[data-theme="classic-light"] .lm_header .lm_tab:hover
                                           { background: #ececec; color: #505050; }
:root[data-theme="classic-light"] .lm_header .lm_tab.lm_active
                                           { background: #ffffff; color: #1a1a1a; }
:root[data-theme="classic-light"] .lm_selected .lm_header { background-color: #007acc; }
:root[data-theme="classic-light"] .lm_splitter       { background: #d4d4d4; }
:root[data-theme="classic-light"] .lm_splitter:hover { background: #a0a0a0; opacity: 1; }

/* ── 唐 · 黑 ── */
:root[data-theme="tang-dark"] .lm_goldenlayout  { background: #141210; }
:root[data-theme="tang-dark"] .lm_content       { background: #141210; }
:root[data-theme="tang-dark"] .lm_header        { background: #1E1C18; }
:root[data-theme="tang-dark"] .lm_header .lm_tab,
:root[data-theme="tang-dark"] .lm_header .lm_tab:hover
                                            { background: #2A2820; color: #A89F90; }
:root[data-theme="tang-dark"] .lm_header .lm_tab.lm_active
                                            { background: #141210; color: #F5F0E6; }
:root[data-theme="tang-dark"] .lm_selected .lm_header { background-color: #7E231A; }

/* ── 唐 · 白 ── */
:root[data-theme="tang-light"] .lm_goldenlayout  { background: #EDE8DC; }
:root[data-theme="tang-light"] .lm_content       { background: #F5F0E6; }
:root[data-theme="tang-light"] .lm_header        { background: #EDE8DC; }
:root[data-theme="tang-light"] .lm_header .lm_tab,
:root[data-theme="tang-light"] .lm_header .lm_tab:hover
                                            { background: #EDE8DC; color: #8A7E6A; }
:root[data-theme="tang-light"] .lm_header .lm_tab.lm_active
                                            { background: #F5F0E6; color: #1A1612; }
:root[data-theme="tang-light"] .lm_selected .lm_header { background-color: #B5372B; }
:root[data-theme="tang-light"] .lm_splitter       { background: #D1C8B5; }
:root[data-theme="tang-light"] .lm_splitter:hover { background: #A89F90; opacity: 1; }
:root[data-theme="tang-light"] .lm_header .lm_controls > li::before { content: ""; }
:root[data-theme="tang-light"] .lm_dropTargetIndicator { box-shadow: inset 0 0 30px rgba(181,55,43,0.15); outline: 1px dashed #B5372B; }

/* ── 宋 · 黑 ── */
:root[data-theme="song-dark"] .lm_goldenlayout  { background: #1A1814; }
:root[data-theme="song-dark"] .lm_content       { background: #1A1814; }
:root[data-theme="song-dark"] .lm_header        { background: #23201A; }
:root[data-theme="song-dark"] .lm_header .lm_tab,
:root[data-theme="song-dark"] .lm_header .lm_tab:hover
                                            { background: #302B24; color: #B0A898; }
:root[data-theme="song-dark"] .lm_header .lm_tab.lm_active
                                            { background: #1A1814; color: #E8E2D8; }
:root[data-theme="song-dark"] .lm_selected .lm_header { background-color: #33495F; }

/* ── 宋 · 白 ── */
:root[data-theme="song-light"] .lm_goldenlayout  { background: #EEE8DF; }
:root[data-theme="song-light"] .lm_content       { background: #F7F3EC; }
:root[data-theme="song-light"] .lm_header        { background: #EEE8DF; }
:root[data-theme="song-light"] .lm_header .lm_tab,
:root[data-theme="song-light"] .lm_header .lm_tab:hover
                                            { background: #EEE8DF; color: #807565; }
:root[data-theme="song-light"] .lm_header .lm_tab.lm_active
                                            { background: #F7F3EC; color: #2C2C2C; }
:root[data-theme="song-light"] .lm_selected .lm_header { background-color: #4A6B8A; }
:root[data-theme="song-light"] .lm_splitter       { background: #D8CFBF; }
:root[data-theme="song-light"] .lm_splitter:hover { background: #B5A992; opacity: 1; }

/* ── 晋 · 黑 ── */
:root[data-theme="jin-dark"] .lm_goldenlayout  { background: #3E3730; }
:root[data-theme="jin-dark"] .lm_content       { background: #3E3730; }
:root[data-theme="jin-dark"] .lm_header        { background: #4A413A; }
:root[data-theme="jin-dark"] .lm_header .lm_tab,
:root[data-theme="jin-dark"] .lm_header .lm_tab:hover
                                            { background: #5A4D42; color: #D2C3B4; }
:root[data-theme="jin-dark"] .lm_header .lm_tab.lm_active
                                            { background: #3E3730; color: #F2ECE2; }
:root[data-theme="jin-dark"] .lm_selected .lm_header { background-color: #336872; }

/* ── 晋 · 白 ── */
:root[data-theme="jin-light"] .lm_goldenlayout  { background: #F2ECE2; }
:root[data-theme="jin-light"] .lm_content       { background: #F9F6F0; }
:root[data-theme="jin-light"] .lm_header        { background: #F2ECE2; }
:root[data-theme="jin-light"] .lm_header .lm_tab,
:root[data-theme="jin-light"] .lm_header .lm_tab:hover
                                            { background: #F2ECE2; color: #9A8E7E; }
:root[data-theme="jin-light"] .lm_header .lm_tab.lm_active
                                            { background: #F9F6F0; color: #3E3730; }
:root[data-theme="jin-light"] .lm_selected .lm_header { background-color: #5298A3; }
:root[data-theme="jin-light"] .lm_splitter       { background: #E4DACF; }
:root[data-theme="jin-light"] .lm_splitter:hover { background: #BCA694; opacity: 1; }

/* Semantic UI 颜色覆盖（部分需要 !important） */
:root .ui.inverted.menu {
  background: var(--nav-bg) !important;
  border: 1px solid var(--semantic-border) !important;
}
:root .ui.menu .item,
:root .ui.menu .item a {
  color: var(--nav-text) !important;
}
:root .ui.menu .item:hover,
:root .ui.menu a.item:hover {
  background: var(--hover-bg) !important;
  color: var(--accent) !important;
}

/* ── 下拉菜单（dropdown）── 覆盖 SUI 默认黑色文字 ── */
:root[data-theme] .ui.dropdown .menu {
  background: var(--menu-bg) !important;
  border: 1px solid var(--nav-border) !important;
  border-color: var(--nav-border) !important;
}
:root[data-theme] .ui.dropdown .menu,
:root[data-theme] .ui.dropdown .menu *,
:root[data-theme] .ui.dropdown .menu > .item,
:root[data-theme] .ui.dropdown .menu .item,
:root[data-theme] .ui.dropdown .menu .item span,
:root[data-theme] .ui.dropdown .menu .item i.icon,
:root[data-theme] .ui.dropdown .menu .header {
  color: var(--menu-text) !important;
}
:root[data-theme] .ui.dropdown .menu > .item:hover,
:root[data-theme] .ui.dropdown .menu .item:hover {
  background: var(--hover-bg) !important;
  color: var(--accent) !important;
}
/* 下拉触发器按钮的文字 */
:root[data-theme] .ui.dropdown > .text,
:root .ui.selection.dropdown > .text {
  color: var(--nav-text) !important;
}
:root .ui.button {
  background: var(--nav-bg) !important;
  color: var(--nav-text) !important;
  border: 1px solid var(--semantic-border) !important;
}
/* ============================================
   IDE 顶栏按钮：FAQ（次级 / outline）+ 运行（主操作 / primary）
   配色严格参照 design package 的 button 规范：
   - 运行按钮 = 实心 --accent（即各主题品牌主色 --color-primary）+ --btn-text
   - FAQ 按钮  = 透明底 + --accent 描边与文字（outline 风格）
   ============================================ */
:root[data-theme] #run-btn {
  background: var(--accent) !important;
  color: var(--btn-text) !important;
  border: 1px solid var(--accent) !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25) !important;
  transition: filter 0.15s, background 0.15s !important;
}
:root[data-theme] #run-btn:hover {
  filter: brightness(1.08) !important;
}
:root[data-theme] #run-btn:active {
  filter: brightness(0.95) !important;
}
:root[data-theme] #run-btn.loading {
  filter: brightness(0.92) !important;
  cursor: progress !important;
}
:root[data-theme] #faq-btn {
  background: transparent !important;
  color: var(--accent) !important;
  border: 1px solid var(--accent) !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  transition: background 0.15s, color 0.15s !important;
}
:root[data-theme] #faq-btn:hover {
  background: var(--hover-bg) !important;
  color: var(--accent) !important;
}
:root .ui.input > input {
  background: var(--nav-bg) !important;
  color: var(--nav-text) !important;
  border-color: var(--semantic-border) !important;
}
/* selection dropdown（语言选择等）文字色 */
:root .ui.selection.dropdown,
:root .ui.selection.dropdown > .text,
:root .ui.selection.dropdown .menu,
:root .ui.selection.dropdown .menu *,
:root .ui.selection.dropdown .menu > .item,
:root .ui.selection.dropdown .menu .item {
  background-color: var(--nav-bg);
  color: var(--nav-text) !important;
}
:root .ui.selection.dropdown .menu {
  background-color: var(--menu-bg) !important;
}
:root .ui.modal {
  background: var(--menu-bg) !important;
  color: var(--menu-text) !important;
}
:root .ui.modal .header,
:root .ui.modal .content {
  color: var(--menu-text) !important;
  background: var(--menu-bg) !important;
}
:root .ui.modal .input input {
  background: var(--nav-bg) !important;
  color: var(--nav-text) !important;
  border-color: var(--semantic-border) !important;
}