:root{
  --bg0:#090807;
  --bg1:#110E0C;
  --bg2:#171310;
  --bg3:#1E1814;
  --line:rgba(255,140,60,.14);
  --line2:rgba(255,255,255,.07);
  --text:#F6EFE8;
  --muted:#A89B90;
  --orange:#FF6A1A;
  --orange2:#FF8A3D;
  --ember:#E0391A;
  --good:#3DDC97;
  --code:#0C0A09;
  --radius:16px;
  --font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Cascadia Code", monospace;
  --nav-h:64px;
  --side-w:240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0; font-family:var(--font); color:var(--text);
  background:
    radial-gradient(900px 420px at 0% 0%, rgba(255,106,26,.14), transparent 55%),
    radial-gradient(700px 380px at 100% 0%, rgba(224,57,26,.10), transparent 50%),
    linear-gradient(180deg, var(--bg0), var(--bg1));
  min-height:100vh;
}
a{color:var(--orange2); text-decoration:none}
a:hover{text-decoration:underline}
code, kbd{
  font-family:var(--mono); font-size:.92em;
  background:rgba(255,106,26,.10);
  border:1px solid rgba(255,140,60,.16);
  border-radius:6px; padding:.1em .35em; color:#FFD7B0;
}
img{display:block; max-width:100%}

.topnav{
  position:sticky; top:0; z-index:50; height:var(--nav-h);
  display:flex; align-items:center;
  backdrop-filter: blur(14px);
  background:rgba(9,8,7,.78);
  border-bottom:1px solid var(--line2);
}
.topnav-inner{
  width:min(1200px, calc(100% - 32px)); margin:0 auto;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.brand{display:flex; align-items:center; gap:10px; color:var(--text); font-weight:700; text-decoration:none}
.brand:hover{text-decoration:none}
.brand img{width:32px; height:32px}
.brand-badge{
  margin-left:6px; font-size:11px; font-weight:600; color:var(--orange2);
  border:1px solid var(--line); border-radius:999px; padding:3px 8px;
  background:rgba(255,106,26,.08);
}
.top-actions{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius:999px; padding:9px 14px; font-size:13px; font-weight:650;
  border:1px solid transparent; cursor:pointer; transition:.18s ease; text-decoration:none !important;
}
.btn-primary{
  background:linear-gradient(135deg, var(--orange2), var(--orange) 55%, var(--ember));
  color:#1A0D08; box-shadow:0 8px 22px rgba(255,106,26,.25);
}
.btn-ghost{border-color:var(--line); color:var(--text); background:rgba(255,255,255,.03)}
.btn-ghost:hover{background:rgba(255,106,26,.08)}

.layout{
  width:min(1200px, calc(100% - 32px)); margin:0 auto;
  display:grid; grid-template-columns:var(--side-w) 1fr; gap:28px;
  padding:28px 0 64px;
}
@media (max-width:960px){
  .layout{grid-template-columns:1fr}
  .sidebar{position:relative !important; top:auto !important; max-height:none !important}
  .side-nav{display:flex; flex-wrap:wrap; gap:6px}
  .side-nav a{width:auto}
}

.sidebar{
  position:sticky; top:calc(var(--nav-h) + 16px);
  align-self:start; max-height:calc(100vh - var(--nav-h) - 32px); overflow:auto;
  padding:14px; border-radius:18px;
  background:rgba(255,255,255,.02);
  border:1px solid var(--line2);
}
.side-title{font-size:12px; color:var(--muted); letter-spacing:.08em; text-transform:uppercase; margin:0 0 10px}
.side-nav{display:flex; flex-direction:column; gap:4px}
.side-nav a{
  color:var(--muted); text-decoration:none; font-size:13.5px;
  padding:8px 10px; border-radius:10px; border:1px solid transparent;
}
.side-nav a:hover, .side-nav a.active{
  color:var(--text); background:rgba(255,106,26,.10); border-color:var(--line);
}

.content{min-width:0}
.hero-doc{
  padding:18px 20px; border-radius:20px; margin-bottom:22px;
  background:
    linear-gradient(135deg, rgba(255,106,26,.12), transparent 42%),
    var(--bg2);
  border:1px solid var(--line);
}
.hero-doc h1{margin:0 0 8px; font-size:clamp(28px,4vw,40px); letter-spacing:-.03em}
.hero-doc p{margin:0; color:var(--muted); line-height:1.7; max-width:760px}
.meta-pills{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px}
.pill{
  font-size:12px; color:#FFD7B0; border:1px solid var(--line); border-radius:999px;
  padding:5px 10px; background:rgba(0,0,0,.2);
}

section.doc-sec{
  scroll-margin-top:calc(var(--nav-h) + 18px);
  padding:8px 0 26px; border-bottom:1px solid var(--line2); margin-bottom:18px;
}
section.doc-sec:last-child{border-bottom:0}
.doc-sec h2{margin:0 0 10px; font-size:22px; letter-spacing:-.02em}
.doc-sec h3{margin:18px 0 8px; font-size:16px; color:#FFE1C8}
.doc-sec p, .doc-sec li{color:var(--muted); line-height:1.75}
.doc-sec ul{padding-left:1.2em}
.doc-sec strong{color:var(--text)}

.table-wrap{overflow:auto; border:1px solid var(--line2); border-radius:14px; margin:12px 0}
table{width:100%; border-collapse:collapse; font-size:13.5px}
th, td{padding:10px 12px; border-bottom:1px solid var(--line2); text-align:left; vertical-align:top}
th{color:#FFD7B0; background:rgba(255,106,26,.06); font-weight:650}
td{color:var(--text)}
tr:last-child td{border-bottom:0}

.callout{
  margin:12px 0; padding:12px 14px; border-radius:12px;
  border:1px solid var(--line); background:rgba(255,106,26,.07); color:#F0D2BC; font-size:13.5px; line-height:1.65;
}
.callout.warn{border-color:rgba(224,57,26,.35); background:rgba(224,57,26,.10)}

.codebox{
  position:relative; margin:12px 0 16px; border-radius:14px; overflow:hidden;
  border:1px solid var(--line2); background:var(--code);
}
.codebox .code-bar{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:8px 12px; border-bottom:1px solid var(--line2); color:var(--muted); font-size:12px;
}
.copy-btn{
  border:1px solid var(--line); background:rgba(255,255,255,.03); color:var(--text);
  border-radius:999px; padding:5px 10px; font-size:12px; cursor:pointer;
}
.copy-btn:hover{background:rgba(255,106,26,.12)}
pre{
  margin:0; padding:14px 14px 16px; overflow:auto;
  font-family:var(--mono); font-size:12.5px; line-height:1.65; color:#F0D2BC;
}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:12px}
@media (max-width:800px){.grid-2{grid-template-columns:1fr}}
.card{
  border:1px solid var(--line2); background:rgba(255,255,255,.02);
  border-radius:14px; padding:14px;
}
.card h3{margin:0 0 6px; font-size:15px; color:var(--text)}
.card p{margin:0; color:var(--muted); font-size:13.5px; line-height:1.65}

.footer{
  border-top:1px solid var(--line2); color:var(--muted); font-size:13px;
  padding:20px 0 36px;
}
.footer-inner{
  width:min(1200px, calc(100% - 32px)); margin:0 auto;
  display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap;
}
.footer a{color:var(--muted)}
.footer a:hover{color:var(--orange2)}

/* ===== 首页门面 home ===== */
body.xh-home .home-hero{
  width:min(1120px, calc(100% - 32px));
  margin:0 auto;
  padding:48px 0 56px;
  min-height:calc(100vh - var(--nav-h) - 90px);
  display:flex; align-items:center;
}
body.xh-home .home-grid{
  width:100%;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:28px;
  align-items:stretch;
}
@media (max-width:960px){
  body.xh-home .home-grid{grid-template-columns:1fr}
  body.xh-home .home-hero{padding-top:28px; align-items:flex-start}
}
body.xh-home .home-main{min-width:0}
body.xh-home .home-kicker{
  margin:0 0 10px; font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted);
}
body.xh-home .home-title{
  margin:0 0 14px;
  font-size:clamp(40px, 7vw, 64px);
  line-height:1.05;
  letter-spacing:-.04em;
  text-align:left;
  background:linear-gradient(135deg, #FFF6EE 10%, #FFB07A 45%, #FF6A1A 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-weight:800;
}
body.xh-home .home-lead{
  margin:0 0 22px; color:var(--muted); line-height:1.75; font-size:15.5px; max-width:560px;
}
body.xh-home .home-copy-card{
  border:1px solid var(--line);
  background:linear-gradient(180deg, rgba(30,24,20,.96), rgba(18,14,12,.98));
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 16px 40px rgba(0,0,0,.28);
  margin-bottom:16px;
}
body.xh-home .home-copy-bar{
  display:flex; justify-content:space-between; align-items:center; gap:10px;
  padding:12px 14px; border-bottom:1px solid var(--line2); color:#FFD7B0; font-size:13px; font-weight:650;
  background:rgba(255,106,26,.08);
}
body.xh-home .home-copy-btn{padding:8px 14px; font-size:13px}
body.xh-home .home-copy-pre{
  margin:0; padding:16px 16px 8px;
  font-family:var(--mono); font-size:13.5px; line-height:1.75; color:#FFE8D6;
  white-space:pre-wrap; word-break:break-all;
  background:transparent;
}
body.xh-home .home-copy-hint{
  margin:0; padding:0 16px 14px; color:var(--muted); font-size:12.5px; line-height:1.55;
}
body.xh-home .home-note{
  border:1px solid var(--line2); border-radius:16px; padding:14px 16px;
  background:rgba(255,255,255,.02); margin-bottom:18px;
}
body.xh-home .home-note strong{display:block; margin-bottom:6px; color:#FFE1C8}
body.xh-home .home-note p{margin:0 0 8px; color:var(--muted); line-height:1.7; font-size:13.5px}
body.xh-home .home-note-sub{margin:0 !important; font-size:13px !important}
body.xh-home .home-links{display:flex; flex-wrap:wrap; gap:10px}

body.xh-home .home-side{min-width:0}
body.xh-home .home-login-card{
  position:sticky; top:calc(var(--nav-h) + 18px);
  border:1px solid var(--line);
  background:linear-gradient(165deg, rgba(36,26,20,.98), rgba(16,12,10,.99));
  border-radius:20px;
  padding:22px 20px 18px;
  box-shadow:0 18px 48px rgba(0,0,0,.35);
}
body.xh-home .home-login-title{margin:0 0 6px; font-size:22px; color:var(--text); letter-spacing:-.02em}
body.xh-home .home-login-desc{margin:0 0 16px; color:var(--muted); font-size:13.5px; line-height:1.55}
body.xh-home .home-login-form{display:flex; flex-direction:column; gap:12px}
body.xh-home .home-field{display:flex; flex-direction:column; gap:6px; font-size:12.5px; color:#FFD7B0}
body.xh-home .home-field input{
  appearance:none; border:1px solid var(--line2); border-radius:12px;
  background:#120E0C; color:var(--text); padding:11px 12px; font-size:14px; outline:none;
}
body.xh-home .home-field input:focus{border-color:rgba(255,106,26,.55); box-shadow:0 0 0 3px rgba(255,106,26,.12)}
body.xh-home .home-login-submit{width:100%; padding:12px 14px; margin-top:4px; font-size:14px}
body.xh-home .home-logout-btn{width:100%; margin-top:10px}
body.xh-home .home-login-msg{min-height:1.2em; margin:4px 0 0; font-size:13px; color:var(--muted)}
body.xh-home .home-login-msg.err{color:#FF8A7A}
body.xh-home .home-login-msg.ok{color:var(--good)}
body.xh-home .home-login-foot{margin-top:14px; font-size:12.5px; color:var(--muted); text-align:center}
body.xh-home .home-logged .home-login-submit{display:flex}