:root {
  color-scheme: light dark;
  --bg:#f4f6f7; --surface:#fff; --text:#1c2226; --muted:#59656d;
  --line:#d4dce1; --gold:#ad841d; --green:#103d2c; --soft:#e8f3fb;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans TC",sans-serif;
}
@media (prefers-color-scheme:dark) { :root {
  --bg:#1f2325; --surface:#292e31; --text:#f5f3f7; --muted:#c1c8c4;
  --line:#4b5356; --gold:#d3ad45; --green:#123c2d; --soft:#17372d;
}}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:24px; }
body { margin:0; overflow-x:hidden; background:var(--bg); color:var(--text); font-size:17px; line-height:1.75; overflow-wrap:anywhere; }
a { color:var(--gold); font-weight:750; }
.sidebar { position:fixed; inset:0 auto 0 0; width:300px; padding:34px 26px; overflow:auto; background:#101914; color:#fff; border-right:1px solid #345143; z-index:20; }
.brand { display:block; color:#fff; text-decoration:none; font-size:28px; font-weight:950; letter-spacing:2px; }
.manual-name { color:#d3ad45; font-weight:850; margin:2px 0 28px; }
nav { display:grid; gap:2px; }
nav a { color:#cad3ce; text-decoration:none; padding:8px 10px; border-left:2px solid transparent; font-size:15px; }
nav a:hover, nav a:focus { color:#fff; background:#1d2b24; border-color:#d3ad45; }
.sidebar-actions { display:grid; gap:10px; padding-top:24px; margin-top:24px; border-top:1px solid #34443c; }
.sidebar-actions a { color:#fff; }
.app-link { display:block; padding:10px 13px; border:1px solid #d3ad45; text-decoration:none; }
main { margin-left:300px; width:min(980px,calc(100% - 348px)); padding:42px 0 64px; }
.hero { padding:clamp(26px,5vw,54px); background:linear-gradient(135deg,var(--green),#17221c); color:#fff; border-bottom:5px solid #d3ad45; }
.hero span { color:#d3ad45; font-size:13px; font-weight:900; letter-spacing:1.8px; }
.hero h1 { font-size:clamp(32px,6vw,54px); line-height:1.1; margin:16px 0; }
.hero p { color:#dbe5df; max-width:680px; margin:0; }
article { background:var(--surface); border:1px solid var(--line); padding:clamp(24px,6vw,64px); }
.manual-section { padding:0 0 34px; margin:0 0 34px; border-bottom:1px solid var(--line); }
.manual-section:last-child { border:0; }
h1,h2,h3 { line-height:1.3; }
article h1 { font-size:clamp(30px,5vw,44px); margin-top:0; }
h2 { border-left:5px solid var(--gold); padding-left:14px; margin-top:36px; }
h3 { margin-top:28px; }
p,li { max-width:780px; }
li { margin:7px 0; }
blockquote { margin:22px 0; padding:16px 20px; background:var(--soft); border-left:5px solid var(--gold); color:var(--muted); }
table { width:100%; border-collapse:collapse; overflow:auto; display:block; }
th,td { border:1px solid var(--line); padding:10px 12px; text-align:left; }
th { background:var(--soft); }
code { background:var(--soft); padding:2px 6px; }
img { max-width:100%; height:auto; }
footer { color:var(--muted); padding:28px 4px; font-size:14px; }
.mobile-header { display:none; }
@media (max-width:820px) {
  .mobile-header { display:flex; position:sticky; top:0; z-index:30; gap:14px; align-items:center; padding:14px 18px; background:#101914; color:#fff; border-bottom:2px solid #d3ad45; }
  .mobile-header strong { min-width:0; line-height:1.3; }
  .mobile-header button { flex:0 0 auto; border:1px solid #65736b; background:transparent; color:#fff; font-size:24px; width:46px; height:42px; }
  .sidebar { transform:translateX(-102%); transition:transform .2s ease; top:72px; width:min(330px,88vw); }
  .sidebar.open { transform:translateX(0); }
  main { margin:0; width:100%; padding:0; }
  article { border-left:0; border-right:0; }
  footer { padding-left:20px; padding-right:20px; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .sidebar { transition:none; } }