: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;
    }