docs(analysis): 添加 FishDice 框架分析页面

analysis/FishDice/style.css

@@ -0,0 +1,297 @@
+:root {
+  color-scheme: light;
+  --ink: #17202a;
+  --muted: #607080;
+  --paper: #f7f4ed;
+  --panel: #fffdf7;
+  --line: #d9d0bd;
+  --accent: #b8472a;
+  --accent-2: #1f6f68;
+  --accent-3: #315c9a;
+  --code: #243447;
+  --soft: #efe7d7;
+  --warn: #8b4c10;
+  --bad: #9d2c2f;
+  --good: #267257;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+body {
+  margin: 0;
+  background:
+    linear-gradient(90deg, rgba(23, 32, 42, 0.04) 1px, transparent 1px),
+    linear-gradient(rgba(23, 32, 42, 0.04) 1px, transparent 1px),
+    var(--paper);
+  background-size: 32px 32px;
+  color: var(--ink);
+  font-family: "Microsoft YaHei", "Segoe UI", sans-serif;
+  line-height: 1.7;
+}
+
+a {
+  color: var(--accent-3);
+  text-decoration: none;
+}
+
+a:hover {
+  text-decoration: underline;
+}
+
+.shell {
+  width: min(1180px, calc(100vw - 40px));
+  margin: 0 auto;
+  padding: 34px 0 56px;
+}
+
+.topbar {
+  display: flex;
+  justify-content: space-between;
+  gap: 18px;
+  align-items: center;
+  margin-bottom: 22px;
+  font-size: 14px;
+  color: var(--muted);
+}
+
+.brand {
+  font-weight: 700;
+  color: var(--accent);
+  letter-spacing: 0.04em;
+}
+
+.hero {
+  border: 1px solid var(--line);
+  background: rgba(255, 253, 247, 0.88);
+  padding: 34px;
+  box-shadow: 0 18px 50px rgba(30, 25, 18, 0.08);
+}
+
+h1,
+h2,
+h3 {
+  line-height: 1.2;
+  margin: 0;
+}
+
+h1 {
+  font-size: clamp(34px, 5vw, 58px);
+  max-width: 920px;
+  letter-spacing: 0;
+}
+
+h2 {
+  font-size: 26px;
+  margin-top: 40px;
+  margin-bottom: 14px;
+  padding-bottom: 10px;
+  border-bottom: 2px solid var(--line);
+}
+
+h3 {
+  font-size: 19px;
+  margin-top: 26px;
+  margin-bottom: 8px;
+}
+
+.subtitle {
+  max-width: 860px;
+  margin: 18px 0 0;
+  color: var(--muted);
+  font-size: 17px;
+}
+
+.nav-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
+  gap: 12px;
+  margin-top: 26px;
+}
+
+.nav-card,
+.card,
+.note,
+.evidence,
+.metric {
+  border: 1px solid var(--line);
+  background: var(--panel);
+}
+
+.nav-card {
+  min-height: 116px;
+  padding: 18px;
+}
+
+.nav-card strong {
+  display: block;
+  color: var(--accent);
+  margin-bottom: 7px;
+}
+
+.nav-card span {
+  color: var(--muted);
+  font-size: 14px;
+}
+
+.grid-2,
+.grid-3 {
+  display: grid;
+  gap: 14px;
+}
+
+.grid-2 {
+  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+}
+
+.grid-3 {
+  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+}
+
+.card,
+.metric {
+  padding: 18px;
+}
+
+.metric .value {
+  font-size: 28px;
+  font-weight: 800;
+  color: var(--accent);
+}
+
+.metric .label {
+  color: var(--muted);
+  font-size: 14px;
+}
+
+.note {
+  padding: 16px 18px;
+  border-left: 5px solid var(--accent-2);
+  margin: 18px 0;
+}
+
+.warning {
+  border-left-color: var(--warn);
+}
+
+.danger {
+  border-left-color: var(--bad);
+}
+
+.good {
+  border-left-color: var(--good);
+}
+
+table {
+  width: 100%;
+  border-collapse: collapse;
+  margin: 16px 0 26px;
+  background: var(--panel);
+  border: 1px solid var(--line);
+}
+
+th,
+td {
+  border-bottom: 1px solid var(--line);
+  padding: 12px 14px;
+  text-align: left;
+  vertical-align: top;
+}
+
+th {
+  color: var(--accent);
+  background: var(--soft);
+  font-weight: 800;
+}
+
+tr:last-child td {
+  border-bottom: 0;
+}
+
+code,
+.path {
+  font-family: Consolas, "Cascadia Mono", monospace;
+  color: var(--code);
+  background: rgba(31, 111, 104, 0.09);
+  padding: 2px 5px;
+  border-radius: 3px;
+}
+
+pre {
+  overflow-x: auto;
+  padding: 16px;
+  background: #16202b;
+  color: #f7f4ed;
+  border: 1px solid #0f1720;
+}
+
+.flow {
+  display: grid;
+  gap: 10px;
+  margin: 16px 0 24px;
+}
+
+.flow-row {
+  display: grid;
+  grid-template-columns: 180px 1fr;
+  gap: 12px;
+  align-items: stretch;
+}
+
+.flow-key {
+  background: var(--accent-2);
+  color: white;
+  padding: 12px;
+  font-weight: 800;
+}
+
+.flow-val {
+  border: 1px solid var(--line);
+  background: var(--panel);
+  padding: 12px;
+}
+
+.evidence {
+  margin-top: 28px;
+  padding: 18px;
+}
+
+.evidence ul,
+.tight {
+  margin: 8px 0 0;
+  padding-left: 20px;
+}
+
+.badge {
+  display: inline-block;
+  padding: 3px 8px;
+  border: 1px solid var(--line);
+  background: var(--soft);
+  color: var(--accent);
+  font-size: 13px;
+  font-weight: 700;
+}
+
+.footer {
+  margin-top: 42px;
+  padding-top: 18px;
+  border-top: 1px solid var(--line);
+  color: var(--muted);
+  font-size: 14px;
+}
+
+@media (max-width: 760px) {
+  .shell {
+    width: min(100vw - 24px, 1180px);
+    padding-top: 20px;
+  }
+
+  .hero {
+    padding: 22px;
+  }
+
+  .flow-row {
+    grid-template-columns: 1fr;
+  }
+}