/* ============================================================
   MY-LO — Cyber-Minimalist Theme Override (4-colour scan)
   Loaded LAST (injected before </head>). Overrides the shared
   tokens + chrome classes site-wide. Does NOT touch any page
   HTML/content — fully reversible by removing the one <link>.

   Palette:
     blue   #5B8CFF  = brand / primary / flow
     amber  #FFC107  = highlight / active
     red    #FF4D4D  = alert / guardrail
     green  #3DDC97  = success / live
   ============================================================ */
:root{
  --bg:#0A0A0C; --bg-2:#101013; --panel:#141418; --panel-2:#1a1a20;
  --line:rgba(255,255,255,.09); --line-soft:rgba(255,255,255,.05);
  --text:#ECECF1; --muted:#9a9aa8; --muted-2:#B6B6C0;
  --accent:#5B8CFF;            /* primary brand -> blue */
  --accent-2:#7CA0FF;
  --blue:#5B8CFF;  --blue-glow:rgba(91,140,255,.22);
  --amber:#FFC107; --amber-glow:rgba(255,193,7,.20);
  --red:#FF4D4D;   --red-glow:rgba(255,77,77,.20);
  --green:#3DDC97; --green-glow:rgba(61,220,151,.20);
  --radius:16px;
}
html, body{
  background:var(--bg) !important;
  background-image:
    radial-gradient(700px 420px at 12% 4%, rgba(91,140,255,.06), transparent 60%),
    radial-gradient(600px 420px at 88% 8%, rgba(255,193,7,.05), transparent 60%),
    radial-gradient(600px 420px at 80% 92%, rgba(255,77,77,.04), transparent 60%),
    radial-gradient(600px 420px at 10% 96%, rgba(61,220,151,.05), transparent 60%) !important;
  color:var(--text) !important;
}

/* Containers */
.wrap{max-width:1140px;margin:0 auto}
.section, section{padding:72px 0;position:relative}
.section-head .sec-tag{color:var(--amber);border:1px solid rgba(255,193,7,.35);
  background:rgba(255,193,7,.06);border-radius:40px;padding:5px 14px;display:inline-flex;
  font-family:var(--mono,monospace);font-size:.72rem;letter-spacing:2px;text-transform:uppercase}
.section-head h2{color:var(--text)}
.section-head p{color:var(--muted)}

/* Buttons — amber primary, ghost outline */
.btn{
  background:linear-gradient(135deg,var(--amber),#FFB300) !important;
  color:#0A0A0C !important;
  box-shadow:0 0 20px var(--amber-glow) !important;
  border:1px solid transparent !important;
}
.btn:hover{box-shadow:0 0 30px rgba(255,193,7,.5) !important}
.btn.ghost{background:transparent !important;color:var(--text) !important;
  border:1px solid var(--line) !important;box-shadow:none !important}
.btn.green{background:linear-gradient(135deg,var(--green),#2ecb88) !important;color:#04130c !important}

/* Cards */
.card{background:var(--panel) !important;border:1px solid var(--line) !important;
  border-radius:var(--radius) !important}
.card:hover{border-color:rgba(91,140,255,.4) !important;box-shadow:0 0 22px var(--blue-glow) !important}

/* NAV (nav.css classes) — blue brand, amber CTA */
.sn-header{background:rgba(10,10,12,.82) !important;border-bottom:1px solid var(--line) !important}
.sn-brand{color:var(--text)}
.sn-dot{background:linear-gradient(135deg,var(--blue),var(--amber));box-shadow:0 0 12px var(--blue-glow)}
.sn-links a{color:var(--muted) !important}
.sn-links a:hover{color:var(--text) !important;background:rgba(255,255,255,.04) !important}
.sn-cta{background:linear-gradient(135deg,var(--blue),#4a7bff) !important;color:#06121f !important;
  box-shadow:0 0 18px var(--blue-glow) !important}
.sn-cta.ghost{background:transparent !important;color:var(--text) !important;border:1px solid var(--line) !important}
.sn-group-btn{color:var(--muted) !important}
.sn-group-btn:hover,.sn-group:hover .sn-group-btn{color:var(--text) !important;background:rgba(91,140,255,.14) !important}
.sn-menu{background:var(--bg-2) !important;border:1px solid var(--line) !important}
.sn-menu a{color:var(--muted) !important}
.sn-menu a:hover{color:var(--text) !important;background:rgba(91,140,255,.14) !important}

/* FOOTER (in nav.css) */
.site-footer{background:var(--bg-2) !important;border-top:1px solid var(--line) !important;color:var(--muted) !important}
.site-footer .brand{color:var(--text)}
.site-footer .foot-nav a{color:var(--muted-2) !important}
.site-footer .foot-nav a:hover{color:var(--accent) !important}

/* Tags / pills used around the site */
.sec-tag{color:var(--amber) !important}
.tag{color:var(--amber);border:1px solid rgba(255,193,7,.35);background:rgba(255,193,7,.06)}
.tag.blue{color:var(--blue);border-color:rgba(91,140,255,.4);background:rgba(91,140,255,.07)}
.tag.red{color:var(--red);border-color:rgba(255,77,77,.4);background:rgba(255,77,77,.06)}
.tag.green{color:var(--green);border-color:rgba(61,220,151,.4);background:rgba(61,220,151,.06)}

/* Generic success / alert text helpers */
.ok,.text-ok,.success{color:var(--green) !important}
.warn,.alert{color:var(--red) !important}
.accent,.text-accent{color:var(--amber) !important}

/* Smooth, subtle focus ring in brand blue */
a:focus,button:focus,input:focus,textarea:focus,select:focus{
  outline:2px solid var(--blue) !important;outline-offset:2px !important}
