/* ============================================================
   AGENT RIG — 视觉 v2.1
   暖纸 + 芯片工坊（借鉴 tapeout 气质），数据用本项目自己的
   字号整体上调 / 8px 网格对齐 / 控件统一高度 44
   ============================================================ */

:root{
  --bg:#f6f5f1;
  --panel:#ffffff;
  --chip:#efede6;
  --chip-2:#e9e6de;
  --hover:#f1efe9;
  --line:#e3e1da;
  --line-2:#d5d2c9;

  --ink:#1d1d1b;
  --muted:#63625e;
  --faint:#a09e97;

  --accent:#0f6b5c;
  --accent-hi:#0c5a4d;
  --accent-soft:#e6f0ed;
  --ok:#1a7f37;
  --warn:#9a6700;
  --warn-soft:#fdf8ec;
  --err:#b42318;

  --sans:"Space Grotesk", -apple-system, BlinkMacSystemFont, "PingFang SC", "Segoe UI", "Microsoft YaHei", system-ui, sans-serif;
  --mono:"JetBrains Mono", ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, "Courier New", monospace;

  --r:10px;
  --r-sm:6px;
  --ctl:44px;
  --g:16px;          /* 基础间距 */
}

*,*::before,*::after{box-sizing:border-box}

html{ -webkit-text-size-adjust:100%; font-size:16px }
body{
  margin:0; min-height:100vh; display:flex; flex-direction:column;
  background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
main{ flex:1 }

/* 极淡纸面网格 */
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(29,29,27,.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(29,29,27,.02) 1px, transparent 1px);
  background-size:48px 48px;
  mask-image:radial-gradient(circle at 50% 0%, #000 0%, transparent 80%);
}

.wrap{ width:100%; max-width:1240px; margin:0 auto; padding:0 24px; position:relative; z-index:1 }
@media (max-width:640px){ .wrap{ padding:0 16px } }

h1,h2,h3{ margin:0; font-weight:600 }
a{ color:inherit; text-decoration:none }

.label{
  font-family:var(--mono); font-size:12px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--faint);
}
.mono{ font-family:var(--mono); font-size:15px }
.num{
  font-family:var(--mono); font-size:15px; text-align:right;
  font-variant-numeric:tabular-nums;
}
.dim{ color:var(--muted) }
.green{ color:var(--ok) }
.gold{ color:var(--warn) }
.cyan{ color:var(--accent) }
.pink{ color:var(--err) }

/* ---------------- 顶栏 ---------------- */
header{
  position:sticky; top:0; z-index:20;
  background:rgba(246,245,241,.9);
  backdrop-filter:saturate(1.2) blur(8px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  gap:24px; height:68px;
}
.brand{
  display:inline-flex; align-items:baseline; gap:12px;
  font-family:var(--sans); font-size:22px; font-weight:700; letter-spacing:.08em;
  white-space:nowrap; color:var(--ink);
}
.nav-links{ display:flex; gap:2px; flex-wrap:wrap }
.nav-links a{
  font-family:var(--sans); font-size:14px; font-weight:500; letter-spacing:.04em;
  color:var(--muted); padding:9px 13px; border-radius:var(--r-sm);
}
.nav-links a:hover{ background:var(--hover); color:var(--ink) }
.nav-links a.on{ color:var(--accent); background:var(--accent-soft) }
.nav-r{ display:flex; align-items:center; gap:8px; flex-wrap:wrap }

.chip{
  font-family:var(--mono); font-size:12px; letter-spacing:.05em;
  color:var(--muted); background:var(--chip);
  border:1px solid var(--line);
  border-radius:var(--r-sm); padding:6px 10px; white-space:nowrap;
}

/* ---------------- 状态条 ---------------- */
.ticker{ border-bottom:1px solid var(--line); background:var(--panel) }
.ticker-in{ display:flex; align-items:center; gap:10px; height:40px }
.ticker .spacer{ flex:1 }
.ticker .mono{ font-size:13px; color:var(--muted) }

/* 协议数字条 */
.statsbar{ background:var(--panel); border-bottom:1px solid var(--line) }
.statsbar-in{ display:grid; grid-template-columns:repeat(4,1fr); }
.sb{
  padding:12px 0 12px 16px; display:flex; flex-direction:column; gap:3px;
  border-right:1px solid var(--line); min-width:0;
}
.sb:first-child{ padding-left:0 }
.sb:last-child{ border-right:0 }
.sb .k{
  font-family:var(--mono); font-size:11px; letter-spacing:.1em;
  text-transform:uppercase; color:var(--faint);
}
.sb .v{ font-family:var(--mono); font-size:15px; color:var(--ink); font-variant-numeric:tabular-nums }
@media (max-width:700px){ .statsbar-in{ grid-template-columns:repeat(2,1fr) } .sb{ padding-left:0 } }

/* ---------------- 章节 ---------------- */
section{ padding:40px 0 12px }
.sec-h{
  display:flex; align-items:center; gap:14px;
  padding-bottom:16px; margin-bottom:24px;
  border-bottom:1px solid var(--line);
}
.sec-h h2{ font-family:var(--sans); font-size:28px; font-weight:700; letter-spacing:-.02em; line-height:1.15 }
.sec-h .meta{
  margin-left:auto; font-family:var(--mono); font-size:12px;
  color:var(--faint); letter-spacing:.06em; text-transform:uppercase;
  text-align:right;
}

/* ---------------- 面板 ---------------- */
.panel{
  position:relative; height:100%;
  background:var(--panel); border:1px solid var(--line);
  border-radius:var(--r); padding:20px;
}
.panel.tight{ padding:16px }
/* 四角刻度 */
.panel::before,.panel::after{
  content:""; position:absolute; width:8px; height:8px; pointer-events:none;
  border-color:var(--line-2); border-style:solid;
}
.panel::before{ top:-1px; left:-1px; border-width:1px 0 0 1px; border-top-left-radius:var(--r) }
.panel::after{ bottom:-1px; right:-1px; border-width:0 1px 1px 0; border-bottom-right-radius:var(--r) }

.panel-h{
  display:flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:12px; letter-spacing:.09em;
  text-transform:uppercase; color:var(--faint);
  margin-bottom:16px; min-height:20px;
}
.panel-h .spacer{ flex:1 }

/* ---------------- 指标 ---------------- */
.metrics{
  display:grid; grid-template-columns:repeat(3,1fr);
  border:1px solid var(--line); border-radius:var(--r-sm);
  overflow:hidden; background:var(--panel);
}
.metrics .m{
  padding:16px 18px; border-right:1px solid var(--line);
  min-width:0; display:grid; grid-template-rows:14px 28px; row-gap:9px;
  align-content:start;
}
.metrics .m:last-child{ border-right:0 }
.metrics .k{
  font-family:var(--mono); font-size:11px; letter-spacing:.09em;
  text-transform:uppercase; color:var(--faint); line-height:14px;
}
.metrics .v{
  font-family:var(--mono); font-size:22px; line-height:28px; color:var(--ink);
  font-variant-numeric:tabular-nums;
  display:flex; align-items:baseline; gap:6px;
  white-space:nowrap; overflow:hidden;
}
.metrics .v b{ font-weight:500 }
.metrics .v .u{ font-size:13px; color:var(--faint) }
@media (max-width:760px){
  .metrics{ grid-template-columns:repeat(3,1fr) }
  .metrics .m{ padding:12px 12px }
  .metrics .v{ font-size:17px }
}

/* 进度条 */
.bar{ height:10px; background:var(--chip); border-radius:999px; overflow:hidden; margin-top:14px }
.bar > i{
  display:block; height:100%; width:0; background:var(--accent);
  border-radius:999px; transition:width .45s cubic-bezier(.2,.7,.3,1);
}
.bar.rare > i{ background:var(--warn) }
.bar-scale{
  display:flex; justify-content:space-between; margin-top:8px;
  font-family:var(--mono); font-size:11px; letter-spacing:.06em;
  color:var(--faint); text-transform:uppercase;
}

/* ---------------- 表单 ---------------- */
.field{ margin-bottom:20px }
.field label{
  display:block; font-family:var(--mono); font-size:11px; letter-spacing:.09em;
  text-transform:uppercase; color:var(--faint); margin-bottom:8px;
}
.field input, .field select{
  width:100%; min-height:var(--ctl);
  background:var(--panel); color:var(--ink);
  border:1px solid var(--line-2); border-radius:var(--r-sm);
  padding:0 14px; font-family:var(--mono); font-size:16px;
  outline:none; transition:border-color .15s, box-shadow .15s;
}
.field input:focus{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft) }
.row-2{ display:flex; gap:10px; align-items:stretch }
.row-2 > *{ min-width:0 }
.help{ font-size:14px; color:var(--muted); margin-top:8px }

/* 步进器 */
.stepper{
  display:flex; align-items:stretch; min-height:var(--ctl);
  border:1px solid var(--line-2); border-radius:var(--r-sm);
  overflow:hidden; background:var(--panel);
}
.stepper button{
  width:48px; border:0; background:var(--chip); color:var(--ink);
  font-size:18px; cursor:pointer; transition:background .15s;
}
.stepper button:hover{ background:var(--chip-2) }
.stepper input{
  flex:1; min-width:0; border:0; text-align:center; background:var(--panel); color:var(--ink);
  font-family:var(--mono); font-size:17px; outline:none;
}

/* ---------------- 按钮 ---------------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:var(--ctl); padding:0 20px;
  font-family:var(--sans); font-size:15px; font-weight:500;
  border-radius:var(--r-sm);
  background:var(--panel); color:var(--ink);
  border:1px solid var(--line-2); cursor:pointer;
  transition:background .15s, border-color .15s, transform .05s;
}
.btn:hover:not(:disabled){ background:var(--hover); border-color:var(--faint) }
.btn:active:not(:disabled){ transform:translateY(1px) }
.btn:disabled{ opacity:.5; cursor:not-allowed }
.btn-sm{ min-height:36px; padding:0 14px; font-size:13px }
.btn-primary{ background:var(--accent); border-color:var(--accent); color:#fff }
.btn-primary:hover:not(:disabled){ background:var(--accent-hi); border-color:var(--accent-hi) }
.btn-pink{ background:var(--warn); border-color:var(--warn); color:#fff }
.btn-pink:hover:not(:disabled){ filter:brightness(.94) }
.btn-pink:disabled{ background:var(--chip); border-color:var(--line); color:var(--faint); filter:none }
.btn-ghost{ background:transparent; border-color:var(--line-2) }
.btn-block{ width:100% }

/* ---------------- 布局 ---------------- */
.grid-2{
  display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);
  gap:20px; align-items:stretch;
}
@media (max-width:960px){ .grid-2{ grid-template-columns:1fr } }

/* ---------------- BODY 卡片 ---------------- */
.cards{ display:grid; grid-template-columns:repeat(auto-fill,minmax(152px,1fr)); gap:12px }
.nft{
  border:1px solid var(--line); border-radius:var(--r-sm);
  background:var(--panel); cursor:pointer; position:relative;
  overflow:hidden; transition:border-color .15s, box-shadow .15s, transform .12s;
}
.nft:hover{ border-color:var(--faint); transform:translateY(-1px) }
.nft.sel{ border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft) }
.nft .art{
  height:104px; position:relative; overflow:hidden;
  background:
    repeating-conic-gradient(from 0deg,
      color-mix(in srgb, var(--c1) 26%, transparent) 0 25%,
      transparent 0 50%) 0 0/24px 24px,
    linear-gradient(0deg, rgba(29,29,27,.07) 1px, transparent 1px) 0 0/12px 12px,
    linear-gradient(90deg, rgba(29,29,27,.07) 1px, transparent 1px) 0 0/12px 12px,
    linear-gradient(135deg, color-mix(in srgb, var(--c2) 45%, transparent) 0%, transparent 46%),
    #fbfaf7;
}
.nft .art::before{
  content:""; position:absolute; inset:12px;
  border:1px solid color-mix(in srgb, var(--c2) 55%, transparent);
  border-radius:2px;
}
.nft .id{
  position:absolute; top:8px; left:8px; z-index:2;
  font-family:var(--mono); font-size:11px; color:var(--ink);
  background:rgba(255,255,255,.92); border:1px solid var(--line);
  border-radius:3px; padding:2px 6px;
}
.nft .pick{
  position:absolute; top:8px; right:8px; z-index:2;
  width:16px; height:16px; border-radius:4px;
  border:1px solid var(--line-2); background:rgba(255,255,255,.92);
  transition:background .12s, border-color .12s;
}
.nft.sel .pick{ background:var(--accent); border-color:var(--accent) }
.nft .body{ padding:10px 12px 12px }
.nft .trait{
  display:flex; justify-content:space-between; gap:8px;
  font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:var(--muted);
}

/* ---------------- 配方 ---------------- */
.recipe{ display:flex; flex-direction:column }
.recipe .line{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  font-size:15px; color:var(--muted);
  border-bottom:1px solid var(--line); padding:11px 0;
}
.recipe .line:last-child{ border-bottom:0 }
.recipe .line b{ color:var(--ink); font-weight:500; font-family:var(--mono); font-size:14px }
.recipe .total{ color:var(--ink); font-weight:500 }
.recipe .total b{ color:var(--accent) }

.slots{ display:grid; grid-template-columns:repeat(5,1fr); gap:8px }
.slot{
  height:48px; border:1px dashed var(--line-2); border-radius:var(--r-sm);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--mono); font-size:12px; color:var(--faint); background:var(--bg);
}
.slot.fill{ border-style:solid; border-color:var(--accent); color:var(--accent); background:var(--accent-soft) }

/* ---------------- 矿机 ---------------- */
.rig{
  border:1px solid var(--line); border-radius:var(--r);
  background:var(--panel); padding:18px;
  display:flex; flex-direction:column; gap:12px;
}
.rig header{ position:static; background:none; border:0; display:flex; align-items:center; gap:10px }
.rig .rid{ font-family:var(--mono); font-size:16px; font-weight:600 }
.rig .hash{
  font-family:var(--mono); font-size:12px; color:var(--accent);
  background:var(--accent-soft); border-radius:4px; padding:2px 8px;
}
.rig .kv{ display:flex; justify-content:space-between; align-items:center; font-size:14px; color:var(--muted) }
.rig .kv b{ color:var(--ink); font-weight:500; font-family:var(--mono); font-size:14px }
.rig .lockbar{
  font-family:var(--mono); font-size:11px; letter-spacing:.04em; color:var(--warn);
  border-top:1px solid var(--line); padding-top:10px;
}
.rig .lockbar.green{ color:var(--ok) }

/* ---------------- 表格 ---------------- */
.tbl-wrap{ border:1px solid var(--line); border-radius:var(--r); background:var(--panel); overflow:hidden }
.tbl-scroll{ overflow-x:auto }
table{ width:100%; border-collapse:collapse; table-layout:fixed }
thead th{
  text-align:left; font-weight:500; font-family:var(--mono);
  font-size:11px; letter-spacing:.09em; text-transform:uppercase;
  color:var(--faint); padding:12px 16px;
  border-bottom:1px solid var(--line); background:#fbfaf7; white-space:nowrap;
}
tbody td{
  padding:13px 16px; border-bottom:1px solid var(--line);
  color:var(--muted); font-family:var(--mono); font-size:14px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
tbody tr:hover td{ background:var(--hover); color:var(--ink) }
tbody tr:last-child td{ border-bottom:0 }
tbody td.num, thead th.num{ text-align:right; font-variant-numeric:tabular-nums }
.empty-td{ text-align:center; color:var(--faint); padding:48px; font-size:14px }

/* 标签页 */
.tabs{ display:inline-flex; gap:2px; padding:4px; background:var(--chip); border-radius:var(--r-sm); margin-bottom:16px }
.tab{
  font-family:var(--mono); font-size:12px; letter-spacing:.07em;
  padding:8px 16px; border:0; border-radius:4px;
  background:transparent; color:var(--muted); cursor:pointer;
}
.tab:hover{ color:var(--ink) }
.tab.on{ background:var(--panel); color:var(--ink); box-shadow:0 1px 2px rgba(0,0,0,.06) }

/* ---------------- toast ---------------- */
.toast-wrap{ position:fixed; right:24px; bottom:24px; z-index:50; display:flex; flex-direction:column; gap:8px }
.toast{
  background:var(--panel); color:var(--ink);
  border:1px solid var(--line); border-left:3px solid var(--accent);
  border-radius:var(--r-sm); padding:12px 16px;
  font-size:13px; font-family:var(--mono);
  box-shadow:0 8px 24px rgba(29,29,27,.08);
  animation:pop .16s ease-out;
}
.toast.err{ border-left-color:var(--err) }
@keyframes pop{ from{ transform:translateY(6px); opacity:0 } to{ transform:none; opacity:1 } }

/* ---------------- footer ---------------- */
footer{ border-top:1px solid var(--line); margin-top:48px; background:var(--panel) }
.foot{
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding:20px 0; font-family:var(--mono); font-size:12px; color:var(--faint);
}

/* ---------------- 其他 ---------------- */
.warnbox{
  border:1px solid #ecd9a8; background:var(--warn-soft); color:#6b4a00;
  border-radius:var(--r-sm); padding:14px 16px; font-size:14px; line-height:1.7;
}
.okbox{
  border:1px solid #bfe0c6; background:#f0f8f2; color:#12552a;
  border-radius:var(--r-sm); padding:14px 16px; font-size:14px;
}
.hr{ height:1px; background:var(--line); margin:20px 0 }
.mt4{ margin-top:16px }
.mt6{ margin-top:24px }
.rowline{ display:flex; gap:10px; align-items:center; flex-wrap:wrap }

.loglist{ display:flex; flex-direction:column; font-family:var(--mono); font-size:12px }
.logline{
  display:flex; gap:12px; padding:8px 0;
  border-bottom:1px solid var(--line); color:var(--muted);
}
.logline:last-child{ border-bottom:0 }
.logline .t{ color:var(--faint); white-space:nowrap }

/* ---------------- 连接钱包弹窗 ---------------- */
.modal-mask{
  position:fixed; inset:0; z-index:60;
  background:rgba(29,29,27,.32);
  display:flex; align-items:center; justify-content:center;
  padding:24px;
}
.modal-mask[hidden]{ display:none }
.modal{
  width:100%; max-width:420px;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:var(--r);
  box-shadow:0 24px 60px rgba(29,29,27,.18);
  overflow:hidden;
}
.modal-h{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 18px; border-bottom:1px solid var(--line);
  font-size:15px; font-weight:600;
}
.modal-x{
  border:0; background:transparent; color:var(--muted);
  font-size:22px; line-height:1; cursor:pointer; padding:0 4px;
}
.modal-x:hover{ color:var(--ink) }
.modal-b{ padding:16px 18px 18px; display:flex; flex-direction:column; gap:10px }
.opt{
  display:flex; flex-direction:column; align-items:flex-start; gap:3px;
  text-align:left; padding:14px 16px;
  background:var(--panel); border:1px solid var(--line-2);
  border-radius:var(--r-sm); cursor:pointer;
  transition:border-color .15s, background .15s;
}
.opt:hover{ border-color:var(--accent); background:var(--accent-soft) }
.opt .t{ font-size:15px; font-weight:500; color:var(--ink) }
.opt .d{ font-family:var(--mono); font-size:12px; color:var(--muted) }
.modal-note{
  margin:4px 0 0; font-size:12px; color:var(--faint); line-height:1.6;
}
#qrPanel{ display:none; flex-direction:column; align-items:center; gap:10px; padding:8px 0 4px }
#qrPanel[style*="flex"]{ display:flex }
#qrCanvas{ background:#fff; padding:12px; border:1px solid var(--line); border-radius:8px; display:flex; justify-content:center }
#qrCanvas img, #qrCanvas canvas{ display:block; width:200px !important; height:200px !important }
#qrStatus{ text-align:center; font-family:var(--mono); font-size:12px; color:var(--muted); margin:0 }

.addrbox{ display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1px solid var(--line-2); border-radius:var(--r-sm); background:var(--panel) }
.addr{ flex:1; min-width:0; word-break:break-all; font-size:11px; line-height:1.6; color:var(--muted) }

.brand{ align-items:center }
.brand-mark{ width:24px; height:24px; display:block; color:var(--ink); flex:0 0 auto }

.pdfwrap{ height:calc(100vh - 300px); min-height:520px; border:1px solid var(--line); border-radius:var(--r-sm); overflow:hidden; background:#fff }
.pdfwrap iframe{ width:100%; height:100%; border:0; display:block }

.doc{ max-width:880px }
.doc-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:24px }
.doc .meta{ font-family:var(--mono); font-size:11px; letter-spacing:.18em; color:var(--faint); text-transform:uppercase }
.doc .doc-h{ font-size:36px; line-height:1.1; letter-spacing:-.015em; margin:10px 0 14px; font-weight:700 }
.doc .doc-h em{ font-style:normal; color:var(--accent) }
.doc .lead{ font-size:18px; line-height:1.6; color:var(--ink); max-width:60ch; margin:0 0 18px }
.doc p{ font-size:15px; line-height:1.75; color:var(--muted); max-width:74ch; margin:0 0 14px }
.doc .kicker{ font-family:var(--mono); font-size:11px; letter-spacing:.22em; color:var(--accent); text-transform:uppercase; margin:26px 0 8px }
.doc-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin:18px 0 22px }
.doc-card{ border:1px solid var(--line); border-radius:10px; padding:16px; background:var(--panel) }
.doc-card .num{ font-family:var(--mono); font-size:12px; color:var(--faint) }
.doc-card .t{ font-size:16px; font-weight:600; margin:6px 0 6px }
.doc-card .d{ font-size:13px; color:var(--muted); line-height:1.55 }
.doc-two{ column-count:2; column-gap:32px }
.doc-flow{ display:flex; align-items:stretch; margin:18px 0 22px }
.doc-flow .node{ flex:1; border:1px solid var(--line-2); border-radius:10px; padding:14px; background:var(--panel) }
.doc-flow .node.accent{ border-color:var(--accent) }
.doc-flow .k{ font-family:var(--mono); font-size:10px; letter-spacing:.14em; color:var(--faint) }
.doc-flow .v{ font-size:18px; font-weight:600; margin-top:4px }
.doc-flow .s{ font-size:12px; color:var(--muted); margin-top:2px }
.doc-flow .arrow{ width:34px; display:flex; align-items:center; justify-content:center; color:var(--accent) }
.doc-table{ width:100%; border-collapse:collapse; margin:8px 0 20px }
.doc-table th{ text-align:left; font-family:var(--mono); font-size:10px; letter-spacing:.16em; color:var(--faint); text-transform:uppercase; padding:0 0 10px; border-bottom:1px solid var(--line-2) }
.doc-table td{ padding:10px 0; border-bottom:1px solid var(--line); font-size:14px; color:var(--muted) }
.doc-table td.mono{ font-family:var(--mono); color:var(--ink) }
.doc-phases{ margin-top:10px }
.doc-phases .phase{ display:grid; grid-template-columns:110px 1fr; gap:20px; padding:16px 0; border-top:1px solid var(--line) }
.doc-phases .p{ font-family:var(--mono); font-size:10px; letter-spacing:.14em; color:var(--accent); line-height:1.6 }
.doc-phases .p span{ color:var(--faint) }
.doc-phases .h{ font-size:17px; font-weight:600; margin-bottom:4px }
.doc-phases .d{ font-size:14px; color:var(--muted); line-height:1.6 }
.doc .quote{ border-left:2px solid var(--accent); padding:4px 0 4px 20px; font-size:20px; line-height:1.5; color:var(--ink); margin:22px 0 }
.doc .foot{ font-size:12px; color:var(--faint); line-height:1.6 }
@media (max-width:900px){
  .doc-cards{ grid-template-columns:1fr }
  .doc-two{ column-count:1 }
  .doc-flow{ flex-direction:column }
  .doc-flow .arrow{ width:auto; padding:8px 0 }
  .doc-phases .phase{ grid-template-columns:1fr; gap:8px }
  .doc .doc-h{ font-size:28px }
}
.doc-head h2{ font-size:34px; line-height:1.08; letter-spacing:-.02em; margin:10px 0 14px; font-weight:700 }
.doc-head h2 em{ font-style:normal; color:var(--accent) }
.doc-head{ align-items:flex-start }