
  /* Login overlay — same white field as the splash so the transition feels seamless. */
  #ctp-login{
    position:fixed; inset:0; z-index:var(--z-login);
    display:none; align-items:center; justify-content:center;
    background:#ffffff; padding:24px;
    opacity:0; transition:opacity .45s cubic-bezier(.4,0,.2,1);
  }
  #ctp-login.ctp-login-show{ display:flex; opacity:1; }
  #ctp-login.ctp-login-hide{ opacity:0; pointer-events:none; }
  .ctp-login-card{
    width:100%; max-width:420px;
    display:flex; flex-direction:column; align-items:stretch; gap:14px;
    padding:36px 32px 32px; border-radius:14px;
    background:#fff; border:1px solid rgba(63,129,144,.14);
    box-shadow:0 30px 60px -30px rgba(15,42,56,.18), 0 6px 20px -10px rgba(15,42,56,.08);
    animation:ctpLoginRise .55s cubic-bezier(.16,1,.3,1) both;
  }
  #ctp-login-logo{
    width:240px; max-width:70%; height:auto; display:block;
    margin:0 auto 4px;
  }
  .ctp-login-tag{
    text-align:center; color:#3F8190;
    font-family:'Inter','Segoe UI',Arial,sans-serif;
    font-size:10px; font-weight:600; letter-spacing:2.6px; text-transform:uppercase;
    opacity:.85; padding-bottom:10px; margin-bottom:4px;
    border-bottom:1px solid rgba(63,129,144,.12);
  }
  .ctp-login-h{
    margin:6px 0 2px; font-family:'Inter','Segoe UI',Arial,sans-serif;
    font-size:18px; font-weight:700; color:#1a3340; letter-spacing:-.2px;
  }
  .ctp-login-sub{
    margin:0 0 6px; font-family:'Inter','Segoe UI',Arial,sans-serif;
    font-size:12.5px; color:#5a6e78; line-height:1.5;
  }
  .ctp-login-label{
    display:flex; flex-direction:column; gap:5px;
    font-family:'Inter','Segoe UI',Arial,sans-serif;
    font-size:11px; font-weight:600; color:#3F8190;
    letter-spacing:.6px; text-transform:uppercase;
  }
  .ctp-login-label input{
    font-family:'Inter','Segoe UI',Arial,sans-serif;
    font-size:14px; font-weight:500; color:#1a3340;
    padding:10px 12px; border-radius:8px;
    border:1px solid rgba(63,129,144,.22); background:#fafcfc;
    text-transform:none; letter-spacing:normal;
    transition:border-color .15s, background .15s, box-shadow .15s;
  }
  .ctp-login-label input:focus{
    outline:none; border-color:#3F8190; background:#fff;
    box-shadow:0 0 0 3px rgba(63,129,144,.14);
  }
  .ctp-login-btn{
    margin-top:8px; padding:12px 16px; border:none; cursor:pointer;
    border-radius:8px; background:#3F8190; color:#fff;
    font-family:'Inter','Segoe UI',Arial,sans-serif;
    font-size:13px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase;
    transition:background .15s, transform .08s;
  }
  .ctp-login-btn:hover{ background:#357180; }
  .ctp-login-btn:active{ transform:translateY(1px); }
  .ctp-login-btn:disabled{ background:#9bb5bd; cursor:not-allowed; }
  .ctp-login-err{
    min-height:18px; font-family:'Inter','Segoe UI',Arial,sans-serif;
    font-size:12px; color:#b94a48; font-weight:500;
  }
  @keyframes ctpLoginRise{
    from{ opacity:0; transform:translateY(10px); }
    to{ opacity:1; transform:translateY(0); }
  }
  @media (prefers-reduced-motion:reduce){
    .ctp-login-card{ animation:none; }
    #ctp-login{ transition:opacity .15s linear; }
  }

  /* CTP-BG START — login dark-glass restyle (approved prototype; styling only, no ID/handler changes) */
  #ctp-login{ background:var(--ctp-bg) 62% 50%/cover no-repeat fixed, #06090c; }
  #ctp-login::before{ content:""; position:absolute; inset:0; pointer-events:none; z-index:0; background:radial-gradient(135% 120% at 50% 42%, rgba(0,0,0,0) 50%, rgba(0,0,0,.62) 100%); }
  #ctp-login::after{ content:""; position:absolute; left:50%; top:50%; width:760px; height:760px; transform:translate(-50%,-52%); pointer-events:none; z-index:0; background:radial-gradient(circle at 50% 50%, rgba(60,224,228,.20) 0%, rgba(45,200,210,.10) 32%, rgba(0,0,0,0) 64%); filter:blur(6px); animation:ctpBgDrift 14s ease-in-out infinite alternate; }
  @keyframes ctpBgDrift{ from{ transform:translate(-50%,-52%) scale(1); } to{ transform:translate(-49%,-50%) scale(1.06); } }
  .ctp-login-card{ position:relative; z-index:2; max-width:404px; background:rgba(10,15,20,.62); -webkit-backdrop-filter:blur(20px) saturate(120%); backdrop-filter:blur(20px) saturate(120%); border:1px solid rgba(130,220,228,.16); border-radius:22px; box-shadow:0 34px 90px rgba(0,0,0,.62), 0 0 78px rgba(40,200,210,.10), inset 0 1px 0 rgba(180,240,244,.10); color:#eaf6f8; }
  .ctp-login-card::before{ content:""; position:absolute; inset:0 0 auto 0; height:1px; border-radius:22px 22px 0 0; pointer-events:none; background:linear-gradient(90deg, transparent, rgba(120,240,246,.55) 38%, rgba(120,240,246,.7) 50%, rgba(120,240,246,.55) 62%, transparent); }
  #ctp-login-logo{ display:none; }
  .ctp-bg-brand{ width:48px; height:48px; margin:2px auto 14px; border-radius:13px; display:flex; align-items:center; justify-content:center; background:rgba(70,192,208,.12); border:1px solid rgba(130,220,228,.26); box-shadow:inset 0 1px 0 rgba(180,240,244,.18), 0 6px 18px rgba(0,0,0,.35); }
  .ctp-bg-brand svg{ width:22px; height:22px; display:block; }
  .ctp-login-tag{ color:#8fb9bf; border-bottom-color:rgba(130,220,228,.18); }
  .ctp-login-h{ color:#eef6f8; }
  .ctp-login-sub{ color:#9fb6ba; }
  .ctp-login-label{ color:#8aabb0; }
  .ctp-login-label input{ color:#eef6f8; background:rgba(255,255,255,.055); border:1px solid rgba(150,220,228,.18); border-radius:11px; }
  .ctp-login-label input::placeholder{ color:#6f878c; }
  .ctp-login-label input:hover{ border-color:rgba(150,220,228,.30); }
  .ctp-login-label input:focus{ outline:none; border-color:#46e0e4; background:rgba(255,255,255,.07); box-shadow:0 0 0 3px rgba(70,224,228,.16); }
  .ctp-login-remember{ color:#b9ccd0 !important; }
  .ctp-login-remember input{ accent-color:#23c7d2 !important; }
  #ctp-login-pw-toggle{ color:#7fe0e6 !important; }
  #ctp-to-signin, #ctp-to-setup{ color:#6fdfe6 !important; }
  .ctp-login-btn{ background:linear-gradient(180deg,#5fe4ea,#23c7d2); color:#042a30; border-radius:11px; box-shadow:0 8px 24px rgba(37,201,212,.42), inset 0 1px 0 rgba(255,255,255,.4); }
  .ctp-login-btn:hover{ background:linear-gradient(180deg,#6fe9ef,#2bd0db); filter:brightness(1.04); }
  .ctp-login-btn:disabled{ background:#3a6b72; color:#cfe9ec; box-shadow:none; }
  .ctp-login-err{ color:#ff9b97; }
  @media (max-width:440px){ .ctp-login-card{ border-radius:18px; } #ctp-login::after{ width:520px; height:520px; } }
  @media (prefers-reduced-motion:reduce){ #ctp-login::after{ animation:none; } }
  /* CTP-BG END */

  /* Sidebar "Signed in as" footer + admin button */
  .sb-user{
    margin-top:auto; padding:14px 16px;
    border-top:1px solid rgba(255,255,255,.08);
    font-size:11px; color:rgba(255,255,255,.7);
  }
  .sb-user-name{ font-weight:600; color:#fff; font-size:12.5px; margin-bottom:6px; }
  .sb-user-actions{ display:flex; gap:6px; }
  .sb-user-btn{
    flex:1; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.12);
    color:rgba(255,255,255,.85); cursor:pointer; padding:5px 8px; border-radius:5px;
    font-size:10px; font-weight:600; letter-spacing:.8px; text-transform:uppercase;
    font-family:inherit;
  }
  .sb-user-btn:hover{ background:rgba(255,255,255,.12); color:#fff; }
