:root{
--ink:#252627;
--muted:#65686b;
--line:#d9dcdd;
--paper:#f5f6f6;
--white:#fff;
--signal:#b47b1b;
--signal-dark:#80550e;
--graphite:#303437;
font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,Helvetica,sans-serif}

*{
box-sizing:border-box}
html{
scroll-behavior:smooth}
body{
margin:0;
color:var(--ink);
background:#fff;
line-height:1.7}
a{
color:inherit;
text-decoration:none}
img{
display:block;
max-width:100%;
height:auto}
button{
font:inherit}
.shell{
width:min(1160px,calc(100% - 40px));
margin:auto}

.header{
position:sticky;
top:0;
z-index:30;
background:rgba(255,255,255,.96);
border-bottom:1px solid var(--line);
backdrop-filter:blur(10px)}
.header-shell{
width:min(1160px,calc(100% - 40px));
height:72px;
margin:auto;
display:flex;
align-items:center;
gap:28px}
.identity{
display:flex;
align-items:center;
gap:10px;
font-weight:800}
.identity img{
width:40px;
height:40px;
border-radius:50%}
.nav{
margin-left:auto;
display:flex;
gap:8px}
.nav a{
padding:9px 14px;
color:#555a5c;
border-radius:4px}
.nav a.on,.nav a:hover{
color:var(--signal-dark);
background:#fbf3e5}
.header-actions{
display:flex;
align-items:center;
gap:8px}
.header-actions>a{
padding:9px 14px;
border:1px solid var(--line);
border-radius:4px;
font-size:14px;
font-weight:700}
.header-actions .solid{
color:#fff;
background:var(--graphite);
border-color:var(--graphite)}
.menu{
display:none;
width:42px;
height:42px;
padding:9px;
background:#fff;
border:1px solid var(--line);
border-radius:4px}
.menu i{
display:block;
height:2px;
margin:4px 0;
background:var(--ink)}

.hero{
background:var(--paper);
border-bottom:1px solid var(--line)}
.hero-shell{
width:min(1160px,calc(100% - 40px));
min-height:650px;
margin:auto;
padding:48px 0 42px;
display:grid;
grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr);
gap:78px;
align-items:center}
.hero-label{
color:var(--signal-dark);
font-size:12px;
font-weight:800}
.hero-label span{
display:inline-grid;
width:28px;
height:28px;
margin-right:8px;
place-items:center;
color:#fff;
background:var(--signal);
border-radius:50%}
h1,h2,h3,p{
margin-top:0}
.hero h1{
max-width:690px;
margin:14px 0 18px;
font-size:clamp(40px,4.4vw,61px);
line-height:1.14}
.hero-content>p{
max-width:650px;
color:#555b5d;
font-size:16px}
.action-row{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-top:24px}
.action-row a{
min-width:126px;
padding:11px 20px;
border:1px solid #bfc4c6;
border-radius:4px;
text-align:center;
font-weight:800}
.action-row .primary{
color:#fff;
background:var(--signal);
border-color:var(--signal)}
.hero-ledger{
display:grid;
grid-template-columns:repeat(3,1fr);
margin-top:30px;
border-top:1px solid #cfd3d4}
.hero-ledger div{
padding:14px 12px 0 0}
.hero-ledger b,.hero-ledger span{
display:block}
.hero-ledger b{
color:var(--signal-dark);
font-size:11px}
.hero-ledger span{
font-size:13px;
font-weight:700}

.status-console{
padding:22px;
background:#fff;
border:1px solid #cfd3d4;
border-radius:6px;
box-shadow:0 22px 48px rgba(37,41,43,.11)}
.console-head{
display:grid;
grid-template-columns:54px 1fr auto;
gap:13px;
align-items:center;
padding-bottom:16px;
border-bottom:1px solid var(--line)}
.console-head img{
width:54px;
height:54px;
border-radius:50%}
.console-head strong,.console-head span{
display:block}
.console-head span{
color:var(--muted);
font-size:12px}
.console-head>i{
color:var(--signal-dark);
font-size:11px;
font-style:normal;
font-weight:800}
.status-dial{
position:relative;
width:200px;
height:200px;
margin:20px auto}
.status-dial svg{
width:100%;
height:100%;
transform:rotate(-90deg)}
.status-dial circle{
fill:none;
stroke:#e3e5e5;
stroke-width:7}
.status-dial .progress{
stroke:var(--signal);
stroke-dasharray:245 314;
stroke-linecap:round}
.status-dial>div{
position:absolute;
inset:0;
display:grid;
place-content:center;
text-align:center}
.status-dial b{
font-size:42px;
line-height:1}
.status-dial span{
color:var(--muted);
font-size:12px}
.command-list>div{
display:grid;
grid-template-columns:34px 1fr auto;
gap:10px;
padding:11px 0;
border-top:1px solid var(--line);
font-size:13px}
.command-list span{
color:var(--signal);
font-weight:800}
.command-list i{
color:var(--muted);
font-size:11px;
font-style:normal}
.status-console>p{
margin:12px 0 0;
color:var(--muted);
font-size:11px}

.section{
padding:82px 0}
.heading-row{
display:flex;
justify-content:space-between;
align-items:end;
gap:30px;
margin-bottom:30px}
.heading-row span{
color:var(--signal-dark);
font-size:11px;
font-weight:800}
.heading-row h2{
margin:4px 0 0;
font-size:34px;
line-height:1.2}
.heading-row>strong{
color:var(--muted);
font-size:13px}
.workflow{
background:#fff}
.workflow-ledger{
border-top:2px solid var(--graphite)}
.workflow-ledger article{
display:grid;
grid-template-columns:72px 1fr 120px;
gap:20px;
align-items:center;
padding:19px 0;
border-bottom:1px solid var(--line)}
.workflow-ledger article>b{
color:var(--signal);
font-size:13px}
.workflow-ledger h3{
margin:0 0 3px;
font-size:20px}
.workflow-ledger p{
margin:0;
color:var(--muted)}
.workflow-ledger article>span{
text-align:right;
color:#878b8c;
font-size:11px;
font-weight:800}

.categories{
background:var(--paper)}
.category-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:18px}
.category-grid article{
padding:25px;
background:#fff;
border:1px solid var(--line);
border-radius:5px}
.category-mark{
width:46px;
height:46px;
margin-bottom:34px;
display:grid;
place-items:center;
color:#fff;
background:var(--graphite);
border-radius:50%;
font-weight:800}
.category-grid article>span{
color:var(--signal-dark);
font-size:11px;
font-weight:800}
.category-grid h3{
margin:5px 0 10px;
font-size:23px}
.category-grid p{
color:var(--muted)}
.category-grid ul{
margin:20px 0 0;
padding:15px 0 0;
list-style:none;
border-top:1px solid var(--line)}
.category-grid li{
padding:5px 0;
font-size:13px}
.category-grid li::before{
content:"·";
margin-right:8px;
color:var(--signal);
font-weight:800}

.schematic{
background:#fff}
.schematic-grid{
display:grid;
grid-template-columns:minmax(390px,.95fr) 1.05fr;
gap:62px}
.schematic-panel{
min-height:440px;
padding:24px;
color:#eef0f1;
background:var(--graphite);
border-radius:6px;
display:flex;
flex-direction:column}
.schematic-top{
display:flex;
justify-content:space-between;
padding-bottom:15px;
border-bottom:1px solid rgba(255,255,255,.15)}
.schematic-top b{
color:#c7cacc;
font-size:11px}
.schematic-tabs{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:6px;
margin:18px 0}
.schematic-tabs i{
padding:8px;
border:1px solid rgba(255,255,255,.15);
font-size:12px;
font-style:normal;
text-align:center}
.schematic-tabs .active{
background:var(--signal);
border-color:var(--signal)}
.schematic-row{
display:grid;
grid-template-columns:40px 1fr auto;
gap:12px;
align-items:center;
padding:16px 0;
border-bottom:1px solid rgba(255,255,255,.12)}
.schematic-row em{
width:36px;
height:36px;
border-radius:50%}
.mark-one{
background:#c49a52}
.mark-two{
background:#737c82}
.schematic-row strong,.schematic-row small{
display:block}
.schematic-row small{
color:#bbc0c2}
.schematic-row>span{
color:#e3bf7e;
font-size:11px}
.schematic-footer{
margin-top:auto;
padding-top:16px;
display:flex;
justify-content:space-between;
gap:20px}
.schematic-footer span{
color:#bbc0c2;
font-size:12px}
.schematic-copy>div{
position:relative;
padding:0 0 28px 58px;
border-left:1px solid var(--line)}
.schematic-copy>div>span{
position:absolute;
left:-17px;
top:0;
width:34px;
height:34px;
display:grid;
place-items:center;
color:#fff;
background:var(--signal);
border-radius:50%;
font-size:11px;
font-weight:800}
.schematic-copy h3{
font-size:21px}
.schematic-copy p{
color:var(--muted)}

.risk-checks{
background:var(--paper)}
.risk-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:80px}
.risk-grid>div>p{
color:var(--muted)}
.risk-grid a{
color:var(--signal-dark);
font-weight:800}
.risk-grid dl{
margin:0;
border-top:2px solid var(--graphite)}
.risk-grid dl>div{
display:grid;
grid-template-columns:85px 1fr;
padding:14px 0;
border-bottom:1px solid var(--line)}
.risk-grid dt{
color:var(--signal-dark);
font-weight:800}
.risk-grid dd{
margin:0}
.questions{
background:#fff}
.question-row{
display:grid;
grid-template-columns:repeat(3,1fr);
border-top:1px solid var(--line);
border-left:1px solid var(--line)}
.question-row a{
min-height:150px;
padding:20px;
border-right:1px solid var(--line);
border-bottom:1px solid var(--line);
display:grid;
grid-template-columns:1fr auto}
.question-row span{
grid-column:1/-1;
color:var(--signal-dark);
font-size:11px;
font-weight:800}
.question-row b{
align-self:end}
.question-row i{
align-self:end;
color:var(--signal);
font-style:normal}
.download-section{
padding:46px 0;
color:#fff;
background:var(--graphite)}
.download-section>.shell{
display:flex;
align-items:center;
justify-content:space-between;
gap:30px}
.download-section span{
color:#c8ccce;
font-size:11px}
.download-section h2{
margin:4px 0 0;
font-size:28px}
.download-section .action-row{
margin:0}
.download-section .action-row a{
color:#fff;
border-color:#74797b}
.download-section .action-row .primary{
color:var(--graphite);
background:#fff;
border-color:#fff}
.footer{
background:#f0f1f1;
border-top:1px solid var(--line)}
.footer>.shell{
padding:26px 0;
color:var(--muted);
text-align:center;
font-size:13px}
.footer p{
margin:3px 0}

.manual-hero,.support-hero{
width:min(1160px,calc(100% - 40px));
min-height:350px;
margin:auto;
padding:56px 0;
display:grid;
grid-template-columns:1fr 260px;
gap:80px;
align-items:center}
.manual-title>span,.support-hero>div>span{
color:var(--signal-dark);
font-size:11px;
font-weight:800}
.manual-title h1,.support-hero h1{
max-width:760px;
margin:7px 0 14px;
font-size:clamp(36px,4vw,52px);
line-height:1.2}
.manual-title>p,.support-hero>div>p{
max-width:760px;
color:var(--muted)}
.manual-code{
padding:22px;
background:var(--paper);
border-left:4px solid var(--signal)}
.manual-code img{
width:64px;
height:64px;
margin-bottom:18px;
border-radius:50%}
.manual-code span,.manual-code b,.manual-code small{
display:block}
.manual-code span{
color:var(--signal-dark);
font-size:11px;
font-weight:800}
.manual-code b{
font-size:25px}
.manual-code small{
color:var(--muted)}

.manual-shell{
width:min(1080px,calc(100% - 40px));
margin:auto;
padding:65px 0 90px;
display:grid;
grid-template-columns:170px 1fr;
gap:70px}
.manual-shell>aside{
position:sticky;
top:100px;
align-self:start;
display:grid;
border-top:2px solid var(--graphite)}
.manual-shell>aside strong,.manual-shell>aside a{
padding:11px 0;
border-bottom:1px solid var(--line)}
.manual-shell>aside a{
color:var(--muted)}
.manual-content>section{
padding:0 0 45px}
.unit-head{
display:flex;
gap:10px;
color:var(--signal-dark);
font-size:11px}
.unit-head span{
font-weight:800}
.manual-content h2{
margin:9px 0 12px;
font-size:28px}
.manual-content p{
color:#52585a}
.manual-content ul{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:8px;
margin:18px 0 0;
padding:0;
list-style:none}
.manual-content li{
padding:10px;
background:var(--paper);
border:1px solid var(--line);
font-size:12px}
.manual-content a,.support-bottom a{
color:var(--signal-dark);
font-weight:800}
.manual-download,.support-bottom{
padding:24px;
background:var(--paper);
border:1px solid var(--line);
display:flex;
justify-content:space-between;
align-items:center;
gap:20px}
.manual-download strong,.manual-download span{
display:block}
.manual-download span{
color:var(--muted)}

.support-sequence{
padding:20px;
background:var(--paper);
border-top:3px solid var(--signal);
display:grid}
.support-sequence span{
padding:6px 0;
border-top:1px solid var(--line);
color:var(--muted)}
.support-shell{
width:min(960px,calc(100% - 40px));
margin:auto;
padding:58px 0 90px}
.support-toolbar{
display:flex;
gap:8px;
margin-bottom:18px}
.support-toolbar button{
padding:9px 17px;
background:#fff;
border:1px solid var(--line);
border-radius:4px;
cursor:pointer}
.support-toolbar button.active{
color:#fff;
background:var(--graphite);
border-color:var(--graphite)}
.entry{
border-top:1px solid var(--line)}
.entry.hidden{
display:none}
.entry>button{
width:100%;
min-height:76px;
padding:15px 3px;
display:grid;
grid-template-columns:110px 1fr 26px;
gap:12px;
align-items:center;
color:var(--ink);
background:transparent;
border:0;
text-align:left;
cursor:pointer}
.entry>button span{
color:var(--signal-dark);
font-size:11px;
font-weight:800}
.entry>button i{
font-size:22px;
font-style:normal;
transition:transform .2s}
.entry>div{
display:none;
padding:0 40px 20px 122px;
color:var(--muted)}
.entry>div p{
margin:0}
.entry.open>div{
display:block}
.entry.open>button i{
transform:rotate(45deg)}
.support-bottom{
margin-top:35px}
.support-bottom p{
margin:3px 0 0;
color:var(--muted)}

@media(max-width:900px){
.header-shell{
width:min(100% - 28px,740px)}
.nav,.header-actions>a{
display:none}
.header-actions{
margin-left:auto}
.menu{
display:block}
.nav.open{
display:grid;
position:absolute;
top:72px;
left:14px;
right:14px;
margin:0;
padding:10px;
background:#fff;
border:1px solid var(--line);
box-shadow:0 18px 40px rgba(30,34,35,.12)}
.nav.open a{
padding:11px}
.hero-shell{
width:min(100% - 32px,740px);
min-height:auto;
grid-template-columns:1fr;
gap:30px;
padding:42px 0 34px}
.hero-content{
order:1}
.status-console{
order:2}
.shell,.manual-hero,.support-hero,.manual-shell,.support-shell,.footer>.shell{
width:min(100% - 32px,740px)}
.section{
padding:62px 0}
.category-grid{
grid-template-columns:1fr}
.schematic-grid,.risk-grid{
grid-template-columns:1fr;
gap:35px}
.question-row{
grid-template-columns:1fr}
.download-section>.shell{
width:min(100% - 32px,740px)}
.manual-hero,.support-hero{
grid-template-columns:1fr;
gap:22px}
.manual-code,.support-sequence{
display:none}
.manual-shell{
grid-template-columns:1fr;
gap:28px}
.manual-shell>aside{
position:static;
grid-template-columns:repeat(3,1fr)}
.manual-shell>aside strong{
grid-column:1/-1}
}

@media(max-width:560px){
.header-shell{
height:66px}
.identity img{
width:38px;
height:38px}
.identity span{
font-size:14px}
.nav.open{
top:66px}
.hero-shell{
padding:25px 0 20px;
gap:16px}
.hero h1{
margin:9px 0 12px;
font-size:31px;
line-height:1.17}
.hero-content>p{
font-size:14px;
line-height:1.58}
.hero-ledger{
display:none}
.action-row{
margin-top:17px}
.action-row a{
flex:1}
.status-console{
padding:14px;
display:grid;
grid-template-columns:1fr 155px;
gap:12px}
.console-head{
grid-column:1/-1;
padding-bottom:10px}
.console-head img{
width:42px;
height:42px}
.status-dial{
width:130px;
height:130px;
margin:auto}
.status-dial b{
font-size:31px}
.command-list>div{
grid-template-columns:25px 1fr}
.command-list i{
display:none}
.status-console>p{
grid-column:1/-1;
margin:0}
.section{
padding:50px 0}
.heading-row{
align-items:start}
.heading-row h2{
font-size:29px}
.heading-row>strong{
display:none}
.workflow-ledger article{
grid-template-columns:46px 1fr}
.workflow-ledger article>span{
display:none}
.category-mark{
margin-bottom:20px}
.schematic-panel{
min-height:390px}
.schematic-copy>div{
padding-left:42px}
.risk-grid{
gap:28px}
.download-section>.shell,.manual-download,.support-bottom{
align-items:flex-start;
flex-direction:column}
.download-section .action-row,.manual-download .action-row,.support-bottom .action-row{
width:100%}
.manual-hero,.support-hero{
min-height:auto;
padding:40px 0}
.manual-title h1,.support-hero h1{
font-size:32px}
.manual-shell>aside{
grid-template-columns:1fr 1fr}
.manual-content ul{
grid-template-columns:1fr}
.support-toolbar{
overflow-x:auto}
.support-toolbar button{
white-space:nowrap}
.entry>button{
grid-template-columns:78px 1fr 20px}
.entry>div{
padding-left:90px;
padding-right:10px}
}


