/* ============================================================
   C++ 人话教程 · UI 主题库（HMOS NEXT 风格）
   深灰 / 浅蓝 双主题 · 无描边 · 大圆角
   本文件只含：变量 + 基础排版，组件样式见 components.css
   ============================================================ */

:root {
    --bg: #0e0e12; --card: #17171c; --card2: #1f1f26;
    --fg: #e8e8ec; --dim: #8f8f98;
    --acc: #007dff; --acc2: #66b2ff;
    --ok: #4cd1a1; --err: #ff6b6b;
    --prebg: #17171c; --codebg: #1f1f26;
    --prefg: #d6e6ff; --codefg: #7db4ff;
    --notebg: rgba(0,125,255,.08); --warnbg: rgba(255,107,107,.08);
    --h1fg: #ffffff; --row: rgba(255,255,255,.03);
    --shadow: 0 4px 20px rgba(0,0,0,.35);
    --btnbg: rgba(255,255,255,.14);
}

:root[data-theme="light"] {
    --bg: #eef3fb; --card: #ffffff; --card2: #f2f7ff;
    --fg: #1a2332; --dim: #5f6b7d;
    --acc: #007dff; --acc2: #0060cc;
    --ok: #0f9d6c; --err: #d13438;
    --prebg: #ffffff; --codebg: #e9f1fd;
    --prefg: #16233a; --codefg: #0060cc;
    --notebg: #e3f0ff; --warnbg: #ffecec;
    --h1fg: #0f1725; --row: rgba(26,35,50,.035);
    --shadow: 0 4px 20px rgba(31,58,96,.10);
    --btnbg: rgba(0,125,255,.12);
}

* { box-sizing: border-box; }

body {
    background: var(--bg);
    color: var(--fg);
    font-family: "HarmonyOS Sans SC", "Noto Sans CJK SC", "PingFang SC",
                 "Microsoft YaHei", sans-serif;
    line-height: 1.8;
    margin: 0;
    padding: 0 16px 60px;
}

.wrap { max-width: 920px; margin: 0 auto; }

header { padding: 96px 0 16px; margin-bottom: 24px; }

h1 { font-size: 1.7em; margin: 0 0 6px; color: var(--h1fg); font-weight: 600; }
h2 { font-size: 1.45em; color: var(--acc); padding-left: 12px;
     margin-top: 44px; font-weight: 600; }
h3 { font-size: 1.15em; color: var(--acc2); margin-top: 32px; }
p  { color: var(--fg); }
.dim { color: var(--dim); }
.ok { color: var(--ok); font-weight: bold; }
.err { color: var(--err); font-weight: bold; }

a { color: var(--acc); text-decoration: none; }
a:hover { color: var(--acc2); }

code {
    background: var(--codebg);
    padding: 2px 8px;
    border-radius: 8px;
    font-family: "JetBrains Mono", "Fira Code", monospace;
    font-size: .9em;
    color: var(--codefg);
}

footer {
    margin-top: 56px; padding-top: 16px;
    color: var(--dim); font-size: .9em;
}

hr { border: none; margin: 28px 0; }