/* GENESIS shared research UI · blue interface, independent scientific palettes. */
:root {
  color-scheme: dark;
  --bg: #071225;
  --surface: #102747;
  --border: #2d5182;
  --cyan: #72baff;
  --mint: #72baff;
  --accent: #4195ff;
  --text: #ecf4ff;
  --muted: #a5bad5;
  --subtle: #879fc0;
  --ui-blue: #378aff;
  --ui-green: #41e59b;
  accent-color: var(--ui-blue);
}
body {
  background: radial-gradient(ellipse at 90% 0%, #183e7955, transparent 55%), #071225;
  color: var(--text);
}
body:before, .grid-bg {
  background: radial-gradient(ellipse at 82% 25%, #205caa42, transparent 48%),
    radial-gradient(ellipse at 12% 85%, #204b8b24, transparent 50%);
}
header, .app-header { border-bottom-color: #72aaf12b; }
.brand, h1, h2, h3 { color: #edf5ff; }
.mark, .brand b, .brand-mark { color: #83c4ff; border-color: #529ff0; background: #12326366; }
.eyebrow, .kicker, .demo-eyebrow { color: #81beff; }
nav a:hover, a:focus-visible { color: #b9dcff; }
h1 span { background-image: linear-gradient(100deg, #b5dfff, #5c9cff); }
.card, .cards article, .bottom article {
  background: linear-gradient(135deg, #16335a, #0d203c);
  border-color: #315a8c;
  box-shadow: inset 0 1px 0 #9bcaff0b, 0 8px 32px #02091920;
}
.card:hover { border-color: #589fff; box-shadow: 0 10px 32px #0a459329; }
.card .num, .card .icon, .title b { color: #85c5ff; }
.card .icon, .title b { background-color: #17437a55; }
body[data-tool] main > section, body:not([data-ui="badge"]) .demo-entry {
  background-color: #102644;
  border-color: #315786;
}
:where(button, .button, .btn, .primary, .secondary, .outline-button, .hero a, .tool-action) {
  border-radius: 7px;
  transition: background-color .18s, border-color .18s, box-shadow .18s;
}
button:not(.card):not(.step):not(.text-button):not(.color-options button):not([style*="background"]),
.button, .btn, .primary, .hero a, a.tool-action {
  background: linear-gradient(135deg, #2264cf, #3188f1);
  color: #fff;
  border: 1px solid #65aaff;
  box-shadow: inset 0 1px 0 #ffffff16, 0 4px 14px #06357833;
}
button:not(:disabled):not(.card):not(.step):not(.text-button):not(.color-options button):hover,
a.tool-action:hover, .button:hover, .btn:hover, .primary:hover, .hero a:hover {
  background: linear-gradient(135deg, #2c75e7, #439bff);
  border-color: #acd5ff;
  color: #fff;
  box-shadow: 0 0 20px #3187ed38;
}
.secondary, .outline-button { color: #b4d8ff; border-color: #4976ad; background: #10294c; }
.secondary:hover, .outline-button:hover { color: #fff; background: #193e6c; border-color: #76b8ff; }
button.active, button[aria-current="step"], .step.active,
.step-navigation button.active { background: #205aa6; border-color: #80beff; color: #fff; }
button:disabled { cursor: not-allowed; opacity: .45; box-shadow: none; }
:where(a, button, input, select, textarea, summary):focus-visible {
  outline: 2px solid #9bd1ff;
  outline-offset: 3px;
}
input, select, textarea { border-color: #3d628f; max-width: 100%; min-width: 0; }
input:not([type="checkbox"]):not([type="radio"]):not([type="color"]), select, textarea {
  background-color: #091a33;
  color: #ecf4ff;
}
input[type="checkbox"], input[type="radio"] { accent-color: #4195ff; }
input::file-selector-button { color: #d9ecff; background: #1d467a; border: 1px solid #528ac7; border-radius: 4px; padding: 5px 9px; }
/* State remains independent of the blue brand color. */
.card .tool-card-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.card .status { display: inline-flex; align-items: center; gap: 8px; margin: 0; padding: 7px 12px; line-height: 1.5; color: #adc5e5; background: #142b49; border: 1px solid #426080; border-radius: 999px; font-size: 12px; }
.card .status::before { content: ""; width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%; background: #8195ae; }
.card .status.is-authorized { color: #abefcd; background: #0c332b; border-color: #26805b; }
.card .status.is-authorized::before { background: #41e59b; box-shadow: 0 0 0 3px #41e59b13, 0 0 9px #41e59b66; }
.card .status.is-unauthorized { color: #c3cddd; }
.card a.tool-action { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 40px; padding: 9px 16px; font-size: 13px; font-weight: 600; line-height: 1.5; text-decoration: none; }
.license-pill.licensed .status-dot { background: #41e59b; box-shadow: 0 0 8px #41e59b55; }
/* Reuse existing illustration slots; decorative graphics never cover controls. */
.orb {
  border-color: #70b6ff66;
  background: url('/research-motif.svg') center / 90% no-repeat, radial-gradient(ellipse at center, #2778dd24, transparent 70%);
  box-shadow: 0 0 90px #398af024, inset 0 0 60px #398af014;
}
.orb:before, .orb:after, .ring, .ring.b { border-color: #75baff55; }
.atom { border-color: #78b9ff88; background: radial-gradient(circle at 30% 30%, #4e9cff66, #0d254cbb); }
.molecule { filter: drop-shadow(0 0 20px #357ff522); }
.bond { border-color: #7abaff77; }
.app-header { background: #0b1c36eb; }
.sidebar { background: #0a1930; border-color: #2a4873; }
.work-panel, .panel { border-color: #315786; }
/* Embedded account badge must keep the host page visible. */
body[data-ui="badge"] { background: transparent; }
body[data-ui="badge"] .dot { background: #41e59b; box-shadow: 0 0 7px #41e59b55; }
body[data-ui="badge"] button { padding: 0 6px; min-height: 0; }
img, video { max-width: 100%; height: auto; }
iframe { max-width: 100%; }
:where(main, section, article, form, .card, .cards, .panel, .workspace) { min-width: 0; }
:where(button, .button, .btn, label, p, td, th) { overflow-wrap: anywhere; }
nav { flex-wrap: wrap; min-width: 0; }
@media (max-width: 640px) {
  header { height: auto; min-height: 88px; gap: 16px; padding-block: 18px; flex-wrap: wrap; }
  header nav { gap: 12px; max-width: 100%; }
  .brand { max-width: 100%; overflow-wrap: anywhere; }
  .hero { padding-top: 45px; }
  h1 { letter-spacing: -1px; }
  .orb { max-width: 65vw; max-height: 65vw; }
  footer { flex-wrap: wrap; gap: 12px; }
  input, select, textarea { font-size: 16px; }
  .toolbar, .step-footer { flex-wrap: wrap; }
  .card a.tool-action { max-width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *:before, *:after { transition: none !important; animation: none !important; }
}

/* Navigation cards and workflow steps retain their original visual hierarchy. */
button.card:hover{background:linear-gradient(135deg,#1b3f6c,#10294b);border-color:#589fff}
.step{background:transparent;color:#a5bad5;border-color:transparent}
.step:hover:not(:disabled){background:#143159;border-color:#345d90}
.step.active{background:#205aa6;border-color:#80beff;color:#fff}
/* Keep mobile orbit artwork inside its original decorative slot. */
@media (max-width: 640px) {
  .orb:before { inset: 20% 16%; transform: rotate(-25deg); }
  .orb:after { inset: 16% 20%; transform: rotate(35deg); }
  .molecule { right: 0; overflow: clip; }
  .molecule-decoration { overflow: clip; }
}
/* Demo-only toolbar uses legacy !important rules; override only its UI colors. */
.dockflow-static-demo .demo-banner { background:linear-gradient(100deg,#163563,#0b1c36 65%); border-color:#355f91; }
.demo-banner-copy strong { color:#b6dbff; }
.demo-banner-copy>span, .demo-switch { color:#a7c5e7; }
.dockflow-static-demo .demo-action { background:#13345b!important; color:#d7eaff!important; border-color:#4876ae!important; }
.dockflow-static-demo .demo-action-primary { background:linear-gradient(135deg,#2264cf,#3188f1)!important; color:#fff!important; border-color:#65aaff!important; }
.dockflow-static-demo .demo-action-close { background:transparent!important; color:#9dbbde!important; border-color:transparent!important; }
.demo-switch-track { background:#142e50; border-color:#4873a3; }
.demo-switch>input:checked+.demo-switch-track,
.demo-switch-label input:checked+.demo-switch-track { background:#2369c0; border-color:#75b8ff; }
.demo-switch>input:checked+.demo-switch-track:after,
.demo-switch-label input:checked+.demo-switch-track:after { background:#d4eaff; }
.demo-switch>input:focus-visible+.demo-switch-track,
.demo-switch-label input:focus-visible+.demo-switch-track { outline-color:#9bd1ff; }
.demo-explanation { color:#bad2ed; background:#15376166; border-color:#345d8e; }
body:not([data-ui="badge"]) .demo-entry { background:linear-gradient(110deg,#153765,#102440); border-color:#3b669d; }
.demo-standalone, .demo-preview-note a { color:#97c9ff; }
.demo-preview-bar { background:#14325b; color:#b5d4f6; border-color:#355a87; }
.molecule-decoration:before, .molecule-decoration:after { border-color:#5b9ee477; }
.molecule-decoration span { background:#67a7ed; box-shadow:0 0 14px #579eff38; }
.molecule-decoration span:nth-child(1) { background:#a4d4ff; }