:root{
  --brand-blue: #3D7EB9;
  --brand-green: #07A869;
  --brand-dark: #15445A;
  --brand-gold: #d4b06a;

  --text-main: #ffffff;
  --text-dark: #0f2230;

  --radius-lg: 22px;
  --radius-md: 16px;
  --shadow-soft: 0 16px 36px rgba(0,0,0,.18);
}

html, body {
  min-height: 100%;
}

body.app-theme {
  margin: 0;
  font-family: 'Cairo', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text-main);

  background-color: #070a12;
  background-image:
    radial-gradient(900px 520px at 12% 8%, rgba(61,126,185,.18), transparent 60%),
    radial-gradient(900px 520px at 90% 10%, rgba(7,168,105,.15), transparent 60%),
    radial-gradient(800px 500px at 50% 120%, rgba(212,176,106,.10), transparent 55%),
    linear-gradient(to bottom, rgba(7,10,18,.78), rgba(7,10,18,.90)),
    url('/img/srw2.png');
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat;
  background-position: center center, center center, center center, center center, center center;
  background-size: auto, auto, auto, auto, 600px;
  background-attachment: fixed, fixed, fixed, fixed, fixed;
}

body.app-theme::before{
  content:"";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 22px 22px;
  opacity: .18;
}

.app-main,
.auth-main{
  position: relative;
  z-index: 1;
  min-height: calc(100vh - 90px);
  padding: 24px 16px 40px;
}

.auth-page .auth-main{
  display: flex;
  align-items: center;
  justify-content: center;
}

.glass-card{
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-soft);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.section-title{
  font-weight: 900;
  font-size: 28px;
  color: #fff;
  text-align: center;
}

@media (max-width: 1000px){
  body.app-theme{
    background-size: auto, auto, auto, auto, 400px;
    background-attachment: scroll, scroll, scroll, scroll, scroll;
  }
}