:root {
  --auth-bg: #06101b;
  --auth-panel: rgba(10, 25, 41, 0.92);
  --auth-line: rgba(144, 175, 205, 0.18);
  --auth-blue: #20a9ff;
  --auth-red: #e51f32;
  --auth-text: #f5f9fd;
  --auth-muted: #95a9bc;
}

body.auth-locked { overflow: hidden; }
body.auth-locked .prototype-frame { filter: blur(9px) saturate(.75); transform: scale(1.012); pointer-events: none; user-select: none; }

.auth-gate {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: grid;
  place-items: center;
  padding: 32px;
  color: var(--auth-text);
  background:
    radial-gradient(circle at 72% 18%, rgba(29, 154, 236, .19), transparent 28%),
    radial-gradient(circle at 14% 82%, rgba(229, 31, 50, .13), transparent 31%),
    linear-gradient(140deg, rgba(3, 10, 17, .96), rgba(8, 24, 39, .98));
  font-family: Inter, "Segoe UI", Arial, sans-serif;
}
.auth-gate[hidden] { display: none !important; }
.auth-gate::before {
  content: "";
  position: absolute;
  inset: 0;
  opacity: .23;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(116, 163, 201, .08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(116, 163, 201, .08) 1px, transparent 1px);
  background-size: 42px 42px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent 85%);
}
.auth-shell {
  width: min(1120px, 94vw);
  min-height: 650px;
  position: relative;
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  overflow: hidden;
  border: 1px solid var(--auth-line);
  border-radius: 30px;
  background: rgba(5, 15, 25, .77);
  box-shadow: 0 36px 120px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.04);
  backdrop-filter: blur(24px);
}
.auth-hero {
  position: relative;
  padding: 58px 58px 48px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  border-right: 1px solid var(--auth-line);
  background:
    linear-gradient(135deg, rgba(14, 37, 58, .92), rgba(5, 15, 26, .76)),
    url('../assets/rr1515_robot_anthracite.png') center 62% / 70% auto no-repeat;
}
.auth-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(to bottom, rgba(5,15,25,.1), rgba(5,15,25,.83));
}
.auth-brand, .auth-hero-copy, .auth-hero-footer { position: relative; z-index: 1; }
.auth-brand { display: flex; align-items: center; gap: 15px; }
.auth-brand-mark {
  width: 52px; height: 52px; display: grid; place-items: center;
  border-radius: 15px; font-size: 30px; font-weight: 900; font-style: italic;
  background: linear-gradient(145deg, #ff3347, #b80519);
  box-shadow: 0 12px 34px rgba(229,31,50,.32);
}
.auth-brand-copy { display: grid; line-height: .9; letter-spacing: .12em; }
.auth-brand-copy strong:first-child { font-size: 18px; }
.auth-brand-copy strong:last-child { font-size: 14px; color: var(--auth-muted); margin-top: 6px; }
.auth-hero-copy { max-width: 540px; margin-top: 170px; }
.auth-kicker { color: #68c8ff; letter-spacing: .18em; font-size: 12px; font-weight: 800; text-transform: uppercase; }
.auth-hero h1 { margin: 14px 0 16px; font-size: clamp(44px, 5vw, 78px); line-height: .93; letter-spacing: -.055em; }
.auth-hero p { margin: 0; max-width: 490px; color: #b5c5d4; line-height: 1.65; font-size: 16px; }
.auth-hero-footer { display: flex; gap: 22px; flex-wrap: wrap; color: #87a0b5; font-size: 12px; }
.auth-hero-footer span { display: flex; align-items: center; gap: 8px; }
.auth-hero-footer i { width: 7px; height: 7px; border-radius: 50%; background: #33d38e; box-shadow: 0 0 14px rgba(51,211,142,.7); }

.auth-panel { padding: 60px 54px; display: flex; flex-direction: column; justify-content: center; background: var(--auth-panel); }
.auth-panel-heading { margin-bottom: 32px; }
.auth-panel-heading small { color: #6fcaff; letter-spacing: .16em; font-weight: 800; font-size: 11px; }
.auth-panel-heading h2 { margin: 10px 0 7px; font-size: 34px; letter-spacing: -.035em; }
.auth-panel-heading p { margin: 0; color: var(--auth-muted); line-height: 1.5; }
.auth-field { display: grid; gap: 9px; margin-bottom: 19px; }
.auth-field label { color: #c7d5e1; font-size: 12px; font-weight: 750; letter-spacing: .05em; }
.auth-input-wrap { position: relative; }
.auth-input {
  width: 100%; box-sizing: border-box; height: 55px; padding: 0 48px 0 16px;
  color: var(--auth-text); background: rgba(4, 14, 24, .72);
  border: 1px solid rgba(132, 169, 201, .23); border-radius: 13px;
  outline: none; font-size: 15px; transition: .18s ease;
}
.auth-input:focus { border-color: var(--auth-blue); box-shadow: 0 0 0 4px rgba(32,169,255,.12); }
.auth-eye { position: absolute; right: 9px; top: 8px; width: 39px; height: 39px; border: 0; border-radius: 10px; color: #8fa8bd; background: transparent; cursor: pointer; font-size: 18px; }
.auth-eye:hover { background: rgba(255,255,255,.05); color: white; }
.auth-options { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin: 2px 0 25px; font-size: 12px; color: var(--auth-muted); }
.auth-remember { display: flex; align-items: center; gap: 9px; cursor: pointer; }
.auth-remember input { accent-color: var(--auth-blue); width: 16px; height: 16px; }
.auth-help { border: 0; padding: 0; color: #64c7ff; background: none; cursor: pointer; font-weight: 700; }
.auth-submit {
  width: 100%; height: 56px; border: 0; border-radius: 14px; cursor: pointer;
  color: #fff; font-size: 14px; font-weight: 900; letter-spacing: .07em;
  background: linear-gradient(135deg, #159fea, #0878c8);
  box-shadow: 0 16px 34px rgba(11, 132, 213, .26); transition: .18s ease;
}
.auth-submit:hover { transform: translateY(-1px); filter: brightness(1.08); }
.auth-submit:active { transform: translateY(0); }
.auth-message { min-height: 23px; margin-top: 14px; color: #ff7584; font-size: 12px; line-height: 1.45; }
.auth-demo-note {
  margin-top: 22px; padding: 14px 15px; border-radius: 12px;
  border: 1px solid rgba(255, 192, 77, .18); background: rgba(255, 173, 42, .055);
  color: #aebdca; font-size: 11px; line-height: 1.5;
}
.auth-demo-note strong { color: #f8c66b; }
.auth-version { margin-top: 22px; text-align: center; color: #60778a; font-size: 10px; letter-spacing: .08em; }
.auth-loading .auth-submit { opacity: .6; pointer-events: none; }
.auth-loading .auth-submit::after { content: "  ···"; }

@media (max-width: 850px) {
  .auth-gate { padding: 15px; }
  .auth-shell { width: min(520px, 100%); min-height: 0; grid-template-columns: 1fr; }
  .auth-hero { min-height: 220px; padding: 30px; border-right: 0; border-bottom: 1px solid var(--auth-line); background-size: 52%; background-position: 90% 75%; }
  .auth-hero-copy { margin-top: 55px; }
  .auth-hero h1 { font-size: 45px; }
  .auth-hero p, .auth-hero-footer { display: none; }
  .auth-panel { padding: 34px 30px 38px; }
}

.auth-expansion{margin:7px 0!important;color:#c2e4ff!important;font-size:14px!important;font-weight:750;letter-spacing:.045em}
