/* Nexli founder-approved color-only polish, 2026-09-20.
   Deliberately cosmetic: no layout, dimensions, visibility, pointer events, or behavior changes.
   Loaded after styles.css and nexli.css; do not remove existing functionality. */
:root {
  color-scheme: dark;
  --nx-ink: #070b18;
  --nx-surface: #10182a;
  --nx-surface-high: #172138;
  --nx-line: rgba(128, 158, 230, .27);
  --nx-line-strong: rgba(161, 185, 255, .43);
  --nx-white: #f8faff;
  --nx-soft: #b8c5df;
  --nx-dim: #a3b0ce;
  --nx-orange: #ff8536;
  --nx-pink: #ff338e;
  --nx-violet: #9348f4;
  --nx-blue: #277cff;
  --nx-cyan: #39cbfa;
  --nx-spectrum: linear-gradient(100deg, #ff883a 0%, #ff376a 22%, #f52ea9 45%, #9851f5 70%, #33c3f7 100%);
  --nx-cta: linear-gradient(98deg, #f16d28 0%, #ed286b 27%, #ae27cc 54%, #6048eb 74%, #186de5 100%);
  --nx-card-paint: linear-gradient(150deg, rgba(21, 30, 54, .98), rgba(11, 16, 32, .98) 72%);
  --card: #11182b;
  --muted: #b8c5df;
  --line: rgba(128, 158, 230, .27);
  --danger: #ff718b;
  --ok: #74e6ab;
}
html { background-color: var(--nx-ink); }
body {
  color: var(--nx-white);
  background:
    radial-gradient(ellipse at 90% 0%, rgba(114, 45, 171, .18), transparent 42%),
    radial-gradient(ellipse at 0% 22%, rgba(21, 90, 194, .12), transparent 39%),
    linear-gradient(180deg, #0b0b17 0%, #080e1c 48%, #070b17 100%);
}
/* Fit the spectrum to the actual letters, rather than stretching it across the entire header. */
.brand, .brand.xl {
  display: inline-block;
  width: max-content;
  max-width: 100%;
  background: var(--nx-spectrum);
  background-size: 100% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  filter: drop-shadow(0 0 9px rgba(240, 48, 165, .17));
}
.brand.xl { margin-inline: auto; }
.tag { color: #e9eeff; }
/* Surfaces and dividers: stronger visual hierarchy without moving existing content. */
.card, .weatherbar, .travel, .travel.active, .zero, .modal, .read-only {
  background: var(--nx-card-paint);
  border-color: var(--nx-line);
  color: var(--nx-white);
  box-shadow: 0 10px 28px rgba(1, 4, 16, .34), 0 0 0 1px rgba(55, 106, 211, .035);
}
.card.warn, .banner, .chat-msg-announcement {
  background: linear-gradient(150deg, #2c2419, #181522);
  border-color: rgba(255, 184, 87, .45);
  color: #ffe4c1;
}
.card.clickable:hover, .act:hover { border-color: var(--nx-line-strong); }
.section-title, .greeting, .act-title, .zero-title, .metric { color: var(--nx-white); }
.label, .muted, .small.muted, .footer-note, .bubble-time { color: var(--nx-soft); }
.divider, .bring-row, .thread-head { border-color: var(--nx-line); }
.divider { background: var(--nx-line); }
/* Native form controls; retain all types, sizes, interaction and validation. */
.field input, .field select, .field textarea,
.msg-form input, #chatBody, input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea {
  background-color: #141c2d;
  border-color: rgba(147, 171, 231, .34);
  color: var(--nx-white);
  caret-color: var(--nx-cyan);
}
input::placeholder, textarea::placeholder { color: #a9b6d2; opacity: 1; }
select option { background-color: #141c2d; color: var(--nx-white); }
input:focus-visible, select:focus-visible, textarea:focus-visible,
button:focus-visible, [role="button"]:focus-visible {
  outline: 2px solid #56c7ff;
  outline-offset: 2px;
  border-color: #56c7ff;
}
input[type="checkbox"], input[type="radio"] { accent-color: var(--nx-pink); }
/* The existing pill shapes and actions remain untouched. */
.btn, .nav button, .bell, .chip, .back {
  color: var(--nx-white);
  border-color: rgba(160, 179, 225, .29);
  background-color: var(--nx-surface-high);
}
.btn, .nav button, .bell, .chip {
  background-image: linear-gradient(175deg, rgba(56, 65, 88, .85), rgba(28, 36, 58, .94));
  box-shadow: 0 5px 14px rgba(0, 0, 0, .18);
}
.btn.primary, .nav button.active, .seg button.active, .chip.on {
  background: var(--nx-cta);
  border-color: rgba(255, 187, 225, .28);
  color: #fff;
  box-shadow: 0 7px 19px rgba(114, 39, 161, .22);
}
.btn.danger {
  background: linear-gradient(110deg, #442032, #542139);
  border-color: rgba(255, 105, 145, .5);
  color: #ffb5c5;
}
.btn.success { border-color: rgba(93, 224, 150, .46); color: #a5f4c7; }
.btn:disabled, button:disabled { box-shadow: none; }
.seg { background: #0d1425; border-color: var(--nx-line); }
.seg button:not(.active) { color: #c6d1e8; }
.chip:not(.on) { color: #d5dff4; }
.pill {
  color: #dce6fb;
  border-color: rgba(155, 178, 231, .36);
  background: rgba(47, 62, 96, .17);
}
.pill.md { background: var(--nx-cta); color: #fff; }
.pill.active { border-color: rgba(110, 228, 160, .52); color: #a4f4c5; background: rgba(26, 90, 60, .12); }
.pill.paused { border-color: rgba(255, 115, 145, .5); color: #ffb3c5; background: rgba(112, 35, 65, .13); }
/* Complementary navigation, notification and messaging accents. */
.bottomnav {
  background: rgba(7, 10, 22, .96);
  border-top-color: rgba(106, 128, 200, .28);
  box-shadow: 0 -7px 23px rgba(1, 3, 14, .3);
}
.bottomnav button { color: #aebcdb; }
.bottomnav button.active { color: #fff; text-shadow: 0 0 11px rgba(247, 68, 171, .19); }
.bell { background-image: linear-gradient(155deg, #283149, #131a2d); }
.badge { background: linear-gradient(110deg, #fc337c, #a32ceb); }
.notif.unread { border-left-color: var(--nx-pink); }
.bubble { background: #182137; border-color: var(--nx-line); }
.bubble.mine { background: linear-gradient(128deg, #4b235e, #233c72); border-color: rgba(127, 135, 225, .23); }
.msg-form { background: #080e1c; }
.toggle input { background: #303b58; }
.toggle input:checked { background: linear-gradient(95deg, #fb387f, #874af0, #2d8bf5); }
.stepper span { background: #303b58; }
.stepper span.on { background: var(--nx-spectrum); }
.spinner { border-color: #303b58; border-top-color: var(--nx-pink); }
.error { background: #381825; border-color: rgba(255, 97, 125, .53); color: #ffc0ca; }
.success { background: #112e2a; border-color: rgba(85, 221, 150, .42); color: #aff1d0; }
.modal-body .actions { background: #10182a; border-top-color: var(--nx-line); }
/* Respect operating-system reduced motion settings: no new animations introduced. */