/* Shared NovuHub light/dark tokens — include on every Hub/Learn/auth page */
:root{
  --window:#151A20; --bg:#1D2228; --panel:#232A33; --card:#29323D;
  --hair:rgba(60,203,127,.14); --hair2:rgba(183,193,206,.22);
  --text:#E7EDF5; --text2:#B7C1CE; --text3:#8793A3;
  /* NovuApp identity — three consistent shades each: light / primary / dark.
     Mirrors data/app-colors.mjs and styles/00-theme.css. */
  --app-hub-l:#6ADB9E;      --app-hub:#3CCB7F;      --app-hub-d:#26A362;      --app-hub-rgb:60,203,127;
  --app-explorer-l:#A9BED4; --app-explorer:#7E9AB8; --app-explorer-d:#566F8B; --app-explorer-rgb:126,154,184;
  --app-space-l:#F6C453;    --app-space:#E2A02A;    --app-space-d:#A86F14;    --app-space-rgb:226,160,42;
  --app-ai-l:#7CBCFF;       --app-ai:#4DA3FF;       --app-ai-d:#2F7FD4;       --app-ai-rgb:77,163,255;
  --app-voice-l:#D9A0A7;    --app-voice:#C47B85;    --app-voice-d:#A05F68;    --app-voice-rgb:196,123,133;
  --app-builder-l:#6AD8E5;  --app-builder:#2FC6D8;  --app-builder-d:#1FA0B0;  --app-builder-rgb:47,198,216;

  --green:var(--app-hub); --green-d:var(--app-hub-d); --green-l:var(--app-hub-l);
  --accent:var(--app-hub); --accent-l:var(--app-hub-l);
  --blue:var(--app-ai); --explorer:var(--app-explorer); --pink:var(--app-voice); --cyan:var(--app-builder);
  --purple:#7345CC; --orange:#FFB14D;
  --rl:var(--app-hub-rgb);
  --on-accent:#151A20;
  --novu-mark:#B7C1CE;
  --ink-shadow:0 1px 18px rgba(21,26,32,.8),0 0 48px rgba(21,26,32,.55);
  --surface:rgba(21,26,32,.78);
  --surface-strong:rgba(29,34,40,.88);
  --surface-soft:rgba(21,26,32,.72);
  --surface-card:rgba(29,34,40,.82);
  --surface-card-hover:rgba(35,42,51,.92);
  --surface-chip:rgba(29,34,40,.9);
  --line-soft:rgba(183,193,206,.14);
  --overlay:rgba(8,10,14,.55);
  --overlay-soft:rgba(8,10,14,.28);
  --nav-sheet:rgba(21,26,32,.97);
}
html[data-theme="light"]{
  --window:#E4E7EB; --bg:#EEF0F3; --panel:#F4F5F7; --card:#F7F8FA;
  --hair:rgba(47,168,102,.16); --hair2:rgba(100,110,122,.22);
  --text:#1A1F26; --text2:#3A4450; --text3:#6B7582;
  /* NovuApp identity, light theme — the same identities one step darker. */
  --app-hub-l:#3CCB7F;      --app-hub:#2FA866;      --app-hub-d:#248A52;      --app-hub-rgb:47,168,102;
  --app-explorer-l:#7E9AB8; --app-explorer:#566F8B; --app-explorer-d:#3C4F63; --app-explorer-rgb:86,111,139;
  --app-space-l:#E2A02A;    --app-space:#A86F14;    --app-space-d:#7C500D;    --app-space-rgb:168,111,20;
  --app-ai-l:#4DA3FF;       --app-ai:#2F7FD4;       --app-ai-d:#215E9E;       --app-ai-rgb:47,127,212;
  --app-voice-l:#C47B85;    --app-voice:#A05F68;    --app-voice-d:#7C4650;    --app-voice-rgb:160,95,104;
  --app-builder-l:#2FC6D8;  --app-builder:#1FA8B8;  --app-builder-d:#16808C;  --app-builder-rgb:31,168,184;

  --green:var(--app-hub); --green-d:var(--app-hub-d); --green-l:var(--app-hub-l);
  --accent:var(--app-hub); --accent-l:var(--app-hub-l);
  --blue:var(--app-ai); --explorer:var(--app-explorer); --pink:var(--app-voice); --cyan:var(--app-builder);
  --purple:#5E3AA8; --orange:#D9922E;
  --rl:var(--app-hub-rgb);
  --on-accent:#F7F8FA;
  --novu-mark:#B7C1CE;
  --ink-shadow:none;
  --surface:rgba(255,255,255,.72);
  --surface-strong:rgba(255,255,255,.9);
  --surface-soft:rgba(244,245,247,.88);
  --surface-card:rgba(255,255,255,.92);
  --surface-card-hover:#ffffff;
  --surface-chip:rgba(255,255,255,.98);
  --line-soft:rgba(100,110,122,.18);
  --overlay:rgba(50,56,64,.28);
  --overlay-soft:rgba(50,56,64,.12);
  --nav-sheet:rgba(238,240,243,.97);
}
html{color-scheme:dark;}
html[data-theme="light"]{color-scheme:light;}

html[data-theme="light"] .topglow{
  background:
    radial-gradient(78% 58% at 50% 22%, rgba(255,255,255,.72), transparent 70%),
    radial-gradient(95% 68% at 50% -8%, rgba(47,168,102,.14), transparent 72%),
    radial-gradient(60% 52% at 18% 2%, rgba(255,255,255,.7), transparent 68%),
    radial-gradient(58% 50% at 84% 6%, rgba(47,168,102,.1), transparent 66%),
    radial-gradient(48% 42% at 88% 78%, rgba(100,110,122,.1), transparent 72%) !important;
}

/* Fixed corner theme toggle — same across Hub ecosystem */
.theme-toggle{
  position:fixed;top:calc(14px + env(safe-area-inset-top,0px));right:clamp(14px,2.5vw,28px);z-index:60;
  width:36px;height:36px;border:none;border-radius:0;
  background:transparent;color:var(--text2);cursor:pointer;padding:0;
  display:inline-flex;align-items:center;justify-content:center;
  transition:color .22s ease,opacity .22s ease,transform .22s ease;
  pointer-events:auto;
}
.theme-toggle:hover{color:var(--green);background:transparent;transform:scale(1.08);}
.theme-toggle svg{width:20px;height:20px;display:block;}
.theme-toggle .ico-sun{display:none;}
html[data-theme="light"] .theme-toggle .ico-moon{display:none;}
html[data-theme="light"] .theme-toggle .ico-sun{display:block;}

/* Soft type halo — dark only; light mode stays clean over pale honeycomb */
html[data-theme="light"] :is(h1,h2,h3,p,.lead,.eyebrow,.sub,.toc a,.back,.next,.slide-credit,.tool-name,.hint,.page-credit,.note,.tagline,.zero-badge,.sys-label,.learn-more,.nav-links a,.logo,.num,.li-txt){
  text-shadow:none;
}

/* Auth / legal chrome that hardcodes dark wash */
html[data-theme="light"] .chrome{
  background:linear-gradient(180deg,rgba(238,240,243,.94),rgba(238,240,243,.72) 70%,transparent);
}
html[data-theme="light"] body.auth-page,
html[data-theme="light"] body.nv-auth{
  background-image:
    radial-gradient(70% 55% at 50% -10%, rgba(47,168,102,.10), transparent 58%),
    radial-gradient(45% 40% at 88% 8%, rgba(100,110,122,.08), transparent 60%);
}

/* Content cards / chips — solid light surfaces (no backdrop-filter over animated honeycomb) */
html[data-theme="light"] :is(.step,.app-card,.tool,.nav-map li,.settings-map li,.callout,.post,.panel,.prod-card,.feature-card,.plan-card,.hub-launch,.map-card,.ent-strip){
  background:var(--surface-card);
  border-color:var(--line-soft);
  box-shadow:0 1px 0 rgba(255,255,255,.8),0 8px 24px rgba(50,56,64,.06);
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html[data-theme="light"] :is(.step,.app-card,.tool):hover,
html[data-theme="light"] :is(.step,.app-card,.tool):focus-within{
  background:var(--surface-card-hover);
  border-color:rgba(var(--rl),.35);
}
html[data-theme="light"] .key{
  background:var(--surface-chip);
  border-color:var(--line-soft);
  color:var(--text2);
}
html[data-theme="light"] .btn.ghost{
  background:var(--surface-chip);
  border-color:var(--line-soft);
  color:var(--text2);
}
html[data-theme="light"] .btn.ghost:hover{
  background:var(--surface-card-hover);
  border-color:rgba(var(--rl),.4);
  color:var(--text);
}
html[data-theme="light"] .btn.primary{
  background:rgba(var(--rl),.12);
}
html[data-theme="light"] .btn.primary:hover{
  background:rgba(var(--rl),.2);
}
html[data-theme="light"] .callout{
  background:rgba(var(--rl),.08);
  border-color:rgba(var(--rl),.28);
}
html[data-theme="light"] .callout strong{color:var(--green-d);}

/* Novusion / studio surfaces */
html[data-theme="light"] :is(.collab-strip,.firm-details,.about-focus > div,.about-process > div,.prod-card,.card,.gallery .shot button.shot-open){
  background:var(--surface-card);
  border-color:var(--line-soft);
  box-shadow:0 1px 0 rgba(255,255,255,.8),0 8px 24px rgba(50,56,64,.06);
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html[data-theme="light"] :is(.hub-cta,.home-product){
  background:var(--surface-card);
  border-color:rgba(47,168,102,.42);
  box-shadow:0 1px 0 rgba(255,255,255,.8),0 8px 24px rgba(47,168,102,.08);
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html[data-theme="light"] :is(.grid-3,.grid-2):hover .prod-card:hover,
html[data-theme="light"] .prod-card:hover{
  background:var(--surface-card-hover);
  box-shadow:
    0 0 0 1px rgba(var(--g),.16),
    0 14px 32px rgba(var(--g),.14),
    0 6px 16px rgba(50,56,64,.08);
}
html[data-theme="light"] .hub-cta:hover{
  background:var(--surface-card-hover);
  border-color:rgba(47,168,102,.55);
}

/* Novusion wordmark — entire name one graphite grey (not split orange) */
.wm-sion,
.wm:has(> .wm-sion) > .wm-p{
  color:var(--novu-mark, #B7C1CE)!important;
}
.logo .novu,
.logo .sion,
.logo .novu .sion{
  color:var(--novu-mark, #B7C1CE)!important;
}
