/* Bynzo v9.4 · premium owner sign-in refresh
   Scope is intentionally limited to /login (body.auth-owner-login) so register,
   staff-login and other auth flows keep their existing layout and behavior. */

.auth-owner-login{
  --login-navy:#031018;
  --login-navy-2:#062833;
  --login-teal:#12dbc0;
  --login-teal-2:#36f0cf;
  --login-cream:#f8faf8;
  --login-line:rgba(13,46,55,.11);
  overflow-x:hidden;
}
.auth-owner-login .auth-v2-shell{
  grid-template-columns:minmax(520px,46%) minmax(0,54%);
  min-height:100svh;
  background:var(--login-navy);
}

/* LEFT / BRAND EXPERIENCE */
.auth-owner-login .auth-v2-brand{
  padding:clamp(30px,4.2vh,52px) clamp(34px,4.8vw,76px) clamp(28px,4vh,46px);
  background:
    radial-gradient(circle at 78% 14%,rgba(0,236,216,.14),transparent 27%),
    radial-gradient(circle at 22% 83%,rgba(0,159,146,.11),transparent 30%),
    linear-gradient(145deg,#020910 0%,#031822 56%,#020a11 100%);
}
.auth-owner-login .auth-v2-brand:before{
  opacity:.16;
  background-size:92px 92px;
  mask-image:linear-gradient(to bottom,transparent 3%,#000 42%,#000 100%);
}
.auth-owner-login .auth-v2-brand:after{
  width:560px;height:560px;right:-250px;top:-72px;
  background:radial-gradient(circle,rgba(28,222,201,.15),rgba(2,63,72,.06) 42%,transparent 69%);
}
.auth-owner-login .auth-logo{gap:14px}
.auth-owner-login .auth-logo-mark{width:42px;height:42px;border-radius:11px;background:rgba(255,255,255,.07)}
.auth-owner-login .auth-logo-name{font-size:30px;font-weight:830;letter-spacing:-.035em}

.auth-owner-login .auth-brand-copy{
  max-width:650px;
  margin-top:clamp(72px,11vh,118px);
}
.auth-owner-login .auth-kicker{font-size:11px;letter-spacing:.16em;color:#23e5c8}
.auth-owner-login .auth-brand-copy h1{
  margin:24px 0 20px;
  max-width:680px;
  font-size:clamp(52px,5.05vw,82px);
  line-height:.96;
  letter-spacing:-.064em;
  font-weight:820;
}
.auth-owner-login .auth-brand-copy h1 em{
  display:inline-block;
  color:#1be0c5;
  text-shadow:0 0 30px rgba(27,224,197,.09);
}
.auth-owner-login .auth-brand-copy>p{
  max-width:620px;
  color:#aebdc4;
  font-size:17px;
  line-height:1.62;
}
.auth-owner-login .auth-brand-copy>p strong{color:#eef8f7;font-weight:720}
.auth-owner-login .auth-benefits{gap:clamp(24px,3.2vw,52px);margin-top:36px}
.auth-owner-login .auth-benefits article{grid-template-columns:54px auto;grid-template-rows:auto;align-items:center;gap:12px;min-width:0}
.auth-owner-login .benefit-icon{
  width:54px;height:54px;border-radius:15px;
  background:linear-gradient(145deg,rgba(6,87,91,.96),rgba(2,31,41,.98));
  border-color:rgba(73,240,212,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 14px 34px rgba(0,0,0,.19),0 0 26px rgba(10,223,195,.06);
}
.auth-owner-login .benefit-icon svg{width:27px;height:27px}
.auth-owner-login .auth-benefits strong{font-size:13px;line-height:1.25;color:#f6fbfb}

/* Decorative orbital planet: purely visual and intentionally CSS-generated. */
.auth-owner-login .auth-login-planet{
  position:absolute;z-index:2;right:-13%;top:4.5%;width:min(31vw,460px);aspect-ratio:1;border-radius:50%;pointer-events:none;
  background:
    radial-gradient(circle at 34% 30%,rgba(83,255,232,.28),transparent 7%),
    radial-gradient(circle at 42% 37%,#0d7f89 0 8%,#075364 28%,#032b3d 55%,#011421 72%);
  box-shadow:inset -45px -36px 90px rgba(0,0,0,.62),inset 24px 18px 44px rgba(32,238,218,.08),0 0 70px rgba(20,223,203,.12);
  opacity:.78;
  animation:loginPlanetFloat 8s ease-in-out infinite;
}
.auth-owner-login .auth-login-planet:before,.auth-owner-login .auth-login-planet:after{
  content:"";position:absolute;border:1px solid rgba(50,227,206,.19);border-radius:50%;left:-47%;top:47%;width:190%;height:43%;transform:rotate(-18deg);
}
.auth-owner-login .auth-login-planet:after{left:-31%;top:56%;width:158%;height:30%;border-color:rgba(123,239,222,.11);transform:rotate(13deg)}
.auth-owner-login .auth-login-planet span{position:absolute;left:-10%;top:44%;width:7px;height:7px;border-radius:50%;background:#28f4d3;box-shadow:0 0 16px 5px rgba(40,244,211,.34)}
.auth-owner-login .auth-login-planet i{position:absolute;right:8%;top:18%;width:5px;height:5px;border-radius:50%;background:#7ff7e4;box-shadow:0 0 13px 4px rgba(127,247,228,.24)}

.auth-owner-login .auth-motion-stage{left:2%;right:1%;bottom:-1%;height:33%;opacity:.96}
.auth-owner-login .auth-motion-stage:before{left:6%;right:14%;height:30%;background:radial-gradient(ellipse,rgba(15,229,199,.23),rgba(0,95,102,.07) 45%,transparent 73%)}
.auth-owner-login .motion-dashboard{left:13%;bottom:6%;width:min(49%,340px);border-radius:22px;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 26px 50px rgba(0,0,0,.46),0 0 45px rgba(9,210,184,.13)}
.auth-owner-login .motion-rocket-card{left:59%;bottom:18%;width:84px;height:94px}
.auth-owner-login .orbit{left:0;width:86%;height:80%}.auth-owner-login .orbit-b{left:6%;width:68%;height:70%}
.auth-owner-login .auth-brand-footer-note{
  position:absolute;z-index:7;left:clamp(34px,4.8vw,76px);bottom:24px;
  display:grid;gap:2px;color:#8da5ab;font-size:9px;font-weight:750;letter-spacing:.23em;
}
.auth-owner-login .auth-brand-footer-note strong{color:#c2d0d3;font-size:10px;font-weight:760}
.auth-owner-login .auth-brand-footer-note:after{content:"";position:absolute;left:115px;top:14px;width:42px;height:1px;background:#738b91}

/* RIGHT / FORM AREA */
.auth-owner-login .auth-v2-panel{
  min-width:0;
  padding:clamp(42px,6vh,78px) clamp(34px,6vw,92px);
  border-radius:0;
  background:
    radial-gradient(circle at 1% 0%,rgba(24,224,197,.095),transparent 27%),
    radial-gradient(circle at 11% 80%,rgba(17,220,192,.07),transparent 30%),
    radial-gradient(circle at 95% 26%,rgba(238,214,178,.13),transparent 27%),
    linear-gradient(135deg,#ffffff 0%,#fbfcfb 63%,#f8f9f7 100%);
}
.auth-owner-login .auth-v2-panel:before{
  background:
    radial-gradient(circle at 3% -3%,rgba(22,211,185,.07),transparent 28%),
    radial-gradient(circle at 41% 105%,rgba(14,201,176,.055),transparent 31%);
}
.auth-owner-login .auth-v2-panel:after{
  content:"";position:absolute;left:-80px;bottom:-130px;width:360px;height:360px;border-radius:50%;border:1px solid rgba(13,184,164,.11);box-shadow:0 0 0 70px rgba(21,211,187,.018),0 0 0 140px rgba(21,211,187,.012);pointer-events:none;
}
.auth-owner-login .auth-login-card{
  width:min(540px,100%);
  padding:44px 46px 38px;
  border-radius:30px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(10,48,57,.105);
  box-shadow:0 30px 80px rgba(29,59,63,.105),0 4px 18px rgba(15,47,53,.035),inset 0 1px 0 rgba(255,255,255,.95);
  backdrop-filter:blur(18px);
}
.auth-owner-login .auth-form-brand{
  width:auto;height:auto;min-height:52px;margin:0 auto 12px;padding:0 10px;border:0;border-radius:0;background:transparent;box-shadow:none;display:flex;align-items:center;justify-content:center;gap:10px;
}
.auth-owner-login .auth-form-brand:after{content:"Bynzo";font-size:25px;font-weight:840;letter-spacing:-.04em;color:#07151c}
.auth-owner-login .auth-form-brand img{width:38px;height:38px;border-radius:9px;box-shadow:0 7px 18px rgba(5,37,43,.08)}
.auth-owner-login .auth-form-head{margin-bottom:26px}
.auth-owner-login .auth-form-head .auth-form-kicker{margin-bottom:12px;letter-spacing:.18em;color:#03aa90}
.auth-owner-login .auth-form-kicker:after{content:"";width:22px;height:1px;background:currentColor}
.auth-owner-login .auth-form-head h2{font-size:clamp(34px,3vw,43px);letter-spacing:-.052em}
.auth-owner-login .auth-form-head p{font-size:14px;color:#71818b;margin-top:8px}
.auth-owner-login .auth-login-card label{font-size:12px;margin-bottom:17px;gap:8px}
.auth-owner-login .auth-v2-card input{height:54px;border-radius:12px;border-color:#ccd8dd;padding-left:48px;font-size:14px;background:rgba(255,255,255,.94)}
.auth-owner-login .field-icon{left:15px;width:20px;height:20px;color:#647984}
.auth-owner-login .field-icon svg,.auth-owner-login .password-toggle svg{width:20px;height:20px}
.auth-owner-login .password-toggle{right:12px;width:36px;height:36px}
.auth-owner-login .auth-login-meta{margin:-4px 1px 5px}
.auth-owner-login .auth-login-meta a{font-size:12px;color:#047d6e}
.auth-owner-login .auth-submit{
  min-height:55px;margin-top:14px;border-radius:12px;font-size:15px;
  background:linear-gradient(100deg,#031720 0%,#07373c 45%,#079f83 100%);
  box-shadow:0 13px 30px rgba(4,67,62,.18);
}
.auth-owner-login .auth-submit i{color:#5ff6d8}
.auth-owner-login .auth-switch{margin-top:12px!important;font-size:12px!important}
.auth-owner-login .auth-switch a{color:#039c83}
.auth-owner-login .auth-error{font-size:11px}

.auth-owner-login .auth-panel-note{position:absolute;z-index:2;color:#728f98;font-size:9px;font-weight:780;letter-spacing:.24em;line-height:1.6;pointer-events:none}
.auth-owner-login .auth-panel-note i{font-style:normal;color:#18aa94;margin:0 7px}
.auth-owner-login .auth-panel-note span{display:inline-block;width:42px;height:1px;background:#83a4aa;vertical-align:middle;margin-left:18px}
.auth-owner-login .auth-panel-note-top{top:42px;right:7.5%}
.auth-owner-login .auth-panel-note-bottom{right:8%;bottom:35px;text-align:right}
.auth-owner-login .auth-panel-note-bottom span{position:absolute;right:100%;top:50%;margin:0 18px 0 0;width:36px}

@keyframes loginPlanetFloat{0%,100%{transform:translate3d(0,0,0) rotate(-4deg)}50%{transform:translate3d(-9px,9px,0) rotate(-1deg)}}

/* Laptop/short viewport: keep the card readable instead of shrinking it aggressively. */
@media (max-height:840px) and (min-width:901px){
  .auth-owner-login .auth-v2-brand{padding-top:26px;padding-bottom:24px}
  .auth-owner-login .auth-brand-copy{margin-top:clamp(42px,7vh,62px)}
  .auth-owner-login .auth-brand-copy h1{font-size:clamp(45px,4.5vw,67px);margin-top:18px;margin-bottom:14px}
  .auth-owner-login .auth-brand-copy>p{font-size:14px;line-height:1.52;max-width:570px}
  .auth-owner-login .auth-benefits{margin-top:20px}
  .auth-owner-login .auth-benefits article{grid-template-columns:44px auto;gap:9px}
  .auth-owner-login .benefit-icon{width:44px;height:44px;border-radius:12px}
  .auth-owner-login .benefit-icon svg{width:22px;height:22px}
  .auth-owner-login .auth-benefits strong{font-size:11px}
  .auth-owner-login .auth-motion-stage{height:26%;bottom:0}
  .auth-owner-login .motion-dashboard{left:13%;width:min(43%,255px)}
  .auth-owner-login .motion-rocket-card{left:57%;width:62px;height:70px}
  .auth-owner-login .auth-login-planet{width:min(28vw,360px);right:-12%;top:3%}
  .auth-owner-login .auth-v2-panel{padding-top:34px;padding-bottom:34px;overflow:hidden}
  .auth-owner-login .auth-login-card{width:min(510px,100%);padding:32px 38px 28px}
  .auth-owner-login .auth-form-brand{min-height:44px;margin-bottom:7px}
  .auth-owner-login .auth-form-brand img{width:32px;height:32px}.auth-owner-login .auth-form-brand:after{font-size:22px}
  .auth-owner-login .auth-form-head{margin-bottom:18px}.auth-owner-login .auth-form-head h2{font-size:34px}
  .auth-owner-login .auth-form-head p{font-size:12px;margin-top:6px}
  .auth-owner-login .auth-login-card label{margin-bottom:13px;font-size:11px}
  .auth-owner-login .auth-v2-card input{height:46px;font-size:13px}
  .auth-owner-login .auth-submit{min-height:48px;margin-top:10px;font-size:14px}
  .auth-owner-login .auth-panel-note-top{top:24px}.auth-owner-login .auth-panel-note-bottom{bottom:20px}
}

@media (max-height:700px) and (min-width:901px){
  .auth-owner-login .auth-brand-copy{margin-top:25px}
  .auth-owner-login .auth-brand-copy h1{font-size:clamp(40px,4vw,57px);margin-top:14px}
  .auth-owner-login .auth-brand-copy>p{font-size:13px;line-height:1.45}
  .auth-owner-login .auth-benefits{margin-top:13px;gap:20px}
  .auth-owner-login .auth-benefits article{grid-template-columns:38px auto}.auth-owner-login .benefit-icon{width:38px;height:38px}.auth-owner-login .auth-benefits strong{font-size:10px}
  .auth-owner-login .auth-motion-stage{height:19%;opacity:.78}
  .auth-owner-login .auth-login-card{padding:22px 32px 20px}
  .auth-owner-login .auth-form-brand{min-height:36px;margin-bottom:4px}.auth-owner-login .auth-form-brand img{width:28px;height:28px}.auth-owner-login .auth-form-brand:after{font-size:20px}
  .auth-owner-login .auth-form-head{margin-bottom:10px}.auth-owner-login .auth-form-head .auth-form-kicker{margin-bottom:6px}.auth-owner-login .auth-form-head h2{font-size:29px}.auth-owner-login .auth-form-head p{font-size:11px;margin-top:4px}
  .auth-owner-login .auth-login-card label{margin-bottom:9px;font-size:10px;gap:5px}.auth-owner-login .auth-v2-card input{height:41px}.auth-owner-login .auth-submit{min-height:43px;margin-top:7px}
  .auth-owner-login .auth-switch{font-size:10px!important;margin-top:5px!important}.auth-owner-login .auth-error{min-height:10px;margin-top:3px}
  .auth-owner-login .auth-panel-note{display:none}
}

/* Tablet: keep brand first, then card; the decorative planet stays subtle. */
@media (max-width:900px){
  .auth-owner-login .auth-v2-shell{grid-template-columns:1fr;overflow:visible;background:#031018}
  .auth-owner-login .auth-v2-brand{min-height:560px;padding:28px 28px 58px}
  .auth-owner-login .auth-brand-copy{margin-top:58px;max-width:690px}
  .auth-owner-login .auth-brand-copy h1{font-size:clamp(48px,9vw,72px);max-width:650px}
  .auth-owner-login .auth-brand-copy>p{max-width:620px}
  .auth-owner-login .auth-login-planet{width:330px;right:-95px;top:48px;opacity:.5}
  .auth-owner-login .auth-motion-stage{width:42%;height:37%;right:-2%;left:auto;bottom:2%;opacity:.5}
  .auth-owner-login .auth-benefits{max-width:600px}
  .auth-owner-login .auth-brand-footer-note{display:none}
  .auth-owner-login .auth-v2-panel{min-height:auto;margin-top:-34px;border-radius:38px 38px 0 0;padding:72px 24px 58px;overflow:hidden}
  .auth-owner-login .auth-login-card{width:min(560px,100%)}
  .auth-owner-login .auth-panel-note-top{top:28px;right:30px}.auth-owner-login .auth-panel-note-bottom{display:none}
}

/* Mobile Chrome / iOS: no horizontal overflow, no giant blank zones, easy tap targets. */
@media (max-width:640px){
  .auth-owner-login{background:#031018}
  .auth-owner-login .auth-v2-brand{min-height:470px;padding:24px 20px 48px;overflow:hidden}
  .auth-owner-login .auth-logo-mark{width:38px;height:38px}.auth-owner-login .auth-logo-name{font-size:25px}
  .auth-owner-login .auth-brand-copy{margin-top:48px;max-width:100%}
  .auth-owner-login .auth-kicker{font-size:9px;letter-spacing:.13em}
  .auth-owner-login .auth-brand-copy h1{font-size:clamp(42px,12vw,56px);line-height:.98;letter-spacing:-.055em;margin:18px 0 15px}
  .auth-owner-login .auth-brand-copy>p{font-size:14px;line-height:1.5;max-width:96%}
  .auth-owner-login .auth-brand-copy>p strong{display:block;margin-bottom:4px}
  .auth-owner-login .auth-benefits{margin-top:24px;gap:8px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
  .auth-owner-login .auth-benefits article{display:grid;grid-template-columns:1fr;justify-items:start;gap:8px;min-width:0}
  .auth-owner-login .benefit-icon{width:43px;height:43px;border-radius:12px}.auth-owner-login .benefit-icon svg{width:22px;height:22px}
  .auth-owner-login .auth-benefits strong{font-size:10px;line-height:1.25}
  .auth-owner-login .auth-login-planet{width:240px;right:-112px;top:48px;opacity:.32}
  .auth-owner-login .auth-motion-stage{display:none}
  .auth-owner-login .auth-v2-panel{margin-top:-22px;border-radius:28px 28px 0 0;padding:54px 14px max(30px,env(safe-area-inset-bottom));overflow:hidden}
  .auth-owner-login .auth-panel-note-top{top:19px;right:18px;font-size:7px;letter-spacing:.16em}.auth-owner-login .auth-panel-note-top span{width:25px;margin-left:9px}.auth-owner-login .auth-panel-note-top i{margin:0 4px}
  .auth-owner-login .auth-login-card{padding:27px 18px 24px;border-radius:24px}
  .auth-owner-login .auth-form-brand{min-height:43px;margin-bottom:7px}.auth-owner-login .auth-form-brand img{width:31px;height:31px}.auth-owner-login .auth-form-brand:after{font-size:22px}
  .auth-owner-login .auth-form-head{margin-bottom:20px}.auth-owner-login .auth-form-head h2{font-size:31px}.auth-owner-login .auth-form-head p{font-size:12px}
  .auth-owner-login .auth-login-card label{font-size:11px;margin-bottom:14px}
  .auth-owner-login .auth-v2-card input{height:52px;font-size:16px}
  .auth-owner-login .auth-login-meta a{font-size:11px}.auth-owner-login .auth-submit{min-height:52px;font-size:14px}
}

@media (max-width:390px){
  .auth-owner-login .auth-v2-brand{min-height:450px;padding-left:17px;padding-right:17px}
  .auth-owner-login .auth-brand-copy{margin-top:42px}
  .auth-owner-login .auth-brand-copy h1{font-size:40px}
  .auth-owner-login .auth-benefits{gap:5px}.auth-owner-login .auth-benefits strong{font-size:9px}.auth-owner-login .benefit-icon{width:40px;height:40px}
  .auth-owner-login .auth-v2-panel{padding-left:10px;padding-right:10px}.auth-owner-login .auth-login-card{padding-left:15px;padding-right:15px}
}

@media (prefers-reduced-motion:reduce){
  .auth-owner-login .auth-login-planet{animation:none!important}
}
