/* ==========================================================================
   my-docs-site — AI科普 · 高年级（apps/ai-introduction/ai-teens-class.html）主题层
   --------------------------------------------------------------------------
   注入方式：build.py 依据 site.config.json → appsOverrides 命中该文件：
     - theme: "ai-teens-theme.css" → 注入本表
     - favicon: true               → 注入站点 favicon
     - siteBar: true               → 注入站点顶栏（返回 + 标题 + 明暗开关）
                                     （顶栏样式同时写在本表开头，参考 static/zgcm1-theme.css）

   这一页本来就**是**暗色霓虹（--bg #05070D + --neon #00E5A0），和站点默认主题
   同向，所以暗色不需要覆盖；本表反过来补一套**亮色**变体（[data-theme="light"]）：
   把霓虹调成深一些的可用色（保证白底上的对比度），写死的近黑面板换成浅色面板。
   ========================================================================== */

/* ===== 站点顶栏（与主站同款：返回 / 标题 / 明暗开关） ===== */
.hw-topbar{
  position:sticky;top:0;z-index:70;display:flex;align-items:center;gap:.6rem;
  padding:.5rem 1rem;background:rgba(11,16,32,.9);backdrop-filter:blur(10px);
  border-bottom:1px solid #24304f;
}
[data-theme="light"] .hw-topbar{background:rgba(247,249,252,.92);border-bottom-color:#dde4f0}
.hw-back{
  display:inline-grid;place-items:center;width:2rem;height:2rem;flex:none;
  color:#5eead4;background:rgba(94,234,212,.12);border:1px solid #24304f;
  border-radius:.55rem;text-decoration:none;font-size:1rem;transition:.15s;
}
.hw-back:hover{border-color:#5eead4}
[data-theme="light"] .hw-back{color:#0d9488;background:rgba(13,148,136,.1);border-color:#dde4f0}
.hw-title{font-weight:700;font-size:.95rem;color:#5eead4;letter-spacing:.02em}
[data-theme="light"] .hw-title{color:#0d9488}
.hw-spacer{flex:1}
.hw-theme{
  width:2.25rem;height:2.25rem;flex:none;display:inline-grid;place-items:center;
  background:transparent;color:#93a0bd;border:1px solid #24304f;border-radius:.55rem;
  font-size:1.05rem;cursor:pointer;transition:.15s;
}
.hw-theme:hover{color:#dbe3f4;border-color:#5eead4;background:rgba(94,234,212,.12)}
[data-theme="light"] .hw-theme{color:#5a6780;border-color:#dde4f0}
[data-theme="light"] .hw-theme:hover{color:#1a2233;border-color:#0d9488;background:rgba(13,148,136,.1)}

/* 页面自带 .topbar 也是 sticky:top:0 —— 给它让出站点顶栏的高度，避免两层叠在一起 */
[data-theme] .topbar{top:3.3rem}

/* ===== 亮色覆盖层 ===== */
[data-theme="light"]{
  --bg:#f7f9fc;
  --surface:#ffffff;
  --surface-2:#eef2f9;
  --line:rgba(26,34,51,.12);
  --line-str:rgba(26,34,51,.24);
  --neon:#0d9488;                       /* 站点青色：白底上仍够对比 */
  --neon-dim:rgba(13,148,136,.12);
  --cyan:#0369a1;
  --violet:#6d28d9;
  --err:#dc2626;
  --text:#1a2233;
  --body:#3b465e;
  --muted:#6b7899;
}

/* 写死的近黑「控制台/纸面」→ 浅色纸面 */
[data-theme="light"] .code,
[data-theme="light"] .plotbox,
[data-theme="light"] .readout,
[data-theme="light"] .tok-input,
[data-theme="light"] .pbody{background:#f4f7fb}
[data-theme="light"] .chip,
[data-theme="light"] .opt{background:#eef2f9}
[data-theme="light"] .topbar{background:rgba(247,249,252,.86)}
[data-theme="light"] .fabgroup{background:rgba(255,255,255,.92)}
[data-theme="light"] .terminal .bar i{background:#c3cbdd}

/* 稀疏网格 / 扫描线 / 进度槽：把「浅灰透明」换成「深灰透明」 */
[data-theme="light"] .bg-grid{
  background-image:
    linear-gradient(rgba(26,34,51,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(26,34,51,.05) 1px,transparent 1px);
}
[data-theme="light"] .bg-scan{opacity:.02}
[data-theme="light"] .progress-track{background:rgba(26,34,51,.08)}
[data-theme="light"] input[type=range]{background:rgba(26,34,51,.15)}
[data-theme="light"] .pbar{background:rgba(26,34,51,.14)}

/* 霓虹辉光在白底上是「糊」，去掉光晕；青色描边同步收深 */
[data-theme="light"] .hero h1 .glow,
[data-theme="light"] .readout .big{text-shadow:none}
[data-theme="light"] .card:hover{border-color:rgba(13,148,136,.45);box-shadow:0 8px 24px rgba(13,148,136,.10)}
[data-theme="light"] .chip.cjk{border-color:rgba(13,148,136,.45)}