
  :root{
    --navy:#121417;--navy2:#1E2228;--navy3:#0F172A;--steel:#121417;
    --teal:#E01E26;--teal2:#16A34A;--cream:#faf6ee;--cream2:#f5f0e8;
    --yellow:#16A34A;--grey:#6b7280;--line:#e5e7eb;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  body{font-family:'Inter',-apple-system,sans-serif;color:#0f172a;background:#fff;-webkit-font-smoothing:antialiased}
  img{display:block;max-width:100%}
  a{text-decoration:none;color:inherit}

  .auth{display:flex;min-height:100vh}

  
  .back-link{position:absolute;top:24px;left:28px;z-index:10;color:#fff;font-size:13.5px;font-weight:600;opacity:.9;display:inline-flex;align-items:center;gap:7px}
  .back-link:hover{opacity:1;color:var(--teal)}

  
  .auth-left{width:45%;background:var(--navy);color:#fff;position:relative;display:flex;flex-direction:column;padding:64px 56px;overflow:hidden}
  .auth-left .bg{position:absolute;inset:0;background:url('img/tcuk-home-hero-right.webp') center/cover no-repeat;opacity:.18;z-index:0}
  .auth-left .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,20,23,.55),rgba(18,20,23,.92))}
  .auth-left .inner{position:relative;z-index:1;display:flex;flex-direction:column;height:100%}
  .auth-left .logo{background:transparent;border-radius:0;padding:0;display:inline-flex;align-self:flex-start;margin-bottom:auto}
  .auth-left .logo img{width:220px;height:auto}
  .auth-left h1{font-size:40px;font-weight:800;letter-spacing:-.6px;line-height:1.1;margin:40px 0 16px}
  .auth-left .sub{color:var(--teal);font-size:16px;font-weight:500;line-height:1.5;max-width:380px;margin-bottom:34px}
  .trust{list-style:none;margin-bottom:auto}
  .trust li{font-size:14px;opacity:.92;margin-bottom:13px;display:flex;align-items:center;gap:10px}
  .trust li .ck{color:var(--teal);font-weight:800}
  .auth-left .reg-line{font-size:14px;margin-top:40px;opacity:.92}
  .auth-left .reg-line a{color:#fff;font-weight:800}
  .auth-left .reg-line a:hover{color:var(--teal)}

  
  .auth-right{width:55%;display:flex;align-items:center;justify-content:center;padding:48px 40px;background:#fff}
  .form-box{width:100%;max-width:420px}
  .form-box h2{font-size:32px;font-weight:800;color:var(--navy);letter-spacing:-.4px;margin-bottom:8px}
  .form-box .lead{font-size:15px;color:var(--grey);margin-bottom:32px}

  .field{margin-bottom:18px}
  .field label{display:block;font-size:13px;font-weight:700;color:var(--navy);margin-bottom:7px}
  .field input{width:100%;border:1px solid var(--line);border-radius:9px;padding:13px 15px;font-size:15px;font-family:inherit;color:#0f172a;outline:0;transition:border-color .15s,box-shadow .15s}
  .field input:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(224,30,38,.15)}
  .pw-wrap{position:relative}
  .pw-toggle{position:absolute;right:14px;top:50%;transform:translateY(-50%);font-size:12.5px;font-weight:700;color:var(--teal);cursor:pointer;user-select:none}

  .row-between{display:flex;align-items:center;justify-content:space-between;margin:6px 0 22px}
  .remember{display:flex;align-items:center;gap:8px;font-size:13.5px;color:#475569;cursor:pointer}
  .remember input{width:16px;height:16px;accent-color:var(--teal);cursor:pointer}
  .forgot{font-size:13.5px;color:var(--teal);font-weight:600}
  .forgot:hover{text-decoration:underline}

  .btn-teal{background:var(--teal);color:#fff;border:0;border-radius:24px;padding:14px;font-size:15px;font-weight:800;width:100%;cursor:pointer;transition:filter .15s}
  .btn-teal:hover{filter:brightness(.95)}
  .btn-teal:disabled{opacity:.6;cursor:not-allowed}

  .divider{display:flex;align-items:center;gap:14px;margin:22px 0;color:#94a3b8;font-size:12.5px;font-weight:600}
  .divider::before,.divider::after{content:"";flex:1;height:1px;background:var(--line)}

  .btn-google{width:100%;border:1px solid var(--line);background:#fff;border-radius:24px;padding:13px;font-size:14.5px;font-weight:700;color:#1f2937;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:background .15s}
  .btn-google:hover{background:#f8fafc}
  .btn-google svg{width:18px;height:18px}

  .alt-link{text-align:center;font-size:13.5px;color:var(--grey);margin-top:26px}
  .alt-link a{color:var(--teal);font-weight:700}
  .alt-link a:hover{text-decoration:underline}

  .err-box{display:none;background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;font-size:13.5px;font-weight:600;padding:11px 14px;border-radius:9px;margin-bottom:18px}
  .err-box.show{display:block}

  @media(max-width:900px){
    .auth{flex-direction:column}
    .auth-left{width:100%;min-height:320px;padding:72px 32px 40px}
    .auth-right{width:100%;padding:40px 24px}
    .auth-left .reg-line{margin-top:28px}
  }

.filterbar{background:#f8fafc!important;border-bottom:1px solid #E2E5E9!important;box-shadow:0 12px 26px rgba(15,23,42,.08)!important}.filterbar input,.filterbar select{border:1px solid #D6DAE0!important;box-shadow:0 2px 8px rgba(15,23,42,.045)!important}.filterbar input:focus,.filterbar select:focus{border-color:var(--teal)!important;box-shadow:0 0 0 3px rgba(224,30,38,.14)!important}

  :root{
    --navy:#121417;--navy2:#1E2228;--navy3:#0F172A;--steel:#121417;
    --teal:#E01E26;--teal2:#16A34A;--cream:#faf6ee;--cream2:#f5f0e8;
    --yellow:#16A34A;--grey:#6b7280;--line:#e5e7eb;
  }
  *{margin:0;padding:0;box-sizing:border-box}
  body{font-family:'Inter',-apple-system,sans-serif;color:#0f172a;background:#fff;-webkit-font-smoothing:antialiased}
  img{display:block;max-width:100%}
  a{text-decoration:none;color:inherit}

  .auth{display:flex;min-height:100vh}
  .back-link{position:absolute;top:24px;left:28px;z-index:10;color:#fff;font-size:13.5px;font-weight:600;opacity:.9;display:inline-flex;align-items:center;gap:7px}
  .back-link:hover{opacity:1;color:var(--teal)}

  
  .auth-left{width:45%;background:var(--navy);color:#fff;position:relative;display:flex;flex-direction:column;padding:64px 56px;overflow:hidden}
  .auth-left .bg{position:absolute;inset:0;background:url('img/tcuk-home-hero-right.webp') center/cover no-repeat;opacity:.18;z-index:0}
  .auth-left .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,20,23,.55),rgba(18,20,23,.92))}
  .auth-left .inner{position:relative;z-index:1;display:flex;flex-direction:column;height:100%}
  .auth-left .logo{background:transparent;border-radius:0;padding:0;display:inline-flex;align-self:flex-start;margin-bottom:36px}
  .auth-left .logo img{width:220px;height:auto}
  .auth-left h1{font-size:38px;font-weight:800;letter-spacing:-.6px;line-height:1.1;margin-bottom:12px}
  .auth-left .sub{color:var(--teal);font-size:16px;font-weight:500;line-height:1.5;max-width:360px;margin-bottom:30px}

  
  .opt-card{border:1.5px solid rgba(255,255,255,.28);border-radius:13px;padding:18px 20px;margin-bottom:14px;cursor:pointer;display:flex;align-items:flex-start;gap:14px;transition:all .18s;background:rgba(255,255,255,.02)}
  .opt-card:hover{border-color:rgba(224,30,38,.6)}
  .opt-card.selected{border-color:var(--teal);background:rgba(224,30,38,.14)}
  .opt-card .ico{font-size:26px;line-height:1.1;flex-shrink:0}
  .opt-card .ot{font-size:15px;font-weight:800;margin-bottom:4px}
  .opt-card .od{font-size:13px;opacity:.85;line-height:1.45}

  .auth-left .signin-line{font-size:14px;margin-top:auto;padding-top:30px;opacity:.92}
  .auth-left .signin-line a{color:#fff;font-weight:800}
  .auth-left .signin-line a:hover{color:var(--teal)}

  
  .auth-right{width:55%;display:flex;align-items:center;justify-content:center;padding:48px 40px;background:#fff;overflow-y:auto}
  .form-box{width:100%;max-width:480px}
  .form-box h2{font-size:30px;font-weight:800;color:var(--navy);letter-spacing:-.4px;margin-bottom:22px}

  
  .progress{display:flex;align-items:center;gap:0;margin-bottom:30px}
  .pstep{display:flex;align-items:center;gap:9px;flex:1}
  .pstep .num{width:28px;height:28px;border-radius:50%;background:#e5e7eb;color:#94a3b8;font-size:13px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}
  .pstep .ptxt{font-size:12.5px;font-weight:700;color:#94a3b8;white-space:nowrap}
  .pstep.active .num{background:var(--teal);color:#fff}
  .pstep.active .ptxt{color:var(--navy)}
  .pstep.done .num{background:var(--navy);color:#fff}
  .pstep.done .ptxt{color:var(--navy)}
  .pline{height:2px;background:#e5e7eb;flex:1;margin:0 8px;min-width:14px}
  .pline.done{background:var(--teal)}

  
  .q-label{font-size:16px;font-weight:800;color:var(--navy);margin-bottom:16px}
  .opt-big{border:1.5px solid var(--line);border-radius:13px;padding:22px;margin-bottom:14px;cursor:pointer;display:flex;align-items:center;gap:16px;transition:all .18s}
  .opt-big:hover{border-color:var(--teal)}
  .opt-big.selected{border-color:var(--teal);background:rgba(224,30,38,.07);box-shadow:0 0 0 3px rgba(224,30,38,.12)}
  .opt-big .ico{font-size:34px;flex-shrink:0}
  .opt-big .ot{font-size:17px;font-weight:800;color:var(--navy);margin-bottom:4px}
  .opt-big .od{font-size:13.5px;color:var(--grey);line-height:1.45}
  .opt-big .rad{margin-left:auto;width:22px;height:22px;border-radius:50%;border:2px solid var(--line);flex-shrink:0;position:relative}
  .opt-big.selected .rad{border-color:var(--teal)}
  .opt-big.selected .rad::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--teal)}

  
  .field{margin-bottom:16px}
  .field label{display:block;font-size:13px;font-weight:700;color:var(--navy);margin-bottom:7px}
  .field input,.field select{width:100%;border:1px solid var(--line);border-radius:9px;padding:12px 14px;font-size:14.5px;font-family:inherit;color:#0f172a;outline:0;background:#fff;transition:border-color .15s,box-shadow .15s}
  .field input:focus,.field select:focus{border-color:var(--teal);box-shadow:0 0 0 3px rgba(224,30,38,.15)}
  .grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .pw-wrap{position:relative}
  .pw-toggle{position:absolute;right:13px;top:50%;transform:translateY(-50%);font-size:12px;font-weight:700;color:var(--teal);cursor:pointer;user-select:none}
  .role-fields{display:none}
  .role-fields.show{display:block}

  .terms{display:flex;align-items:flex-start;gap:10px;font-size:13px;color:#475569;margin:18px 0 22px;line-height:1.5}
  .terms input{width:17px;height:17px;accent-color:var(--teal);cursor:pointer;margin-top:1px;flex-shrink:0}
  .terms a{color:var(--teal);font-weight:600}
  .plan-summary{display:none;border:1px solid rgba(224,30,38,.35);background:rgba(224,30,38,.08);border-radius:10px;padding:12px 14px;margin:16px 0;color:#0f172a;font-size:13.5px;line-height:1.45}
  .plan-summary.show{display:block}
  .plan-summary strong{color:var(--navy)}
  .plan-summary span{display:block;color:#475569;margin-top:3px}

  .btn-teal{background:var(--teal);color:#fff;border:0;border-radius:24px;padding:14px;font-size:15px;font-weight:800;width:100%;cursor:pointer;transition:filter .15s}
  .btn-teal:hover{filter:brightness(.95)}
  .btn-teal:disabled{opacity:.5;cursor:not-allowed}
  .btn-ghost{background:#fff;border:1px solid var(--line);color:var(--navy);border-radius:24px;padding:14px 22px;font-size:14.5px;font-weight:700;cursor:pointer}

  .step{display:none}
  .step.active{display:block}

  .err-box{display:none;background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;font-size:13.5px;font-weight:600;padding:11px 14px;border-radius:9px;margin-bottom:18px}
  .err-box.show{display:block}

  
  .success{text-align:center;padding:20px 0}
  .success .circle{width:78px;height:78px;border-radius:50%;background:#dcfce7;color:#16a34a;font-size:40px;display:flex;align-items:center;justify-content:center;margin:0 auto 24px}
  .success h2{font-size:28px;margin-bottom:12px}
  .success p{font-size:15px;color:var(--grey);line-height:1.55;max-width:380px;margin:0 auto 28px}

  @media(max-width:900px){
    .auth{flex-direction:column}
    .auth-left{width:100%;min-height:auto;padding:72px 32px 36px}
    .auth-right{width:100%;padding:36px 24px}
    .auth-left .signin-line{margin-top:24px}
    .grid2{grid-template-columns:1fr}
  }

.filterbar{background:#f8fafc!important;border-bottom:1px solid #E2E5E9!important;box-shadow:0 12px 26px rgba(15,23,42,.08)!important}.filterbar input,.filterbar select{border:1px solid #D6DAE0!important;box-shadow:0 2px 8px rgba(15,23,42,.045)!important}.filterbar input:focus,.filterbar select:focus{border-color:var(--teal)!important;box-shadow:0 0 0 3px rgba(224,30,38,.14)!important}
/* Claim-listing banner on register */
.etm-claim-banner{display:flex;gap:12px;align-items:flex-start;background:rgba(224,30,38,.1);border:1px solid rgba(224,30,38,.3);border-radius:12px;padding:14px 16px;margin:0 0 20px;color:#0F7A38}
.etm-claim-banner svg{width:22px;height:22px;flex:none;color:#B71C24;margin-top:2px}
.etm-claim-banner strong{color:#121417;font-size:15px}
.etm-claim-banner span{font-size:13.5px;color:#475569;line-height:1.5}

/* ---- Minimal auth-page header (logo left, back-to-site right) ---- */
.etm-auth-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 28px;background:#121417;
  position:relative;z-index:30;
}
.etm-auth-header .etm-auth-logo{display:inline-flex;align-items:center;line-height:0;}
.etm-auth-header .etm-auth-logo .etm-logo-svg{width:188px;max-width:46vw;}
.etm-auth-header .etm-auth-back{
  display:inline-flex;align-items:center;gap:7px;
  color:#fff;font-size:14px;font-weight:700;text-decoration:none;
  padding:9px 16px;border:1px solid rgba(255,255,255,.32);border-radius:8px;
  transition:background .15s,border-color .15s;white-space:nowrap;
}
.etm-auth-header .etm-auth-back:hover{background:rgba(224,30,38,.16);border-color:#E01E26;color:#fff;}
.etm-auth-header .etm-auth-back span{color:#E01E26;}
@media(max-width:600px){
  .etm-auth-header{padding:12px 16px;}
  .etm-auth-header .etm-auth-back{font-size:12.5px;padding:8px 12px;}
}

/* ===================== Checkout / order review ===================== */
.etm-checkout-wrap{min-height:60vh;background:#f1f5f9;padding:40px 16px 64px;}
.etm-checkout{max-width:560px;margin:0 auto;}
.etm-checkout-back{display:inline-block;color:#475569;text-decoration:none;font-size:14px;font-weight:600;margin-bottom:14px;}
.etm-checkout-back:hover{color:#16A34A;}
.etm-checkout h1{font-size:30px;font-weight:900;color:#121417;margin:0 0 6px;letter-spacing:-.02em;}
.etm-checkout-sub{color:#64748b;font-size:15px;margin:0 0 22px;line-height:1.5;}
.etm-co-card{background:#fff;border:1px solid #e2e8f0;border-radius:16px;padding:26px;box-shadow:0 10px 30px rgba(18,20,23,.06);}
.etm-co-line{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:18px;border-bottom:1px solid #eef2f7;}
.etm-co-line-main{display:flex;flex-direction:column;gap:3px;}
.etm-co-name{font-size:17px;font-weight:800;color:#0f172a;}
.etm-co-cadence{font-size:13px;color:#94a3b8;font-weight:600;}
.etm-co-price{font-size:22px;font-weight:900;color:#121417;white-space:nowrap;}
.etm-co-price span{font-size:14px;font-weight:600;color:#94a3b8;}
.etm-co-includes{list-style:none;margin:18px 0;padding:0;display:flex;flex-direction:column;gap:11px;}
.etm-co-includes li{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;color:#334155;line-height:1.4;}
.etm-co-includes li svg{width:18px;height:18px;color:#16A34A;flex:none;margin-top:1px;}
.etm-co-total{display:flex;align-items:center;justify-content:space-between;padding-top:18px;border-top:1px solid #eef2f7;font-size:16px;color:#0f172a;}
.etm-co-total strong{font-size:24px;font-weight:900;color:#121417;}
.etm-co-renew{margin:8px 0 0;font-size:13px;color:#94a3b8;}
.etm-co-payform{margin:22px 0 0;}
.etm-co-pay{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;border:0;cursor:pointer;
  background:#E01E26;color:#fff;font-weight:900;font-size:17px;padding:16px 20px;border-radius:12px;
  box-shadow:0 10px 24px rgba(224,30,38,.34);transition:transform .12s,box-shadow .12s;}
.etm-co-pay:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(224,30,38,.42);}
.etm-co-pay svg{width:19px;height:19px;}
.etm-co-trust{display:flex;align-items:flex-start;gap:10px;margin:16px 4px 0;color:#64748b;font-size:13px;line-height:1.5;}
.etm-co-trust svg{width:18px;height:18px;color:#16A34A;flex:none;margin-top:1px;}
.etm-co-trust strong{color:#334155;}
.etm-co-error{background:#fef2f2;border:1px solid #fecaca;color:#b91c1c;border-radius:10px;padding:12px 14px;font-size:14px;margin:0 0 18px;}
@media(max-width:600px){
  .etm-checkout h1{font-size:25px;}
  .etm-co-card{padding:20px;}
}
