/* 设置项对照台与平台切换 */
.tabs { min-width:0; }
.tabs__list,[role="tablist"] { display:flex; flex-wrap:wrap; gap:8px; min-width:0; }
.tabs__tab,[role="tab"] {
  position:relative;
  min-height:48px;
  padding:12px 20px;
  text-align:left;
  border:1px solid var(--c-line);
  border-radius:var(--r-ctl);
  background:var(--c-paper);
  color:var(--c-ink-muted);
  font-weight:var(--weight-normal);
}
.tabs__tab:hover,[role="tab"]:hover { background:var(--c-paper-2); color:var(--c-ink); }
.tabs__tab[aria-selected="true"],[role="tab"][aria-selected="true"] {
  background:var(--c-paper);
  color:var(--c-ink);
  border-color:var(--c-line);
  box-shadow:inset 0 -3px var(--c-accent);
}
.tabs__panel { margin-top:24px; min-width:0; }
.settings-desk { display:grid; grid-template-columns:270px minmax(0,1fr); gap:32px; }
.settings-desk > .tabs__list { flex-direction:column; flex-wrap:nowrap; gap:4px; }
.settings-desk .tabs__tab { padding:18px 22px; border-color:var(--c-clear); background:var(--c-clear); color:var(--c-ink-muted); }
.settings-desk .tabs__tab[aria-selected="true"] { background:var(--c-paper); color:var(--c-ink); box-shadow:inset 3px 0 var(--c-accent); }
.tabs__path { display:block; font-family:var(--font-mono); font-size:11px; color:var(--c-ink-muted); margin-bottom:5px; overflow-wrap:anywhere; }
.tabs__name { display:block; font-size:18px; }
.settings-desk .tabs__panel { margin-top:0; }
.settings-detail { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:36px; align-items:center; min-height:340px; }
.settings-detail p { color:var(--c-ink-muted); margin-top:18px; }
.mini-settings { padding:20px; border:1px solid var(--c-line); border-radius:var(--r-ctl); background:var(--c-paper-2); color:var(--c-ink); }
.mini-settings__head { font-size:var(--fs-small); padding-bottom:12px; margin-bottom:16px; border-bottom:1px solid var(--c-line); }
.mini-settings__row { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-top:16px; font-size:var(--fs-small); }
.mini-settings__value { padding:4px 10px; border:1px solid var(--c-line-strong); border-radius:var(--r-sq); background:var(--c-paper); color:var(--c-ink); overflow-wrap:anywhere; }

/* 长页锚点导航。直接父容器应覆盖全文。 */
.toc { display:flex; flex-wrap:wrap; gap:8px; padding:14px; border:1px solid var(--c-line); border-radius:var(--r-card); background:var(--c-paper); color:var(--c-ink); }
.toc a { display:flex; align-items:center; min-height:44px; padding:8px 14px; font-size:var(--fs-small); border-radius:var(--r-ctl); }
.toc a:hover,.toc a[aria-current] { background:var(--c-paper-2); color:var(--c-link); }
.toc--sticky { position:sticky; top:12px; z-index:10; }
.toc--static { position:static; }

.faq-item { border-bottom:1px solid var(--c-line); background:var(--c-paper); color:var(--c-ink); }
.faq-item:first-child { border-top:1px solid var(--c-line); }
.faq-item summary { position:relative; padding:22px 40px 22px 0; list-style:none; font-size:18px; cursor:pointer; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"+"; position:absolute; right:6px; top:19px; color:var(--c-link); font-family:var(--font-mono); font-size:24px; }
.faq-item[open] summary::after { content:"−"; }
.faq-item__answer { padding-bottom:24px; padding-right:28px; color:var(--c-ink-muted); }
.faq-item__answer p + p { margin-top:12px; }

.term-card { padding:26px; border:1px solid var(--c-line); border-radius:var(--r-card); background:var(--c-paper); color:var(--c-ink); }
.term-card__category { font-family:var(--font-mono); font-size:var(--fs-caption); color:var(--c-ink-muted); margin-bottom:12px; }
.term-card h3 { font-family:var(--font-mono); font-size:22px; }
.term-card p { margin-top:14px; color:var(--c-ink-muted); }
.term-card__related { display:block; margin-top:20px; color:var(--c-link); font-size:var(--fs-small); }

.badges { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.badge,.tag {
  display:inline-flex;
  align-items:center;
  gap:6px;
  max-width:100%;
  min-width:0;
  overflow:hidden;
  padding:3px 9px;
  border:1px solid var(--c-line);
  border-radius:var(--r-sq);
  background:var(--c-paper-2);
  color:var(--c-ink-muted);
  font-size:var(--fs-caption);
  line-height:1.5;
  overflow-wrap:anywhere;
}
.badge--first { background:var(--c-accent-soft); color:var(--c-ink); border-color:var(--c-accent); }
.badge--recommended { background:var(--c-paper); color:var(--c-link); border-color:var(--c-field); }
.badge--retired { background:var(--c-paper-2); color:var(--c-ink-muted); border-color:var(--c-line-strong); }
.status-dot { display:inline-block; width:6px; height:6px; border-radius:var(--r-round); background:var(--c-success); flex-shrink:0; }
.status-dot--warn { background:var(--c-warn); }
.status-dot--error { background:var(--c-error); }
.client-card { padding:30px; border:1px solid var(--c-line); border-radius:var(--r-card); background:var(--c-paper); color:var(--c-ink); box-shadow:var(--sh-card); }
.client-card__head { display:flex; align-items:center; flex-wrap:wrap; gap:16px; margin-bottom:20px; }
.client-card__logo { width:56px; height:56px; flex-shrink:0; }
.client-card__name { font-size:26px; }
.client-card__version { color:var(--c-ink-muted); font-family:var(--font-mono); font-size:var(--fs-small); }
.client-card__description { color:var(--c-ink-muted); }
.client-card__actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:24px; }
.client-card__minor { margin-top:14px; display:flex; flex-wrap:wrap; gap:10px 18px; font-size:var(--fs-small); }
.client-card__minor a { color:var(--c-link); text-decoration:underline; text-underline-offset:3px; }

.platform-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.platform-card { position:relative; padding:26px; border:1px solid var(--c-line); border-top:2px solid var(--c-field); border-radius:var(--r-card); background:var(--c-paper); color:var(--c-ink); }
.platform-card__icon { width:28px; height:28px; color:var(--c-link); margin-bottom:20px; }
.platform-card h3 { font-size:22px; }
.platform-card p { margin-top:12px; color:var(--c-ink-muted); font-size:var(--fs-small); }
.platform-card a { display:inline-flex; align-items:center; min-height:44px; margin-top:16px; color:var(--c-link); font-size:var(--fs-small); }

.article-card { display:flex; flex-direction:column; padding:28px; background:var(--c-paper); color:var(--c-ink); border:1px solid var(--c-line); border-radius:var(--r-card); transition:box-shadow var(--motion-fast),border-color var(--motion-fast); }
.article-card:hover { border-color:var(--c-line-strong); box-shadow:var(--sh-card); }
.article-card__meta { display:flex; flex-wrap:wrap; align-items:center; gap:10px; color:var(--c-ink-muted); font-family:var(--font-mono); font-size:var(--fs-caption); }
.article-card h3 { font-size:22px; line-height:1.5; margin-top:20px; }
.article-card p { margin-top:14px; color:var(--c-ink-muted); font-size:var(--fs-small); }
.article-card__link { display:inline-flex; align-items:center; min-height:44px; align-self:flex-start; margin-top:20px; color:var(--c-link); font-size:var(--fs-small); }

.callout { padding:22px 24px; border:1px solid var(--c-line); border-left:3px solid var(--c-field); border-radius:var(--r-ctl); background:var(--c-paper-2); color:var(--c-ink); }
.callout__title { display:block; font-weight:var(--weight-medium); margin-bottom:8px; }
.callout p { color:var(--c-ink-muted); }
.callout--warning { border-left-color:var(--c-warn); }
.callout--success { border-left-color:var(--c-success); }
.callout--error { border-left-color:var(--c-error); }
.table-scroll { width:100%; max-width:100%; min-width:0; overflow-x:auto; overscroll-behavior-x:contain; border:1px solid var(--c-line); border-radius:var(--r-ctl); }
.data-table { width:100%; border-collapse:collapse; text-align:left; background:var(--c-paper); color:var(--c-ink); font-size:var(--fs-small); }
.data-table th,.data-table td,.prose table th,.prose table td,.article-body table th,.article-body table td {
  min-width:7em;
  padding:14px 18px;
  border-bottom:1px solid var(--c-line);
  vertical-align:top;
  overflow-wrap:normal;
  word-break:normal;
}
.data-table th,.prose table th,.article-body table th { background:var(--c-paper-2); color:var(--c-ink); font-weight:var(--weight-medium); }
.data-table tr:last-child td { border-bottom:0; }
.prose table,.article-body table {
  display:block;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  max-width:100%;
  min-width:0;
  border-collapse:collapse;
  text-align:left;
  background:var(--c-paper);
  color:var(--c-ink);
}
.data-table code,.prose table code,.article-body table code { overflow-wrap:anywhere; }

.dl-fab {
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:30;
  display:flex;
  align-items:center;
  gap:12px;
  max-width:calc(100vw - 32px);
  padding:14px 20px;
  border:1px solid var(--c-line);
  border-radius:var(--r-card);
  box-shadow:var(--sh-menu);
  background:var(--c-paper);
  color:var(--c-ink);
}
.dl-fab:hover { border-color:var(--c-field); }
.dl-fab svg { width:24px; height:24px; color:var(--c-field); flex-shrink:0; }
.dl-fab__title { display:block; font-size:var(--fs-small); font-weight:var(--weight-medium); }
.dl-fab__hint { display:block; color:var(--c-ink-muted); font-size:var(--fs-caption); }
.article-download { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:24px; padding:28px; border:1px solid var(--c-line); border-top:2px solid var(--c-field); border-radius:var(--r-card); background:var(--c-paper-2); color:var(--c-ink); margin-top:40px; }
.article-download__copy { flex:1 1 260px; }
.article-download h2 { font-size:26px; }
.article-download p { color:var(--c-ink-muted); margin-top:8px; }

.quick-steps { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:44px; list-style:none; padding:0; margin:0; }
.quick-steps li { position:relative; }
.quick-steps li:not(:last-child)::after { content:""; position:absolute; top:28px; left:76px; right:-24px; border-top:1px dashed var(--c-field); }
.quick-steps__number { display:block; font-family:var(--font-mono); font-size:38px; line-height:1.5; color:var(--c-link); }
.quick-steps h3 { font-size:22px; margin-top:18px; }
.quick-steps p { margin-top:12px; color:var(--c-ink-muted); }
.quick-steps__more { display:inline-flex; align-items:center; min-height:44px; color:var(--c-link); margin-top:32px; }

/* 拍板首屏：平铺钴蓝、轨道背景、跨界编辑窗 */
.hero { position:relative; padding-top:30px; }
.hero__copy { position:relative; z-index:3; padding-left:calc(4% + 13px); }
.chips { display:flex; flex-wrap:wrap; gap:10px; }
.chip { display:inline-flex; align-items:center; gap:8px; min-height:28px; max-width:100%; padding:3px 12px; border-radius:var(--r-pill); background:var(--c-white-08); color:var(--c-white-88); border:1px solid var(--c-white-24); font-size:13px; line-height:1.5; }
.chip__dot { width:6px; height:6px; border-radius:var(--r-round); background:var(--c-white); flex-shrink:0; }
.chip__mono { font-family:var(--font-mono); font-size:12px; }
.hero__title { margin-top:18px; font-size:var(--fs-h1); font-weight:var(--weight-normal); line-height:1.14; letter-spacing:-.005em; color:var(--c-white); }
.hero__line { display:block; }
.nodemark { display:inline-block; width:.62em; height:.62em; margin-left:.18em; vertical-align:.42em; color:var(--c-cyan); }
.lede { margin-top:14px; max-width:780px; font-size:17px; line-height:1.6; color:var(--c-white-88); }
.lede strong { font-weight:var(--weight-strong); color:var(--c-white); }
.cta { display:flex; align-items:center; gap:16px; margin-top:26px; }
.cta__note { margin-left:14px; padding-left:18px; border-left:1px solid var(--c-white-24); font-size:13px; line-height:1.55; color:var(--c-white-88); }
.platforms { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:22px; }
.platforms__label { margin-right:6px; font-family:var(--font-mono); font-size:12px; color:var(--c-white-88); }
.plat { display:inline-flex; align-items:center; gap:8px; min-height:32px; padding:4px 13px 4px 11px; border:1px solid var(--c-white-36); border-radius:var(--r-ctl); color:var(--c-white); font-size:13px; line-height:1.5; transition:background var(--motion-fast),border-color var(--motion-fast); }
.plat:hover { background:var(--c-white-14); color:var(--c-white); border-color:var(--c-white-72); }
.plat svg { width:15px; height:15px; flex-shrink:0; }
.orbit { position:absolute; z-index:1; top:24px; right:calc(4% + 8px); width:320px; height:320px; pointer-events:none; }
.orbit__halo { position:absolute; inset:60px; border-radius:var(--r-round); background:radial-gradient(circle,var(--c-white-24) 0%,var(--c-white-08) 45%,var(--c-clear) 72%); }
.orbit__ring { position:absolute; border-radius:var(--r-round); }
.orbit__ring--outer { inset:0; border:1px solid var(--c-white-24); }
.orbit__ring--inner { inset:50px; border:1px dashed var(--c-white-36); animation:orbit-turn 72s linear infinite; }
.orbit__node { position:absolute; width:7px; height:7px; border-radius:var(--r-round); background:var(--c-white); }
.orbit__node--a { top:-4px; left:calc(50% - 3.5px); }
.orbit__node--b { bottom:28px; right:12px; opacity:.7; }
.orbit__node--c { bottom:28px; left:12px; opacity:.45; }
.orbit__core { position:absolute; top:50%; left:50%; width:96px; height:96px; margin:-48px 0 0 -48px; border-radius:var(--r-round); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:2px; background:var(--c-white-14); color:var(--c-white); border:1px solid var(--c-white-56); }
.orbit__core-k { font-family:var(--font-mono); font-size:10px; color:var(--c-white-88); letter-spacing:.08em; }
.orbit__core-v { font-family:var(--font-display); font-size:20px; }
.orbit__tag { position:absolute; transform:translate(-50%,-50%); height:24px; padding:0 10px; display:inline-flex; align-items:center; border-radius:var(--r-pill); border:1px solid var(--c-white-36); background:var(--c-field); color:var(--c-white-88); font-family:var(--font-mono); font-size:11.5px; white-space:nowrap; }
.orbit__tag--vmess { left:105px; top:10px; }
.orbit__tag--vless { left:299px; top:80px; background:var(--c-white); color:var(--c-field-ink); border-color:var(--c-white); }
.orbit__tag--trojan { left:283px; top:263px; }
.orbit__tag--ss { left:92px; top:305px; }
.orbit__tag--reality { left:2px; top:132px; }
@keyframes orbit-turn { to { transform:rotate(360deg); } }

.stage { position:relative; z-index:4; width:92%; margin:32px auto -180px; }
.stage::before { content:""; position:absolute; inset:18px 4% -6px; border-radius:var(--r-frame); background:linear-gradient(120deg,var(--c-cyan-pale),var(--c-field-deep) 40%,var(--c-accent) 80%,var(--c-peach)); filter:blur(28px); opacity:.45; z-index:-1; }
.stage::after { content:""; position:absolute; left:7%; right:7%; bottom:-22px; height:44px; border-radius:var(--r-round); background:var(--c-shade-30); filter:blur(20px); z-index:-2; }
.stage__tilt { transform:perspective(2200px) rotateX(4deg); transform-origin:50% 100%; }
.frame { padding:12px; border-radius:var(--r-frame); background:linear-gradient(135deg,var(--c-cyan-pale) 0%,var(--c-field-deep) 38%,var(--c-accent) 80%,var(--c-peach) 100%); color:var(--c-ink); box-shadow:var(--sh-frame),inset 0 0 0 1px var(--c-white-24); }
.win { background:var(--c-paper); color:var(--c-ink); border:1px solid var(--c-line); border-radius:var(--r-win); overflow:hidden; box-shadow:var(--sh-window); }
.win__bar { min-height:40px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:6px 12px 6px 14px; background:var(--c-paper-2); color:var(--c-ink); border-bottom:1px solid var(--c-line); }
.win__title { display:flex; align-items:center; flex-wrap:wrap; gap:10px; font-size:13px; line-height:1.4; font-weight:var(--weight-medium); }
.win__glyph { width:16px; height:16px; flex-shrink:0; border-radius:var(--r-sq); background:var(--c-field); color:var(--c-white); display:flex; align-items:center; justify-content:center; }
.win__glyph::after { content:""; width:6px; height:6px; border-radius:var(--r-round); background:var(--c-white); }
.win__sep { color:var(--c-ink-muted); font-weight:var(--weight-normal); }
.win__actions { display:flex; gap:8px; flex-shrink:0; }
.wbtn { height:26px; min-width:64px; padding:0 14px; display:inline-flex; align-items:center; justify-content:center; border-radius:var(--r-sq); font-size:12.5px; line-height:1.4; }
.wbtn--ok { background:var(--c-field); color:var(--c-white); }
.wbtn--cancel { background:var(--c-paper); color:var(--c-ink); border:1px solid var(--c-line-strong); }
.win__body { display:grid; grid-template-columns:168px minmax(0,1fr); min-height:250px; }
.plist { background:var(--c-paper-2); color:var(--c-ink-muted); border-right:1px solid var(--c-line); padding:14px 10px; }
.kicker { display:block; min-height:16px; margin-bottom:10px; font-family:var(--font-mono); font-size:11px; line-height:16px; color:var(--c-ink-muted); letter-spacing:.03em; }
.plist .kicker { padding-left:10px; }
.plist__item { position:relative; min-height:30px; display:flex; align-items:center; padding-left:12px; border-radius:var(--r-ctl); font-family:var(--font-mono); font-size:12.5px; }
.plist__item.is-on { background:var(--c-accent-soft); color:var(--c-ink); font-weight:var(--weight-medium); }
.plist__item.is-on::before { content:""; position:absolute; left:0; top:6px; bottom:6px; width:3px; border-radius:var(--r-pill); background:var(--c-accent); }
.plist__item.is-on::after { content:""; position:absolute; right:10px; top:50%; width:6px; height:6px; margin-top:-3px; border-radius:var(--r-round); background:var(--c-accent); }
.form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:30px; padding:14px 22px; }
.form__col { display:flex; flex-direction:column; min-width:0; }
.form__rows { display:flex; flex-direction:column; gap:8px; }
.frow { display:grid; grid-template-columns:98px minmax(0,1fr); align-items:center; min-height:26px; }
.frow__k { font-family:var(--font-mono); font-size:11.5px; color:var(--c-ink-muted); }
.frow__v { position:relative; min-height:26px; display:flex; align-items:center; padding:3px 10px; border:1px solid var(--c-line); border-radius:var(--r-ctl); background:var(--c-paper); color:var(--c-ink); font-family:var(--font-mono); font-size:12px; line-height:1.5; overflow-wrap:anywhere; }
.frow__v--select { padding-right:28px; }
.frow__v--select::after { content:""; position:absolute; right:11px; top:50%; width:5px; height:5px; margin-top:-4px; border-right:1.5px solid var(--c-ink-muted); border-bottom:1.5px solid var(--c-ink-muted); transform:rotate(45deg); }
.frow__v--focus { border-color:var(--c-field); box-shadow:var(--focus-ring); }
.frow__v--empty { color:var(--c-ink-muted); }
.win__foot { min-height:46px; display:flex; align-items:center; flex-wrap:wrap; gap:12px 26px; padding:8px 18px; border-top:1px solid var(--c-line); background:var(--c-paper); color:var(--c-ink); }
.core { display:flex; align-items:center; gap:10px; }
.core__k { font-family:var(--font-mono); font-size:11.5px; color:var(--c-ink-muted); }
.seg { display:inline-flex; padding:2px; border:1px solid var(--c-line); border-radius:var(--r-ctl); background:var(--c-paper-2); color:var(--c-ink-muted); }
.seg__opt { height:22px; padding:0 12px; display:inline-flex; align-items:center; border-radius:var(--r-sq); font-family:var(--font-mono); font-size:12px; }
.seg__opt.is-on { background:var(--c-accent-soft); color:var(--c-ink); box-shadow:inset 0 0 0 1px var(--c-accent); font-weight:var(--weight-medium); }
.foot__div { width:1px; height:20px; background:var(--c-line); flex-shrink:0; }
.tog { display:inline-flex; align-items:center; gap:8px; font-size:12.5px; color:var(--c-ink); }
.tog__sw { position:relative; width:30px; height:17px; border-radius:var(--r-pill); background:var(--c-line-strong); flex-shrink:0; }
.tog__sw::after { content:""; position:absolute; top:2px; left:2px; width:13px; height:13px; border-radius:var(--r-round); background:var(--c-paper); box-shadow:0 1px 2px var(--c-shade-14); }
.tog.is-on .tog__sw { background:var(--c-field); }
.tog.is-on .tog__sw::after { left:15px; }
.tog__mono { font-family:var(--font-mono); font-size:12px; }
.fold { position:relative; z-index:1; min-height:300px; background:var(--c-paper); color:var(--c-ink); overflow:hidden; }
.fold__glow { position:absolute; right:1%; top:40px; width:64%; height:240px; border-radius:var(--r-round); background:linear-gradient(90deg,var(--c-glow-orange),var(--c-glow-cyan)); filter:blur(60px); }

/* 预览色板。透明令牌叠在蓝底上展示，不作为文字底色。 */
.swatch-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.swatch { border:1px solid var(--c-line); border-radius:var(--r-ctl); overflow:hidden; background:var(--c-paper); color:var(--c-ink); }
.swatch__paint { display:block; height:64px; background:var(--swatch-color); }
.swatch__label { display:block; padding:10px 12px; font-family:var(--font-mono); font-size:11px; overflow-wrap:anywhere; }
.swatch--field { --swatch-color:var(--c-field); }
.swatch--deep { --swatch-color:var(--c-field-deep); }
.swatch--field-ink { --swatch-color:var(--c-field-ink); }
.swatch--ring { --swatch-color:var(--c-field-ring); }
.swatch--paper { --swatch-color:var(--c-paper); }
.swatch--paper2 { --swatch-color:var(--c-paper-2); }
.swatch--line { --swatch-color:var(--c-line); }
.swatch--line-strong { --swatch-color:var(--c-line-strong); }
.swatch--accent { --swatch-color:var(--c-accent); }
.swatch--accent-dark { --swatch-color:var(--c-accent-dark); }
.swatch--accent-soft { --swatch-color:var(--c-accent-soft); }
.swatch--cyan { --swatch-color:var(--c-cyan); }
.swatch--cyan-pale { --swatch-color:var(--c-cyan-pale); }
.swatch--peach { --swatch-color:var(--c-peach); }
.swatch--ink { --swatch-color:var(--c-ink); }
.swatch--muted { --swatch-color:var(--c-ink-muted); }
.swatch--faint { --swatch-color:var(--c-ink-faint); }
.swatch--white { --swatch-color:var(--c-white); }
.swatch--w88 { --swatch-color:var(--c-white-88); }
.swatch--w72 { --swatch-color:var(--c-white-72); }
.swatch--w56 { --swatch-color:var(--c-white-56); }
.swatch--w36 { --swatch-color:var(--c-white-36); }
.swatch--w24 { --swatch-color:var(--c-white-24); }
.swatch--w14 { --swatch-color:var(--c-white-14); }
.swatch--w08 { --swatch-color:var(--c-white-08); }
.swatch--orange-glow { --swatch-color:var(--c-glow-orange); }
.swatch--cyan-glow { --swatch-color:var(--c-glow-cyan); }
.swatch--s06 { --swatch-color:var(--c-shade-06); }
.swatch--s14 { --swatch-color:var(--c-shade-14); }
.swatch--s30 { --swatch-color:var(--c-shade-30); }
.swatch--s42 { --swatch-color:var(--c-shade-42); }
.swatch--success { --swatch-color:var(--c-success); }
.swatch--warn { --swatch-color:var(--c-warn); }
.swatch--error { --swatch-color:var(--c-error); }
.swatch--clear { --swatch-color:var(--c-clear); }
.swatch--on-blue .swatch__paint { background:linear-gradient(var(--swatch-color),var(--swatch-color)),var(--c-field); }
.preview-stack { display:grid; gap:24px; }
.preview-buttons { display:flex; flex-wrap:wrap; align-items:center; gap:16px; }
.preview-blue { padding:28px; background:var(--c-field); color:var(--c-white); border-radius:var(--r-card); }
.preview-type { display:grid; gap:20px; }
.preview-type__display { font-family:var(--font-display); font-size:var(--fs-h1); line-height:1.14; }
.preview-type__small { font-size:var(--fs-caption); color:var(--c-ink-muted); }

@media (max-width:1180px) {
  .orbit { display:none; }
  .settings-desk { grid-template-columns:230px minmax(0,1fr); gap:24px; }
  .settings-detail { gap:24px; }
}
@media (max-width:900px) {
  .cta__note { display:none; }
  .form { grid-template-columns:minmax(0,1fr); gap:14px; }
  .foot__div { display:none; }
  .settings-detail { grid-template-columns:minmax(0,1fr); }
  .platform-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:760px) {
  .hero__copy { padding-left:0; }
  .hero__title { font-size:var(--fs-h1); }
  .lede { font-size:15px; }
  .cta { flex-wrap:wrap; }
  .stage { width:100%; }
  .win__body { grid-template-columns:minmax(0,1fr); }
  .plist { display:none; }
  .stage__tilt { transform:none; }
  .settings-desk { grid-template-columns:minmax(0,1fr); }
  .settings-desk > .tabs__list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
  .settings-desk .tabs__tab { padding:14px; }
  .tabs__name { font-size:16px; }
  .quick-steps { grid-template-columns:minmax(0,1fr); gap:26px; }
  .quick-steps li:not(:last-child)::after { display:none; }
  .quick-steps h3 { margin-top:4px; }
}
@media (max-width:640px) {
  .platforms { gap:8px; }
  .platforms__label { width:100%; }
  .platform-grid { gap:14px; }
  .platform-card { padding:18px; }
  .swatch-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .client-card { padding:22px; }
  .form { padding:14px 12px; }
  .frow { grid-template-columns:88px minmax(0,1fr); }
  .win__bar { padding-inline:10px; align-items:flex-start; }
  .win__title { gap:5px; }
  .win__actions { gap:4px; }
  .wbtn { min-width:40px; padding-inline:7px; }
  .win__foot { padding-inline:12px; gap:12px; }
  .frame { padding:8px; }
  .tabs__list > [role="tab"] { padding:10px 14px; }
  .dl-fab { right:16px; bottom:16px; padding:12px 16px; }
  .article-download { padding:22px; }
}