*, *::before, *::after { box-sizing: border-box; }

    :root {
      --ink: #0f1117;
      --ink-soft: #4a4e5c;
      --surface: #f7f6f2;
      --card: #ffffff;
      --accent: #1a56e8;
      --accent-dark: #0f38b8;
      --gold: #c8a84b;
      --border: #e4e2da;
      --error: #d94040;
      --shadow-lg: 0 20px 60px rgba(15,17,23,.13);
      --radius: 14px;
    }

    body {
      font-family: 'DM Sans', sans-serif !important;
      background:
        radial-gradient(ellipse 55% 45% at 0% 100%, rgba(26,86,232,.08) 0%, transparent 65%),
        radial-gradient(ellipse 40% 40% at 100% 0%, rgba(200,168,75,.07) 0%, transparent 60%),
        var(--surface) !important;
      color: var(--ink);
      min-height: 100vh;
    }

    /* ── OUTER WRAPPER ── */
    #signuppage-outer1 {
      width: 100% !important;
      max-width: 600px !important;
      margin: 3rem auto !important;
      padding: 0 1rem !important;
      float: none !important;
    }

    /* ── CARD ── */
    #signuppagecontentdiv {
      background: var(--card) !important;
      border: 1px solid var(--border) !important;
      border-radius: var(--radius) !important;
      box-shadow: var(--shadow-lg) !important;
      overflow: visible !important;
      padding: 0 !important;
      position: relative;
    }

    /* ── TOP ACCENT STRIPE ── */
    #signuppagecontentdiv::before {
      content: '';
      display: block;
      height: 5px;
      background: linear-gradient(90deg, var(--accent) 0%, var(--gold) 100%);
      border-radius: var(--radius) var(--radius) 0 0;
    }

    /* ── FORM BODY ── */
    #addmemberpagebodydiv {
      padding: 2.25rem 2.5rem 1.75rem !important;
      text-align: left !important;
    }

    /* ── CARD HEADING ── */
    .caicus-form-heading {
      font-family: 'DM Serif Display', serif;
      font-size: 1.7rem;
      letter-spacing: -.025em;
      color: var(--ink);
      margin-bottom: .3rem;
      display: block;
    }
    .caicus-form-subheading {
      font-size: .8rem;
      color: var(--ink-soft);
      font-weight: 300;
      display: block;
      margin-bottom: 1.75rem;
    }

    /* ── FIELD SPACING ── */
    .caicus-field {
      margin-bottom: 1.1rem;
    }

    /* ── LABELS ── */
    #addmemberpagebodydiv label {
      display: block;
      text-align: left;
      font-size: .8rem;
      font-weight: 600;
      color: var(--ink);
      letter-spacing: .015em;
      margin-bottom: .4rem;
      line-height: 1.5;
    }

    /* ── INPUTS ── */
    .caicus-signup-input {
      width: 100% !important;
      height: 46px !important;
      padding: 0 1rem !important;
      border: 1.5px solid var(--border) !important;
      border-radius: 9px !important;
      font-family: 'DM Sans', sans-serif !important;
      font-size: .9rem !important;
      color: var(--ink) !important;
      background: var(--surface) !important;
      transition: border-color .2s, box-shadow .2s, background .2s !important;
      outline: none !important;
      box-shadow: none !important;
      display: block !important;
    }
    .caicus-signup-input:focus {
      border-color: var(--accent) !important;
      background: #fff !important;
      box-shadow: 0 0 0 3px rgba(26,86,232,.12) !important;
    }
    .caicus-signup-input::placeholder {
      color: #b5b2a8 !important;
      font-weight: 300 !important;
    }

    /* ── TWO-COL TABLE (firstname / lastname) ── */
    #addmemberpagebodydiv table {
      width: 100% !important;
      border-collapse: separate !important;
      border-spacing: 1rem 0 !important;
      margin: 0 !important;
      table-layout: fixed;
    }
    #addmemberpagebodydiv table td {
      width: 50% !important;
      vertical-align: top !important;
      padding: 0 !important;
    }

    /* ── CHECKBOX ROW ── */
    #addmemberpagebodydiv .form-check-input {
      width: 15px !important;
      height: 15px !important;
      accent-color: var(--accent);
      cursor: pointer;
      vertical-align: middle;
      margin-right: .4rem;
      flex-shrink: 0;
    }
    #addmemberpagebodydiv .form-check-label {
      font-size: .78rem !important;
      font-weight: 400 !important;
      color: var(--ink-soft) !important;
      cursor: pointer;
      display: inline !important;
      letter-spacing: 0 !important;
    }
    #addmemberpagebodydiv div:has(.form-check-input) {
      margin-top: .6rem;
      display: flex !important;
      align-items: center;
    }

    /* ── ADDRESS: force input below full label ── */
    #memberaddress-signuppage {
      display: block !important;
      clear: both !important;
    }
    label[for="memberaddress-signuppage"] {
      display: block !important;
      width: 100% !important;
    }

    /* ── CAPTCHA ── */
    .caicus-captchadiv {
      margin: 1.25rem 0 !important;
    }

    /* ── SUBMIT BUTTON ── */
    #signuppagebutton {
      width: 100% !important;
      height: 50px !important;
      background: var(--accent) !important;
      color: #fff !important;
      border: none !important;
      border-radius: 10px !important;
      font-family: 'DM Sans', sans-serif !important;
      font-size: .95rem !important;
      font-weight: 600 !important;
      letter-spacing: .01em !important;
      cursor: pointer !important;
      transition: background .2s, transform .15s, box-shadow .2s !important;
      box-shadow: 0 4px 16px rgba(26,86,232,.28) !important;
      margin-top: .5rem !important;
      display: block !important;
    }
    #signuppagebutton:hover {
      background: var(--accent-dark) !important;
      box-shadow: 0 6px 24px rgba(26,86,232,.38) !important;
      transform: translateY(-1px) !important;
    }
    #signuppagebutton:active { transform: translateY(0) !important; }

    /* ── LOADING BUTTON ── */
    #memberSignupPostLoadingButton {
      width: calc(100% - 5rem) !important;
      height: 50px !important;
      border-radius: 10px !important;
      font-family: 'DM Sans', sans-serif !important;
      font-size: .9rem !important;
      font-weight: 500 !important;
      background: var(--border) !important;
      color: var(--ink-soft) !important;
      border: none !important;
      margin: .5rem 2.5rem 1.25rem !important;
    }

    /* ── RESPONSE DIV WRAPPER ── */
    #signuppagecontentdiv > div:last-child {
      padding: 0 2.5rem !important;
    }

    /* ── RESPONSE MESSAGE ── */
    #addmembermodalresponse {
      border-radius: 9px !important;
      font-size: .85rem !important;
      font-weight: 500 !important;
      padding: .85rem 1rem !important;
    }

    /* ── HIDE <br> SPACERS — replaced by CSS margin ── */
    #addmemberpagebodydiv > br { display: none; }

    /* ── RESPONSIVE ── */
    @media (max-width: 620px) {
      #signuppage-outer1 { margin: 1.5rem auto !important; }
      #addmemberpagebodydiv { padding: 1.75rem 1.25rem 1.5rem !important; }
      #addmemberpagebodydiv table,
      #addmemberpagebodydiv table tbody,
      #addmemberpagebodydiv table tr,
      #addmemberpagebodydiv table td {
        display: block !important;
        width: 100% !important;
      }
      #memberSignupPostLoadingButton {
        width: calc(100% - 2.5rem) !important;
        margin: .5rem 1.25rem 1.25rem !important;
      }
      #signuppagecontentdiv > div:last-child {
        padding: 0 1.25rem !important;
      }
    }