/* 标签与状态：动态文案允许完整换行，不裁字。 */
.badge,.chip{display:inline-flex;align-items:center;justify-content:center;gap:7px;max-width:100%;min-height:28px;padding:4px 12px;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--bg);color:var(--text-muted);font-size:12px;line-height:1.5;white-space:normal;overflow-wrap:anywhere}
.badge::before{content:"";width:6px;height:6px;border-radius:var(--r-circle);background:var(--text-muted);color:var(--text);flex-shrink:0}
.badge-first,.badge-recommended{background:var(--bg-panel-2);color:var(--text)}
.badge-first::before,.badge-recommended::before{background:var(--accent);color:var(--white)}
.badge-archived::before{background:var(--warn);color:var(--text)}
.badge-error::before{background:var(--error);color:var(--white)}
.badge-success::before{background:var(--success);color:var(--white)}
.chip{font-size:13px}
.tab-list,[role="tablist"]{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 32px}
[role="tab"]{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 22px;border:1px solid var(--border);border-radius:var(--r-pill);font:inherit;line-height:1.5;background:var(--bg);color:var(--text-muted);transition:background-color var(--ease),color var(--ease)}
[role="tab"][aria-selected="true"]{background:var(--accent);color:var(--white);border-color:var(--accent)}
[role="tabpanel"]{min-width:0}
[role="tabpanel"]:focus-visible{outline-offset:6px}
.room-browser{display:grid;grid-template-columns:minmax(240px,.75fr) minmax(0,1.25fr);gap:72px;align-items:start}
.room-browser [role="tablist"]{display:flex;flex-direction:column;gap:0;margin:0}
.room-browser [role="tab"]{position:relative;display:block;width:100%;padding:24px 0 24px 24px;text-align:left;border:0;border-bottom:1px solid var(--border);border-radius:0;background:var(--bg);color:var(--text-muted)}
.room-browser [role="tab"][aria-selected="true"]{background:var(--bg);color:var(--text)}
.room-browser [role="tab"][aria-selected="true"]::before{content:"";position:absolute;left:0;top:40px;width:7px;height:7px;border-radius:var(--r-circle);background:var(--accent);color:var(--white)}
.room-name{display:block;font-family:var(--font-display);font-size:30px;font-weight:var(--weight-normal);line-height:1.3}
.room-note{display:block;margin-top:10px;font-size:14px;line-height:1.7;color:var(--text-muted)}
.room-panel{overflow:hidden;border-radius:var(--r-card);background:var(--bg-panel-2);color:var(--text)}
.room-picture{position:relative;min-width:0;padding:24px 24px 0}
.room-picture>svg{display:block;width:100%;height:auto;border-radius:var(--r-float)}
.room-setting{position:relative;margin:-44px 0 0 auto;padding:18px;width:min(320px,94%);background:var(--bg);color:var(--text);border-radius:var(--r-float);box-shadow:var(--shadow-float);font-size:14px}
.room-setting code{font-size:12px}
.room-body{padding:32px}
.room-body p{font-size:15px;line-height:1.9;color:var(--text-muted)}
.room-accordion-trigger{display:none}
.toc{position:sticky;top:16px;z-index:8;display:flex;flex-wrap:wrap;gap:8px;padding:12px;border:1px solid var(--border);border-radius:var(--r-float);background:var(--bg);color:var(--text);margin-bottom:40px}
.toc a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 16px;border-radius:var(--r-pill);font-size:14px;text-decoration:none}
.toc a:hover,.toc a[aria-current]{background:var(--bg-panel-2);color:var(--text)}
.faq-item{border-bottom:1px solid var(--border);padding:0}
.faq-item summary{position:relative;list-style:none;cursor:pointer;padding:24px 40px 24px 0;font-size:17px;color:var(--text)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:4px;top:22px;font-size:22px;font-weight:var(--weight-normal)}
.faq-item[open] summary::after{content:"−"}
.faq-answer{padding:0 32px 24px 0;color:var(--text-muted)}
.faq-answer p:last-child{margin-bottom:0}
.term-card{position:relative;border:0;border-top:1px solid var(--border);border-radius:0;padding:28px 0;background:var(--bg);color:var(--text)}
.term-card h3{margin:12px 0}
.term-card .term-alias{font-family:var(--font-mono);font-size:13px;color:var(--text-muted)}
.term-card p{color:var(--text-muted);font-size:15px}
.client-card{padding:32px;border:1px solid var(--border);border-radius:var(--r-card);background:var(--bg);color:var(--text);min-width:0}
.client-card.is-primary{box-shadow:var(--shadow-card)}
.client-head{display:flex;align-items:flex-start;gap:18px;margin-bottom:20px}
.client-head>div{min-width:0}
.client-icon{width:56px;height:56px;flex-shrink:0}
.client-head h3{font-size:28px;margin:0 0 10px}
.client-card p{color:var(--text-muted)}
.client-meta{display:flex;flex-wrap:wrap;gap:8px 20px;color:var(--text-muted);font-size:13px;margin-bottom:24px}
[data-rev]:empty{display:none}
.client-actions{display:flex;flex-wrap:wrap;gap:12px}
.post-card{display:flex;flex-direction:column;padding:28px 0;border-top:1px solid var(--border);min-width:0}
.post-meta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;color:var(--text-muted);font-size:12px;margin-bottom:20px}
.post-card h3{font-size:26px;line-height:1.4}
.post-card h3 a{text-decoration:none}
.post-card h3 a:hover{text-decoration:underline}
.post-card p{color:var(--text-muted);font-size:15px}
.post-card>.text-link{margin-top:auto;font-size:14px}
.callout{position:relative;margin:28px 0;padding:24px 28px;border:1px solid var(--border);border-left:3px solid var(--text-muted);border-radius:0 var(--r-float) var(--r-float) 0;background:var(--bg-panel-2);color:var(--text)}
.callout p:last-child{margin-bottom:0}
.callout-title{display:block;font-weight:var(--weight-strong);margin-bottom:8px}
.callout-warning{border-left-color:var(--warn)}
.callout-error{border-left-color:var(--error)}
.table-scroll{max-width:100%;min-width:0;overflow-x:auto;overscroll-behavior-inline:contain;border:1px solid var(--border);border-radius:var(--r-float)}
.data-table{border-collapse:collapse;width:100%;font-size:14px;background:var(--bg);color:var(--text)}
.data-table :is(th,td),.prose table :is(th,td){min-width:7em;padding:16px 20px;text-align:left;vertical-align:top;border-bottom:1px solid var(--border);overflow-wrap:normal;word-break:normal}
.data-table th,.prose table th{background:var(--bg-panel-2);color:var(--text);font-weight:var(--weight-strong)}
.data-table tr:last-child td{border-bottom:0}
.prose table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;min-width:0;border-collapse:collapse;overscroll-behavior-inline:contain}
.prose table code,.data-table code{overflow-wrap:anywhere;white-space:normal}
.article-download{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:32px;margin-top:48px;border-radius:var(--r-card);background:var(--bg-panel-2);color:var(--text)}
.article-download>div{min-width:0}
.article-download h2{font-size:28px;margin:0 0 10px}
.article-download p{margin:0;color:var(--text-muted);font-size:15px}
.article-download .btn{flex-shrink:0}
.dl-fab{position:fixed;right:24px;bottom:24px;z-index:20;display:inline-flex;align-items:center;justify-content:center;gap:12px;max-width:calc(100% - 40px);min-height:60px;padding:12px 24px;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--bg);color:var(--text);box-shadow:var(--shadow-float);text-decoration:none;font-size:14px}
.dl-fab .ico{width:22px;height:22px;flex-shrink:0}
.dl-fab small{display:block;font-size:12px;color:var(--text-muted)}
/* 预览页也使用可复用的色板与字号样张。 */
.swatch-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.swatch{margin:0;min-width:0}
.swatch-surface{height:86px;border:1px solid var(--border);border-radius:var(--r-float);margin-bottom:10px}
.swatch figcaption{font-family:var(--font-mono);font-size:12px;overflow-wrap:anywhere}
.swatch-bg{background:var(--bg);color:var(--text)}
.swatch-panel{background:var(--bg-panel);color:var(--text)}
.swatch-panel2{background:var(--bg-panel-2);color:var(--text)}
.swatch-border{background:var(--border);color:var(--text)}
.swatch-accent{background:var(--accent);color:var(--white)}
.swatch-dark{background:var(--accent-dark);color:var(--white)}
.swatch-text{background:var(--text);color:var(--white)}
.swatch-muted{background:var(--text-muted);color:var(--white)}
.swatch-success{background:var(--success);color:var(--white)}
.swatch-warn{background:var(--warn);color:var(--text)}
.swatch-error{background:var(--error);color:var(--white)}
.swatch-link{background:var(--link);color:var(--white)}
.swatch-apricot{background:var(--apricot);color:var(--text)}
.swatch-white{background:var(--white);color:var(--text)}
.swatch-glow{background:var(--glow-warm);color:var(--text)}
.swatch-veil{background:var(--veil);color:var(--text)}
.swatch-hairline{background:var(--hairline-ink);color:var(--text)}
.swatch-overlay{background:var(--overlay);color:var(--text)}
.swatch-clear{background:var(--clear);color:var(--text)}
.type-display{font:var(--weight-normal) var(--display-size)/1.2 var(--font-display)}
.type-mono{font-family:var(--font-mono)}
.preview-section{border-top:1px solid var(--border)}
@media(max-width:860px){
  .room-browser{grid-template-columns:1fr;gap:24px}
  .room-browser[data-tabs-ready] [role="tablist"]{display:none}
  .room-accordion-trigger{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:68px;text-align:left;padding:18px 20px;border:1px solid var(--border);border-radius:var(--r-float);background:var(--bg);color:var(--text);font-family:var(--font-display);font-size:24px}
  .room-accordion-trigger::after{content:"+";flex-shrink:0}
  .room-accordion-trigger[aria-expanded="true"]::after{content:"−"}
  .room-browser .room-panels{display:grid;gap:16px}
  .swatch-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:640px){
  .room-picture{padding:16px 16px 0}
  .room-body{padding:24px}
  .room-name{font-size:28px}
  .client-card{padding:24px}
  .client-head{gap:14px}
  .client-head h3{font-size:24px}
  .article-download{flex-direction:column;align-items:flex-start;padding:24px}
  .toc{position:static}
  .swatch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dl-fab{right:20px;bottom:20px;padding:10px 18px}
}