/* rangooo night mode: calm dark theme for bedtime. Opt-in via the moon button; artwork keeps its colours. */
html[data-night="1"]{color-scheme:dark;
  --bg:#0F1720;--surface:#18222D;--ink:#E9EEF2;--muted:#9BA8B5;--line:#263341;--line-strong:#34445A;
  --accent:#4FB3C4;--accent-2:#3A98A9;--accent-soft:#16323A;--accent-ink:#0B1218;
  --mark:#F0A862;--mark-soft:#2A2118;--warm:#E0A06A;--ok:#6CC08F;--ok-soft:#16281F;
  --sh-1:0 1px 2px rgba(0,0,0,.3);--sh-2:0 1px 2px rgba(0,0,0,.3),0 8px 24px rgba(0,0,0,.35);--sh-3:0 2px 4px rgba(0,0,0,.3),0 18px 44px rgba(0,0,0,.45)}
html[data-night="1"] body{background:var(--bg)!important;color:var(--ink)}
html[data-night="1"] header.top{background:rgba(15,23,32,.84);border-bottom-color:var(--line)}
html[data-night="1"] .select,html[data-night="1"] input,html[data-night="1"] textarea,html[data-night="1"] select{background-color:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-night="1"] .heroname,html[data-night="1"] .khero .heroname{background:var(--surface)}
html[data-night="1"] .story,html[data-night="1"] .shelf .feat,html[data-night="1"] .card,html[data-night="1"] .panel .card,html[data-night="1"] .sheet,html[data-night="1"] .agent{background:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-night="1"] .story .t,html[data-night="1"] .story h3,html[data-night="1"] .feat .ft{color:var(--ink)}
html[data-night="1"] .filters button,html[data-night="1"] .filters .chip,html[data-night="1"] .chip{background:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-night="1"] .filters .on,html[data-night="1"] .chip.on,html[data-night="1"] .chip[aria-pressed="true"]{background:var(--ink);color:var(--bg)}
html[data-night="1"] .tabbar,html[data-night="1"] .sh-tab{background:rgba(15,23,32,.92);border-top-color:var(--line)}
html[data-night="1"] footer,html[data-night="1"] footer.sf{background:transparent;color:var(--muted)}
html[data-night="1"] .brand .wm b{color:var(--ink)}
html[data-night="1"] .brand svg path[fill="#16202C"],html[data-night="1"] .brand svg [fill="#16202C"]{fill:#E9EEF2}
html[data-night="1"] .fx-card{background:var(--surface)}
html[data-night="1"] .fx-card .fx-name,html[data-night="1"] .fx-ring span{background:var(--surface);color:var(--ink);border-color:var(--line)}
html[data-night="1"] .fx-glow{background:radial-gradient(closest-side,rgba(79,179,196,.18),rgba(240,168,98,.10) 60%,transparent)}
html[data-night="1"] .khero,html[data-night="1"] .kbb{background-color:transparent}
html[data-night="1"] .khero .kz-scene{filter:brightness(.42) saturate(.8)}
html[data-night="1"] img,html[data-night="1"] svg.art{filter:brightness(.92)}
html[data-night="1"] .c3d-toggle{background:var(--surface);color:var(--ink);border-color:var(--line)}

/* the toggle */
.kn-btn{width:38px;height:38px;border-radius:10px;border:1px solid var(--line);background:var(--surface,#fff);color:var(--ink);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;flex:0 0 auto;padding:0;transition:background .2s,border-color .2s}
.kn-btn:hover{border-color:var(--line-strong)}
.kn-btn svg{width:18px;height:18px}
.kn-btn .sun{display:none}
html[data-night="1"] .kn-btn .sun{display:block}
html[data-night="1"] .kn-btn .moon{display:none}
html.kn-fade,html.kn-fade *{transition:background-color .5s ease,color .5s ease,border-color .5s ease!important}

/* hero + wordmark */
html[data-night="1"] .kbb-bg{opacity:.08}
html[data-night="1"] .kbb-form{background:rgba(24,34,45,.88);border-color:var(--line-strong);box-shadow:0 18px 50px rgba(0,0,0,.4)}
html[data-night="1"] .kbb-form input{background:none;color:var(--ink)}
html[data-night="1"] .kbb-form button{color:#0B1218}
html[data-night="1"] .brand .wm svg [stroke="#16202C"]{stroke:#E9EEF2}
html[data-night="1"] .brand .wm svg [fill="#16202C"]{fill:#E9EEF2}
html[data-night="1"] .ks-card.panc{--ink:#16202C;--muted:#5A6573;--accent:#145C63}
html[data-night="1"] .khero::before{background-image:radial-gradient(60% 80% at 88% 20%,rgba(79,179,196,.14),transparent 60%)}
html[data-night="1"] .khero::after{background-image:radial-gradient(rgba(233,238,242,.07) 1px,transparent 1.2px)}
html[data-night="1"] .kbb-wash{background:linear-gradient(90deg,rgba(15,23,32,.94) 0%,rgba(15,23,32,.6) 30%,rgba(15,23,32,0) 52%)}
html[data-night="1"] .kbb-glow{opacity:.22}
html[data-night="1"] .kform,html[data-night="1"] .khero .kform{background:rgba(24,34,45,.92);border-color:var(--line-strong)}
html[data-night="1"] .kform input{background:none;color:var(--ink)}
html[data-night="1"] .kform button{color:#0B1218}

/* the drifting aura paints a light page behind everything: make it dark and quiet at night */
html.k-aura[data-night="1"]{background:var(--bg,#0F1720);color-scheme:dark}
html[data-night="1"] #kAura{opacity:.28}