#authApp.auth-shell{
  min-height:100vh;
  min-height:100svh;
  display:grid;
  grid-template-columns:minmax(520px,53%) minmax(500px,47%);
  overflow:hidden;
  background:#050606;
}
.os-sidebar .os-logo{
  background:transparent;
  filter:invert(1) hue-rotate(180deg) contrast(1.08);
}
#authApp .auth-brand-panel{
  position:relative;
  isolation:isolate;
  min-height:100vh;
  min-height:100svh;
  padding:clamp(42px,5vw,72px) clamp(44px,5.4vw,82px) clamp(34px,4vw,58px);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  overflow:hidden;
  color:#fff;
  background:#050606;
  border-bottom:3px solid #b9902f;
}
#authApp .auth-brand-panel::before{
  content:"";
  position:absolute;
  z-index:-1;
  top:16%;
  right:12%;
  bottom:12%;
  width:1px;
  background:rgba(201,168,75,.18);
}
#authApp .auth-brand-panel::after{
  content:"";
  position:absolute;
  z-index:-1;
  left:-9%;
  right:-9%;
  top:39%;
  bottom:3%;
  background:url("assets/roc-architecture-wireframe.png") center bottom/cover no-repeat;
  opacity:.54;
  pointer-events:none;
}
#authApp .auth-logo{
  width:clamp(230px,19vw,300px);
  height:auto;
  margin:0;
  padding:0;
  background:transparent;
  filter:invert(1) hue-rotate(180deg) contrast(1.08);
}
#authApp .auth-statement{
  position:relative;
  z-index:1;
  width:min(650px,100%);
  margin:clamp(40px,8vh,90px) 0 auto;
}
#authApp .auth-statement .eyebrow{
  color:#d0aa42;
  font-size:11px;
  letter-spacing:.22em;
}
#authApp .auth-statement h1{
  max-width:640px;
  margin:24px 0 22px;
  font:600 clamp(54px,5.3vw,82px)/.98 "Playfair Display",Georgia,serif;
  letter-spacing:-.035em;
}
#authApp .auth-statement p{
  max-width:530px;
  margin:0;
  color:#b7b8b7;
  font-size:clamp(14px,1.15vw,17px);
  line-height:1.75;
}
#authApp .auth-trust{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  margin-top:42px;
  color:#c5c6c4;
  font-size:11px;
}
#authApp .auth-trust span{
  min-height:50px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:0 22px;
  border-left:1px solid rgba(201,168,75,.3);
}
#authApp .auth-trust span:first-child{padding-left:0;border-left:0}
#authApp .auth-trust i{color:#d1a834}
#authApp .auth-trust svg{width:21px;height:21px;stroke-width:1.6}
#authApp .auth-form-panel{
  min-height:100vh;
  min-height:100svh;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding:clamp(76px,9.4vh,100px) clamp(38px,5vw,76px) clamp(38px,5vw,76px);
  background:#f8f6f0;
}
#authApp .login-card{
  width:min(520px,100%);
  margin:0;
  padding:0;
  border:0;
  background:transparent;
  box-shadow:none;
}
#authApp .mobile-auth-brand{display:none}
#authApp .auth-kicker{
  display:block;
  margin-bottom:20px;
  color:#a67f20;
  font-size:11px;
  font-weight:700;
  letter-spacing:.22em;
}
#authApp .login-card h2{
  margin:0 0 12px;
  color:#0d0e0e;
  font:600 clamp(43px,4.2vw,61px)/1.02 "Playfair Display",Georgia,serif;
  letter-spacing:-.035em;
}
#authApp .login-card>p{
  margin:0 0 30px;
  color:#777974;
  font-size:14px;
  line-height:1.55;
}
#authApp .preview-notice{
  min-height:78px;
  margin:0 0 26px;
  padding:16px 20px;
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:15px;
  border:1px solid #d9bd70;
  border-left:3px solid #b78a20;
  background:#f6f0df;
}
#authApp .preview-notice>i{display:grid;place-items:center;color:#a77f20}
#authApp .preview-notice>i svg{width:24px;height:24px}
#authApp .preview-notice span{display:flex;flex-direction:column;gap:4px;color:#55564f}
#authApp .preview-notice b{color:#33342f;font-size:12px}
#authApp .preview-notice small{font-size:11px}
#authApp .auth-field{display:block;margin-bottom:18px}
#authApp .auth-field>span{
  display:block;
  margin-bottom:8px;
  color:#343530;
  font-size:11px;
  font-weight:700;
}
#authApp .auth-field>div{
  min-height:70px;
  padding:0 18px;
  display:flex;
  align-items:center;
  gap:14px;
  border:1px solid #cfcdc5;
  background:#fff;
}
#authApp .auth-field>div:focus-within{
  border-color:#a77f20;
  box-shadow:0 0 0 3px rgba(167,127,32,.12);
}
#authApp .auth-field i{color:#171817}
#authApp .auth-field svg{width:19px;height:19px;stroke-width:1.7}
#authApp .auth-field input{
  min-width:0;
  height:64px;
  flex:1;
  border:0;
  outline:0;
  background:transparent;
  color:#131413;
  font-size:14px;
}
#authApp .auth-field button{padding:10px;border:0;background:none;color:#71736e}
#authApp .auth-options{
  margin:2px 0 22px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  color:#3e3f3a;
  font-size:11px;
}
#authApp .auth-options label{display:flex;align-items:center;gap:9px}
#authApp .auth-options input{width:18px;height:18px;accent-color:#b28b2c}
#authApp .auth-options button{border:0;background:none;color:#9a7219;font-size:11px}
#authApp .auth-error{
  margin:0 0 14px;
  padding:13px 15px;
  border:0;
  border-left:3px solid #b7443d;
  background:#f8e5e2;
  color:#a23832;
  font-size:11px;
}
#authApp .auth-submit{
  width:100%;
  min-height:70px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:1px solid #b58b27;
  background:#cba840;
  color:#11120f;
  font:700 18px/1 "Playfair Display",Georgia,serif;
}
#authApp .auth-submit:hover{background:#d6b750;transform:translateY(-1px)}
#authApp .auth-submit svg{width:20px;height:20px}
#authApp .auth-back{width:100%;margin-top:12px;padding:10px;border:0;background:transparent;color:#8d6b18;font:600 11px/1.3 Inter,sans-serif}
#authApp .mfa-enrollment{margin:0 0 18px;padding:14px;border:1px solid #e3d3a0;background:#fbf8ef;text-align:center}
#authApp .mfa-enrollment img{display:block;width:148px;height:148px;margin:0 auto 12px;background:#fff;border:8px solid #fff}
#authApp .mfa-enrollment>div{display:grid;gap:4px;text-align:left}
#authApp .mfa-enrollment small{color:#777;font-size:9px;text-transform:uppercase;letter-spacing:1px}
#authApp .mfa-enrollment code{overflow-wrap:anywhere;color:#171817;font-size:11px;letter-spacing:1px}
#authApp .mfa-enrollment p{margin:10px 0 0;color:#777;font-size:9px;line-height:1.5}
#authApp .client-onboarding-link{
  min-height:72px;
  margin-top:16px;
  padding:13px 18px;
  display:flex;
  align-items:center;
  gap:13px;
  border:1px solid #d2cfc6;
  background:#fff;
  color:#252622;
  text-decoration:none;
  font-size:11px;
}
#authApp .client-onboarding-link:hover{border-color:#b89030;background:#fcfaf4}
#authApp .client-onboarding-link span{display:flex;flex:1;flex-direction:column;gap:4px}
#authApp .client-onboarding-link b{font-size:12px}
#authApp .client-onboarding-link>i:first-child{color:#b18725}
#authApp .client-onboarding-link>i:last-child{transform:rotate(-90deg);color:#1a1b19}
#authApp .client-onboarding-link svg{width:21px;height:21px}
#authApp .auth-legal{
  display:block;
  margin-top:24px;
  color:#8d8e89;
  font-size:10px;
  line-height:1.55;
  text-align:left;
}
@media(max-width:1100px){
  #authApp.auth-shell{grid-template-columns:minmax(430px,48%) minmax(470px,52%)}
  #authApp .auth-brand-panel{padding-left:45px;padding-right:45px}
  #authApp .auth-statement h1{font-size:56px}
  #authApp .auth-trust span{padding:0 12px;font-size:9px}
}
@media(max-width:850px){
  #authApp.auth-shell{display:block;overflow:auto;background:#f8f6f0}
  #authApp .auth-brand-panel{display:none}
  #authApp .auth-form-panel{
    min-height:100vh;
    min-height:100svh;
    padding:calc(28px + env(safe-area-inset-top)) 24px calc(30px + env(safe-area-inset-bottom));
  }
  #authApp .login-card{width:min(520px,100%)}
  #authApp .mobile-auth-brand{display:block;width:190px;margin:0 0 34px}
  #authApp .mobile-auth-brand img{display:block;width:100%;height:auto}
}
@media(max-width:430px){
  #authApp .auth-form-panel{align-items:flex-start;padding-left:18px;padding-right:18px}
  #authApp .login-card{padding:0}
  #authApp .mobile-auth-brand{width:160px;margin-bottom:26px}
  #authApp .auth-kicker{margin-bottom:14px;font-size:9px}
  #authApp .login-card h2{font-size:39px}
  #authApp .login-card>p{margin-bottom:24px;font-size:13px}
  #authApp .preview-notice{min-height:68px;margin-bottom:22px;padding:13px 14px}
  #authApp .preview-notice small{font-size:9px}
  #authApp .auth-field>div{min-height:58px;padding:0 14px}
  #authApp .auth-field input{height:52px;font-size:13px}
  #authApp .auth-options{font-size:10px}
  #authApp .auth-options button{font-size:10px}
  #authApp .auth-submit{min-height:58px;font-size:17px}
  #authApp .client-onboarding-link{min-height:66px;padding:11px 14px}
  #authApp .auth-legal{font-size:9px}
}
@media(max-width:350px){
  #authApp .auth-form-panel{padding-left:13px;padding-right:13px}
  #authApp .auth-options{align-items:flex-start;gap:12px}
  #authApp .auth-options label{line-height:1.35}
}
