

html.streamrly-unified-page {
  --bg1:#0b0f1a;
  --bg2:#070a12;
  --bg:#070a12;
  --text:#e9edf7;
  --muted:rgba(233,237,247,.72);
  --border:rgba(255,255,255,.12);
  --card:rgba(255,255,255,.055);
  --panel:rgba(255,255,255,.055);
  --line:rgba(255,255,255,.12);
  --soft:rgba(255,255,255,.075);
  --deep:#111b2a;
  --deep-text:#f1f5fb;
  --deep-text-muted:rgba(241,245,251,.72);
  --accent:#8AAED9;
  --accent-strong:#5f8fbe;
  --accent-on-deep:#bcd3e9;
  --glass:rgba(255,255,255,.06);
  --glass-strong:rgba(255,255,255,.09);
  --glass-hover:rgba(138,174,217,.16);
  --glass-outline:rgba(138,174,217,.34);
  --ink-wash:rgba(255,255,255,.04);
  --ink-wash-strong:rgba(255,255,255,.075);
  --shadow:0 24px 64px rgba(0,0,0,.42);
  --ring:0 0 0 3px rgba(138,174,217,.24);
  --radius:4px;
  --ok:#55d69a;
  --warn:#f0c46a;
  --danger:#ef6c7c;
  --bad:#ef6c7c;
  --blue:rgba(138,174,217,.16);
  --blueBorder:rgba(138,174,217,.38);
  --purple:rgba(142,105,181,.16);
  --purpleBorder:rgba(142,105,181,.38);
  --okBorder:rgba(85,214,154,.40);
  --warnBorder:rgba(240,196,106,.42);
  --dangerBorder:rgba(239,108,124,.42);
  --btn:linear-gradient(135deg,#5f8fbe,#476f98);
  --btn-hover:linear-gradient(135deg,#76a6d4,#5f8fbe);
  color-scheme:dark;
  min-height:100%;

  background:
    radial-gradient(93% 93% at 0% 0%, rgba(20,217,210,.30) 0%, rgba(20,217,210,.135) 30%, transparent 65%),
    radial-gradient(93% 105% at 100% 100%, rgba(122,77,232,.34) 0%, rgba(122,77,232,.153) 30%, transparent 65%),
    radial-gradient(69% 69% at 100% 18%, rgba(224,27,93,.18) 0%, rgba(224,27,93,.081) 30%, transparent 65%),
    radial-gradient(75% 87% at 0% 64%, rgba(36,56,224,.24) 0%, rgba(36,56,224,.108) 30%, transparent 65%),
    radial-gradient(75% 75% at 34% 100%, rgba(18,201,74,.15) 0%, rgba(18,201,74,.068) 30%, transparent 65%),
    radial-gradient(63% 60% at 50% 0%, rgba(195,217,78,.11) 0%, rgba(195,217,78,.05) 30%, transparent 65%),
    radial-gradient(51% 60% at 78% 0%, rgba(242,230,53,.08) 0%, rgba(242,230,53,.036) 30%, transparent 65%),
    linear-gradient(180deg,#070A12,#0B0F1A) !important;
  background-attachment:fixed !important;
  color:var(--text);
}

html.streamrly-unified-page[data-mode="light"] {
  --bg1:#FFFFFF;
  --bg2:#F6F8FB;
  --bg:#FFFFFF;
  --text:#12151C;
  --muted:rgba(18,21,28,.64);
  --border:rgba(18,21,28,.16);
  --card:#F4F7FB;
  --panel:#F4F7FB;
  --line:rgba(18,21,28,.16);
  --soft:rgba(18,21,28,.075);
  --deep:#0B0F1A;
  --deep-text:#FFFFFF;
  --deep-text-muted:rgba(255,255,255,.72);
  --accent:#3E6FA8;
  --accent-strong:#2F5A8C;
  --accent-on-deep:#8AAED9;
  --glass:rgba(255,255,255,.55);
  --glass-strong:rgba(255,255,255,.72);
  --glass-hover:rgba(62,111,168,.14);
  --glass-outline:rgba(62,111,168,.30);
  --ink-wash:rgba(18,21,28,.05);
  --ink-wash-strong:rgba(18,21,28,.08);
  --shadow:0 24px 60px rgba(20,40,70,.18);
  --ring:0 0 0 3px rgba(62,111,168,.20);
  --btn:linear-gradient(135deg,#3E6FA8,#2F5A8C);
  --btn-hover:linear-gradient(135deg,#5A8DC4,#3E6FA8);
  color-scheme:light;
  background:
    linear-gradient(90deg,
      rgba(195,217,78,.05) 0 12.5%, rgba(20,217,210,.05) 12.5% 25%,
      rgba(18,201,74,.05) 25% 37.5%, rgba(160,6,196,.05) 37.5% 50%,
      rgba(224,27,93,.05) 50% 62.5%, rgba(36,56,224,.05) 62.5% 75%,
      rgba(242,230,53,.05) 75% 87.5%, rgba(122,77,232,.05) 87.5% 100%),
    linear-gradient(180deg,var(--bg1),var(--bg2)) !important;
}

html.streamrly-unified-page[data-mode] header.topbar::after {
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:4px;
  border-radius:0 0 4px 4px;
  pointer-events:none;
  background:linear-gradient(90deg,#C3D94E 0 12.5%,#14D9D2 12.5% 25%,#12C94A 25% 37.5%,#A006C4 37.5% 50%,#E01B5D 50% 62.5%,#2438E0 62.5% 75%,#F2E635 75% 87.5%,#7A4DE8 87.5% 100%);
  
  background-size:100% 100%;
  background-attachment:fixed;
}

html.streamrly-unified-page *,
html.streamrly-unified-page *::before,
html.streamrly-unified-page *::after {
  box-sizing:border-box;
}

html.streamrly-unified-page body {
  min-height:100vh;
  color:var(--text) !important;
  background:transparent !important;
  box-shadow:inset 0 4px 0 var(--deep);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif !important;
  letter-spacing:-.012em;
}

html.streamrly-unified-page :where(h1,h2,h3,h4,h5,h6) {
  color:var(--text);
  letter-spacing:-.035em;
}

html.streamrly-unified-page :where(p,.muted,.small,.tiny,.help,.hint,.copy,.empty) {
  color:var(--muted);
}

html.streamrly-unified-page :where(label,.label,.k,.key) {
  color:var(--text) !important;
}

html.streamrly-unified-page :where(a) {
  color:var(--accent);
  text-underline-offset:3px;
}

html.streamrly-unified-page :where(a:hover,a:focus-visible) {
  color:var(--accent-strong);
}

html.streamrly-unified-page body > :where(.topbar,.top) {
  border:1px solid color-mix(in srgb,var(--accent-on-deep),transparent 76%);
  border-radius:0 0 4px 4px;
  background:
    radial-gradient(620px 130px at 50% 0%,color-mix(in srgb,var(--accent),transparent 80%),transparent 70%),
    var(--deep) !important;
  color:var(--deep-text) !important;
  box-shadow:0 12px 30px color-mix(in srgb,var(--deep),transparent 78%);
}

html.streamrly-unified-page body > :where(.topbar,.top) :where(a,.brand,h1,h2,h3,p,.muted) {
  color:var(--deep-text) !important;
}

html.streamrly-unified-page body > :where(.topbar,.top) :where(.muted,p) {
  color:var(--deep-text-muted) !important;
}

html.streamrly-unified-page body > :where(.topbar,.top) :where(button,.btn,.pill,a.btn,a.pill) {
  border-color:color-mix(in srgb,var(--accent-on-deep),transparent 70%) !important;
  background:rgba(255,255,255,.08) !important;
  color:var(--deep-text) !important;
}

html.streamrly-unified-page body > :where(.topbar,.top) :where(.primary,.btn-primary,.pill.primary) {
  border-color:color-mix(in srgb,var(--accent-on-deep),transparent 56%) !important;
  background:color-mix(in srgb,var(--accent),var(--deep) 24%) !important;
  color:#fff !important;
}

html.streamrly-unified-page :where(.hero) {
  border:1px solid color-mix(in srgb,var(--accent-on-deep),transparent 74%) !important;
  border-radius:4px !important;
  background:
    radial-gradient(700px 280px at 12% 0%,color-mix(in srgb,var(--accent),transparent 76%),transparent 64%),
    linear-gradient(135deg,var(--deep),color-mix(in srgb,var(--deep),#000 16%)) !important;
  color:var(--deep-text) !important;
  box-shadow:var(--shadow) !important;
}

html.streamrly-unified-page .hero :where(h1,h2,h3,h4,p,.muted,.eyebrow,.copy) {
  color:var(--deep-text) !important;
}

html.streamrly-unified-page .hero :where(p,.muted,.copy) {
  color:var(--deep-text-muted) !important;
}

html.streamrly-unified-page :where(.card,.panel,.metric,.stat,.kv,.fact,.item,.auth-card,.note-box,.checkrow,.table-wrap,.funding-dialog,.box,.status) {
  border-color:var(--border) !important;
  border-radius:4px !important;
  background:linear-gradient(180deg,var(--glass-strong),var(--glass)) !important;
  color:var(--text);
  box-shadow:0 14px 34px color-mix(in srgb,var(--deep),transparent 88%);
}

html.streamrly-unified-page :where(button,.btn,.pill,input[type="submit"],input[type="button"],input[type="reset"],a.btn,a.pill) {
  min-height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:8px 12px;
  border:1px solid var(--border) !important;
  border-radius:4px !important;
  background:var(--glass-strong) !important;
  color:var(--text) !important;
  box-shadow:none;
  font-family:inherit !important;
  font-weight:800;
  text-decoration:none;
  transition:background 150ms ease,border-color 150ms ease,color 150ms ease,transform 120ms ease,box-shadow 150ms ease;
}

html.streamrly-unified-page :where(button,.btn,.pill,input[type="submit"],input[type="button"],input[type="reset"],a.btn,a.pill):hover {
  border-color:var(--glass-outline) !important;
  background:var(--glass-hover) !important;
}

html.streamrly-unified-page :where(button,.btn,.pill,input[type="submit"],input[type="button"],input[type="reset"],a.btn,a.pill):focus-visible {
  outline:none !important;
  border-color:var(--accent) !important;
  box-shadow:var(--ring) !important;
}

html.streamrly-unified-page :where(button,.btn,.pill,input[type="submit"],input[type="button"],input[type="reset"]):active {
  transform:translateY(1px);
}

html.streamrly-unified-page :where(button.primary,a.primary,input.primary,.btn-primary,.pill.primary,.approve,.btn-ok) {
  border-color:color-mix(in srgb,var(--accent),transparent 28%) !important;
  background:var(--btn) !important;
  color:#fff !important;
}

html.streamrly-unified-page :where(.danger,.btn-danger,.reject,button.danger) {
  border-color:var(--dangerBorder) !important;
  background:color-mix(in srgb,var(--danger),transparent 78%) !important;
  color:color-mix(in srgb,var(--danger),#fff 20%) !important;
}

html.streamrly-unified-page :where(.btn-warn,.warning,button.warn) {
  border-color:var(--warnBorder) !important;
  background:color-mix(in srgb,var(--warn),transparent 80%) !important;
  color:var(--text) !important;
}

html.streamrly-unified-page :where(input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),select,textarea) {
  border:1px solid var(--border) !important;
  border-radius:4px !important;
  background:var(--glass-strong) !important;
  color:var(--text) !important;
  caret-color:var(--accent);
  font-family:inherit !important;
}

html.streamrly-unified-page :where(input,select,textarea)::placeholder {
  color:var(--muted) !important;
  opacity:.78;
}

html.streamrly-unified-page :where(input,select,textarea):focus {
  outline:none !important;
  border-color:var(--accent) !important;
  box-shadow:var(--ring) !important;
}

html.streamrly-unified-page :where(select option) {
  background:var(--card);
  color:var(--text);
}

html.streamrly-unified-page :where(table) {
  color:var(--text);
  border-color:var(--border);
}

html.streamrly-unified-page :where(th,td) {
  border-color:var(--border) !important;
}

html.streamrly-unified-page :where(th) {
  color:var(--muted) !important;
  background:var(--ink-wash-strong);
  font-size:12px;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}

html.streamrly-unified-page :where(tbody tr:hover td) {
  background:var(--ink-wash);
}

html.streamrly-unified-page :where(.badge,.tag,.chip,.status-badge) {
  border:1px solid var(--border) !important;
  border-radius:4px !important;
  background:var(--glass-strong) !important;
  color:var(--text) !important;
}

html.streamrly-unified-page :where(.badge.ok,.badge-ok,.status.ok,.pass,.badge.active,.status.active) {
  border-color:var(--okBorder) !important;
  background:color-mix(in srgb,var(--ok),transparent 84%) !important;
}

html.streamrly-unified-page :where(.badge.warn,.badge-warn,.status.warn,.warning) {
  border-color:var(--warnBorder) !important;
  background:color-mix(in srgb,var(--warn),transparent 84%) !important;
}

html.streamrly-unified-page :where(.badge.bad,.badge-danger,.status.bad,.fail,.error) {
  border-color:var(--dangerBorder) !important;
  background:color-mix(in srgb,var(--danger),transparent 84%) !important;
}

html.streamrly-unified-page :where(code,pre,.hash) {
  border-color:var(--border) !important;
  border-radius:4px !important;
  background:color-mix(in srgb,var(--deep),transparent 12%) !important;
  color:var(--deep-text) !important;
}

html.streamrly-unified-page :where(dialog,[role="dialog"],.modal) {
  border-color:var(--border) !important;
  border-radius:4px !important;
  background:color-mix(in srgb,var(--card),transparent 4%) !important;
  color:var(--text) !important;
  box-shadow:var(--shadow) !important;
}

html.streamrly-unified-page :where(hr) {
  border:0;
  border-top:1px solid var(--border);
}

html.streamrly-unified-page ::selection {
  background:color-mix(in srgb,var(--accent),transparent 68%);
  color:var(--text);
}

html.streamrly-unified-page {
  scrollbar-color:color-mix(in srgb,var(--accent),transparent 28%) var(--ink-wash);
}

html.streamrly-unified-page ::-webkit-scrollbar { width:12px; height:12px; }
html.streamrly-unified-page ::-webkit-scrollbar-track { background:var(--ink-wash); }
html.streamrly-unified-page ::-webkit-scrollbar-thumb {
  border:3px solid transparent;
  border-radius:4px;
  background:color-mix(in srgb,var(--accent),transparent 28%);
  background-clip:padding-box;
}

@media (max-width:700px) {
  html.streamrly-unified-page :where(.wrap,main,.container) { max-width:100%; }
  html.streamrly-unified-page :where(table) { font-size:12px; }
}

@media (prefers-reduced-motion:reduce) {
  html.streamrly-unified-page *,
  html.streamrly-unified-page *::before,
  html.streamrly-unified-page *::after {
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
  }
}
