:root{--bg:#02070c;--panel:#04131e;--line:rgba(105,189,238,.13);--text:#eef8fd;--muted:#6d899a;--muted2:#42657a;--blue:#5cbcf6;--blue2:#198bcf;--green:#3ed09a;--red:#ff5157;--amber:#f0b24b;--sans:Inter,Arial,Helvetica,sans-serif;--mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}*{box-sizing:border-box}html,body{min-height:100%;margin:0;background:var(--bg);color:var(--text);font-family:var(--sans)}button,input{font:inherit}.auth-page{min-width:320px;background:radial-gradient(circle at 18% 18%,rgba(25,116,169,.13),transparent 27%),radial-gradient(circle at 80% 80%,rgba(22,86,124,.08),transparent 27%),#02070c}.auth-shell,.setup-wrap{min-height:100vh;display:grid;grid-template-columns:minmax(360px,.9fr) minmax(480px,1.1fr)}.auth-brand-panel{position:relative;overflow:hidden;padding:52px clamp(30px,5vw,80px);border-right:1px solid var(--line);background:linear-gradient(145deg,rgba(4,20,31,.95),rgba(2,9,15,.98));display:flex;flex-direction:column}.auth-brand-panel:before{content:"";position:absolute;inset:0;opacity:.13;background-image:linear-gradient(rgba(92,188,246,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(92,188,246,.08) 1px,transparent 1px);background-size:70px 70px;mask-image:radial-gradient(circle at 40% 40%,#000,transparent 72%)}.auth-brand{position:relative;z-index:2;display:flex;align-items:center;gap:12px;text-decoration:none}.auth-brand>span{width:50px;height:50px;display:grid;place-items:center;border:1px solid rgba(92,188,246,.3);border-radius:11px;background:rgba(18,78,113,.16);color:var(--blue);font-size:12px;font-weight:800;letter-spacing:.08em}.auth-brand div strong,.auth-brand div small{display:block}.auth-brand div strong{font-size:13px;letter-spacing:.1em}.auth-brand div strong span{color:var(--blue)}.auth-brand div small{margin-top:4px;color:#456a7f;font-size:6px;letter-spacing:.14em}.auth-hero{position:relative;z-index:2;margin:auto 0;max-width:620px}.auth-hero>small,.auth-form-card>small{color:#527b91;font-family:var(--mono);font-size:7px;letter-spacing:.16em}.auth-hero h1{margin:18px 0 0;font-size:clamp(42px,5vw,72px);line-height:.96;letter-spacing:-.055em}.auth-hero h1 span{color:var(--blue)}.auth-hero p{max-width:500px;margin:22px 0 0;color:var(--muted);font-size:10px;line-height:1.8}.auth-network{position:relative;z-index:2;display:flex;align-items:center;gap:12px;color:#456f86;font-family:var(--mono);font-size:6px}.auth-network>i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 12px rgba(62,208,154,.35)}.auth-network>i:nth-child(2){opacity:.55}.auth-network>i:nth-child(3){opacity:.28}.auth-network b,.auth-network small{display:block}.auth-network b{color:#6e9bb3;font-size:7px}.auth-network small{margin-top:3px;font-size:5px;letter-spacing:.09em}.auth-security-list{position:relative;z-index:2;margin-top:auto;display:grid;gap:8px;color:#54768a;font-family:var(--mono);font-size:6px}.auth-form-panel{padding:55px clamp(28px,6vw,90px);display:flex;align-items:center;justify-content:center;flex-direction:column}.auth-form-card{width:min(100%,520px)}.auth-form-card.wide{width:min(100%,760px)}.auth-form-card h2{margin:12px 0 0;font-size:32px;letter-spacing:-.04em}.auth-lead{margin:10px 0 0;color:var(--muted);font-size:9px;line-height:1.7}.auth-form{margin-top:26px;display:grid;grid-template-columns:1fr 1fr;gap:13px}.auth-form label{color:#65879a;font-size:7px}.auth-form label.full,.auth-form .full{grid-column:1/-1}.auth-form input{width:100%;height:46px;margin-top:7px;padding:0 12px;border:1px solid rgba(100,176,221,.12);border-radius:8px;background:rgba(3,15,24,.72);color:#abc5d3;outline:none;transition:.2s ease}.auth-form input:focus{border-color:rgba(92,188,246,.35);box-shadow:0 0 0 3px rgba(92,188,246,.035)}.auth-form label>small{display:block;margin-top:5px;color:#3f6174;font-size:6px}.auth-form-row{display:flex;align-items:center;justify-content:space-between;gap:15px}.auth-form-row a,.auth-switch a{color:#6fb9e1;text-decoration:none}.remember{display:flex;align-items:center;gap:7px}.remember input,.check-row>input{width:14px;height:14px;margin:0;flex:0 0 auto}.auth-submit{height:48px;border:1px solid rgba(92,188,246,.22);border-radius:8px;background:linear-gradient(135deg,#147bb6,#1c92d0);color:#fff;font-size:8px;font-weight:700;cursor:pointer;box-shadow:0 15px 40px rgba(25,139,207,.13)}.auth-divider{margin:28px 0 0;border-top:1px solid rgba(103,177,221,.08);text-align:center}.auth-divider span{position:relative;top:-7px;padding:0 10px;background:#02070c;color:#3f6174;font-family:var(--mono);font-size:5px}.auth-switch{margin:18px 0 0;color:#5f7d8e;font-size:7px}.auth-alert{margin-top:18px;padding:11px 12px;border-radius:8px;font-size:7px;line-height:1.55}.auth-alert.error{border:1px solid rgba(255,81,87,.14);background:rgba(96,24,30,.12);color:#c67a7d}.auth-alert.success{border:1px solid rgba(62,208,154,.13);background:rgba(18,79,61,.12);color:#79b39c}.auth-primary-link{display:inline-flex;margin-top:18px;min-height:42px;padding:0 14px;align-items:center;border:1px solid rgba(92,188,246,.15);border-radius:8px;background:rgba(18,78,113,.18);color:#7ec2e6;text-decoration:none;font-size:7px}.auth-copyright{width:min(100%,520px);margin:22px 0 0;color:#34576b;font-size:6px}.check-row{display:flex!important;gap:9px;align-items:flex-start;padding:11px;border:1px solid rgba(100,176,221,.08);border-radius:8px;background:rgba(3,15,24,.4)}.check-row span,.check-row strong,.check-row small{display:block}.check-row strong{color:#829faf;font-size:7px}.check-row small{margin-top:4px;color:#496a7c;line-height:1.5}.dev-link,.setup-note{margin-top:15px;padding:12px;border:1px solid rgba(240,178,75,.12);border-radius:8px;background:rgba(78,54,14,.08);color:#876f48;font-size:7px;line-height:1.55}.dev-link small,.dev-link a{display:block}.dev-link small{font-family:var(--mono);font-size:5px;letter-spacing:.1em}.dev-link a{margin-top:6px;color:#c4a66b}.form-section-title{grid-column:1/-1;margin-top:6px;padding-top:13px;border-top:1px solid rgba(103,177,221,.08);color:#4d748a;font-family:var(--mono);font-size:6px;letter-spacing:.12em}.setup-note{margin-bottom:18px}.setup-form{margin-top:16px}@media(max-width:900px){.auth-shell,.setup-wrap{grid-template-columns:1fr}.auth-brand-panel{min-height:330px;padding:34px 28px}.auth-hero{margin:50px 0}.auth-network,.auth-security-list{display:none}.auth-form-panel{padding:45px 24px 65px}.auth-hero h1{font-size:44px}}@media(max-width:560px){.auth-form{grid-template-columns:1fr}.auth-form label.full,.auth-form .full,.form-section-title{grid-column:auto}.auth-brand-panel{min-height:280px}.auth-hero h1{font-size:38px}.auth-form-card h2{font-size:27px}}

/* =========================================================
   GUARDIANOS V12 — AUTH / SETUP READABILITY
========================================================= */

html,
body {
  font-size: 14px;
}

.auth-brand > span {
  width: 56px;
  height: 56px;
  font-size: 14px;
}

.auth-brand div strong {
  font-size: 16px;
}

.auth-brand div small {
  font-size: 9px;
}

.auth-hero > small,
.auth-form-card > small {
  font-size: 10px;
}

.auth-hero p {
  max-width: 560px;
  font-size: 13px;
  line-height: 1.75;
}

.auth-network {
  font-size: 9px;
}

.auth-network b {
  font-size: 10px;
}

.auth-network small {
  font-size: 8px;
}

.auth-security-list {
  gap: 11px;
  font-size: 10px;
  line-height: 1.45;
}

.auth-form-card {
  width: min(100%, 580px);
}

.auth-form-card.wide {
  width: min(100%, 820px);
}

.auth-form-card h2 {
  font-size: 36px;
}

.auth-lead {
  font-size: 12px;
  line-height: 1.7;
}

.auth-form {
  margin-top: 30px;
  gap: 16px;
}

.auth-form label {
  font-size: 10.5px;
}

.auth-form input,
.auth-form select,
.auth-form textarea {
  min-height: 52px;
  margin-top: 8px;
  padding: 0 14px;
  font-size: 12px;
}

.auth-form textarea {
  min-height: 110px;
  padding-top: 13px;
}

.auth-form label > small {
  margin-top: 7px;
  font-size: 9px;
  line-height: 1.45;
}

.auth-form-row {
  min-height: 42px;
}

.auth-form-row a,
.auth-switch,
.auth-switch a {
  font-size: 10.5px;
}

.remember {
  font-size: 10.5px;
}

.remember input,
.check-row > input {
  width: 18px;
  height: 18px;
}

.auth-submit {
  min-height: 52px;
  font-size: 11px;
}

.auth-divider span {
  font-size: 8px;
}

.auth-alert {
  padding: 14px 15px;
  font-size: 10.5px;
  line-height: 1.6;
}

.auth-primary-link {
  min-height: 46px;
  padding: 0 16px;
  font-size: 10.5px;
}

.auth-copyright {
  font-size: 9px;
}

.check-row {
  padding: 14px;
}

.check-row strong {
  font-size: 10.5px;
}

.check-row small {
  margin-top: 6px;
  font-size: 9px;
  line-height: 1.55;
}

.dev-link,
.setup-note {
  padding: 15px;
  font-size: 10.5px;
  line-height: 1.65;
}

.dev-link small {
  font-size: 8px;
}

.form-section-title {
  padding-top: 16px;
  font-size: 9px;
}

@media (max-width: 900px) {
  .auth-brand-panel {
    min-height: 360px;
  }
}

@media (max-width: 560px) {
  .auth-hero p {
    font-size: 12px;
  }
  .auth-form-card h2 {
    font-size: 30px;
  }
}

/* =========================================================
   GUARDIANOS V16 — CLIENT LOGIN / SIGNUP GATEWAY
========================================================= */

.client-access-card {
  width: min(100%, 610px);
}

.auth-mode-switch {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin: 0 0 30px;
  padding: 6px;
  border: 1px solid rgba(92,188,246,.11);
  border-radius: 14px;
  background: rgba(4,16,24,.72);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.02);
}

.auth-mode-switch a {
  min-height: 68px;
  padding: 10px 13px;
  display: grid;
  grid-template-columns: 28px 1fr;
  grid-template-rows: auto auto;
  column-gap: 10px;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 10px;
  color: #6d8b9c;
  text-decoration: none;
  transition: .2s ease;
}

.auth-mode-switch a > span {
  grid-row: 1 / 3;
  width: 28px;
  height: 28px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(92,188,246,.11);
  border-radius: 7px;
  font-family: "IBM Plex Mono", monospace;
  font-size: 8px;
  color: #6594ad;
}

.auth-mode-switch a strong {
  align-self: end;
  font-size: 12px;
  color: #aac4d2;
}

.auth-mode-switch a small {
  align-self: start;
  margin-top: 2px;
  font-size: 9px;
  color: #587787;
}

.auth-mode-switch a:hover {
  background: rgba(92,188,246,.045);
}

.auth-mode-switch a.active {
  border-color: rgba(92,188,246,.2);
  background: linear-gradient(180deg, rgba(17,65,91,.46), rgba(8,29,43,.52));
  box-shadow: 0 10px 28px rgba(0,0,0,.16), inset 0 1px 0 rgba(255,255,255,.025);
}

.auth-mode-switch a.active strong {
  color: #e3f4fc;
}

.auth-mode-switch a.active > span {
  color: #a9e2ff;
  border-color: rgba(92,188,246,.24);
  background: rgba(92,188,246,.06);
}

.auth-existing-note {
  margin-top: 18px;
  padding: 14px 15px;
  display: grid;
  gap: 4px;
  border: 1px solid rgba(62,208,154,.11);
  border-radius: 10px;
  background: rgba(15,56,43,.16);
}

.auth-existing-note span,
.auth-existing-note small {
  color: #6f998b;
  font-size: 9px;
}

.auth-existing-note strong {
  color: #b9e5d3;
  font-size: 11px;
}

@media (max-width: 560px) {
  .auth-mode-switch {
    grid-template-columns: 1fr;
  }

  .auth-mode-switch a {
    min-height: 60px;
  }
}
