
  <!-- =====================
       COPY THIS INTO style.css
       =====================

  /* Brand (constant) */
  :root{
    --brand: #0d6efd;
    --brand-ink: #0b5ed7;
    --brand-accent: #22c55e;
  }

  /* DARK THEME TOKENS */
  .theme-dark{
    --text: #e8eefc;              /* light text */
    --sub: rgba(232,238,252,.72);  /* secondary text */
    --bg: #0b1220;                 /* page bg */
    --card-bg: rgba(15,26,50,.78);
    --card-border: rgba(255,255,255,.08);
    --input-bg: #0f1a32;
    --input-border: #253050;
    --link: #cfe1ff;
  }

  /* LIGHT THEME TOKENS */
  .theme-light{
    --text: #0b1020;              /* dark text */
    --sub: #475166;               /* readable gray */
    --bg: #f6f8ff;
    --card-bg: #ffffffeb;
    --card-border: #e9eef7;
    --input-bg: #f7f9ff;
    --input-border: #cfd9f0;
    --link: #0d6efd;
  }

  html, body{height:100%;}
  body{font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji"; background: var(--bg); color: var(--text);}  

  .text-heading{color: var(--text) !important;}
  .text-sub{color: var(--sub) !important;}
  .small-muted{color: var(--sub)}
  .link-muted{color: var(--link)}
  .link-muted:hover{opacity:.9}

  /* Background ambiance */
  .bg-blur-blob{position:fixed; z-index:-2; filter:blur(60px); opacity:.45;}
  .blob-1{width:420px; height:420px; background:radial-gradient(circle at 30% 30%, #0d6efd, transparent 60%), radial-gradient(circle at 70% 70%, #22c55e, transparent 60%); top:-120px; left:-80px}
  .blob-2{width:520px; height:520px; background:radial-gradient(circle at 70% 40%, #0ea5e9, transparent 60%), radial-gradient(circle at 40% 80%, #22c55e, transparent 60%); bottom:-160px; right:-140px}
  .noise-overlay{position:fixed; inset:0; pointer-events:none; z-index:-1; background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/><feComponentTransfer><feFuncA type='table' tableValues='0 0 0 0 0 0 0.08'/></feComponentTransfer></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");}

  /* Hero column */
  .hero-col{position:relative}
  .hero-card{background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02)); border:1px solid var(--card-border); box-shadow: 0 20px 60px rgba(0,0,0,.35); color: var(--text)}
  .brand-logo{height:56px; width:auto}
  .badge-env{background: rgba(34,197,94,0.15); color:#22c55e; border:1px solid rgba(34,197,94,0.3)}
  .feature-tile{background: rgba(255,255,255,0.04); border:1px solid rgba(255,255,255,0.08); color: var(--text)}
  .feature-ico{width:42px; height:42px; display:grid; place-items:center; border-radius:12px; background: rgba(13,110,253,.18); color:#2b67ff}

  .hero-illustration{max-width: 360px; filter: drop-shadow(0 18px 40px rgba(0,0,0,.35));}

  /* Auth card */
  .glass{background: var(--card-bg); border:1px solid var(--card-border); box-shadow: 0 10px 40px rgba(0,0,0,.45); color: var(--text)}
  .auth-card .form-floating>label{color: var(--sub)}
  .auth-card .form-control, .auth-card .form-select{color: var(--text); background: var(--input-bg); border-color: var(--input-border)}
  .auth-card .form-control:focus{background: var(--input-bg); border-color: var(--brand); box-shadow:0 0 0 .25rem rgba(13,110,253,.25)}

  .btn-primary{background: var(--brand); border-color: var(--brand)}
  .btn-primary:hover{background: var(--brand-ink); border-color: var(--brand-ink)}

  .gov-footer{color: var(--sub)}
  .gov-footer a{color: var(--link)}

  /* Modals */
  .modal-glass{background: var(--card-bg)}

  /* Responsive tweaks */
  @media (max-width: 991.98px){
    .brand-logo{height:44px}
  }
/* Theme-aware sign in button */
.theme-light .btn-primary {
  background-color: #fff !important;
  border: 1px solid #212529 !important;
  color: #212529 !important;
}

.theme-light .btn-primary:hover {
  background-color: #f8f9fa !important;
  border-color: #0d6efd !important;
  color: #0d6efd !important;
}



  */
