/* 客户门户 4 页共用。页面只需再写各自骨架区块 */
:root{--paper:#E7EBE6;--surface:#FBFCFA;--ink:#101A16;--ink-2:#3A4A43;--muted:#7C8A83;--line:#B9C4BC;--line-solid:#12352A;--brass:#A8801F;--brass-soft:#F0E4C4;--note:#1F5F8B;--note-soft:#DCEAF3;--off:#C9CFC9;--danger:#8A2B1F;--danger-soft:#F7E4E0;--ok:#2C5E4B;--ok-soft:#DDEAE3;--mono:ui-monospace,"SF Mono","JetBrains Mono",Menlo,Consolas,monospace;--sans:"Inter",system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;--r:2px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;font-family:var(--sans);background:var(--paper);background-image:linear-gradient(rgba(18,53,42,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(18,53,42,.045) 1px,transparent 1px);background-size:24px 24px;color:var(--ink);font-size:15px;line-height:1.6}
a{color:inherit}:focus-visible{outline:2px solid var(--brass);outline-offset:2px}
.toolbar{position:sticky;top:0;z-index:60;display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:8px 20px;background:var(--line-solid);color:#DFE7E1;font-family:var(--mono);font-size:11px;letter-spacing:.06em}
.toolbar b{color:#fff;font-weight:600}.toolbar .sep{color:#5C7A6D}
.tgl{margin-left:auto;display:inline-flex;align-items:center;gap:7px;background:none;border:1px solid #4A6A5C;color:#DFE7E1;font-family:var(--mono);font-size:11px;letter-spacing:.06em;padding:4px 10px;border-radius:var(--r);cursor:pointer}
.tgl:hover{background:#1B4436}.tgl .dot{width:7px;height:7px;border-radius:50%;background:var(--brass)}
body.notes-off .tgl .dot{background:#4A6A5C}
.nav{position:sticky;top:33px;z-index:50;background:var(--surface);border-top:1px solid var(--line);border-bottom:1px solid var(--line-solid)}
.nav-in{max-width:1180px;margin:0 auto;padding:0 20px;display:flex;align-items:center;gap:20px;min-height:58px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:9px;font-weight:600;text-decoration:none}
.logo .mark{width:26px;height:26px;border:1.5px solid var(--line-solid);border-radius:var(--r);display:grid;place-items:center;font-family:var(--mono);font-size:10px;color:var(--line-solid)}
.logo small{display:block;font-family:var(--mono);font-size:9.5px;color:var(--muted);letter-spacing:.08em;font-weight:400}
.pnav{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.pnav a{display:block;padding:7px 12px;text-decoration:none;font-size:13.5px;color:var(--ink-2);border-radius:var(--r)}
.pnav a:hover,.pnav a[aria-current]{background:var(--brass-soft);color:var(--ink);font-weight:600}
.nav-cta{margin-left:auto;display:flex;gap:8px;align-items:center}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px 80px}
.crumb{font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.05em;padding:16px 0 0}
.crumb a{text-decoration:none}.crumb a:hover{color:var(--ink)}
.banner{border:1px solid #DFC98A;background:var(--brass-soft);padding:10px 13px;font-size:13px;border-radius:var(--r);margin:16px 0 0}
.sec{position:relative;border:1.5px dashed var(--line);border-radius:var(--r);background:rgba(251,252,250,.72);padding:26px 24px 24px;margin:36px 0}
.sec::before{content:attr(data-ref);position:absolute;top:-11px;left:18px;background:var(--line-solid);color:#F2F6F2;font-family:var(--mono);font-size:10px;letter-spacing:.1em;padding:2px 8px;border-radius:var(--r)}
.sec.pri{border-style:solid;border-color:var(--line-solid);background:var(--surface)}
.sec.risk{border-style:solid;border-color:#C08A80;background:#FDF7F5}.sec.risk::before{background:var(--danger)}
.sec>h2{margin:2px 0 4px;font-size:19px;font-weight:600}
.sec>.role{font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.04em;margin:0 0 18px}
.tag{display:inline-block;vertical-align:2px;margin-left:8px;font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;padding:2px 7px;border-radius:var(--r);border:1px solid}
.t-p0{color:#8A2B1F;border-color:#D9A79F;background:#F7E4E0}
.st{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.06em;padding:2px 7px;border-radius:var(--r);border:1px solid}
.st-ok{color:var(--ok);border-color:#9DBFB0;background:var(--ok-soft)}
.st-run{color:var(--brass);border-color:#DFC98A;background:var(--brass-soft)}
.st-wait{color:var(--note);border-color:#A9C7D9;background:var(--note-soft)}
.st-off{color:var(--muted);border-color:var(--line);background:#E4E8E3}
.st-bad{color:var(--danger);border-color:#D9A79F;background:var(--danger-soft)}
.note{border-left:2px solid var(--note);background:var(--note-soft);padding:9px 13px;margin:14px 0 0;font-size:12.5px;color:#173F5C;line-height:1.55}
.note b{font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;display:block;margin-bottom:2px;color:var(--note)}
.note.red{border-left-color:var(--danger);background:var(--danger-soft);color:#5E1D14}.note.red b{color:var(--danger)}
body.notes-off .note{display:none}
.ph{border:1px dashed var(--line);background:repeating-linear-gradient(135deg,transparent,transparent 7px,rgba(18,53,42,.05) 7px,rgba(18,53,42,.05) 8px);border-radius:var(--r);display:grid;place-items:center;font-family:var(--mono);font-size:11px;color:var(--muted);text-align:center;padding:12px}
.ph.h-sm{min-height:48px}.ph.h-md{min-height:90px}
.grid{display:grid;gap:12px}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:860px){.g2,.g3,.g4{grid-template-columns:1fr}}
.card{border:1px solid var(--line);background:var(--surface);border-radius:var(--r);padding:14px;text-decoration:none;display:block}
.card h3{margin:0 0 4px;font-size:14.5px}
.card .en{font-family:var(--mono);font-size:10.5px;color:var(--brass);display:block;margin-bottom:6px}
.card p{margin:0;font-size:12.5px;color:var(--ink-2)}
.btn{display:inline-block;padding:8px 15px;border-radius:var(--r);text-decoration:none;font-size:13px;font-weight:500;border:1.5px solid var(--line-solid)}
.btn-ghost{background:transparent;color:var(--line-solid)}.btn-ghost:hover{background:var(--brass-soft)}
.btn-brass{background:var(--brass);border-color:var(--brass);color:#fff}.btn-brass:hover{background:#8F6C16}
.btn-lg{padding:12px 18px;font-size:14px}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}
.chip{display:inline-block;padding:5px 10px;border:1px solid var(--line);border-radius:var(--r);font-size:12.5px;text-decoration:none;color:var(--ink-2)}
.chip.on,.chip:hover{border-color:var(--line-solid);background:var(--brass-soft);color:var(--ink)}
table.t{width:100%;border-collapse:collapse;font-size:13px}
table.t th,table.t td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
table.t th{background:#DDE3DC;font-family:var(--mono);font-size:10.5px;letter-spacing:.06em;font-weight:600}
table.t .m{font-family:var(--mono);font-size:12px;color:var(--ink-2)}
table.t tr.dim td{color:var(--muted);background:#F3F5F3}
table.t tr.hi td,table.t th.hi{background:#FDF6E3}
table.t a{text-decoration:none}
table.t a:hover{text-decoration:underline}
ul.spec{list-style:none;margin:0;padding:0;font-size:13px}
ul.spec li{padding:6px 0;border-bottom:1px dotted var(--line);display:flex;justify-content:space-between;gap:14px}
ul.spec span{color:var(--muted);font-family:var(--mono);font-size:11px;text-align:right}
ul.chk{list-style:none;margin:0;padding:0;font-size:13px}
ul.chk li{padding:5px 0 5px 20px;position:relative}
ul.chk li::before{content:"▪";position:absolute;left:4px;color:var(--brass)}
ul.chk.no li::before{content:"×";color:var(--danger)}
.flow{display:flex;flex-wrap:wrap}
.flow .step{flex:1 1 110px;border:1px solid var(--line);background:var(--surface);padding:11px 12px}
.flow .step+.step{border-left:0}
.flow .step.done{border-color:var(--line-solid)}
.flow .step.on{background:var(--brass-soft);border-color:var(--brass)}
.flow .step.wait{opacity:.55}
@media(max-width:860px){.flow .step+.step{border-left:1px solid var(--line)}}
.flow .step em{font-family:var(--mono);font-style:normal;font-size:10px;color:var(--brass);display:block;letter-spacing:.08em}
.flow .step b{font-size:13px;font-weight:600;display:block;margin-top:2px}
.flow .step small{color:var(--muted);font-size:11.5px;display:block;margin-top:2px;line-height:1.45}
.field{margin:0 0 12px}
.field label{display:block;font-size:12.5px;font-weight:600;margin-bottom:4px}
.inp{border:1px solid var(--line);background:var(--surface);border-radius:var(--r);padding:8px 10px;font-family:var(--mono);font-size:11.5px;color:var(--muted);min-height:36px;display:flex;align-items:center}
.inp.ta{min-height:72px;align-items:flex-start}
.inp.sel::after{content:"▾";margin-left:auto}
.slotbox{border:1.5px dashed var(--line);border-radius:var(--r);background:var(--surface);padding:14px}
.slotbox h4{margin:0 0 2px;font-size:13.5px}
.slotbox .fmt{font-family:var(--mono);font-size:10.5px;color:var(--brass);display:block;margin-bottom:8px}
.slotbox .drop{border:1px dashed var(--line);padding:12px;text-align:center;font-family:var(--mono);font-size:11px;color:var(--muted)}
.opts{display:flex;flex-wrap:wrap;gap:7px}
.opt{border:1px solid var(--line);background:var(--surface);border-radius:var(--r);padding:8px 12px;font-size:12.5px;color:var(--ink-2)}
.opt.on{border-color:var(--line-solid);background:var(--brass-soft);color:var(--ink);font-weight:500}
.opt em{font-style:normal;font-family:var(--mono);font-size:10px;color:var(--muted);display:block;margin-top:2px}
.pager{display:flex;gap:8px;align-items:center;margin-top:14px;font-family:var(--mono);font-size:11px;color:var(--muted)}
.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}