:root{
    --bt-yellow:#fac001;
    --bt-yellow-2:#ef9f00;
    --bt-text:#1b1b1b;
    --bt-muted2:#6c757d;
    --bt-border:#e9ecef;
  }
  html, body{
    height:100%;
    margin:0;
    overflow-x:hidden;
  }
  body{
    background:#fff;
    color:var(--bt-text);
    font-family:'Rubik', sans-serif;
  }
  .auth-wrap{
    min-height:100vh;
    padding:0;
    margin:0;
    max-width:100%;
    overflow-x:hidden;
  }
  .auth-wrap > .row{
    min-height:100vh;
    align-items:stretch;
    margin:0;
    width:100%;
  }
  .auth-wrap > .row > [class*="col-"]{
    padding-left:0;
    padding-right:0;
  }
  .form-pane{
    min-height:100vh;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:32px 40px;
    background:#fff;
    overflow-y:auto;
  }
  .form-card{
    width:100%;
    max-width:400px;
  }
  .brand-top{
    display:flex;
    align-items:center;
    justify-content:flex-start;
    margin-bottom:32px;
  }
  .brand-top img{
    height:42px;
    object-fit:contain;
  }
  .login-head h1{
    font-size:1.35rem;
    font-weight:700;
    margin:0 0 6px;
  }
  .login-head p{
    font-size:14px;
    color:var(--bt-muted2);
    margin:0 0 24px;
  }
  .form-pane .form-control{
    background:#f7f8fa;
    border:1px solid var(--bt-border);
    border-radius:10px;
    padding:10px 12px;
    height:42px;
    font-size:14px;
  }
  .form-pane .form-control:focus{
    border-color:var(--bt-yellow);
    box-shadow:0 0 0 3px rgba(250,192,1,.35);
    background:#fff;
  }
  .form-pane .form-label{
    color:#3c3c3c;
    margin-bottom:4px;
    font-weight:600;
    font-size:.875rem;
  }
  .form-pane .input-group .form-control{
    border-top-right-radius:0;
    border-bottom-right-radius:0;
  }
  .form-pane .input-group .btn-toggle-pw{
    border:1px solid var(--bt-border);
    border-left:none;
    border-radius:0 10px 10px 0;
    background:#f7f8fa;
    color:#666;
  }
  .form-pane .input-group .btn-toggle-pw:hover{
    background:#fff;
    color:var(--bt-text);
  }
  .form-pane .btn-auth-submit{
    background-color:var(--bt-yellow) !important;
    border:1px solid var(--bt-yellow) !important;
    color:#1b1b1b !important;
    font-weight:600;
    padding:12px 16px;
    border-radius:10px;
    box-shadow:0 2px 8px rgba(0,0,0,.1);
  }
  .form-pane .btn-auth-submit:hover,
  .form-pane .btn-auth-submit:focus{
    background-color:var(--bt-yellow-2) !important;
    border-color:var(--bt-yellow-2) !important;
    color:#1b1b1b !important;
    box-shadow:0 2px 10px rgba(0,0,0,.12) !important;
  }
  .login-footer-link{
    font-size:14px;
    color:var(--bt-muted2);
    margin-top:20px;
    display:flex;
    flex-wrap:nowrap;
    justify-content:center;
    align-items:center;
    gap:0.35em;
    white-space:nowrap;
  }
  .login-footer-link a{
    color:var(--bt-text);
    font-weight:600;
    text-decoration:none;
    flex-shrink:0;
  }
  .login-footer-link a:hover{
    text-decoration:underline;
  }
  .login-error{
    background:#fff5f5;
    border:1px solid #f5c6cb;
    color:#c0392b;
    border-radius:10px;
    padding:12px 14px;
    font-size:14px;
    margin-bottom:20px;
  }
  .rgpd-logo{
    margin-top:28px;
    text-align:center;
  }
  .rgpd-logo img{
    width:90px;
    opacity:.85;
  }
  .promo-pane{
    min-height:100vh;
    flex:1 1 auto;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    padding:48px 40px;
    overflow:hidden;
    position:relative;
    background:linear-gradient(145deg, #ffd400 0%, var(--bt-yellow) 40%, var(--bt-yellow-2) 100%);
  }
  .promo-pane::before,
  .promo-pane::after{
    content:'';
    position:absolute;
    border-radius:50%;
    pointer-events:none;
  }
  .promo-pane::before{
    width:320px; height:320px;
    top:-80px; right:-60px;
    background:rgba(255,255,255,.15);
  }
  .promo-pane::after{
    width:240px; height:240px;
    bottom:-40px; left:-40px;
    background:rgba(0,0,0,.06);
  }
  .promo-inner{
    position:relative;
    z-index:1;
    width:100%;
    max-width:560px;
    text-align:center;
  }
  .promo-inner h2{
    font-size:1.75rem;
    font-weight:700;
    line-height:1.3;
    color:#1b1b1b;
    margin-bottom:12px;
  }
  .promo-inner .promo-lead{
    font-size:16px;
    line-height:1.5;
    color:rgba(27,27,27,.82);
    margin-bottom:28px;
  }
  .promo-rotate{
    font-size:1.1rem;
    color:rgba(27,27,27,.9);
    margin-bottom:24px;
    min-height:2rem;
  }
  .promo-rotate strong{
    color:#1b1b1b;
  }
  .txt-rotate > .wrap{
    border-right:.08em solid #666;
  }
  .promo-screenshot{
    width:100%;
    max-width:520px;
    border-radius:12px;
    box-shadow:0 20px 50px rgba(0,0,0,.2);
  }
  .promo-badges{
    display:flex;
    flex-wrap:nowrap;
    gap:8px;
    justify-content:center;
    margin-top:24px;
  }
  .promo-badges span{
    font-size:11px;
    font-weight:500;
    padding:5px 10px;
    border-radius:999px;
    background:rgba(255,255,255,.35);
    color:#1b1b1b;
    border:1px solid rgba(255,255,255,.5);
    white-space:nowrap;
    flex-shrink:0;
  }