@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');
:root{
  --gs-bg-1:#0d1f16;   /* deep evergreen */
  --gs-bg-2:#11281c;   /* forest */
  --gs-accent:#2fb5a3; /* teal accent */
  --gs-lime:#a1f043;   /* lime highlight */
  --glass-bg: rgba(17, 40, 28, .6);
  --glass-br: rgba(161, 240, 67, .25);
}
html, body { height: 100%; }
body{
  font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  background: radial-gradient(1200px circle at 20% 10%, #123324 0%, transparent 50%),
              radial-gradient(1000px circle at 90% 80%, #0f2a1f 0%, transparent 50%),
              linear-gradient(180deg, var(--gs-bg-1), var(--gs-bg-2));
  overflow:hidden;
}
.aurora{
  position: fixed; inset: -20vmax; pointer-events:none; z-index:0; background:
    radial-gradient(60vmax 35vmax at 20% 30%, rgba(47,181,163,.20), transparent 55%),
    radial-gradient(45vmax 30vmax at 80% 70%, rgba(161,240,67,.12), transparent 60%),
    radial-gradient(50vmax 40vmax at 10% 80%, rgba(76,175,80,.10), transparent 60%);
  filter: blur(24px) saturate(120%);
  animation: drift 22s ease-in-out infinite alternate;
}
@keyframes drift { to { transform: translate3d(2vmax,-2vmax,0) scale(1.03); } }
.leaves{ position: fixed; inset: 0; pointer-events: none; z-index: 1; overflow: hidden; }
.leaf{ position: absolute; top: -10vh; width: 28px; height: 28px; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='%23a1f043' d='M22 2c-6.5 1-11.2 4.2-14 9.5C6.9 14.9 6.3 18 4 20c3 .5 5.2-.8 6.7-2.1C15.8 13.8 20.5 9 22 2Z'/><path fill='%232fb5a3' opacity='.7' d='M10 13c-2 3-3 6-6 7 2 0 4-.5 5.5-1.8C13 16 16 13 18 9c-3 1-6 2-8 4Z'/></svg>"); background-size: cover; opacity: .85; animation: fall linear infinite, sway ease-in-out infinite; will-change: transform; }
@keyframes fall { to { transform: translateY(120vh) rotate(360deg); } }
@keyframes sway { 50% { transform: translateX(20px) } }
.leaf:nth-child(odd){ filter: hue-rotate(-6deg) saturate(110%); }
.login-wrapper{ position: relative; z-index: 2; min-height: 100%; display: grid; place-items: center; padding: 4rem 1.25rem; }
.login-card{ width: 100%; max-width: 420px; color: #e9f5ee; background: linear-gradient( to bottom right, rgba(7,20,15,.55), var(--glass-bg) ); backdrop-filter: blur(10px); border: 1px solid var(--glass-br); border-radius: 1.25rem; box-shadow: 0 20px 60px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.02); }
.login-card .brand{ display:flex; align-items:center; gap:.6rem; margin-bottom:.75rem; }
.brand-logo{ display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background: radial-gradient(circle at 30% 25%, var(--gs-lime), rgba(161,240,67,.25) 40%, transparent 60%), linear-gradient(145deg, rgba(47,181,163,.7), rgba(15,42,31,.9)); box-shadow: 0 8px 24px rgba(47,181,163,.35), inset 0 0 12px rgba(161,240,67,.35); }
.brand-logo svg{ width:26px; height:26px; }
.brand h1{ font-size: 1.25rem; font-weight: 700; letter-spacing:.2px; margin:0; }
.brand small{ color: #cfe9dc; display:block; margin-top: .125rem; }
.form-label{ color:#d9f3e8; font-weight:500; }
.form-control{ background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); color:#e6fff7; }
.form-control:focus{ background: rgba(255,255,255,.1); border-color: var(--gs-accent); box-shadow: 0 0 0 .25rem rgba(47,181,163,.25); color:#fff; }
.btn-greensense{ --bs-btn-color:#06130e; --bs-btn-bg: var(--gs-lime); --bs-btn-border-color: var(--gs-lime); --bs-btn-hover-bg:#8bd83a; --bs-btn-hover-border-color:#8bd83a; --bs-btn-focus-shadow-rgb: 161,240,67;  --bs-btn-active-bg:#77c12f; --bs-btn-active-border-color:#77c12f; font-weight:600; }
.legal{ color:#a9d6c7; font-size:.85rem; }
:focus-visible{ outline: 3px dashed rgba(161,240,67,.85); outline-offset: 2px; }
@media (max-width: 420px){ .brand h1{ font-size: 1.1rem; } }