/* 路由调度台：静态拼贴，不对产品示意添加动画。 */
.deck { position: relative; flex: 1; margin-top: 48px; isolation: isolate; overflow-x: clip; }
.deck__grid { display: grid; grid-template-columns: 380fr 536fr 380fr; column-gap: var(--gap-deck); width: 100%; max-width: 1440px; margin-inline: auto; padding-inline: var(--edge); align-items: start; }
.col { position: relative; display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.col--l { padding-top: 32px; }
.col--r { padding-top: 20px; }
.slot { position: relative; min-width: 0; }
.slot--in-l { margin-left: 56px; }
.slot--in-r { margin-right: 56px; }
.chip { position: absolute; z-index: 0; pointer-events: none; }
.chip--coral { left: -56px; top: 28px; width: 84px; height: 220px; background: linear-gradient(165deg,var(--c-coral),var(--c-coral-soft)); color: var(--c-ink); clip-path: polygon(28px 0,100% 0,100% 100%,0 100%,0 28px); }
.chip--peri { right: -56px; top: 18px; width: 84px; height: 220px; background: linear-gradient(195deg,var(--c-peri),var(--c-peri-soft)); color: var(--c-ink); clip-path: polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,0 100%); }
.chip--lime { top: -26px; right: -26px; width: 176px; height: 128px; border-radius: var(--r-mini); background: linear-gradient(var(--c-ink-a14) 1px,var(--c-clear) 1px) 0 0/22px 22px,linear-gradient(90deg,var(--c-ink-a14) 1px,var(--c-clear) 1px) 0 0/22px 22px,linear-gradient(135deg,var(--c-accent),var(--c-accent-soft)); color: var(--c-ink); }
.ucard { position: relative; z-index: 1; min-width: 0; overflow: hidden; border: 1px solid var(--c-card-line); border-radius: var(--r-card); color: var(--c-text); box-shadow: var(--shadow-card); }
.ucard--a { background: var(--c-card-a); color: var(--c-text); }
.ucard--b { background: var(--c-card-b); color: var(--c-text); }
.ucard--c { background: var(--c-card-c); color: var(--c-text); }
.ucard__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 46px; padding: 10px 16px; border-bottom: 1px solid var(--c-card-line); }
.ucard__title { font-size: var(--fs-nav); font-weight: var(--fw-medium); color: var(--c-text); }
.ucard__path { font-size: 11px; color: var(--c-muted); }
.rules { padding: 6px; }
.rules li { display: grid; grid-template-columns: 8px minmax(0,1fr) auto 58px; align-items: center; column-gap: 10px; min-height: 32px; padding: 5px 10px; font-family: var(--f-mono); font-size: 12.5px; color: var(--c-text); }
.rules li + li { border-top: 1px solid var(--c-card-line); }
.rules__pre, .rules__arrow { color: var(--c-muted); }
.dot { display: inline-block; width: 8px; height: 8px; border-radius: var(--r-circle); }
.dot--coral { background: var(--c-coral); }
.dot--peri { background: var(--c-peri); }
.dot--lime { background: var(--c-accent); }
.out { justify-self: end; padding: 1px 8px; border: 1px solid var(--c-card-line); border-radius: var(--r-pill); font-size: 11px; color: var(--c-muted); background: var(--c-white-a04); }
.win__bar { display: flex; align-items: flex-end; gap: 14px; height: 42px; padding-inline: 14px; border-bottom: 1px solid var(--c-card-line); background: var(--c-card-b); color: var(--c-text); }
.win__dots { display: flex; gap: 6px; align-self: center; }
.win__dots i { width: 10px; height: 10px; border-radius: var(--r-circle); background: var(--c-panel-2); border: 1px solid var(--c-border); }
.win__tabs { display: flex; gap: 2px; }
.win__tab { display: flex; align-items: center; height: 31px; padding-inline: 13px; margin-bottom: -1px; border: 1px solid var(--c-clear); border-bottom: 0; border-radius: var(--r-tab) var(--r-tab) 0 0; font-family: var(--f-mono); font-size: var(--fs-xs); color: var(--c-muted); }
.win__tab.is-on { background: var(--c-card-a); border-color: var(--c-card-line); color: var(--c-text); box-shadow: inset 0 2px 0 var(--c-accent); }
.win__meta { margin-left: auto; align-self: center; font-family: var(--f-mono); font-size: 11px; color: var(--c-muted); }
.code { padding-block: 12px; font-family: var(--f-mono); font-size: 12.5px; line-height: 19px; counter-reset: ln; overflow-x: auto; }
.code li { position: relative; padding-left: 52px; padding-right: 16px; white-space: pre; color: var(--c-text); }
.code li::before { counter-increment: ln; content: counter(ln); position: absolute; left: 0; width: 36px; text-align: right; color: var(--c-muted); }
.code li.is-hl { background: var(--c-accent-a08); color: var(--c-text); box-shadow: inset 2px 0 0 var(--c-accent); }
.t-k { color: var(--c-accent); }
.t-s { color: var(--c-code-str); }
.t-n { color: var(--c-text); }
.t-p { color: var(--c-muted); }
.radios { display: flex; flex-direction: column; gap: 4px; padding: 6px 8px; }
.radios li { display: flex; align-items: center; gap: 10px; min-height: 28px; padding: 3px 10px; border: 1px solid var(--c-clear); border-radius: var(--r-row); font-size: var(--fs-small); color: var(--c-muted); }
.radio { display: grid; place-items: center; flex: none; width: 14px; height: 14px; border-radius: var(--r-circle); border: 1.5px solid var(--c-muted); }
.radios li.is-on { color: var(--c-accent); background: var(--c-accent-a08); border-color: var(--c-accent-a30); }
.radios li.is-on .radio { border-color: var(--c-accent); }
.radios li.is-on .radio::after { content: ""; width: 6px; height: 6px; border-radius: var(--r-circle); background: var(--c-accent); }
.switchrow { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 6px 18px 14px; padding-top: 12px; border-top: 1px solid var(--c-card-line); font-size: var(--fs-small); color: var(--c-text); }
.switch { position: relative; flex-shrink: 0; width: 34px; height: 20px; border-radius: var(--r-pill); background: var(--c-panel-2); border: 1px solid var(--c-border); }
.switch::after { content: ""; position: absolute; top: 3px; left: 3px; width: 12px; height: 12px; border-radius: var(--r-circle); background: var(--c-muted); }
.switch.is-on { background: var(--c-accent); border-color: var(--c-accent-dark); }
.switch.is-on::after { left: 17px; background: var(--c-ink); }
.field { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 14px 16px 0; }
.field__label { flex: none; width: 56px; font-size: var(--fs-xs); color: var(--c-muted); }
.field__label--wide { width: 72px; }
.select { flex: 1; display: flex; align-items: center; justify-content: space-between; min-height: 36px; padding: 6px 12px; border: 1px solid var(--c-accent-a40); border-radius: var(--r-field); background: var(--c-card-a); font-family: var(--f-mono); font-size: var(--fs-small); color: var(--c-text); }
.select svg { width: 14px; height: 14px; color: var(--c-accent); }
.menu { margin: 6px 16px 14px 84px; padding: 4px; border: 1px solid var(--c-card-line); border-radius: var(--r-field); background: var(--c-panel-2); color: var(--c-text); box-shadow: var(--shadow-pop); }
.menu li { display: flex; align-items: center; justify-content: space-between; min-height: 28px; padding: 4px 10px; border-radius: var(--r-small); font-family: var(--f-mono); font-size: 12.5px; color: var(--c-muted); }
.menu li.is-cur { color: var(--c-text); }
.menu li.is-cur svg { width: 14px; height: 14px; color: var(--c-accent); }
.menu li.is-hover { background: var(--c-white-a06); color: var(--c-text); }
.pills { display: flex; flex-wrap: wrap; gap: 6px; }
.pills li { display: inline-flex; align-items: center; min-height: 22px; padding: 2px 9px; border: 1px solid var(--c-card-line); border-radius: var(--r-pill); font-size: 11.5px; color: var(--c-muted); overflow-wrap: anywhere; }
.pills li.is-on { border-color: var(--c-accent-a30); color: var(--c-text); background: var(--c-card-c); }
.input { flex: 1; min-width: 0; display: flex; align-items: center; min-height: 34px; padding: 6px 12px; border: 1px solid var(--c-card-line); border-radius: var(--r-row); background: var(--c-card-a); font-size: 12.5px; color: var(--c-muted); overflow-wrap: anywhere; }
.subfoot { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: space-between; margin: 12px 16px 16px; font-size: 12.5px; color: var(--c-muted); }
.minibtn { display: inline-flex; align-items: center; min-height: 30px; padding: 5px 12px; border: 1px solid var(--c-border); border-radius: var(--r-row); background: var(--c-card-c); font-size: 12.5px; color: var(--c-text); }
.minibtn--accent { background: var(--c-accent); border-color: var(--c-accent-dark); color: var(--c-ink); font-weight: var(--fw-bold); }
/* 左侧标签、右侧舞台 */
.act2 { margin: 0 16px 16px; padding: 88px 72px 96px; border-radius: var(--r-panel); background: var(--c-light); color: var(--c-ink); color-scheme: light; }
.act2__grid { display: grid; grid-template-columns: minmax(0,5fr) minmax(0,7fr); gap: 72px; max-width: 1280px; margin-inline: auto; }
.act2__side { position: sticky; top: 32px; align-self: start; }
.act2__title { font-family: var(--f-display); font-weight: var(--fw-display); font-size: var(--fs-h2); line-height: 1.12; letter-spacing: -.02em; }
.tabs { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 32px; }
.tab { min-height: 44px; max-width: 100%; padding: 9px 20px; border: 1px solid var(--c-ink); border-radius: var(--r-pill); font-size: var(--fs-nav); font-weight: var(--fw-medium); color: var(--c-ink); background: var(--c-clear); overflow-wrap: anywhere; }
.tab:hover { background: var(--c-ink-a06); color: var(--c-ink); }
.tab[aria-selected="true"] { background: var(--c-accent); color: var(--c-ink); }
.tabs--horizontal { flex-direction: row; flex-wrap: wrap; margin-top: 0; }
.tabs--dark .tab { border-color: var(--c-border-strong); color: var(--c-text); }
.tabs--dark .tab:hover { background: var(--c-panel-2); color: var(--c-text); }
.tabs--dark .tab[aria-selected="true"] { background: var(--c-accent); color: var(--c-ink); }
[role="tabpanel"] { min-width: 0; }
.act2__stage { border-top: 1px solid var(--c-ink); padding-top: 28px; }
.stage-h { padding-bottom: 28px; border-bottom: 1px solid var(--c-ink); font-family: var(--f-display); font-weight: var(--fw-heavy); font-size: var(--fs-h3); letter-spacing: -.02em; }
.stage-h__ico { display: inline-grid; vertical-align: middle; place-items: center; width: 36px; height: 36px; margin-right: 14px; border: 1px solid var(--c-ink); border-radius: var(--r-row); background: var(--c-accent); color: var(--c-ink); }
.stage-h__ico svg { width: 18px; height: 18px; }
.stage-body { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1.25fr); gap: 40px; margin-top: 32px; }
.home-feature-grid .stage-body { grid-template-columns: minmax(0,1fr); }
.stage-text p { font-size: var(--fs-button); line-height: 1.8; color: var(--c-ink-muted); }
.stage-text b { font-weight: var(--fw-bold); color: var(--c-ink); }
.tlink { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 22px; padding: 10px 18px; border: 1px solid var(--c-ink); border-radius: var(--r-btn); font-size: var(--fs-nav); font-weight: var(--fw-bold); color: var(--c-ink); }
.tlink:hover { background: var(--c-ink-a06); color: var(--c-ink); }
.board { min-width: 0; overflow: hidden; padding: 36px 0 0 36px; border: 1px solid var(--c-ink); border-radius: var(--r-board); background: linear-gradient(var(--c-ink-a14) 1px,var(--c-clear) 1px) 0 0/48px 48px,linear-gradient(90deg,var(--c-ink-a14) 1px,var(--c-clear) 1px) 0 0/48px 48px,linear-gradient(150deg,var(--c-accent),var(--c-accent-soft)); color: var(--c-ink); }
.mini { padding-bottom: 18px; border-radius: var(--r-mini) 0 0 0; background: var(--c-panel); color: var(--c-text); box-shadow: var(--shadow-pop); }
.mini .ucard__head { min-height: 50px; padding-inline: 20px; }
.mini .field { padding: 12px 20px 0; }
.mini .input--val { color: var(--c-text); }
.mini__foot { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; margin: 16px 20px 0; font-size: 12.5px; color: var(--c-muted); }
.mini__toggle { display: inline-flex; align-items: center; gap: 10px; }
/* 目录必须直接置于覆盖全部章节的内容父容器中。 */
.toc { position: sticky; top: 0; z-index: 10; display: flex; gap: 8px; max-width: 100%; overflow-x: auto; padding: 14px 16px; border: 1px solid var(--c-border); border-radius: var(--r-field); background: var(--c-bg); color: var(--c-text); overscroll-behavior-inline: contain; }
.toc a { display: inline-flex; flex-shrink: 0; align-items: center; min-height: 44px; padding: 8px 14px; border-radius: var(--r-pill); font-size: var(--fs-nav); }
.toc a:hover, .toc a[aria-current="location"] { background: var(--c-accent); color: var(--c-ink); }
.faq { border-top: 1px solid var(--c-border); }
.faq__item { border-bottom: 1px solid var(--c-border); }
.faq__item summary { position: relative; padding: 22px 40px 22px 4px; cursor: pointer; list-style: none; font-weight: var(--fw-medium); }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary::after { content: "+"; position: absolute; right: 8px; top: 20px; color: var(--c-accent); font-family: var(--f-mono); font-size: var(--fs-lead); }
.faq__item[open] summary::after { content: "−"; }
.faq__answer { padding: 0 4px 24px; color: var(--c-muted); }
.panel .faq, .panel .faq__item { border-color: var(--c-ink-a14); }
.panel .faq__answer { color: var(--c-ink-muted); }
.panel .faq__item summary::after { color: var(--c-ink); }
.term-card { padding: 28px; border: 1px solid var(--c-border); border-radius: var(--r-mini); background: var(--c-panel); color: var(--c-text); }
.term-card__term { font-family: var(--f-mono); font-size: var(--fs-lead); font-weight: var(--fw-bold); }
.term-card__definition { margin-top: 14px; color: var(--c-muted); }
.term-card__category { margin-top: 20px; font-size: var(--fs-xs); color: var(--c-accent); }
.download-card { padding: 28px; border: 1px solid var(--c-border); border-radius: var(--r-card); background: var(--c-panel); color: var(--c-text); box-shadow: var(--shadow-card); }
.download-card__head { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; margin-bottom: 20px; }
.app-icon { width: 56px; height: 56px; flex-shrink: 0; }
.download-card__body { color: var(--c-muted); }
.download-card__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.download-card__meta { margin-top: 16px; font-size: var(--fs-small); color: var(--c-muted); }
.badges { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.badge, .tag { display: inline-flex; align-items: center; gap: 7px; max-width: 100%; padding: 4px 10px; border: 1px solid var(--c-border); border-radius: var(--r-pill); background: var(--c-panel-2); color: var(--c-text); font-size: var(--fs-xs); overflow-wrap: anywhere; }
.badge--first, .badge--recommended { background: var(--c-accent); color: var(--c-ink); border-color: var(--c-accent-dark); font-weight: var(--fw-bold); }
.badge--retired { background: var(--c-panel-2); color: var(--c-muted); border-color: var(--c-border-strong); }
.article-card { display: flex; flex-direction: column; gap: 20px; min-width: 0; padding: 28px; border: 1px solid var(--c-border); border-radius: var(--r-card); background: var(--c-card-a); color: var(--c-text); }
.article-card__meta { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; color: var(--c-muted); font-size: var(--fs-xs); }
.article-card__title { font-size: var(--fs-lead); line-height: 1.5; }
.article-card__title a:hover { text-decoration: underline; text-underline-offset: .2em; }
.article-card__summary { color: var(--c-muted); font-size: var(--fs-nav); }
.article-card__link { margin-top: auto; color: var(--c-accent); font-size: var(--fs-nav); }
.callout { padding: 24px; border: 1px solid var(--c-accent-a30); border-left: 3px solid var(--c-accent); border-radius: var(--r-field); background: var(--c-panel); color: var(--c-text); }
.callout p + p { margin-top: 12px; }
.callout__title { display: block; margin-bottom: 8px; font-weight: var(--fw-bold); color: var(--c-accent); }
.callout--warn { border-left-color: var(--c-warn); }
.callout--warn .callout__title { color: var(--c-warn); }
.callout--error { border-left-color: var(--c-error); }
.callout--error .callout__title { color: var(--c-error); }
.callout--success { border-left-color: var(--c-success); }
.callout--success .callout__title { color: var(--c-success); }
.table-scroll { min-width: 0; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; border: 1px solid var(--c-border); border-radius: var(--r-field); }
.data-table { width: 100%; border-collapse: collapse; font-size: var(--fs-nav); color: var(--c-text); }
.data-table caption { padding: 16px; background: var(--c-panel); color: var(--c-text); }
.data-table th, .data-table td, .prose table th, .prose table td, .article-body table th, .article-body table td { min-width: 7em; padding: 16px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--c-border); overflow-wrap: normal; word-break: normal; }
.data-table th, .prose table th, .article-body table th { background: var(--c-panel-2); color: var(--c-text); font-weight: var(--fw-medium); }
.data-table td, .prose table td, .article-body table td { background: var(--c-panel); color: var(--c-text); }
.prose table, .article-body table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; min-width: 0; border-collapse: collapse; }
.data-table code, .prose table code, .article-body table code { overflow-wrap: anywhere; word-break: normal; }
.dl-fab { position: fixed; right: max(20px,env(safe-area-inset-right)); bottom: max(20px,env(safe-area-inset-bottom)); z-index: 15; display: flex; align-items: center; gap: 12px; max-width: calc(100vw - 40px); padding: 14px 18px; border: 1px solid var(--c-accent-dark); border-radius: var(--r-btn); background: var(--c-accent); color: var(--c-ink); box-shadow: var(--shadow-pop); font-size: var(--fs-nav); font-weight: var(--fw-bold); }
.dl-fab svg { width: 22px; height: 22px; }
.dl-fab:hover { background: var(--c-accent-hover); color: var(--c-ink); }
.article-download { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; padding: 28px; margin-top: 48px; border: 1px solid var(--c-border); border-radius: var(--r-card); background: var(--c-panel); color: var(--c-text); }
.article-download__text { flex: 1 1 240px; min-width: 0; }
.article-download__title { font-size: var(--fs-lead); font-weight: var(--fw-bold); }
.article-download__text p { margin-top: 8px; color: var(--c-muted); font-size: var(--fs-nav); }
/* 仅供设计预览的色板，实际组件不得以这些类代替语义样式。 */
.palette { display: grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: 12px; }
.swatch { min-width: 0; padding: 10px; border: 1px solid var(--c-border); border-radius: var(--r-field); background: var(--c-panel); color: var(--c-text); }
.swatch i { display: block; height: 56px; margin-bottom: 10px; border: 1px solid var(--c-border-strong); border-radius: var(--r-small); }
.swatch code { font-size: var(--fs-xs); }
.sw-bg { background: var(--c-bg); }
.sw-panel { background: var(--c-panel); }
.sw-panel2 { background: var(--c-panel-2); }
.sw-border { background: var(--c-border); }
.sw-strong { background: var(--c-border-strong); }
.sw-grid { background: var(--c-grid); }
.sw-a { background: var(--c-card-a); }
.sw-b { background: var(--c-card-b); }
.sw-c { background: var(--c-card-c); }
.sw-line { background: var(--c-card-line); }
.sw-accent { background: var(--c-accent); }
.sw-accent-dark { background: var(--c-accent-dark); }
.sw-hover { background: var(--c-accent-hover); }
.sw-soft { background: var(--c-accent-soft); }
.sw-coral { background: var(--c-coral); }
.sw-coral-soft { background: var(--c-coral-soft); }
.sw-peri { background: var(--c-peri); }
.sw-peri-soft { background: var(--c-peri-soft); }
.sw-text { background: var(--c-text); }
.sw-muted { background: var(--c-muted); }
.sw-faint { background: var(--c-faint); }
.sw-faint2 { background: var(--c-faint-2); }
.sw-string { background: var(--c-code-str); }
.sw-light { background: var(--c-light); }
.sw-ink { background: var(--c-ink); }
.sw-ink-muted { background: var(--c-ink-muted); }
.sw-success { background: var(--c-success); }
.sw-warn { background: var(--c-warn); }
.sw-error { background: var(--c-error); }
.sw-a08 { background: var(--c-accent-a08); }
.sw-a18 { background: var(--c-accent-a18); }
.sw-a30 { background: var(--c-accent-a30); }
.sw-a40 { background: var(--c-accent-a40); }
.sw-i06 { background: var(--c-ink-a06); }
.sw-i14 { background: var(--c-ink-a14); }
.sw-p60 { background: var(--c-panel-a60); }
.sw-w04 { background: var(--c-white-a04); }
.sw-w06 { background: var(--c-white-a06); }
.sw-b60 { background: var(--c-black-a60); }
.sw-b70 { background: var(--c-black-a70); }
.sw-clear { background: var(--c-clear); }
.sw-mask { background: var(--m-on); }
.preview-block { margin-top: 32px; }
.preview-type > * + * { margin-top: 20px; }
.preview-static-menu { display: none; position: relative; }
.preview-static-menu summary { list-style: none; cursor: pointer; min-width: 44px; min-height: 44px; padding: 8px; border: 1px solid var(--c-border); border-radius: var(--r-field); text-align: center; }
.preview-static-menu nav { position: absolute; right: 0; top: 52px; width: min(280px,calc(100vw - 40px)); padding: 12px; border: 1px solid var(--c-border); border-radius: var(--r-field); background: var(--c-bg); color: var(--c-text); max-height: 70dvh; overflow-y: auto; }
.preview-static-menu nav a { display: flex; align-items: center; min-height: 44px; width: 100%; padding: 10px; }
@media (max-width: 1280px) { .preview-static-menu { display: block; } }
@media (max-width: 1180px) {
  .deck__grid { grid-template-columns: minmax(0,1fr) minmax(0,1.4fr); column-gap: 24px; }
  .col--r { display: none; }
  .act2 { padding: 64px 40px; }
  .act2__grid { gap: 48px; }
}
@media (max-width: 860px) {
  .deck__grid { grid-template-columns: minmax(0,1fr); padding-inline: 20px; }
  .col--l { display: none; }
  .act2__grid { grid-template-columns: minmax(0,1fr); }
  .act2__side { position: static; }
  .stage-body { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 640px) {
  .act2 { margin: 0 8px 8px; padding: 48px 22px; border-radius: var(--r-card); }
  .tabs { flex-direction: row; flex-wrap: wrap; gap: 8px; }
  .tab { padding-inline: 14px; }
  .board { padding: 24px 0 0 18px; }
  .mini .field { flex-wrap: wrap; }
  .mini .field__label { width: 100%; }
  .win__meta { display: none; }
  .win__bar { gap: 8px; padding-inline: 10px; }
  .win__tab { padding-inline: 9px; }
  .code { font-size: 11px; }
  .code li { padding-left: 36px; }
  .code li::before { width: 25px; }
  .term-card, .download-card, .article-card { padding: 22px; }
  .dl-fab { right: 16px; bottom: max(16px,env(safe-area-inset-bottom)); max-width: calc(100vw - 32px); }
}