/* A2 portal palette. Cloud Dancer mixed with 50% white; existing layout and motion are inherited. */
:root {
  --bg: #f8f7f4;
  --paper: #fff;
  --ink: #08141c;
  --text: #172126;
  --muted: #586369;
  --line: #e0ddd9;
  --mesh-blue: 185 216 242;
  --mesh-sky: 143 188 230;
  --mesh-gray: 196 213 229;
  --mesh-lilac: 213 200 238;
  --mesh-core: 192 176 228;
  --mesh-rose: 219 183 181;
  --mesh-gold: 229 197 94;
  --mesh-peach: 223 193 175;
  --mesh-ivory: 247 244 238;
  --mesh-dark-ink: #f5f8f9;

  --mesh-main: var(--mesh-blue);
  --mesh-support: var(--mesh-lilac);
  --mesh-accent: #5a477b;
  --mesh-border: #c5cbdc;
  --mesh-light: radial-gradient(ellipse 65% 95% at 92% 6%, rgb(var(--mesh-blue) / .50), transparent 72%), radial-gradient(ellipse 57% 80% at 3% 95%, rgb(var(--mesh-lilac) / .38), transparent 73%), radial-gradient(ellipse 32% 65% at 52% 20%, rgb(var(--mesh-gold) / .10), transparent 74%);
  --mesh-soft: radial-gradient(ellipse 65% 110% at 100% 0%, rgb(var(--mesh-blue) / .29), transparent 72%), radial-gradient(ellipse 55% 95% at 0% 100%, rgb(var(--mesh-lilac) / .23), transparent 73%);
  --mesh-hero: radial-gradient(ellipse 36% 65% at 70% 14%, rgb(var(--mesh-blue) / .34), transparent 76%), radial-gradient(ellipse 28% 58% at 97% 70%, rgb(var(--mesh-lilac) / .24), transparent 78%), radial-gradient(ellipse 25% 45% at 40% 3%, rgb(var(--mesh-peach) / .17), transparent 80%);
  --mesh-dark: linear-gradient(90deg, #08141c88 0%, #08141c24 46%, transparent 74%), radial-gradient(ellipse 52% 105% at 100% 0%, rgb(var(--mesh-sky) / .39), transparent 72%), radial-gradient(ellipse 45% 85% at 72% 85%, rgb(var(--mesh-core) / .24), transparent 74%), radial-gradient(ellipse 24% 75% at 52% 0%, rgb(var(--mesh-gold) / .15), transparent 75%);
  --mesh-track: radial-gradient(ellipse 36% 160% at 100% 100%, rgb(var(--mesh-core) / .35), transparent 80%), radial-gradient(ellipse 32% 160% at 72% 0%, rgb(var(--mesh-sky) / .18), transparent 82%);
  --mesh-primary: radial-gradient(ellipse at 90% 100%, rgb(var(--mesh-core) / .73), transparent 75%), radial-gradient(ellipse at 0% 0%, rgb(var(--mesh-blue) / .88), transparent 80%), linear-gradient(#f7f4ee, #f1f2f4);
  --mesh-primary-ink: #24313b;
  --mesh-chart: linear-gradient(180deg, #b9d8f2, #95adbf);
  --mesh-chart-current: linear-gradient(155deg, #b9d8f2, #c0b0e4);
  --mesh-calendar: 143 172 198;
}

body { background-color: var(--bg); }
.hero { background-image: var(--mesh-hero); }
.note-human { background-color: #fff; background-image: var(--mesh-soft); }
.note-ai, .start-ink, .prompt-box, .tw-usage-overview, .tw-summary-band, .shared-context, .doc-content pre {
  background-color: var(--ink);
  background-image: var(--mesh-dark);
}
.workspace-window { background-color: #f7f4ee; border-color: #dfdfdf; }
.window-top { background: #ffffffba; }
.workspace-body { background-color: #f7f6f3; background-image: var(--mesh-light); }
.work-tabs { background-color: var(--ink); background-image: var(--mesh-track); }
.glass-tab-surface {
  background-image: radial-gradient(ellipse at 0% 100%, rgb(var(--mesh-main) / .16), transparent 72%), radial-gradient(ellipse at 100% 0%, rgb(var(--mesh-support) / .12), transparent 70%), linear-gradient(135deg, #fffffff5, #f4f3f1ed 55%, #fffffff0);
}
.tw-card, .tw-share-creator, .tw-assistant-entry, .feature-card, .download-card {
  background-color: #fff;
  background-image: var(--mesh-soft);
  border-color: #e4e1df;
}
.tw-share-lead { background-color: #f5f4f2; background-image: var(--mesh-light); border-color: #e1dedc; }
.tw-share-row, .tw-task-content, .approval-preview, .context-file { background-color: #fff; background-image: var(--mesh-soft); }
.tw-task-row { background: #ffffffc9; }
.tw-task-row:hover { background: rgb(var(--mesh-main) / .18); }
.tw-table-head { background: #fbfaf8; }
.tw-usage-history .tw-bar, .tw-state-bar { background-image: var(--mesh-chart); background-color: #8296a7; }
.tw-usage-history .tw-bar-col:last-child>.tw-bar { background-image: var(--mesh-chart-current); outline-color: rgb(var(--mesh-support)); }
.tw-distribution .tw-bar { background: linear-gradient(160deg, #c4d5e5, #c9cdd4); }
.tw-distribution .tw-bar-col:last-child>.tw-bar { background: var(--mesh-chart-current); }
.tw-calendar>button { background-color: rgb(var(--mesh-calendar) / var(--heat)); }
.tw-calendar>button[aria-pressed=true] { background: var(--ink); color: #fff; border-color: var(--ink); }
.tw-segments, .system-selector { background: #eeedeb; }
.tw-segments .tw-button[aria-pressed=true], .system-selector button[aria-pressed=true] { background: #fff; color: var(--mesh-accent); box-shadow: 0 0 0 1px var(--mesh-border); }
.tw-view-tabs .tw-button[aria-pressed=true] { background: rgb(var(--mesh-main) / .24); color: var(--text); }
.command-trigger>.icon, .feature-task-line>.icon, .note-avatar.violet, .tw-assistant-mark, .plugin-emblem, .help-orb { color: var(--mesh-accent); }
.note-avatar.violet, .tw-assistant-mark, .plugin-emblem, .help-orb { background-color: rgb(var(--mesh-support) / .35); background-image: var(--mesh-soft); border-color: var(--mesh-border); }
.note-ai .note-avatar.violet { background-color: #f7f4ee; }
.hero-actions .button.dark:not(:disabled) { background-image: var(--mesh-primary); background-color: #e5e3e5; color: var(--mesh-primary-ink); border-color: var(--mesh-border); }
.header-cta, .tw-button.primary { background-color: var(--ink); background-image: var(--mesh-track); color: #fff; }
.pill.lavender { background: rgb(var(--mesh-support) / .28); color: var(--mesh-accent); }
.flow-steps>span.active { background-color: rgb(var(--mesh-support) / .25); background-image: var(--mesh-light); border-color: var(--mesh-border); color: var(--mesh-accent); }
.feature-task-line, .tw-note, .plan-lead, .tw-scope-options input:checked+span { background-color: #f4f3f1; background-image: var(--mesh-soft); border-color: #ddd9dc; color: var(--text); }
.tw-note.amber { background: #fcf8e7; border-color: #eadca7; color: #87640d; }
.feature-card .link-button, .sidebar-help .link-button, .tw-conversation, .tw-message>small, .select-check { color: var(--mesh-accent); }
.status-dot { background: var(--mesh-accent); }
.tw-status-dot { background: #518e69; }
.tw-scope-options input, .tw-inline-check input { accent-color: var(--mesh-accent); }
.feature-context:hover .context-file, .feature-context:focus-within .context-file { border-color: var(--mesh-border); }
.feature-context:hover .context-file>.icon, .feature-context:focus-within .context-file>.icon { color: var(--mesh-accent); }
.client-emblem { background-color: var(--ink); background-image: var(--mesh-dark); }
.plugin-card { background-color: #fffefa; background-image: var(--mesh-light); }
body[data-page=download] .select-trigger { background-color: #fff; background-image: var(--mesh-soft); }
body[data-page=download] .select-menu { background: #fff; }
body[data-page=download] .select-option[aria-selected=true], body[data-page=download] .select-option.is-focused { background: rgb(var(--mesh-main) / .22); }
.select-option[aria-selected=true] .select-value { color: var(--mesh-accent); }
.installer-link.is-detected, .installer-link:hover { background: rgb(var(--mesh-main) / .12); border-color: var(--mesh-border); }
.install-steps li>span { background: rgb(var(--mesh-support) / .20); border-color: #e0dcdf; color: var(--text); }
.sidebar-help { background-color: #fbfaf8; background-image: var(--mesh-soft); border-color: #e0dcd9; }
.docs-sidebar nav a[aria-current] { background: rgb(var(--mesh-main) / .25); color: var(--mesh-accent); }
.doc-content a, .faq-list p>a { color: var(--mesh-accent); }
.doc-content code { background: rgb(var(--mesh-gray) / .22); color: #35434a; border-color: #dedbdb; }
.doc-content pre code { background: transparent; color: #f5f8f9; border-color: transparent; }
.doc-content blockquote { background-color: #faf9f7; background-image: var(--mesh-soft); color: #48575e; }
.doc-content th { background: rgb(var(--mesh-main) / .19); }
.doc-content th, .doc-content td { border-color: #dfdbd9; }
.end-orbit .orbit-core {
  background-color: #22313e;
  background-image: linear-gradient(#10212f70, #15243570), url('/download/assets/mesh-orb.svg');
  background-position: center;
  background-size: 100% 100%, 182% 182%;
  border-color: rgb(var(--mesh-support) / .38);
}
.end-orbit .orbit-node i { background: rgb(var(--mesh-main)); }
.end-orbit .node-four i { background: #e5c55e; }
/* Every mesh is a static background: no extra filters or animation loops. */
/* Four systems (macOS / Windows / Android / iOS) share the client selector. */
.client-card .system-selector button{padding:11px 6px;gap:6px;font-size:15px}
.client-card .system-selector button .icon{width:17px;height:17px}
.client-detail{max-width:430px;margin-inline:auto!important;line-height:1.7}.client-detail>*{display:block}.client-detail code{margin-top:4px;overflow-wrap:anywhere;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:11px}
@media(max-width:560px){.client-card .system-selector button{font-size:13px;padding:10px 4px;gap:4px}.client-card .system-selector button .icon{width:14px;height:14px}}