:root { --navy:#1f4e79; --navy2:#315f88; --ink:#243447; --muted:#5b6b7b; --line:#dce6ee; --soft:#f4f8fb; --danger:#b43b3b; --ok:#1d7c59; --accent:#d9a621; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#eef3f7; font-family:system-ui,-apple-system,"Microsoft YaHei","Noto Sans CJK SC",sans-serif; }
.shell { max-width:1220px; margin:0 auto; padding:32px 20px 56px; }
.topbar { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; margin-bottom:24px; }.top-state{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}.eyebrow{color:#566d84;font-size:12px;letter-spacing:1.5px;font-weight:700}h1,h2,p{margin:0}h1{margin-top:6px;color:var(--navy);font-size:32px}h2{font-size:20px;color:var(--navy)}.subtitle{margin-top:8px;color:var(--muted)}
.state,.version,.nav-link{border:1px solid var(--line);border-radius:999px;padding:8px 13px;background:#fff;color:var(--muted);font-size:13px;white-space:nowrap}.version{padding:6px 10px;font-size:12px}.nav-link{padding:6px 11px;color:var(--navy);text-decoration:none}.nav-link:hover{border-color:var(--navy);background:#f4f8fb}.state.ok{color:var(--ok);border-color:#b9dfce;background:#f1fbf6}.state.warn{color:#966b00;border-color:#ead8a0;background:#fffaf0}.state.error{color:var(--danger);border-color:#edc5c5;background:#fff6f6}
.card{border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(31,78,121,.06);padding:24px;margin-top:18px}.section-heading{display:flex;gap:13px;align-items:flex-start}.step{display:grid;place-items:center;width:30px;height:30px;flex:0 0 30px;color:#fff;background:var(--navy);border-radius:50%;font-weight:700}.section-heading p{color:var(--muted);font-size:14px;margin-top:5px;line-height:1.5}.toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:19px}
button,.download{border:1px solid #b9cbd8;border-radius:8px;background:#fff;color:var(--navy);padding:9px 14px;font:inherit;cursor:pointer;text-decoration:none}button:hover,.download:hover{border-color:var(--navy2);background:#f4f8fb}button:disabled{cursor:not-allowed;opacity:.45}button.primary,.download{color:#fff;background:var(--navy);border-color:var(--navy)}button.primary:hover,.download:hover{background:var(--navy2)}button.danger{color:var(--danger);border-color:#e2b7b7;background:#fff7f7}button.danger:hover{background:#fff0f0}label{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px}select{min-width:340px;border:1px solid #b9cbd8;border-radius:8px;padding:9px;color:var(--ink);background:#fff}.notice{margin-top:14px;padding:11px 13px;border-radius:9px;background:var(--soft);color:var(--muted);font-size:14px}.table-status{display:flex;flex-wrap:wrap;gap:7px;margin-top:12px}.table-status span{border:1px solid var(--line);border-radius:999px;padding:5px 9px;color:#587087;font-size:12px}.muted{color:var(--muted);font-size:13px}
textarea{width:100%;resize:vertical;border:1px solid #cbd9e3;border-radius:10px;padding:13px;margin-top:15px;color:var(--ink);background:#fbfdff;font:14px/1.65 system-ui,-apple-system,"Microsoft YaHei","Noto Sans CJK SC",sans-serif}textarea:focus,select:focus{outline:2px solid #cfe0ed;border-color:var(--navy2)}.risk{min-height:280px}.evidence{margin-top:18px}.metric-preview{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.evidence-card{border:1px solid var(--line);border-radius:10px;padding:12px 13px;background:#f9fbfd}.evidence-card span{display:block;color:var(--muted);font-size:12px;margin-bottom:5px}.evidence-card strong{display:block;color:var(--navy);font-size:20px}.evidence-card small{display:block;color:#6b7785;margin-top:4px;font-size:12px}.figure-preview-head{display:flex;justify-content:space-between;align-items:end;gap:12px;margin:20px 0 10px}.figure-preview-head strong{color:var(--navy)}.figure-preview-head span{color:var(--muted);font-size:12px}.figure-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.figure-tile{margin:0;border:1px solid var(--line);border-radius:10px;padding:7px;background:#fff}.figure-tile img{display:block;width:100%;height:auto;border-radius:6px}.figure-tile figcaption{padding:6px 4px 2px;color:var(--muted);font-size:12px;text-align:center}
.preview-head{display:flex;align-items:center;justify-content:space-between;gap:20px}.preview-head h2{display:inline;margin-right:10px}iframe{display:block;width:100%;height:900px;margin-top:17px;border:1px solid var(--line);border-radius:10px;background:#e9eef3}.hidden{display:none!important}dialog{width:min(680px,calc(100vw - 28px));border:0;border-radius:16px;padding:0;box-shadow:0 22px 70px rgba(20,40,60,.28);color:var(--ink)}dialog::backdrop{background:rgba(24,42,60,.48);backdrop-filter:blur(2px)}#risk-form{padding:22px}.dialog-head{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:18px}.dialog-head p{color:var(--muted);font-size:13px;margin-top:5px}.icon-button{border:0;font-size:26px;line-height:1;padding:2px 8px;color:var(--muted)}fieldset{border:1px solid var(--line);border-radius:10px;margin:12px 0;padding:13px}legend{padding:0 6px;color:var(--navy);font-weight:700}.option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.option{display:flex;align-items:flex-start;gap:8px;border:1px solid #dce6ee;border-radius:8px;padding:10px;color:var(--ink);cursor:pointer}.option input{margin-top:3px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:18px}
.auth-card{max-width:560px;margin:80px auto 0}.auth-form{display:grid;gap:14px;margin-top:22px}.auth-form label{align-items:stretch}.auth-form input{width:100%;box-sizing:border-box;border:1px solid #b9cbd8;border-radius:8px;padding:10px;color:var(--ink);font:inherit}.auth-form input:focus{outline:2px solid #cfe0ed;border-color:var(--navy2)}
.access-card{max-width:720px;margin:60px auto 0}.request-code-box{margin-top:20px;border:1px solid #ead8a0;background:#fffaf0;border-radius:12px;padding:16px}.request-code-box span,.request-code-box small{display:block;color:#876d28;font-size:13px}.request-code-box strong{display:block;color:#6d5413;font:700 30px/1.2 ui-monospace,SFMono-Regular,Consolas,monospace;letter-spacing:2px;margin:6px 0}.request-code-box small{line-height:1.5}
.admin-table-wrap{overflow:auto;margin-top:18px;border:1px solid var(--line);border-radius:12px}.admin-table{width:100%;border-collapse:collapse;min-width:920px;background:#fff}.admin-table th,.admin-table td{padding:12px 13px;text-align:left;border-bottom:1px solid #edf1f4;vertical-align:middle;font-size:13px}.admin-table th{color:#526a7d;background:#f7fafc;font-weight:700}.admin-table tr:last-child td{border-bottom:0}.row-actions{display:flex;gap:6px;flex-wrap:wrap}.small-action{padding:6px 9px;font-size:12px}.user-badge{display:inline-block;border-radius:999px;padding:4px 8px;font-size:12px}.user-badge.pending{background:#fff5d9;color:#8b6811}.user-badge.active{background:#eaf8f1;color:#176744}.user-badge.disabled{background:#fff0f0;color:#a02e2e}.empty-cell{text-align:center!important;color:var(--muted);padding:30px!important}.compact-card{padding:18px 22px}.admin-help{margin-top:8px;color:var(--muted);font-size:13px;line-height:1.7}
.fieldset-note{margin:8px 0 0;font-size:12.5px}
@media(max-width:820px){.metric-preview{grid-template-columns:repeat(2,minmax(0,1fr))}.figure-gallery{grid-template-columns:1fr}}@media(max-width:720px){.shell{padding:20px 12px 40px}.topbar{display:block}.top-state{justify-content:flex-start;margin-top:16px}h1{font-size:27px}.card{padding:17px;border-radius:12px}select{min-width:0;width:100%}label{width:100%;align-items:flex-start;flex-direction:column}.toolbar{align-items:stretch}button,.download{text-align:center}.preview-head{align-items:flex-start;flex-direction:column}iframe{height:720px}.option-grid{grid-template-columns:1fr}.access-card{margin-top:20px}}

/* v2.2.7 independent editable sections */
.draft-section-label{display:block;margin-top:18px;font-size:15px;font-weight:650;color:var(--navy)}
.draft-section-label+textarea{margin-top:8px}.risk-advice{min-height:220px}

/* v2.2.9 P0 UX: step progress, unified status messages, layout and a11y fixes */
:root{--ok-ink:#17694a;--ok-bg:#eef8f3;--ok-line:#b9dfce;--warn-ink:#8a5a00;--warn-bg:#fff8e6;--warn-line:#ead8a0;--err-ink:#a32b2b;--err-bg:#fff4f4;--err-line:#e7b4b4;--focus:#2f6fb0}
/* Keyboard focus: one visible ring for every interactive control. */
:where(button,a,select,input,textarea,summary,[tabindex]):focus-visible{outline:3px solid var(--focus);outline-offset:2px}
textarea:focus-visible,select:focus-visible,.auth-form input:focus-visible{outline:3px solid var(--focus);outline-offset:1px}
.option:has(input:focus-visible),.module-option:has(input:focus-visible){outline:3px solid var(--focus);outline-offset:1px}
/* Empty status pills (e.g. version before /api/status) should not render as blank capsules. */
.version:empty,.state:empty{display:none}
/* Login: label above input instead of a squeezed one-character-per-line column. */
.auth-form label{flex-direction:column;align-items:stretch;gap:6px;color:var(--ink);font-weight:600}
.step-icon svg{display:block}
/* Mobile radio/checkbox rows: control and text stay on one line (risk dialog + report modules). */
.option,.module-option{flex-direction:row;align-items:flex-start}
.option:has(input:checked),.module-option:has(input:checked){border-color:var(--navy2);background:#f1f6fb}
/* Step progress: done / current / locked / error. */
.flow-card{position:relative;transition:border-color .2s,box-shadow .2s}
.step-hint{font-size:13px!important;margin-top:4px!important;color:var(--muted)}
.flow-card[data-step-state="current"]{border-color:#9fbbd3;box-shadow:0 0 0 3px rgba(47,111,176,.08),0 8px 24px rgba(31,78,121,.08)}
.flow-card[data-step-state="done"] .step{background:var(--ok-ink)}
.flow-card[data-step-state="done"] .step-hint{color:var(--ok-ink)}
.flow-card[data-step-state="locked"] .step{background:#fff;color:#5b6b7b;border:2px solid #b9c8d5}
.flow-card[data-step-state="locked"] h2{color:#4d5d6d}
.flow-card[data-step-state="error"]{border-color:var(--err-line)}
.flow-card[data-step-state="error"] .step{background:var(--err-ink)}
.flow-card[data-step-state="error"] .step-hint{color:var(--err-ink)}
/* Disabled buttons: readable, clearly inactive, not "washed out". */
button:disabled,button.primary:disabled{opacity:1;color:#4d5d6d;background:#e3eaf0;border-color:#d3dde6}
.reason{font-size:13px;color:var(--muted)}.reason:empty{display:none}
.reason::before{content:"ⓘ ";color:#7d8c9a}
/* Unified status messages (notify()). */
.msg{font-size:13px;color:var(--muted)}.msg:empty{display:none}
.msg[data-kind="busy"]{color:var(--navy2)}
.msg[data-kind="ok"]{color:var(--ok-ink)}
.msg[data-kind="warn"]{color:var(--warn-ink)}
.msg[data-kind="error"]{color:var(--err-ink);background:var(--err-bg);border:1px solid var(--err-line);border-radius:8px;padding:6px 10px;font-weight:600}
.notice{border-left:4px solid transparent}
.notice[data-kind="ok"]{color:var(--ok-ink);background:var(--ok-bg);border-left-color:var(--ok-ink)}
.notice[data-kind="busy"]{color:var(--navy2);border-left-color:var(--navy2)}
.notice[data-kind="warn"]{color:var(--warn-ink);background:var(--warn-bg);border-left-color:var(--warn-ink)}
.notice[data-kind="error"]{color:var(--err-ink);background:var(--err-bg);border-left-color:var(--err-ink);font-weight:600}
/* N1: downstream output may be stale after a failed reload. */
.stale-banner{display:flex;gap:10px;flex-wrap:wrap;align-items:baseline;margin-top:14px;padding:10px 13px;border:1px solid var(--warn-line);border-left:4px solid var(--warn-ink);border-radius:9px;background:var(--warn-bg);color:var(--warn-ink);font-size:13px;line-height:1.55}
.stale-banner strong{font-size:14px}
@media(prefers-reduced-motion:reduce){.flow-card{transition:none}}