/* ============================================================
   CYBERFLY — SPECIMEN PLATE
   设计语言：自然史标本图版 × 实验室仪表读数
   纸白底 / Georgia 衬线 / 等宽数据 / 1px 细线 / 微标签宽字距
   ============================================================ */

:root{
  --paper:      #f6f7f3;
  --paper-2:    #eaf0e3;
  --white:      #ffffff;
  --ink:        #253c38;
  --ink-2:      #45684e;
  --ink-3:      #587466;
  --sage:       #86927f;
  --sage-2:     #98a38f;
  --sage-3:     #a3ada5;
  --line:       #dbe3db;
  --line-2:     #edf0e9;
  --amber:      #b38537;
  --amber-soft: #f3ecdd;
  --green:      #295c48;
  --green-soft: #e4ebe3;
  --red:        #a44330;
  --red-soft:   #f6e7e2;
  --pink:       #d2419b;

  --serif: Georgia, 'Times New Roman', 'Songti SC', 'Noto Serif CJK SC', serif;
  --sans:  Inter, -apple-system, BlinkMacSystemFont, 'PingFang SC',
           'Hiragino Sans GB', 'Microsoft YaHei', system-ui, sans-serif;
  --mono:  ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;

  --wrap: 1480px;
  --r:  10px;
  --r-sm: 6px;
  --r-xs: 3px;
}

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

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:14px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  font-synthesis:none;
}

/* 纸张颗粒 */
body::before{
  content:''; position:fixed; inset:0; z-index:0; pointer-events:none; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.22'/%3E%3C/svg%3E");
}

img,svg,canvas{ display:block; max-width:100%; }
a{ color:var(--green); text-decoration:none; }
a:hover{ text-decoration:underline; text-underline-offset:3px; }
button,select,input{ font:inherit; color:inherit; }
button{ cursor:pointer; background:transparent; border:1px solid var(--line); border-radius:var(--r-sm); padding:9px 13px; transition:background .15s, border-color .15s; }
button:hover{ background:var(--green-soft); }
button:focus-visible,select:focus-visible,a:focus-visible,input:focus-visible{ outline:2px solid var(--ink-3); outline-offset:3px; }

/* ---------------------------------------------------------------- 微标签 */
.micro{
  font-size:9px; letter-spacing:1.8px; text-transform:uppercase;
  color:var(--sage-2); font-weight:500;
}
.micro-ink{ color:var(--ink-3); }
.mono{ font-family:var(--mono); }
.serif{ font-family:var(--serif); }

/* ---------------------------------------------------------------- 页头 */
header{
  position:relative; z-index:2;
  max-width:var(--wrap); margin:0 auto; padding:24px 4%;
  display:flex; align-items:center; gap:28px;
  border-bottom:1px solid var(--line);
}
.brand{ display:flex; align-items:center; gap:12px; color:inherit; text-decoration:none; }
.brand:hover{ text-decoration:none; }
.brandmark{
  width:35px; height:35px; border-radius:50%; display:grid; place-items:center;
  background:var(--green); color:#d8edbe; flex-shrink:0;
}
.brandmark svg{ width:21px; height:21px; }
.brandtext{ font-weight:650; font-size:18px; letter-spacing:-.2px; }
.brandtext em{ font-family:var(--serif); font-style:italic; font-weight:400; color:var(--ink-3); font-size:16px; }

.edition{ margin-left:auto; display:flex; align-items:center; gap:13px; font-size:10px; letter-spacing:1px; color:var(--sage); text-transform:uppercase; }
.edition i{ width:3px; height:3px; border-radius:50%; background:var(--sage); display:inline-block; }

.navlinks{ display:flex; gap:22px; font-size:11px; letter-spacing:1px; text-transform:uppercase; }
.navlinks a{ color:var(--sage); }
.navlinks a:hover{ color:var(--ink); }

.langbtn{ border:0; padding:3px; font-size:12px; color:var(--ink-3); letter-spacing:.5px; }
.langbtn:hover{ background:none; color:var(--ink); }

/* ---------------------------------------------------------------- 主体 */
main{ position:relative; z-index:2; max-width:var(--wrap); margin:0 auto; padding:0 4%; }

/* 引言区 */
.intro{ display:flex; align-items:flex-start; justify-content:space-between; gap:60px; padding:44px 0 34px; }
.intro-main{ max-width:760px; }
.eyebrow{ font-size:10px; letter-spacing:1.8px; text-transform:uppercase; color:#5d8a75; margin-bottom:14px; }
h1{
  margin:0; font-size:clamp(30px,3.4vw,50px); font-weight:500;
  letter-spacing:-1.6px; line-height:1.22; font-family:var(--serif);
}
h1 em{ font-style:italic; color:var(--ink-3); }
.intro p{ color:#819087; font-size:13px; line-height:1.85; margin:16px 0 0; max-width:640px; }

/* 标本铭牌 */
.plate{
  flex-shrink:0; width:270px; border-left:1px solid var(--line); padding-left:30px;
}
.plate .spec{
  font-family:var(--serif); font-style:italic; font-size:29px; color:var(--ink-3);
  line-height:1.15; letter-spacing:-.5px;
}
.plate p{ margin:10px 0 14px; font-size:11px; color:var(--sage); line-height:1.75; }
.plate dl{ margin:0; display:grid; grid-template-columns:auto 1fr; gap:4px 12px; }
.plate dt{ font-size:9px; letter-spacing:1.2px; text-transform:uppercase; color:var(--sage-3); }
.plate dd{ margin:0; font-family:var(--mono); font-size:10px; color:var(--ink-3); text-align:right; }

/* ---------------------------------------------------------------- 合约条 */
.token-contract{
  display:flex; align-items:center; gap:14px; flex-wrap:wrap;
  padding:15px 20px; margin:0 0 22px;
  border:1px solid rgba(85,123,123,.33); border-radius:8px; background:var(--white);
}
.token-contract strong{ font-family:var(--mono); font-size:12px; letter-spacing:1px; flex-shrink:0; }
.token-contract .ca{
  font-family:var(--mono); font-size:12px; line-height:1.7; overflow-wrap:anywhere;
  min-width:0; flex:1; color:var(--ink);
}
.token-contract .ca.is-placeholder{ color:var(--amber); }
.token-contract .actions{ display:flex; gap:8px; flex-shrink:0; }
.token-contract button{ font-size:11px; padding:6px 11px; }

/* ---------------------------------------------------------------- 栅格 */
.workspace{ display:grid; grid-template-columns:minmax(0,1fr) 372px; gap:22px; align-items:start; }
.column{ display:flex; flex-direction:column; gap:22px; }

/* ---------------------------------------------------------------- 面板 */
.panel{
  border:1px solid var(--line); background:var(--white); border-radius:var(--r); overflow:hidden;
}
.panelhead{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:16px 20px; font-size:12px; font-weight:600; letter-spacing:-.1px;
  border-bottom:1px solid var(--line-2);
}
.panelhead .ph-left{ display:flex; align-items:baseline; gap:10px; min-width:0; }
.panelhead .sub{ font-size:9px; letter-spacing:1.2px; text-transform:uppercase; color:var(--sage-2); font-weight:400; }
.panelhead .ph-right{ display:flex; align-items:center; gap:10px; flex-shrink:0; }
.live{ display:inline-block; width:6px; height:6px; border-radius:50%; background:#6eab79; margin-right:6px; }
.live.off{ background:var(--sage-3); }
.live.bad{ background:var(--red); }
.live.warn{ background:var(--amber); }
.tag{
  font-size:9px; letter-spacing:1px; text-transform:uppercase;
  background:var(--green-soft); color:#769163; padding:4px 7px; border-radius:var(--r-xs); font-weight:500;
}
.tag-warn{ background:var(--amber-soft); color:#8d6a26; }
.tag-bad{ background:var(--red-soft); color:var(--red); }
.panelbody{ padding:20px; }
.panelfoot{ padding:13px 20px; border-top:1px solid var(--line-2); font-size:10px; color:var(--sage-3); line-height:1.7; }

/* ---------------------------------------------------------------- 结论戳 */
.verdict{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.stamp{
  flex-shrink:0; min-width:200px;
  border:1.5px solid currentColor; border-radius:var(--r-sm);
  padding:14px 18px; text-align:center;
}
.stamp .v-label{ font-size:9px; letter-spacing:2px; text-transform:uppercase; opacity:.7; display:block; margin-bottom:6px; }
.stamp .v-text{ font-family:var(--serif); font-size:23px; letter-spacing:-.4px; line-height:1.2; }
.stamp.ok{ color:var(--green); background:var(--green-soft); }
.stamp.warn{ color:#8d6a26; background:var(--amber-soft); }
.stamp.bad{ color:var(--red); background:var(--red-soft); }
.stamp.idle{ color:var(--sage); background:var(--paper-2); }

.verdict-notes{ flex:1; min-width:240px; }
.verdict-notes ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:9px; }
.verdict-notes li{ position:relative; padding-left:16px; font-size:12px; line-height:1.65; color:#6d7d72; }
.verdict-notes li::before{ content:''; position:absolute; left:0; top:7px; width:5px; height:5px; border-radius:50%; background:var(--sage-2); }
.verdict-notes li.is-alert::before{ background:var(--red); }
.verdict-notes li.is-warn::before{ background:var(--amber); }
.verdict-notes li.is-ok::before{ background:#6eab79; }

/* ---------------------------------------------------------------- 检查表（点线引导） */
.checks{ margin:0; }
.check-row{
  display:flex; align-items:baseline; gap:10px;
  padding:13px 20px; border-bottom:1px solid var(--line-2);
}
.check-row:last-child{ border-bottom:0; }
.check-row .ck-name{ font-size:11.5px; color:var(--ink-2); flex-shrink:0; }
.check-row .ck-lead{ flex:1; border-bottom:1px dotted var(--line); transform:translateY(-3px); min-width:18px; }
.check-row .ck-val{ font-family:var(--mono); font-size:11.5px; color:var(--ink); text-align:right; flex-shrink:0; max-width:58%; }
.ck-ok{ color:#3f7a56; }
.ck-bad{ color:var(--red); }
.ck-warn{ color:#8d6a26; }
.ck-idle{ color:var(--sage-3); }

/* ---------------------------------------------------------------- 翅脉画布 */
.wingwrap{ position:relative; margin:0 20px 20px; border-radius:var(--r-sm); background:var(--paper-2); overflow:hidden; }
#wing{ width:100%; aspect-ratio:2/1; display:block; }
.wingcaption{
  position:absolute; left:14px; bottom:11px; font-size:9px; letter-spacing:1.2px;
  text-transform:uppercase; color:var(--sage);
}
.wingstamp{ position:absolute; right:14px; top:11px; font-size:9px; letter-spacing:1.2px; text-transform:uppercase; color:var(--sage-2); }

/* ---------------------------------------------------------------- 侧栏 */
.side-facts{ display:grid; grid-template-columns:1fr auto; gap:9px 14px; }
.side-facts dt{ font-size:10px; letter-spacing:1px; text-transform:uppercase; color:var(--sage-2); }
.side-facts dd{ margin:0; font-family:var(--mono); font-size:11.5px; text-align:right; color:var(--ink); }

.btn-primary{
  display:flex; align-items:center; justify-content:center; gap:8px;
  width:100%; padding:13px; border:0; border-radius:var(--r-sm);
  background:var(--green); color:#fff; font-size:13px; font-weight:600; letter-spacing:.2px;
  transition:background .15s;
}
.btn-primary:hover{ background:#1e4939; text-decoration:none; }
.btn-primary.is-disabled{ background:var(--sage-3); cursor:not-allowed; }
.btn-ghost{
  display:flex; align-items:center; justify-content:center; gap:8px;
  width:100%; padding:11px; font-size:12px; color:var(--ink-2);
}
.btnrow{ display:flex; flex-direction:column; gap:9px; padding:20px; }
.btnnote{ font-size:9.5px; color:var(--sage-3); line-height:1.7; text-align:center; }

/* 分析任意合约 */
.caform{ display:flex; gap:8px; padding:0 20px 20px; }
.caform input{
  flex:1; min-width:0; padding:10px 12px; font-family:var(--mono); font-size:11px;
  border:1px solid var(--line); border-radius:var(--r-sm); background:var(--paper);
}
.caform button{ flex-shrink:0; font-size:11px; }

/* ---------------------------------------------------------------- 章节 */
.section{ padding:52px 0 12px; }
.section-head{ display:flex; align-items:baseline; gap:14px; margin-bottom:22px; border-bottom:1px solid var(--line); padding-bottom:13px; }
.section-num{ font-family:var(--mono); font-size:11px; color:var(--sage-3); }
.section-title{ font-family:var(--serif); font-size:19px; font-weight:500; letter-spacing:-.3px; margin:0; }
.section-note{ margin-left:auto; font-size:10px; letter-spacing:1.2px; text-transform:uppercase; color:var(--sage-3); }

/* 双栏文本 */
.cols2{ display:grid; grid-template-columns:1fr 1fr; gap:34px; }
.cols2 p, .prose p{ font-size:13px; line-height:1.85; color:#6d7d72; margin:0 0 14px; }
.prose h3{ font-family:var(--serif); font-size:15px; font-weight:500; margin:0 0 8px; }
.prose strong{ color:var(--ink-2); font-weight:600; }

/* 时间线（编号条目） */
.lore{ list-style:none; margin:0; padding:0; }
.lore li{ display:grid; grid-template-columns:78px 1fr; gap:22px; padding:16px 0; border-bottom:1px solid var(--line-2); }
.lore li:last-child{ border-bottom:0; }
.lore .yr{ font-family:var(--mono); font-size:11px; color:var(--sage-2); padding-top:2px; }
.lore .yr.now{ color:var(--amber); font-weight:600; }
.lore h4{ margin:0 0 5px; font-size:13px; font-weight:600; color:var(--ink); }
.lore p{ margin:0; font-size:12.5px; line-height:1.8; color:#6d7d72; }

/* 步骤 */
.steps{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.step{ background:var(--white); padding:22px; }
.step .n{ font-family:var(--serif); font-style:italic; font-size:22px; color:var(--sage-2); display:block; margin-bottom:10px; }
.step h4{ margin:0 0 8px; font-size:13px; font-weight:600; }
.step p{ margin:0; font-size:12px; line-height:1.75; color:#6d7d72; }

/* FAQ */
details{ border-bottom:1px solid var(--line-2); }
details summary{ padding:15px 0; cursor:pointer; font-size:13px; font-weight:500; list-style:none; display:flex; justify-content:space-between; gap:16px; }
details summary::-webkit-details-marker{ display:none; }
details summary::after{ content:'+'; font-family:var(--mono); color:var(--sage-2); }
details[open] summary::after{ content:'−'; }
details .ans{ padding:0 0 16px; font-size:12.5px; line-height:1.85; color:#6d7d72; max-width:80%; }

/* 免责 */
.disclaimer{
  margin:34px 0 0; padding:18px 20px; border:1px solid var(--line); border-radius:var(--r-sm);
  background:var(--paper-2); font-size:10.5px; line-height:1.8; color:var(--sage);
}

/* ---------------------------------------------------------------- 页脚 */
footer{
  position:relative; z-index:2;
  max-width:var(--wrap); margin:40px auto 0; padding:24px 4% 40px;
  display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap;
  font-size:10px; letter-spacing:.4px; color:var(--sage-3);
  border-top:1px solid var(--line);
}
footer b{ font-weight:400; }

/* ---------------------------------------------------------------- 响应式 */
@media (max-width:1100px){
  .workspace{ grid-template-columns:minmax(0,1fr) 320px; }
  .intro{ gap:34px; }
  .plate{ width:230px; padding-left:22px; }
}
@media (max-width:860px){
  .workspace{ grid-template-columns:1fr; }
  .intro{ flex-direction:column; gap:26px; }
  .plate{ width:100%; border-left:0; border-top:1px solid var(--line); padding:22px 0 0; }
  .cols2{ grid-template-columns:1fr; gap:22px; }
  .navlinks{ display:none; }
  .edition{ display:none; }
  header{ padding:18px 5%; gap:14px; }
  main{ padding:0 5%; }
  footer{ padding:20px 5% 32px; flex-direction:column; gap:8px; }
}

/* ---------------------------------------------------------------- 唯一税收 */
.taxhero{ display:flex; align-items:flex-start; gap:26px; }
.taxhero-num{
  font-family:var(--serif); font-size:64px; line-height:.94; letter-spacing:-2px;
  color:var(--green); flex-shrink:0; min-width:150px;
}
.taxhero-body{ flex:1; min-width:0; padding-top:6px; }
.taxhero-label{ font-size:9px; letter-spacing:2px; text-transform:uppercase; color:var(--sage-2); display:block; margin-bottom:7px; }
.taxhero-use{
  margin:0 0 10px; font-size:15px; font-weight:600; color:var(--ink); line-height:1.45;
}
.taxhero-detail{ margin:0; font-size:12.5px; line-height:1.8; color:#6d7d72; }

/* ---------------------------------------------------------------- 路线图 */
.phases{ display:grid; grid-template-columns:repeat(auto-fit,minmax(236px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden; }
.phase{ background:var(--white); padding:24px 22px 22px; display:flex; flex-direction:column; gap:13px; }
.ph-num{ font-family:var(--serif); font-style:italic; font-size:26px; color:var(--sage-2); line-height:1; }
.phase h3{ margin:0; font-size:14.5px; font-weight:650; letter-spacing:-.2px; }
.phase ul{ margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; flex:1; }
.phase li{ position:relative; padding-left:15px; font-size:12.3px; line-height:1.7; color:#6d7d72; }
.phase li::before{ content:''; position:absolute; left:0; top:8px; width:4px; height:4px; border-radius:50%; background:var(--line); }
.ph-tag{
  align-self:flex-start; padding:4px 10px; border-radius:var(--r-xs);
  font-size:9px; letter-spacing:1.2px; text-transform:uppercase;
  border:1px solid var(--line); color:var(--sage-2);
}
.ph-tag.now{ color:#3f7a56; border-color:rgba(63,122,86,.35); background:var(--green-soft); }

@media (max-width:560px){
  .taxhero{ flex-direction:column; gap:12px; }
  .taxhero-num{ font-size:52px; min-width:0; }
}

@media (prefers-reduced-motion:reduce){
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}