/* 开源代码台：四个标签，每个标签一到两个盒子。只用 shared-nav.css 的颜色与字体变量，深浅两种主题都生效。 */
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.75 var(--font-sans)}
a{color:var(--accent-text)}
[hidden]{display:none!important}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,pre:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.cd{max-width:1120px;margin:0 auto;padding:0 20px 72px}

.cd-mast{padding:48px 0 18px;text-align:center}
.cd-eyebrow{margin:0 0 12px;font-size:11px;font-weight:700;letter-spacing:3px;color:var(--muted)}
.cd-mast h1{margin:0;font:600 clamp(32px,5vw,44px)/1.15 var(--font-serif);letter-spacing:.06em}
.cd-mast h1 span{display:block;margin-top:8px;font:italic 400 clamp(17px,2vw,20px)/1.3 var(--font-num);color:var(--muted);letter-spacing:.02em}
:root[lang=en] .cd-mast h1 span{display:none}
.cd-lead{max-width:44em;margin:16px auto 0;color:var(--ink-2);font-size:15.5px;line-height:1.9}

/* 标签 */
.cd-tabs{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:22px 0 4px}
.cd-tabs button{display:grid;gap:2px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);cursor:pointer;text-align:left;font:inherit}
.cd-tabs button b{font-size:15.5px}
.cd-tabs button small{font-size:12px;color:var(--muted);line-height:1.4}
.cd-tabs button:hover{border-color:var(--line-strong)}
.cd-tabs button[aria-selected=true]{border-color:var(--accent);box-shadow:inset 0 -3px 0 var(--accent)}

.cd-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:16px;align-items:start}
.cd-box{margin-top:16px;padding:22px 24px;border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:var(--shadow);min-width:0}
.cd-h2{margin:0 0 12px;font:600 13px/1.4 var(--font-sans);letter-spacing:2px;color:var(--muted)}
.cd-p{margin:0 0 12px;font-size:14px;color:var(--ink-2)}
.cd-small{margin:12px 0 0;font-size:12.5px;line-height:1.75;color:var(--muted)}
.cd-dim{color:var(--muted)}
.cd-empty{margin:0;color:var(--muted);font-size:14px}

/* 表单 */
.cd-field{display:grid;gap:6px;font-size:13px;color:var(--ink-2)}
.cd textarea,.cd input[type=text],.cd input[type=number],.cd select{width:100%;min-height:38px;padding:7px 10px;border:1px solid var(--line-strong);border-radius:8px;background:var(--paper);color:var(--ink);font:14px/1.5 var(--font-sans)}
.cd textarea{font:13px/1.55 var(--font-mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);resize:vertical}
.cd-row{display:flex;flex-wrap:wrap;align-items:end;gap:10px 12px;margin-top:12px}
.cd-row label{display:grid;gap:4px;font-size:13px;color:var(--ink-2);flex:1 1 120px;min-width:0}
.cd-row .cd-grow{flex:3 1 260px}
.cd-checks label,.cd-chk{display:flex;align-items:center;gap:8px;flex:0 1 auto;font-size:13.5px;color:var(--ink-2)}
.cd-chk{margin-top:12px}
.cd-checks input,.cd-chk input{width:17px;height:17px;accent-color:var(--accent)}
.cd-samples{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 12px;font-size:13px;color:var(--muted)}
.cd-samples button{min-height:32px;padding:3px 11px;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);cursor:pointer;font:500 13px var(--font-sans)}
.cd-samples button:hover{border-color:var(--accent)}
.cd-status{margin:8px 0 0;font-size:13px;color:var(--ok)}
.cd-status[data-bad=true]{color:var(--danger)}
.cd-status:empty{display:none}
.cd-preview{margin-top:14px}
/* 从 SMILES 生成、从模型接口送来 */
.cd-smiles{margin:0 0 14px;padding:12px 14px;border:1px dashed var(--line-strong);border-radius:12px;background:var(--paper)}
.cd-smi-row{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.cd-smi-row input{flex:1 1 200px;min-width:0;font-family:var(--font-mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace)!important}
.cd-smi-row .cd-btn,.cd-smi-row .sk-open{flex:0 0 auto}
.cd-smi-row .sk-open{margin-top:0;min-height:36px;border-radius:8px;font-size:13.5px}
.cd-smiles .cd-small{margin-top:8px}
.cd-smiles .cd-notes{margin-top:8px;font-size:13px}
.cd-import{margin:0 0 12px;padding:9px 12px;border-left:3px solid var(--accent);border-radius:8px;background:var(--paper);font-size:13.5px;color:var(--ink-2)}
.cd-gapnote{display:block}

.cd-btn{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:5px 14px;border:1px solid var(--line-strong);border-radius:8px;background:var(--surface);color:var(--ink);cursor:pointer;font:600 13.5px var(--font-sans);text-decoration:none}
.cd-btn:hover{border-color:var(--accent)}
.cd-btn:disabled{opacity:.45;cursor:default}
.cd-btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.cd-btn.primary:hover{background:var(--accent-hover)}
.cd-ask .cd-btn{flex:0 0 auto}
.cd-filepick{position:relative}
.cd-filepick input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.cd-filepick:focus-within{outline:3px solid var(--gold);outline-offset:2px}

/* 生成的输入 */
.cd-progs{display:flex;flex-wrap:wrap;gap:6px}
.cd-progs button{min-height:34px;padding:4px 12px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);cursor:pointer;font:600 13px var(--font-sans)}
.cd-progs button[aria-selected=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.cd-file{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:14px}
.cd-fname{font:600 13px var(--font-mono,ui-monospace,Menlo,Consolas,monospace);color:var(--ink-2)}
.cd-btns{display:flex;gap:6px}
.cd-code{margin:8px 0 0;padding:14px 16px;max-height:480px;overflow:auto;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font:12.5px/1.6 var(--font-mono,ui-monospace,SFMono-Regular,Menlo,Consolas,monospace);white-space:pre;tab-size:4}
.cd-code[data-empty=true]{display:none}
.cd-run{display:flex;flex-wrap:wrap;gap:6px;align-items:baseline;margin:10px 0 0;font-size:13px;color:var(--ink-2)}
.cd-run code{padding:2px 8px;border-radius:6px;background:var(--paper);border:1px solid var(--line);font-size:12.5px;overflow-wrap:anywhere}
.cd-notes{margin:12px 0 0;padding-left:20px;display:grid;gap:4px;font-size:13.5px;color:var(--ink-2)}
.cd-notes:empty{display:none}
.cd-notes li::marker{color:var(--gold)}

/* 读输出 */
.cd-dl{margin:0;display:grid;gap:0}
.cd-dl>div{display:grid;grid-template-columns:minmax(110px,32%) minmax(0,1fr);gap:10px;padding:8px 0;border-bottom:1px solid var(--line)}
.cd-dl>div:last-child{border-bottom:0}
.cd-dl dt{font-size:13px;color:var(--muted)}
.cd-dl dd{margin:0;display:grid;gap:2px;overflow-wrap:anywhere;font-size:14px}
.cd-num{font:600 15px var(--font-num)}
.cd-freqs{font:13px/1.7 var(--font-num)}
.cd-imag{color:var(--danger);font-weight:700}
b.ok{color:var(--ok)}
b.cond{color:var(--warn)}
b.no{color:var(--danger)}
.cd-warn{margin:12px 0 0;padding:10px 14px 10px 30px;border-radius:10px;background:color-mix(in srgb,var(--warn) 10%,transparent);border:1px solid color-mix(in srgb,var(--warn) 35%,transparent);display:grid;gap:4px;font-size:13.5px}
.cd-warn1{margin:0;color:var(--danger);font-size:14px}
.cd-ok{margin:12px 0 0;color:var(--ok);font-size:14px;font-weight:600}
.cd-diff,.cd-how{margin-top:16px;border-top:1px solid var(--line);padding-top:12px}
.cd-diff summary,.cd-how summary{cursor:pointer;font-weight:600;font-size:14px}
.cd-how ol{margin:10px 0 0;padding-left:22px;display:grid;gap:6px;font-size:14px;color:var(--ink-2)}
.cd-how code{font-size:12.5px}

/* 软件体检 */
.cd-check{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-top:14px}
.cd-check:empty{display:none}
.cd-card{padding:14px 16px;border:1px solid var(--line);border-radius:12px;background:var(--paper);min-width:0}
.cd-card h3{margin:0 0 8px;font:600 14px var(--font-sans)}
.cd-card-body>p{margin:0 0 6px;font-size:14px}
.cd-vulns{margin:8px 0 0;padding-left:18px;display:grid;gap:6px;font-size:13px;max-height:220px;overflow:auto}
.cd-vulns span{color:var(--ink-2)}
.cd-tablewrap{overflow-x:auto}
.cd-lic{width:100%;border-collapse:collapse;font-size:13px}
.cd-lic th,.cd-lic td{padding:8px 10px;border-bottom:1px solid var(--line);text-align:center;vertical-align:top}
.cd-lic thead th{font-weight:600;color:var(--muted);font-size:12.5px}
.cd-lic tbody th{text-align:left;font-weight:600;min-width:220px}
.cd-lic tbody th small{display:block;margin-top:4px;font-weight:400;color:var(--ink-2);line-height:1.6}
.cd-lic.small th,.cd-lic.small td{padding:6px 8px}

/* 搜代码 */
.cd-links{list-style:none;margin:14px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.cd-links li{display:grid;gap:4px}
.cd-links .cd-btn{justify-content:space-between}
.cd-links small{font-size:12px;color:var(--muted)}
#sr-repos{overflow-wrap:anywhere}

.cd-credits{margin-top:28px;font-size:12.5px;line-height:1.8;color:var(--muted)}
.cd-credits p{margin:0}

@media (max-width:860px){
  .cd-grid{grid-template-columns:minmax(0,1fr)}
  .cd-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cd-tabs button:last-child:nth-child(odd){grid-column:1/-1}
}
@media (max-width:560px){
  .cd{padding:0 14px 56px}
  .cd-box{padding:18px 16px}
  .cd-tabs button{padding:10px 12px}
  .cd-tabs button small{display:none}
  .cd-dl>div{grid-template-columns:minmax(0,1fr);gap:2px}
  .cd-lic tbody th{min-width:160px}
}
.cd-preview .button{display:inline-flex;align-items:center;min-height:34px;padding:4px 12px;border:1px solid var(--line-strong);border-radius:8px;background:var(--paper);color:var(--ink);cursor:pointer;font:600 13px var(--font-sans)}
.cd-preview .button:hover{border-color:var(--accent)}

/* 化学信息学（cheminf.js） */
.ci-add{margin-top:10px}
.ci-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px}
.ci-tools{display:flex;flex-wrap:wrap;gap:8px}
.ci-table{width:100%;border-collapse:collapse;font-size:13px}
.ci-table th,.ci-table td{padding:6px 8px;border-bottom:1px solid var(--line);vertical-align:middle;text-align:left}
.ci-table thead th{font-weight:600;color:var(--muted);font-size:12px;white-space:nowrap}
.ci-table thead th small{display:block;font-weight:400}
.ci-table td.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.ci-table td b,.ci-table td code,.ci-table td small{display:block;max-width:220px;overflow-wrap:anywhere}
.ci-table td code{font-size:11.5px;color:var(--ink-2);background:none;padding:0}
.ci-table td small{color:var(--muted);font-size:11.5px}
.ci-table tbody tr[data-i]{cursor:pointer}
.ci-table tbody tr[data-i]:hover{background:var(--paper)}
.ci-table tbody tr[aria-selected=true]{background:color-mix(in srgb,var(--accent) 10%,transparent)}
.ci-table tr.ci-bad td{color:var(--danger)}
.ci-img,.ci-big{background:#fff;border-radius:8px;line-height:0;border:1px solid var(--line)}
.ci-img{width:130px}
.ci-img svg{width:130px;height:95px}
.ci-big{max-width:360px;margin:0 auto 10px}
.ci-big svg{width:100%;height:auto}
.ss-acts{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.ss-acts .cd-btn{white-space:nowrap}
.ci-table td a[translate]{display:block;font-size:12px}
#ss-box{margin-top:16px}
.ci-ok{color:var(--ok);white-space:nowrap}
.ci-no{color:var(--danger);white-space:nowrap}
.ci-name{margin:6px 0;font-size:15px}
.ci-ids{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 12px;margin:8px 0;font-size:12.5px}
.ci-ids dt{color:var(--muted)}
.ci-ids dd{margin:0;overflow-wrap:anywhere}
.ci-ids code{font-size:12px}
.ci-more{margin-top:12px}
.ci-desc{width:100%;border-collapse:collapse;font-size:12.5px}
.ci-desc th,.ci-desc td{padding:4px 8px;border-bottom:1px solid var(--line);text-align:left;font-weight:400}
.ci-desc td.n{text-align:right;font-variant-numeric:tabular-nums}
@media (max-width:560px){
  .ci-img{width:120px}
  .ci-img svg{width:120px;height:85px}
}
.cd-steps{margin:14px 0 0}
.cd-steps svg{width:100%;max-width:420px;height:auto;display:block}
.cd-steps polyline{fill:none;stroke:var(--accent);stroke-width:2}
.cd-steps circle{fill:var(--accent)}
.cd-steps .ax{stroke:var(--line-strong);stroke-dasharray:3 3}
.cd-steps text{font-size:10px;fill:var(--muted);font-family:var(--font-num,inherit)}
.cd-steps figcaption{font-size:12px;color:var(--muted);margin-top:4px}
.cd-out3d{margin-top:10px}

/* 红外光谱（ir.js） */
.ir-box{margin:18px 0 0;padding:16px 18px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.ir-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px}
.ir-head h4{margin:0;font:600 15px/1.4 var(--font-sans);color:var(--ink)}
.ir-meta{font-size:12.5px;color:var(--muted)}
.ir-controls{display:flex;flex-wrap:wrap;gap:8px 18px;margin:12px 0 4px;font-size:13px;color:var(--ink-2)}
.ir-controls label{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.ir-controls input[type=range]{width:120px;accent-color:var(--accent)}
.ir-controls output{min-width:2ch;font:500 13px var(--font-num);color:var(--ink)}
.ir-controls input[type=number]{width:5.6em;padding:4px 6px;border:1px solid var(--line-strong);border-radius:6px;background:var(--surface);color:var(--ink);font:13px var(--font-num)}
.ir-controls select{padding:4px 6px;border:1px solid var(--line-strong);border-radius:6px;background:var(--surface);color:var(--ink);font:inherit}
.ir-fig{margin:8px 0 0}
.ir-svg{display:block;width:100%;height:auto}
.ir-curve{fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linejoin:round}
.ir-exp{fill:none;stroke:var(--info);stroke-width:1.3;stroke-dasharray:5 3}
.ir-stick{stroke:var(--gold);stroke-width:1.4}
.ir-stick:hover{stroke-width:3}
.ir-axis{stroke:var(--ink-2);stroke-width:1}
.ir-grid{stroke:var(--line);stroke-width:1}
.ir-tick,.ir-axl{font:11px var(--font-sans);fill:var(--muted)}
.ir-axl{fill:var(--ink-2)}
.ir-pk{font:600 10.5px var(--font-num);fill:var(--ink)}
.ir-cap{margin-top:6px;font-size:12.5px;line-height:1.7;color:var(--muted)}
.ir-actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin-top:10px}
.ir-actions button,.ir-file{display:inline-flex;align-items:center;min-height:34px;padding:4px 12px;border:1px solid var(--line-strong);border-radius:8px;background:var(--surface);color:var(--ink);font:500 13px var(--font-sans);cursor:pointer}
.ir-actions button:hover,.ir-file:hover{border-color:var(--accent)}
.ir-file input{position:absolute;width:1px;height:1px;opacity:0}
.ir-file:focus-within{outline:3px solid var(--gold);outline-offset:2px}
.ir-msg{font-size:12.5px;color:var(--ok)}
.ir-msg[data-bad="1"]{color:var(--danger)}
.ir-table{margin-top:10px;font-size:13px}
.ir-table summary{cursor:pointer;color:var(--accent-text);font-weight:600}
.ir-table table{width:100%;max-width:520px;margin-top:6px;border-collapse:collapse;font:12.5px var(--font-num)}
.ir-table th,.ir-table td{padding:3px 8px;border-bottom:1px solid var(--line);text-align:right}
.ir-table th{font:600 12px var(--font-sans);color:var(--muted)}
.ir-imag td{color:var(--danger)}
.cd-irnote{margin:12px 0 0;font-size:13px}
@media (max-width:560px){.ir-box{padding:12px}.ir-controls input[type=range]{width:96px}}
.ir-box .ir-controls input[type=number],.ir-box .ir-controls select{min-height:0;height:32px;margin:0;padding:3px 8px;font-size:13px;width:auto}
.ir-box .ir-controls input[type=number]{width:5.4em}
.ir-box .ir-controls input[type=range]{min-height:0;height:24px;padding:0;margin:0;border:0;background:none}
