/* theme-midnight.css — "Midnight neon" dark theme
   Load AFTER style.css:  <link rel="stylesheet" href="/assets/css/theme-midnight.css">  */

:root{
  --bg:#070912;
  --surface:#0F1424;
  --ink:#E8ECF6;
  --muted:#98A2BA;
  --line:#232A3D;

  --violet:#A855F7;
  --indigo:#22D3EE;
  --pink:#EC4899;
  --rose:#FB7185;
  --amber:#F59E0B;
  --cyan:#22D3EE;
  --emerald:#34D399;

  --grad-brand:linear-gradient(120deg,#7C3AED 0%,#EC4899 55%,#F59E0B 100%);
  --grad-cool:linear-gradient(120deg,#22D3EE 0%,#6366F1 100%);
  --grad-warm:linear-gradient(120deg,#F59E0B 0%,#EF4444 100%);
  --grad-green:linear-gradient(120deg,#34D399 0%,#22D3EE 100%);
  --grad-violet:linear-gradient(120deg,#A855F7 0%,#EC4899 100%);

  --shadow:0 26px 60px -26px rgba(0,0,0,.75);
  --shadow-sm:0 14px 34px -20px rgba(0,0,0,.7);
}

body{background:var(--bg)}
::selection{background:#EC4899;color:#0B0713}
a{color:#A5B4FC}
a:hover{color:#C7D2FE}

/* nav */
.nav{background:rgba(7,9,18,.72);border-bottom-color:var(--line)}
.brand{color:var(--ink)}
.brand .mark{box-shadow:0 8px 24px -8px rgba(236,72,153,.7)}
.nav-links a{color:#9AA4BC}
.nav-links a:hover{color:#fff}
.nav-links a.active{color:#fff}
.burger{border-color:var(--line)}
.burger span{background:var(--ink)}

/* buttons */
.btn{box-shadow:0 16px 36px -14px rgba(236,72,153,.7)}
.btn:hover{box-shadow:0 22px 46px -16px rgba(236,72,153,.85)}
.btn.ghost{background:rgba(255,255,255,.03);color:var(--ink);border-color:var(--line)}
.btn.ghost:hover{background:rgba(255,255,255,.08);border-color:#3A4560}

/* badges / pills / eyebrow */
.eyebrow{color:#E9D5FF;background:rgba(168,85,247,.16)}
.eyebrow.cool{color:#A5F3FC;background:rgba(34,211,238,.14)}
.eyebrow.warm{color:#FDE68A;background:rgba(245,158,11,.15)}
.eyebrow.green{color:#A7F3D0;background:rgba(52,211,153,.15)}
.pill{background:#121829;border-color:var(--line);color:var(--ink)}
.pill.g{background:rgba(168,85,247,.16);border-color:rgba(168,85,247,.4);color:#E9D5FF}
.pill.b{background:rgba(34,211,238,.14);border-color:rgba(34,211,238,.4);color:#A5F3FC}
.pill.a{background:rgba(245,158,11,.15);border-color:rgba(245,158,11,.4);color:#FDE68A}
.pill.e{background:rgba(52,211,153,.15);border-color:rgba(52,211,153,.4);color:#A7F3D0}
.pill.p{background:rgba(236,72,153,.16);border-color:rgba(236,72,153,.4);color:#FBCFE8}

/* cards / panels */
.card{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0)),var(--surface);border-color:var(--line)}
.card:hover{border-color:#333C55}
.panel{background:var(--surface);border-color:var(--line)}
.stat{background:var(--surface);border-color:var(--line)}
.stat .lab{color:var(--muted)}
.shot{background:#0C1120;border-color:var(--line)}
.shot figcaption{border-top-color:var(--line);color:var(--muted)}

/* hero visual */
.hero .chip{background:#121829;border-color:var(--line);color:var(--ink)}
.mono{box-shadow:0 30px 70px -24px rgba(236,72,153,.55)}

/* forms */
input,textarea,select{background:#0C1120;color:var(--ink);border-color:var(--line)}
input::placeholder,textarea::placeholder{color:#5B6680}
input:focus,textarea:focus,select:focus{border-color:#EC4899;box-shadow:0 0 0 4px rgba(236,72,153,.18)}

/* cta */
.cta .btn{background:#fff;color:#111}

/* timeline */
.timeline::before{background:linear-gradient(#A855F7,#EC4899,#F59E0B)}
.tl-item::before{background:var(--surface);border-color:#A855F7;box-shadow:0 0 0 4px rgba(168,85,247,.15)}
.tl-item:nth-child(2)::before{border-color:#EC4899;box-shadow:0 0 0 4px rgba(236,72,153,.15)}
.tl-item:nth-child(3)::before{border-color:#F59E0B;box-shadow:0 0 0 4px rgba(245,158,11,.15)}
.tl-item:nth-child(4)::before{border-color:#22D3EE;box-shadow:0 0 0 4px rgba(34,211,238,.15)}
.tl-item .where{color:#C4B5FD}

/* footer */
footer{background:#05070E}

/* aurora: brighter neon glows on dark */
.aurora span{opacity:.5}
.aurora span:nth-child(1){background:#7C3AED}
.aurora span:nth-child(2){background:#EC4899}
.aurora span:nth-child(3){background:#22D3EE;opacity:.4}
.aurora span:nth-child(4){background:#F59E0B;opacity:.35}

/* interactive demo (dark) */
.demo-scroll{background:var(--surface);border-color:var(--line)}
.demo-table th{color:var(--muted)}
.demo-table th,.demo-table td{border-bottom-color:var(--line)}
.demo-table tbody tr:hover{background:rgba(255,255,255,.05)}
.demo-table tbody tr.sel{background:rgba(168,85,247,.18);box-shadow:inset 3px 0 0 #A855F7}
.badge-state{color:#0B0713}
.s-cancel{background:#FCA5A5;color:#3B0A0A}
.s-pen{background:#FCD34D;color:#3B2A05}
.s-live{background:#6EE7B7;color:#052E20}
.s-exp{background:#CBD5E1;color:#1E2433}