@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@500;600;700;800&family=Inter:wght@400;500;600;700;800&display=swap');
*{box-sizing:border-box}body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;background:radial-gradient(circle at top,#1d2330 0,#090b10 55%,#050608 100%);color:#f7f8fb;min-height:100vh}.auth-shell{min-height:100vh;display:grid;place-items:center;padding:32px}.brand{display:flex;gap:14px;align-items:center;margin-bottom:28px;justify-content:center}.brand-mark{width:54px;height:54px;border-radius:14px;display:block;object-fit:contain;padding:5px;background:#fff;box-shadow:0 10px 35px #0008}.brand h1{font-family:'Cinzel',serif;letter-spacing:.16em;margin:0;font-size:24px}.brand p{margin:4px 0 0;color:#9da5b5}.auth-card{width:min(440px,100%);background:#11151d;border:1px solid #2a303c;border-radius:22px;padding:30px;box-shadow:0 25px 80px #0008}.eyebrow{font-size:11px;letter-spacing:.18em;color:#c9a35d;font-weight:800}.auth-card h2{font-size:30px;margin:10px 0 8px}.muted{color:#9da5b5;margin-top:0;margin-bottom:24px}label{display:block;font-size:13px;color:#cfd4dd;margin:16px 0}input{display:block;width:100%;margin-top:8px;background:#0a0d12;border:1px solid #303744;color:#fff;border-radius:11px;padding:13px 14px;outline:none}input:focus{border-color:#c9a35d;box-shadow:0 0 0 3px #c9a35d22}.primary{width:100%;border:0;border-radius:11px;padding:13px 16px;background:linear-gradient(135deg,#e7c87b,#b88a3e);font-weight:800;color:#111;cursor:pointer;margin-top:8px}.error{min-height:22px;color:#ff8b8b;font-size:13px;margin-top:14px}footer{text-align:center;color:#6f7786;font-size:12px;margin-top:20px}
.brand-full-logo{width:190px;max-width:70vw;height:auto;display:block;background:#fff;border-radius:12px;padding:8px;box-shadow:0 12px 35px #0006}.brand-copy p{margin:4px 0 0;color:#9da5b5}


/* V7.3 Mobile login / authentication */
html {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

body {
  width: 100%;
  max-width: 100%;
  overflow-x: hidden;
}

.auth-shell {
  width: 100%;
  min-height: 100dvh;
  padding:
    max(18px, env(safe-area-inset-top))
    max(14px, env(safe-area-inset-right))
    max(18px, env(safe-area-inset-bottom))
    max(14px, env(safe-area-inset-left));
}

.auth-card {
  width: min(440px, 100%);
  max-width: 100%;
  padding: clamp(20px, 6vw, 30px);
}

.brand-full-logo {
  width: min(190px, 72vw);
  max-width: 100%;
  height: auto;
}

.auth-card h2 {
  font-size: clamp(24px, 7vw, 30px);
}

input,
button {
  min-height: 46px;
}

@media (max-width: 600px) {
  .auth-shell {
    place-items: start center;
    padding-top: max(28px, env(safe-area-inset-top));
  }

  .brand-full-logo {
    width: min(210px, 78vw);
    padding: 6px;
  }

  .brand {
    margin-bottom: 20px;
  }

  .auth-card {
    border-radius: 17px;
    padding: 22px 18px;
  }

  .auth-card h2 {
    margin-top: 8px;
  }

  .muted {
    margin-bottom: 20px;
  }

  label {
    margin: 14px 0;
  }

  input {
    font-size: 16px;
    padding: 12px 13px;
  }

  .primary {
    min-height: 48px;
    font-size: 16px;
  }

  footer {
    font-size: 11px;
    padding-bottom: 4px;
  }
}

@media (max-width: 380px) {
  .auth-shell {
    padding-left: 10px;
    padding-right: 10px;
  }

  .auth-card {
    padding: 19px 14px;
  }

  .brand-full-logo {
    width: 72vw;
  }
}


/* V7.4 Light Sandal Brand Theme */
:root {
  --velaris-sandal: #f8efde;
  --velaris-sandal-deep: #f2e5d0;
  --velaris-gold: #c58a24;
}
body {
  background:
    radial-gradient(circle at 15% 20%, rgba(197,138,36,.08), transparent 28%),
    radial-gradient(circle at 85% 75%, rgba(197,138,36,.07), transparent 30%),
    linear-gradient(145deg, #fbf4e8 0%, #f8efde 48%, #f1e2cb 100%) !important;
}
.auth-shell {
  background: transparent !important;
}
.auth-card {
  background: rgba(255, 251, 243, .94) !important;
  border-color: rgba(197,138,36,.24) !important;
}

/* V7.6 Login visual correction */
.auth-shell {
  background:transparent !important;
}
.brand-full-logo {
  width:min(360px,78vw) !important;
  max-width:360px !important;
  height:auto !important;
  background:transparent !important;
  border-radius:0 !important;
  padding:0 !important;
  box-shadow:none !important;
  object-fit:contain !important;
}
.auth-shell .brand {
  margin-bottom:20px !important;
}
@media(max-width:600px) {
  .brand-full-logo {
    width:min(300px,76vw) !important;
    max-width:300px !important;
  }
}


/* V7.7 Login readability — darker user ID/password labels */
.auth-card label {
  color: #342b20 !important;
  font-weight: 700 !important;
}
.auth-card input {
  color: #241f19 !important;
  background: #fffaf2 !important;
  border-color: #cdbb9e !important;
}
.auth-card input::placeholder {
  color: #746b5d !important;
  opacity: 1 !important;
}
.auth-card .muted {
  color: #5f574d !important;
}
.auth-card h2 {
  color: #231e18 !important;
}
