/* GameTech 技术专栏统一外壳（插件）：顶栏 = “GameTech / 专栏名” + 站点自己的内容槽 + 首页/技术专栏▾/工作 + 深浅色按钮。
   所有专栏站点都引用这一份（托管在 byte888.com），配合同目录上一级的 nav.js 使用。
   用法见 gametech/README.md；Python 生成器直接用 gametech/shell.py。
   站点自己的样式用 --gt-* 变量取统一的颜色，深浅色由 <html data-theme> 或系统设置决定。 */
:root {
  --gt-bg: #f4f5f0; --gt-panel: #fbfbf8; --gt-sunk: #eceee6; --gt-fg: #1d2620; --gt-text: #2a332d; --gt-muted: #67716a;
  --gt-line: #dde1d8; --gt-line-strong: #c7cdc2; --gt-accent: #35644a; --gt-accent-2: #4a7d61; --gt-accent-soft: rgba(53, 100, 74, .1);
  --gt-warm: #b4673a;
  --gt-serif: "Songti SC", "STSong", "Noto Serif SC", "Source Han Serif SC", serif;
  --gt-sans: -apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  --gt-top-h: 56px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --gt-bg: #0f1310; --gt-panel: #151a16; --gt-sunk: #0c0f0d; --gt-fg: #e2e7e1; --gt-text: #c9d1ca; --gt-muted: #8e988f;
    --gt-line: #283029; --gt-line-strong: #3a443b; --gt-accent: #8dbf9f; --gt-accent-2: #6fa384; --gt-accent-soft: rgba(141, 191, 159, .12);
    --gt-warm: #d9925f;
  }
}
:root[data-theme="dark"] {
  --gt-bg: #0f1310; --gt-panel: #151a16; --gt-sunk: #0c0f0d; --gt-fg: #e2e7e1; --gt-text: #c9d1ca; --gt-muted: #8e988f;
  --gt-line: #283029; --gt-line-strong: #3a443b; --gt-accent: #8dbf9f; --gt-accent-2: #6fa384; --gt-accent-soft: rgba(141, 191, 159, .12);
  --gt-warm: #d9925f;
}

.gt-topbar { position: sticky; top: 0; z-index: 30; height: var(--gt-top-h); display: flex; align-items: center; gap: 14px;
  padding: 0 20px; box-sizing: border-box; background: color-mix(in srgb, var(--gt-bg) 92%, transparent); backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--gt-line); font: 14.5px/1.5 var(--gt-sans); color: var(--gt-fg); }
.gt-topbar a { text-decoration: none; }
.gt-menu-btn { display: none; flex: none; background: none; border: 1px solid var(--gt-line); border-radius: 8px; width: 34px; height: 34px; cursor: pointer; color: var(--gt-fg); font-size: 16px; }
.gt-back { flex: none; display: inline-grid; place-items: center; width: 34px; height: 34px; padding: 0; background: none; border: 1px solid var(--gt-line); border-radius: 8px; cursor: pointer; color: var(--gt-fg); }
.gt-back:hover { border-color: var(--gt-accent); color: var(--gt-accent); }
.gt-crumbs { display: flex; align-items: baseline; gap: 8px; white-space: nowrap; font-family: var(--gt-serif); flex: none; }
.gt-crumbs .gt-home { color: var(--gt-muted); font-size: 15px; letter-spacing: .04em; }
.gt-crumbs .gt-home:hover { color: var(--gt-fg); }
.gt-crumbs .gt-sep { color: var(--gt-line-strong); }
.gt-crumbs .gt-title { color: var(--gt-fg); font-size: 17px; font-weight: 600; letter-spacing: .04em; }
/* 站点自己的内容槽（搜索框、目录链接等），占满中间空间 */
.gt-slot { flex: 1; min-width: 0; display: flex; align-items: center; gap: 18px; }
.gt-slot > a { color: var(--gt-muted); font-size: 14px; white-space: nowrap; }
.gt-slot > a:hover { color: var(--gt-accent); }

/* 导航：首页 / 技术专栏▾（nav.js 插入）/ 工作 */
.gt-topbar .tabs { display: flex; gap: 2px; flex-shrink: 0; }
.gt-topbar .tabs a { white-space: nowrap; color: var(--gt-muted); font-size: 14.5px; padding: 4px 12px; border-radius: 999px; display: inline-flex; align-items: center; gap: 4px; line-height: 1.6; }
.gt-topbar .tabs a:hover { color: var(--gt-fg); }
.gt-topbar .tabs a[aria-current="page"] { color: var(--gt-accent); background: var(--gt-accent-soft); }
.gt-topbar .lock { width: .8em; height: .8em; flex: none; }
.gt-topbar .tab-menu { position: relative; display: inline-flex; }
.gt-topbar .tab-menu .caret { width: .85em; height: .85em; opacity: .7; }
.gt-topbar .tab-drop { display: none; position: absolute; top: 100%; right: 0; z-index: 40; min-width: 15rem; padding: 6px; margin-top: 4px; background: var(--gt-panel); border: 1px solid var(--gt-line); border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,.14); }
.gt-topbar .tab-menu::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 8px; }
.gt-topbar .tab-menu:hover .tab-drop, .gt-topbar .tab-menu.open .tab-drop, .gt-topbar .tab-menu:focus-within .tab-drop { display: block; }
.gt-topbar .tab-drop a { display: block; padding: 8px 12px; border-radius: 8px; color: var(--gt-fg); white-space: normal; line-height: 1.5; }
.gt-topbar .tab-drop a:hover, .gt-topbar .tab-drop a.on { background: var(--gt-accent-soft); }
.gt-topbar .tab-drop a.on b { color: var(--gt-accent); }
.gt-topbar .tab-drop a b { display: block; font-weight: 600; font-size: 14px; }
.gt-topbar .tab-drop a small { display: block; color: var(--gt-muted); font-size: 12px; line-height: 1.4; }
.gt-topbar .tab-drop a.all { color: var(--gt-muted); font-size: 12.5px; border-top: 1px solid var(--gt-line); border-radius: 0 0 8px 8px; margin-top: 4px; }
.gt-topbar .tab-drop a.mob { display: none; color: var(--gt-muted); font-size: 13px; padding: 7px 12px; }
.gt-topbar .tab-drop a.mob.first { border-top: 1px solid var(--gt-line); border-radius: 0; margin-top: 4px; }
.gt-topbar .theme-btn { flex: none; background: none; border: 1px solid var(--gt-line); border-radius: 8px; width: 34px; height: 34px; cursor: pointer; color: var(--gt-fg); font-size: 15px; line-height: 1; }
.gt-topbar .theme-btn:hover { border-color: var(--gt-accent); }

@media (max-width: 960px) {
  .gt-menu-btn { display: inline-grid; place-items: center; }
  .gt-crumbs .gt-home, .gt-crumbs .gt-sep { display: none; }
  /* 手机上一行要放下 返回 / 目录 / 专栏名 / 技术专栏 / 深浅色：收紧间距，专栏名太长就省略 */
  .gt-topbar { padding: 0 10px; gap: 8px; }
  .gt-back, .gt-menu-btn, .gt-topbar .theme-btn { width: 32px; height: 32px; }
  .gt-crumbs { flex: 0 1 auto; min-width: 0; }
  .gt-crumbs .gt-title { font-size: 15px; letter-spacing: .02em; overflow: hidden; text-overflow: ellipsis; }
  .gt-topbar .tabs .tab-menu-btn { padding: 4px 9px; font-size: 13.5px; }
  .gt-slot > a { display: none; }
  .gt-topbar .tab-drop a.mob { display: block; }
  .gt-topbar .tabs > a { display: none; }   /* 只藏顶层的“首页 / 工作”，下拉里的专栏链接要留着 */
}

/* 广告位（nav.js 按 ADS 配置填充；未配置时完全不显示） */
.gt-ad { display: none; }
.gt-ad.on { display: block; margin: 32px auto; max-width: 860px; padding-top: 18px; border-top: 1px solid var(--gt-line); text-align: center; }
.gt-ad.on::before { content: "广告"; display: block; font: 11px var(--gt-sans); color: var(--gt-muted); letter-spacing: .2em; margin-bottom: 6px; }
/* 页脚里的“关于 / 联系 / 隐私政策” */
.gt-foot-links a { margin-right: 10px; }