/* D — 柔和圆润：微灰白底、大圆角、柔和投影、翠绿点缀，气质温和 */

:root {
  --bg: #FFFFFF;
  --page: #F7F8F7;
  --ink: #14181A; --ink-2: #4B5457; --ink-3: #788387; --ink-4: #A6AFB2;
  --line: #E6EAE9; --line-2: #D5DBDA;

  --acc: #059669; --acc-2: #047857; --acc-dim: #ECFDF5; --acc-line: #A7F3D0;
  --acc-ring: rgba(5, 150, 105, .16);
  --up: #059669; --down: #DC2626;

  --sans: 'Plex Sans', -apple-system, BlinkMacSystemFont, var(--cjk), sans-serif;
  --mono: 'Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --display: 'Sora', var(--sans);

  --h1-font: 600 clamp(1.95rem, 4.6vw, 2.75rem)/1.18 var(--sans);
  --h1-em: var(--acc-2);
  --head-rule: 1px solid var(--line-2);

  --panel-border: 1px solid var(--line);
  --panel-bg: #FFFFFF;
  --bar-bg: #FBFCFB;
  --panel-shadow: 0 1px 2px rgba(20, 24, 26, .04), 0 6px 18px rgba(20, 24, 26, .045);
  --panel-shadow-h: 0 3px 8px rgba(5, 150, 105, .08), 0 14px 34px rgba(5, 150, 105, .10);
  --card-shadow: 0 2px 6px rgba(20, 24, 26, .05), 0 18px 44px rgba(20, 24, 26, .08);
  --card-pad: 1.1rem 1.2rem 1.2rem;
  --readout-gap: .85rem;
  --row-hover: var(--acc-dim);
  --c-str: #047857; --c-num: #0E7490;

  --btn-bg: #059669; --btn-bg-h: #047857; --btn-fg: #FFFFFF;
  --btn-shadow:   0 1px 2px rgba(5, 150, 105, .28), inset 0 1px 0 rgba(255, 255, 255, .22);
  --btn-shadow-h: 0 6px 18px rgba(5, 150, 105, .32), inset 0 1px 0 rgba(255, 255, 255, .26);
  --mega-side: #F4F7F5;

  --radius: 11px;
  --radius-lg: 16px;
}

body { background: var(--page); }
.top { background: rgba(255, 255, 255, .86); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); position: sticky; top: 0; z-index: 50; }

/* 首屏：柔和绿色晕染 */
.hero { background: var(--bg); border-bottom: 1px solid var(--line); }
.hero::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(60rem 30rem at 82% -18%, rgba(5, 150, 105, .10), transparent 62%),
    radial-gradient(44rem 26rem at 6% 6%, rgba(14, 116, 144, .06), transparent 60%);
}

.hero h1 { letter-spacing: -.028em; }
.brand { letter-spacing: -.05em; }

.hero-kicker {
  padding: .36rem .8rem;
  border: 1px solid var(--acc-line);
  border-radius: 100px;
  background: var(--acc-dim);
  box-shadow: 0 1px 2px rgba(5, 150, 105, .07);
}

.sec { background: var(--page); }
.sec .wrap > .code,
.sec .wrap > .table-wrap,
.sec .wrap > .ep { background: var(--bg); }

/* 指标：白色圆角卡 */
.readout div {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--bg);
  box-shadow: var(--panel-shadow);
  transition: transform .2s cubic-bezier(.2,.8,.2,1), box-shadow .2s;
}
.readout div:hover { transform: translateY(-2px); box-shadow: var(--panel-shadow-h); }
.readout dd { font-family: var(--display); font-weight: 600; }

.table-wrap {
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--panel-shadow);
}
.table-wrap thead th, .table-wrap tbody td { padding-left: 1.1rem; }
.table-wrap td.n, .table-wrap th.n { padding-right: 1.1rem; }
.table-wrap tbody tr:last-child td { border-bottom: 0; }

.code-bar::before {
  content: ''; width: 7px; height: 7px; border-radius: 50%;
  background: var(--acc); flex: none;
  box-shadow: 0 0 0 3px var(--acc-dim);
}

.method { border-radius: 100px; }
.card { border-radius: var(--radius-lg); }
.field input { border-radius: 9px; }
.btn { border-radius: 9px; }