/* 《基因密语》阅读站 · 样式
   克制、简洁，以阅读体验为核心。深浅两套主题，跟随系统并可手动切换。 */

/* ---------------------------------------------------------- 设计令牌 */
:root{
  --bg:#f6f5f2;
  --surface:#ffffff;
  --surface-2:#fbfaf8;
  --text:#1b1b1d;
  --text-2:#4a4a4f;
  --muted:#8c8c92;
  --line:#e7e4de;
  --line-2:#f0eeea;
  --accent:#3f6484;
  --accent-2:#5b86a8;
  --accent-soft:rgba(63,100,132,.08);
  --danger:#a8443a;
  --ok:#3f7a5a;
  --shadow:0 1px 2px rgba(0,0,0,.04), 0 8px 24px rgba(0,0,0,.05);
  --radius:14px;
  --fs:17px;          /* 正文字号，由 JS 调节 */
  --lh:1.92;
  --sans:-apple-system,BlinkMacSystemFont,"PingFang SC","HarmonyOS Sans SC","Source Han Sans SC","Noto Sans SC","Microsoft YaHei",sans-serif;
  --serif:"Songti SC","STSong","Source Han Serif SC","Noto Serif SC","SimSun",Georgia,serif;
  --safe-b:env(safe-area-inset-bottom,0px);
  --safe-t:env(safe-area-inset-top,0px);
}
html[data-theme="dark"]{
  --bg:#111214;
  --surface:#181a1c;
  --surface-2:#1d1f22;
  --text:#c8c9cc;
  --text-2:#a9abb0;
  --muted:#767a80;
  --line:#2a2d31;
  --line-2:#222528;
  --accent:#7fa8c8;
  --accent-2:#5b86a8;
  --accent-soft:rgba(127,168,200,.10);
  --danger:#c9746a;
  --ok:#6aa98a;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 10px 30px rgba(0,0,0,.45);
}
@media (prefers-color-scheme:dark){
  html[data-theme="auto"]{
    --bg:#111214; --surface:#181a1c; --surface-2:#1d1f22;
    --text:#c8c9cc; --text-2:#a9abb0; --muted:#767a80;
    --line:#2a2d31; --line-2:#222528;
    --accent:#7fa8c8; --accent-soft:rgba(127,168,200,.10);
    --danger:#c9746a; --ok:#6aa98a;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 10px 30px rgba(0,0,0,.45);
  }
}

*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--sans);font-size:16px;line-height:1.7;
  -webkit-tap-highlight-color:transparent;
  -webkit-font-smoothing:antialiased;
  overscroll-behavior-y:none;
}
a{color:var(--accent);text-decoration:none;}
button,input,textarea{font-family:inherit;font-size:inherit;color:inherit;}
.wrap{max-width:680px;margin:0 auto;padding:0 20px;}
.hide{display:none!important;}
.tap{cursor:pointer;touch-action:manipulation;}

/* ---------------------------------------------------------- 顶栏 */
.bar{
  position:sticky;top:0;z-index:40;
  background:color-mix(in srgb,var(--bg) 88%,transparent);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--line);
  padding-top:var(--safe-t);
}
.bar-in{
  max-width:680px;margin:0 auto;height:50px;padding:0 8px 0 4px;
  display:flex;align-items:center;gap:6px;
}
.bar .ttl{
  flex:1;min-width:0;font-size:15px;font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  text-align:center;padding:0 4px;
}
.bar .ttl small{display:block;font-size:11px;color:var(--muted);font-weight:400;line-height:1.3;}
.iconbtn{
  appearance:none;border:0;background:transparent;
  width:44px;height:44px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  color:var(--text);font-size:15px;flex:none;
}
.iconbtn:active{background:var(--accent-soft);}
.iconbtn[disabled]{opacity:.28;}

/* ---------------------------------------------------------- 首页 */
.hero{padding:44px 0 30px;border-bottom:1px solid var(--line);}
.hero .kicker{
  font-size:12px;letter-spacing:.22em;color:var(--muted);
  text-transform:uppercase;margin-bottom:16px;
}
.hero h1{
  font-family:var(--serif);font-size:38px;line-height:1.18;
  margin:0;font-weight:600;letter-spacing:.04em;
}
.hero .sub{
  font-family:var(--serif);font-size:13px;letter-spacing:.3em;
  color:var(--muted);margin-top:10px;text-transform:uppercase;
}
.hero .tagline{
  margin:22px 0 0;font-size:16px;color:var(--text-2);
  font-family:var(--serif);letter-spacing:.05em;
}
.intro{margin-top:18px;font-size:15px;color:var(--text-2);line-height:1.85;}
.bullets{list-style:none;padding:0;margin:20px 0 0;display:flex;flex-direction:column;gap:8px;}
.bullets li{
  font-size:13px;color:var(--muted);padding-left:16px;position:relative;
}
.bullets li::before{
  content:"";position:absolute;left:2px;top:.66em;
  width:4px;height:4px;border-radius:50%;background:var(--accent-2);
}
.stats{
  display:flex;gap:0;margin-top:24px;border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.stats div{flex:1;padding:14px 0;text-align:center;border-right:1px solid var(--line);}
.stats div:last-child{border-right:0;}
.stats b{display:block;font-size:19px;font-weight:600;font-family:var(--serif);}
.stats span{font-size:11px;color:var(--muted);letter-spacing:.08em;}

.cta{padding:26px 0 8px;display:flex;flex-direction:column;gap:10px;}
.btn{
  appearance:none;border:1px solid var(--accent);background:var(--accent);
  color:#fff;border-radius:12px;padding:14px 18px;
  font-size:16px;font-weight:500;letter-spacing:.04em;
  display:flex;align-items:center;justify-content:center;gap:8px;
  touch-action:manipulation;width:100%;
}
.btn:active{opacity:.86;}
.btn.ghost{background:transparent;color:var(--accent);}
.btn.plain{background:transparent;color:var(--text-2);border-color:var(--line);}
.btn.sm{padding:10px 14px;font-size:14px;border-radius:10px;width:auto;}
.btn .sub{font-size:12px;opacity:.8;font-weight:400;}
.resume{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:14px 16px;display:flex;align-items:center;gap:12px;
}
.resume .m{flex:1;min-width:0;}
.resume .m b{display:block;font-size:14px;font-weight:500;}
.resume .m span{font-size:12px;color:var(--muted);}
.resume .go{color:var(--accent);font-size:13px;flex:none;}

.sec-title{
  display:flex;align-items:baseline;justify-content:space-between;
  margin:40px 0 4px;padding-bottom:12px;border-bottom:1px solid var(--line);
}
.sec-title h2{
  font-size:13px;letter-spacing:.2em;color:var(--muted);
  font-weight:500;margin:0;text-transform:uppercase;
}
.sec-title .note{font-size:12px;color:var(--muted);}

/* 分季列表 */
.seasons{border-bottom:1px solid var(--line);}
.season{border-bottom:1px solid var(--line-2);}
.season:last-child{border-bottom:0;}
.season.locked .sname,.season.locked .sno{color:var(--muted);}
.srow{
  display:flex;align-items:center;gap:14px;padding:16px 2px;
  touch-action:manipulation;
}
.sno{
  font-family:var(--serif);font-size:15px;width:34px;flex:none;
  color:var(--accent);letter-spacing:.02em;
}
.smeta{flex:1;min-width:0;}
.sname{font-size:16px;font-family:var(--serif);letter-spacing:.06em;}
.sname em{
  font-style:normal;font-size:11px;color:var(--muted);
  margin-left:8px;letter-spacing:.06em;
}
.sq{font-size:12px;color:var(--muted);margin-top:3px;
   white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.stag{
  font-size:11px;padding:3px 8px;border-radius:20px;flex:none;
  border:1px solid var(--line);color:var(--muted);
}
.stag.free{border-color:var(--accent-2);color:var(--accent);background:var(--accent-soft);}
.stag.soon{border-style:dashed;}
.stag.lock{border-color:var(--line);}
.chev{color:var(--muted);font-size:12px;flex:none;transition:transform .2s;}
.season.open .chev{transform:rotate(90deg);}
.chaps{display:none;padding:2px 0 14px 48px;}
.season.open .chaps{display:block;}
.chap{
  display:flex;align-items:center;gap:10px;padding:11px 0;
  border-top:1px solid var(--line-2);font-size:14px;color:var(--text-2);
  touch-action:manipulation;
}
.chap:first-child{border-top:0;}
.chap .cn{color:var(--muted);font-size:12px;width:30px;flex:none;font-variant-numeric:tabular-nums;}
.chap .ct{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chap .cs{font-size:11px;color:var(--muted);flex:none;}
.chap.read .ct{color:var(--muted);}

footer{
  padding:34px 0 calc(38px + var(--safe-b));
  color:var(--muted);font-size:12px;text-align:center;line-height:1.9;
}
footer .dot{opacity:.5;margin:0 6px;}

/* ---------------------------------------------------------- 阅读器 */
.reader-body{background:var(--bg);}
.read-main{padding:22px 0 40px;}
.chead{margin:0 0 26px;padding-bottom:20px;border-bottom:1px solid var(--line);}
.chead .cs{font-size:12px;letter-spacing:.18em;color:var(--muted);margin-bottom:8px;}
.chead h1{
  font-family:var(--serif);font-size:23px;font-weight:600;
  margin:0;line-height:1.4;letter-spacing:.03em;
}
.content{
  font-size:var(--fs);line-height:var(--lh);color:var(--text);
  letter-spacing:.012em;word-break:break-word;
}
.content p{margin:0 0 1.05em;text-indent:0;}
.content .md-sec{
  text-align:center;color:var(--muted);font-size:.78em;
  letter-spacing:.4em;margin:2.2em 0 2em;font-family:var(--serif);
  text-indent:0;
}
.content .md-sec-dot{letter-spacing:0;font-size:1em;}
.content .md-hr{border:0;height:1px;background:var(--line);margin:2.2em 0;}
.content blockquote{
  margin:1.6em 0;padding:.2em 0 .2em 1.1em;
  border-left:2px solid var(--accent-soft);color:var(--text-2);
}
.content blockquote p{margin:.3em 0;}
.content ul{margin:1.2em 0;padding-left:1.3em;}
.content ul li{margin:.35em 0;}
.content strong{font-weight:600;color:var(--text);}
.content h3{font-family:var(--serif);font-size:1.06em;margin:1.8em 0 .8em;}
.content code{background:var(--accent-soft);padding:.1em .35em;border-radius:4px;font-size:.92em;}
.md-table{margin:1.6em 0;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.md-table table{
  border-collapse:collapse;width:100%;font-size:.86em;line-height:1.6;
  min-width:min(100%,260px);
}
.md-table th,.md-table td{
  border:1px solid var(--line);padding:8px 10px;text-align:left;
  color:var(--text-2);vertical-align:top;
}
.md-table th{background:var(--surface-2);color:var(--text);font-weight:500;}

/* 章末 */
.chend{margin-top:44px;padding-top:28px;border-top:1px solid var(--line);}
.chend .label{font-size:13px;color:var(--muted);margin-bottom:12px;}
.fbs{display:flex;gap:8px;margin-bottom:18px;}
.fb{
  flex:1;appearance:none;background:var(--surface);border:1px solid var(--line);
  border-radius:10px;padding:12px 6px;font-size:14px;color:var(--text-2);
  touch-action:manipulation;
}
.fb:active{background:var(--accent-soft);}
.fb.on{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}
.fb small{display:block;font-size:11px;color:var(--muted);margin-top:2px;font-weight:400;}
.fb.on small{color:var(--accent);}
.cbox{margin-bottom:6px;}
.cbox textarea{
  width:100%;min-height:84px;resize:vertical;background:var(--surface);
  border:1px solid var(--line);border-radius:10px;padding:12px;
  font-size:15px;line-height:1.7;outline:none;
}
.cbox textarea:focus{border-color:var(--accent-2);}
.cbox .row{display:flex;align-items:center;justify-content:space-between;margin-top:10px;gap:10px;}
.cbox .hint{font-size:12px;color:var(--muted);}
.navrow{display:flex;gap:10px;margin-top:24px;}
.navrow .btn{flex:1;}

/* 阅读器底栏 */
.readbar{
  position:fixed;left:0;right:0;bottom:0;z-index:50;
  background:color-mix(in srgb,var(--bg) 92%,transparent);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-top:1px solid var(--line);
  padding-bottom:var(--safe-b);
}
.readbar-in{
  max-width:680px;margin:0 auto;height:52px;
  display:flex;align-items:center;justify-content:space-around;
}
.rb{
  appearance:none;border:0;background:transparent;flex:1;height:100%;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;
  font-size:11px;color:var(--text-2);touch-action:manipulation;
}
.rb:disabled{opacity:.3;}
.rb:active{background:var(--accent-soft);}
.rb svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6;
        stroke-linecap:round;stroke-linejoin:round;}
.progressline{
  position:fixed;left:0;right:0;top:0;height:2px;z-index:60;
  background:transparent;pointer-events:none;
}
.progressline i{display:block;height:100%;width:0;background:var(--accent-2);opacity:.7;}

/* 抽屉 */
.mask{
  position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:70;
  opacity:0;pointer-events:none;transition:opacity .22s;
}
.mask.on{opacity:1;pointer-events:auto;}
.sheet{
  position:fixed;left:0;right:0;bottom:0;z-index:80;
  background:var(--surface);border-radius:18px 18px 0 0;
  transform:translateY(101%);transition:transform .26s cubic-bezier(.32,.72,0,1);
  max-height:78vh;display:flex;flex-direction:column;
  padding-bottom:var(--safe-b);
}
.sheet.on{transform:translateY(0);}
.sheet-head{
  padding:16px 20px 12px;border-bottom:1px solid var(--line);
  display:flex;align-items:center;gap:12px;flex:none;
}
.sheet-head b{flex:1;font-size:15px;font-weight:500;}
.sheet-body{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:6px 0 12px;}
.setrow{
  display:flex;align-items:center;gap:12px;padding:16px 20px;
  border-bottom:1px solid var(--line-2);
}
.setrow .lb{flex:1;font-size:14px;color:var(--text-2);}
.stepper{display:flex;align-items:center;gap:6px;}
.stepper button{
  width:40px;height:36px;border:1px solid var(--line);background:var(--surface-2);
  border-radius:9px;font-size:17px;line-height:1;touch-action:manipulation;
}
.stepper button:active{background:var(--accent-soft);}
.stepper span{width:52px;text-align:center;font-size:13px;color:var(--muted);
              font-variant-numeric:tabular-nums;}
.seg{display:flex;border:1px solid var(--line);border-radius:9px;overflow:hidden;}
.seg button{
  border:0;background:var(--surface-2);padding:9px 15px;font-size:13px;
  color:var(--text-2);touch-action:manipulation;
}
.seg button.on{background:var(--accent-soft);color:var(--accent);}
.toc{padding:6px 0;}
.toc h4{
  font-size:12px;letter-spacing:.16em;color:var(--muted);font-weight:500;
  margin:16px 20px 8px;
}
.toc a{
  display:flex;align-items:center;gap:10px;padding:12px 20px;
  color:var(--text-2);font-size:14px;border-bottom:1px solid var(--line-2);
}
.toc a.cur{color:var(--accent);background:var(--accent-soft);}
.toc a .n{font-size:12px;color:var(--muted);width:28px;flex:none;
          font-variant-numeric:tabular-nums;}
.toc a.cur .n{color:var(--accent);}

/* ---------------------------------------------------------- 登录 */
.login-wrap{max-width:400px;margin:0 auto;padding:56px 24px calc(40px + var(--safe-b));}
.login-wrap h1{font-family:var(--serif);font-size:26px;margin:0 0 8px;font-weight:600;}
.login-wrap .desc{font-size:13px;color:var(--muted);margin-bottom:34px;line-height:1.8;}
.field{margin-bottom:16px;}
.field label{display:block;font-size:12px;color:var(--muted);margin-bottom:7px;letter-spacing:.06em;}
.field input{
  width:100%;background:var(--surface);border:1px solid var(--line);
  border-radius:11px;padding:13px 14px;font-size:16px;outline:none;
  letter-spacing:.04em;
}
.field input:focus{border-color:var(--accent-2);}
.field .inline{display:flex;gap:10px;}
.field .inline input{flex:1;}
.field .inline button{
  flex:none;padding:0 16px;border:1px solid var(--line);background:var(--surface-2);
  border-radius:11px;font-size:13px;color:var(--accent);white-space:nowrap;
  touch-action:manipulation;
}
.field .inline button:disabled{color:var(--muted);}
.msg{font-size:13px;margin:14px 0 0;min-height:20px;}
.msg.err{color:var(--danger);}
.msg.ok{color:var(--ok);}
.devnote{
  margin-top:18px;padding:12px 14px;border:1px dashed var(--accent-2);
  border-radius:10px;font-size:12px;color:var(--text-2);line-height:1.8;
  background:var(--accent-soft);
}
.legal{font-size:11px;color:var(--muted);margin-top:26px;line-height:1.9;}
.gate{
  max-width:420px;margin:0 auto;padding:64px 24px calc(40px + var(--safe-b));
  text-align:center;
}
.gate .lk{font-size:30px;color:var(--accent-2);margin-bottom:18px;}
.gate h2{font-family:var(--serif);font-size:21px;margin:0 0 14px;font-weight:600;}
.gate p{font-size:14px;color:var(--text-2);line-height:1.9;margin:0 0 26px;}
.gate .mini{font-size:12px;color:var(--muted);margin-top:18px;}

/* ---------------------------------------------------------- 我的 */
.me-head{padding:30px 0 22px;border-bottom:1px solid var(--line);}
.me-head .ph{font-family:var(--serif);font-size:22px;letter-spacing:.06em;}
.me-head .st{font-size:12px;color:var(--muted);margin-top:6px;}
.me-grid{display:flex;border-bottom:1px solid var(--line);}
.me-grid div{flex:1;padding:16px 0;text-align:center;border-right:1px solid var(--line);}
.me-grid div:last-child{border-right:0;}
.me-grid b{display:block;font-size:18px;font-family:var(--serif);}
.me-grid span{font-size:11px;color:var(--muted);}
.hist{margin-top:8px;}
.hitem{
  display:flex;align-items:center;gap:12px;padding:14px 2px;
  border-bottom:1px solid var(--line-2);touch-action:manipulation;
}
.hitem .t{flex:1;min-width:0;}
.hitem .t b{display:block;font-size:14px;font-weight:400;
            white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.hitem .t span{font-size:11px;color:var(--muted);}
.hitem .p{font-size:11px;color:var(--muted);flex:none;}
.empty{text-align:center;color:var(--muted);font-size:13px;padding:52px 0;line-height:2;}

/* ---------------------------------------------------------- 后台 */
.admin-body{font-size:14px;}
.admin-wrap{max-width:1080px;margin:0 auto;padding:0 16px calc(60px + var(--safe-b));}
.a-head{padding:26px 0 18px;display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap;}
.a-head h1{font-family:var(--serif);font-size:22px;margin:0;flex:1;font-weight:600;}
.a-head .tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.chip{
  font-size:12px;padding:6px 12px;border:1px solid var(--line);border-radius:20px;
  background:var(--surface);color:var(--text-2);touch-action:manipulation;
}
.chip.on{border-color:var(--accent);color:var(--accent);background:var(--accent-soft);}
.banner{
  border:1px dashed var(--accent-2);background:var(--accent-soft);color:var(--text-2);
  border-radius:10px;padding:11px 14px;font-size:12.5px;margin:14px 0;line-height:1.8;
}
.kpis{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin:6px 0 8px;}
.kpi{
  background:var(--surface);border:1px solid var(--line);border-radius:12px;
  padding:14px 15px;
}
.kpi b{display:block;font-size:23px;font-family:var(--serif);font-weight:600;line-height:1.2;}
.kpi span{display:block;font-size:11.5px;color:var(--muted);margin-top:5px;letter-spacing:.04em;}
.kpi em{display:block;font-size:11px;color:var(--accent);font-style:normal;margin-top:3px;}
.card{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);
  padding:18px;margin-top:16px;
}
.card>h3{
  font-size:13px;letter-spacing:.16em;color:var(--muted);font-weight:500;
  margin:0 0 4px;text-transform:uppercase;
}
.card .subh{font-size:12px;color:var(--muted);margin:0 0 16px;line-height:1.7;}
.funnel{margin-top:10px;}
.fstep{display:flex;align-items:center;gap:12px;padding:9px 0;}
.fstep .fl{width:112px;flex:none;font-size:13px;color:var(--text-2);}
.fstep .fbar{flex:1;height:8px;background:var(--line-2);border-radius:6px;overflow:hidden;}
.fstep .fbar i{display:block;height:100%;background:var(--accent-2);border-radius:6px;
               opacity:.85;transition:width .4s;}
.fstep .fn{width:62px;text-align:right;flex:none;font-size:13px;
           font-variant-numeric:tabular-nums;font-family:var(--serif);}
.fstep .fr{width:58px;text-align:right;flex:none;font-size:11.5px;color:var(--muted);}
.chart{display:flex;align-items:flex-end;gap:4px;height:120px;margin-top:8px;}
.chart .col{flex:1;display:flex;flex-direction:column;justify-content:flex-end;
            align-items:center;gap:3px;min-width:0;}
.chart .col i{display:block;width:100%;background:var(--accent-2);border-radius:3px 3px 0 0;
              opacity:.8;min-height:2px;}
.chart .col em{font-size:9px;color:var(--muted);font-style:normal;
               transform:scale(.9);white-space:nowrap;}
.tbl{width:100%;border-collapse:collapse;font-size:13px;}
.tbl th{
  text-align:left;font-weight:500;color:var(--muted);font-size:11.5px;
  letter-spacing:.06em;padding:8px 8px;border-bottom:1px solid var(--line);
  white-space:nowrap;
}
.tbl td{padding:9px 8px;border-bottom:1px solid var(--line-2);color:var(--text-2);
        vertical-align:top;}
.tbl td.num{font-variant-numeric:tabular-nums;font-family:var(--serif);color:var(--text);}
.tbl tr.linkr:active{background:var(--accent-soft);}
.tbl .nm{color:var(--text);}
.scrollx{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.ret{
  display:inline-block;min-width:46px;text-align:right;font-variant-numeric:tabular-nums;
}
.ret.good{color:var(--ok);}
.ret.bad{color:var(--danger);}
.two{display:grid;grid-template-columns:1fr;gap:16px;}
@media(min-width:820px){.two{grid-template-columns:1fr 1fr;}}
.trail{padding-left:14px;border-left:2px solid var(--line);margin-top:6px;}
.tday{margin-bottom:16px;}
.tday .dh{font-size:12px;color:var(--muted);margin-bottom:6px;letter-spacing:.06em;}
.tchap{
  display:flex;align-items:baseline;gap:10px;padding:5px 0;font-size:13px;
  color:var(--text-2);
}
.tchap .tm{font-size:11px;color:var(--muted);width:38px;flex:none;
           font-variant-numeric:tabular-nums;}
.tchap .tt{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tchap .ts{font-size:11px;color:var(--muted);flex:none;}
.tchap.done .tt::after{content:" ✓";color:var(--ok);}
.cmt{
  border-bottom:1px solid var(--line-2);padding:12px 0;font-size:13.5px;
  color:var(--text);line-height:1.8;
}
.cmt .meta{font-size:11.5px;color:var(--muted);margin-bottom:5px;}
.searchrow{display:flex;gap:8px;margin:6px 0 14px;}
.searchrow input{
  flex:1;background:var(--surface);border:1px solid var(--line);border-radius:10px;
  padding:11px 13px;font-size:14px;outline:none;
}
.bars .b{display:flex;align-items:center;gap:10px;padding:6px 0;font-size:13px;}
.bars .b .l{width:92px;flex:none;color:var(--text-2);}
.bars .b .r{flex:1;height:8px;background:var(--line-2);border-radius:6px;overflow:hidden;}
.bars .b .r i{display:block;height:100%;background:var(--accent-2);opacity:.85;}
.bars .b .n{width:56px;text-align:right;flex:none;font-variant-numeric:tabular-nums;
            font-family:var(--serif);}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin-top:10px;}
.legend i{display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:5px;}