:root{
  --glass-bg: rgba(255,255,255,0.12);
  --glass-brd: rgba(255,255,255,0.35);
  --glass-sh: 0 10px 30px rgba(0,0,0,0.25);
  --txt: #f5f7fb;
  --acc: #7aa2ff;
}
html,body{height:100%;}
body{
  color: var(--txt);
  background: radial-gradient(1200px 800px at 10% 10%, #0e1630, #090f22 55%, #070c1a);
  background-attachment: fixed;
}
.liquid-bg{ position: fixed; inset: 0; overflow: hidden; z-index: -1; }
.blob{
  position:absolute; width: 600px; height: 600px; filter: blur(70px); opacity:.6;
  background: conic-gradient(from 20deg, #1b55ff, #2ad2ff, #a24dff, #1b55ff);
  border-radius: 40% 60% 65% 35% / 40% 45% 55% 60%;
  animation: drift 16s ease-in-out infinite alternate;
}
.blob.b2{ left: 60%; top: -10%; animation-duration: 20s; transform: scale(1.1); }
.blob.b3{ left: -10%; bottom: -20%; animation-duration: 24s; transform: scale(0.9); }
@keyframes drift{ to { transform: translate(40px, -30px) rotate(20deg) scale(1.2); } }

.glass{
  background: var(--glass-bg);
  border: 1px solid var(--glass-brd);
  box-shadow: var(--glass-sh);
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  border-radius: 22px;
}
.btn-glass{
  color:#fff; border:1px solid rgba(255,255,255,.25); background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.08));
  backdrop-filter: blur(10px);
}
.btn-glass:hover{ filter: brightness(1.1); }
.input-glass, .select-glass{
  color:#eaf0ff; background: rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.25); border-radius:14px;
}
/* Stronger contrast for dropdown options (supported browsers) */
select.select-glass option, select.select-glass optgroup {
  color: #0e1630 !important;
  background: #ffffff !important;
}
/* For Windows high-contrast and some engines */
select.select-glass:focus, select.select-glass:active {
  color: #0e1630;
  background: #ffffff;
}
label{font-size:.9rem; opacity:.9}
.progress-glass{ height: 14px; background: rgba(255,255,255,.12); border-radius: 999px; overflow:hidden; }
.progress-bar-liquid{ height:100%; width:0%; background: linear-gradient(90deg, #6aa8ff, #a778ff, #6aa8ff); background-size: 300% 100%; animation: flow 2s linear infinite; }
@keyframes flow{ from{background-position:0 0} to{background-position:300% 0} }
.shimmer{
  background: linear-gradient(110deg, rgba(255,255,255,.05) 8%, rgba(255,255,255,.17) 18%, rgba(255,255,255,.05) 33%);
  background-size: 200% 100%;
  animation: shimmer 1.5s linear infinite;
}
@keyframes shimmer{to{background-position-x:-200%}}
a, .link{color: var(--acc)}
h1,h2,h3,h4{ color: #ffffff; }
.navbar-glass{ background: rgba(17,23,46,.5); border-bottom:1px solid rgba(255,255,255,.15); backdrop-filter: blur(10px); }
.footer{ opacity:.7; font-size:.85rem; }