/* EasyAI Work 用户手册 · 共享样式（由 docs/复盘文档/assets/review.css 派生） */
:root {
  --ink:#1a2630; --muted:#5f6f7b; --paper:#f4f6f8; --surface:#fff; --line:#d5dfe5;
  --nav:#152c40; --nav2:#1c4555; --blue:#176aa4; --teal:#087a70; --amber:#a3620a; --red:#b3352b; --green:#2f7d32;
  --code-bg:#ebf0f3; --code-ink:#8a3d26; --shadow:0 1px 3px rgba(20,40,60,.08);
  --svg-box:#eef5fa; --svg-box-line:#7ea6c2; --svg-life:#a9bccb; --svg-ink:#1f3140; --svg-sub:#5f7686;
  --svg-note:#fff8e1; --svg-note-line:#d8b65c; --svg-frame:#8aa0b0; --svg-tab:#e4ecf2;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink);
  font:15px/1.75 "PingFang SC","Microsoft YaHei UI","Microsoft YaHei","Noto Sans CJK SC",Arial,sans-serif; }
a { color:var(--blue); text-decoration:none; } a:hover { text-decoration:underline; }
h1,h2,h3,h4 { line-height:1.35; }
h2 { margin:0 0 16px; padding-bottom:10px; border-bottom:2px solid var(--nav); font-size:26px; }
h3 { margin:26px 0 8px; font-size:19px; color:var(--nav2); }
h4 { margin:18px 0 6px; font-size:16px; }
p { margin:8px 0 12px; }
code { padding:1px 5px; border-radius:3px; background:var(--code-bg); color:var(--code-ink);
  font:.88em "SF Mono",Menlo,Consolas,"Cascadia Mono",monospace; overflow-wrap:break-word; }
pre { overflow:auto; margin:12px 0; padding:14px 16px; border-radius:8px; background:#10212f; color:#dbe7ef;
  font:13px/1.6 "SF Mono",Menlo,Consolas,monospace; }
pre code { padding:0; background:none; color:inherit; }
ul,ol { margin:6px 0 12px; padding-left:22px; } li { margin:3px 0; }
table { width:100%; margin:10px 0 16px; border-collapse:collapse; background:var(--surface); font-size:13.5px; }
th,td { padding:9px 11px; border:1px solid var(--line); vertical-align:top; text-align:left; }
th { background:#e8eef2; color:var(--nav); font-weight:700; }
table.fixed { table-layout:fixed; } table.fixed td { word-break:break-word; }
td.nw, th.nw { white-space:nowrap; }

/* layout */
.layout { display:grid; grid-template-columns:260px minmax(0,1fr); min-height:100vh; }
.sidebar { position:sticky; top:0; height:100vh; overflow:auto; padding:22px 16px; background:var(--nav); color:#d8e6ee; }
.brand strong { display:block; font-size:17px; color:#fff; } .brand span { font-size:12px; color:#9fb9c8; }
.brand { padding-bottom:14px; margin-bottom:10px; border-bottom:1px solid rgba(255,255,255,.12); }
.toc a { display:block; padding:5px 9px; border-left:3px solid transparent; color:#cbe0ea; font-size:13.5px; border-radius:0 4px 4px 0; }
.toc a:hover { background:rgba(255,255,255,.07); text-decoration:none; }
.toc .grp { margin:14px 0 4px; font-size:11.5px; letter-spacing:.08em; color:#86a4b5; }
.toc a.cur { border-left-color:#5cc3b6; background:rgba(92,195,182,.12); color:#fff; }
.main { min-width:0; }
.hero { padding:54px max(34px,calc((100vw - 1250px)/2)) 44px; color:#fff; background:linear-gradient(127deg,#152c40,#155869); }
.hero h1 { margin:0 0 10px; font-size:32px; }
.hero p { margin:0; max-width:900px; color:#d3e5ee; }
.hero .meta { margin-top:14px; font-size:12.5px; color:#9fc3d2; }
.content { max-width:1250px; margin:0 auto; padding:30px 34px 70px; }
section { margin:0 0 44px; scroll-margin-top:14px; }

/* blocks */
.callout,.decision,.warning,.risk { margin:14px 0; padding:14px 18px; border-left:5px solid var(--blue); background:var(--surface);
  box-shadow:var(--shadow); border-radius:0 8px 8px 0; }
.decision { border-left-color:var(--teal); }
.warning { border-left-color:var(--amber); background:#fffaf0; }
.risk { border-left-color:var(--red); background:#fff5f4; }
.callout > :first-child,.decision > :first-child,.warning > :first-child,.risk > :first-child { margin-top:0; }
.callout > :last-child,.decision > :last-child,.warning > :last-child,.risk > :last-child { margin-bottom:0; }
.decision .k { display:inline-block; min-width:44px; font-weight:700; color:var(--teal); }
.grid2,.grid3 { display:grid; gap:16px; margin:12px 0; }
.grid2 { grid-template-columns:repeat(2,minmax(0,1fr)); } .grid3 { grid-template-columns:repeat(3,minmax(0,1fr)); }
.card { padding:14px 16px; background:var(--surface); border:1px solid var(--line); border-radius:8px; box-shadow:var(--shadow); }
.card h4 { margin:0 0 6px; color:var(--nav2); } .card p { margin:4px 0; font-size:14px; }
.card code { word-break:break-all; }
.tag { display:inline-block; padding:1px 8px; border-radius:999px; font-size:12px; font-weight:700; white-space:nowrap; }
.t-high { color:#fff; background:var(--red); } .t-mid { color:#fff; background:var(--amber); } .t-low { color:#fff; background:#6b7f8c; }
.t-ok { color:#fff; background:var(--green); } .t-plan { color:var(--nav2); background:#dde9f0; }
.src { font-size:12.5px; color:var(--muted); }
.src code { font-size:.95em; }

/* figures */
figure { margin:16px 0 22px; padding:14px 14px 10px; background:var(--surface); border:1px solid var(--line);
  border-radius:10px; box-shadow:var(--shadow); overflow-x:auto; }
figure svg { display:block; max-width:100%; height:auto; margin:0 auto; }
figure svg.seq { min-width:640px; }
figcaption { margin-top:8px; font-size:13px; color:var(--muted); text-align:center; }
figcaption b { color:var(--nav2); }

/* sequence diagram classes (seqsvg.py) */
.sq-box { fill:var(--svg-box); stroke:var(--svg-box-line); stroke-width:1.2; }
.sq-life { stroke:var(--svg-life); stroke-width:1.2; stroke-dasharray:4 4; }
.sq-p { font:600 12.5px "PingFang SC","Microsoft YaHei",sans-serif; fill:var(--svg-ink); }
.sq-ps { font:11px "SF Mono",Menlo,Consolas,monospace; fill:var(--svg-sub); }
.sq-t { font:12px "PingFang SC","Microsoft YaHei",sans-serif; fill:var(--svg-ink); }
.sq-m { stroke:#35556b; stroke-width:1.3; fill:none; }
.sq-head { fill:#35556b; } .sq-open { fill:none; stroke:#35556b; stroke-width:1.4; }
.sq-note { fill:var(--svg-note); stroke:var(--svg-note-line); }
.sq-nt { fill:#6a4d05; }
.sq-frame { fill:none; stroke:var(--svg-frame); stroke-width:1.1; }
.sq-tab { fill:var(--svg-tab); stroke:var(--svg-frame); stroke-width:1.1; }
.sq-ft { font:600 11.5px "PingFang SC","Microsoft YaHei",sans-serif; fill:#34566d; }
.sq-else { stroke:var(--svg-frame); stroke-dasharray:6 4; }

/* hand-drawn diagram classes */
.d-t { font:12.5px "PingFang SC","Microsoft YaHei",sans-serif; fill:var(--svg-ink); }
.d-ts { font:11px "PingFang SC","Microsoft YaHei",sans-serif; fill:var(--svg-sub); }
.d-tb { font:700 13.5px "PingFang SC","Microsoft YaHei",sans-serif; fill:var(--svg-ink); }
.d-tw { font:700 13px "PingFang SC","Microsoft YaHei",sans-serif; fill:#fff; }
.d-mono { font:11px "SF Mono",Menlo,Consolas,monospace; fill:var(--svg-sub); }
.d-layer { fill:#f3f7fa; stroke:#b8cad6; }
.d-box { fill:#fff; stroke:#7ea6c2; stroke-width:1.2; }
.d-box2 { fill:#e7f4f2; stroke:#5fa89e; stroke-width:1.2; }
.d-box3 { fill:#fff4e2; stroke:#d1a257; stroke-width:1.2; }
.d-box4 { fill:#fdeceb; stroke:#d58a83; stroke-width:1.2; }
.d-dark { fill:#1c4555; stroke:#1c4555; }
.d-line { stroke:#5d7a8c; stroke-width:1.3; fill:none; }
.d-dash { stroke:#5d7a8c; stroke-width:1.2; fill:none; stroke-dasharray:5 4; }

.back { display:inline-block; margin-top:4px; font-size:13px; }
.pager { display:flex; justify-content:space-between; gap:12px; margin-top:40px; padding-top:18px; border-top:1px solid var(--line); }
.pager a { display:block; padding:10px 14px; background:var(--surface); border:1px solid var(--line); border-radius:8px; font-size:14px; }

@media (max-width:910px) {
  .layout { display:block; } .sidebar { position:static; height:auto; }
  .grid2,.grid3 { grid-template-columns:1fr; } .content { padding:20px 16px 50px; }
  .hero { padding:36px 16px 30px; }
}
@media print { .sidebar { display:none; } .layout { display:block; } figure { break-inside:avoid; } }

/* ---- user-manual additions ---- */
.shot { padding:10px 10px 8px; }
.shot img { display:block; max-width:100%; height:auto; margin:0 auto; border:1px solid var(--line); border-radius:6px; }
.shot.narrow img { max-width:760px; }
kbd { display:inline-block; min-width:20px; padding:0 6px; border:1px solid #b9c7d0; border-bottom-width:2px; border-radius:4px;
  background:#fff; color:var(--ink); font:12.5px/1.6 "SF Mono",Menlo,Consolas,monospace; text-align:center; }
.ui { font-weight:700; color:var(--nav2); }
.path { font-weight:700; color:var(--nav2); white-space:nowrap; }
.tip,.note,.platform { margin:14px 0; padding:12px 16px 12px 18px; border-left:5px solid var(--teal); background:var(--surface);
  box-shadow:var(--shadow); border-radius:0 8px 8px 0; }
.note { border-left-color:var(--amber); background:#fffaf0; }
.platform { border-left-color:#6a5acd; background:#f6f4ff; }
.tip::before,.note::before,.platform::before { display:block; margin-bottom:2px; font-size:12.5px; font-weight:700; letter-spacing:.06em; }
.tip::before { content:"提示"; color:var(--teal); }
.note::before { content:"注意"; color:var(--amber); }
.platform::before { content:"平台差异"; color:#6a5acd; }
.tip > :last-child,.note > :last-child,.platform > :last-child { margin-bottom:0; }
.tip > p:first-of-type,.note > p:first-of-type,.platform > p:first-of-type { margin-top:0; }
ol.steps { counter-reset:step; list-style:none; padding-left:0; }
ol.steps > li { counter-increment:step; position:relative; margin:10px 0; padding-left:38px; }
ol.steps > li::before { content:counter(step); position:absolute; left:0; top:1px; width:26px; height:26px; border-radius:50%;
  background:var(--teal); color:#fff; font:700 13px/26px Arial,sans-serif; text-align:center; }
.toc span.todo { display:block; padding:5px 9px; border-left:3px solid transparent; color:#6f8a9a; font-size:13.5px; }
.chapters td:first-child { white-space:nowrap; }