#ml-join-dialog{padding:0;width:min(760px,94vw);height:min(900px,92dvh);max-height:92dvh;border:1px solid #f0c24b;border-radius:18px;background:#071525;color:#fff;box-shadow:0 24px 80px #0009}
#ml-join-dialog::backdrop{background:rgba(0,0,0,.78)}
.ml-join-dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px}
.ml-join-dialog-header h2{margin:0;font-size:1.25rem;color:#fff}
.ml-join-dialog-header button{min-height:44px;padding:8px 14px;border:1px solid #f0c24b;border-radius:8px;background:#071525;color:#fff;font:inherit;cursor:pointer}
#ml-join-dialog iframe{display:block;width:100%;height:calc(100% - 112px);border:0;background:#071525}
.ml-join-fallback{margin:0;padding:0 20px 12px}
.ml-join-fallback a,.ml-join-shell a{color:#f0c24b;text-decoration:underline}
.ml-join-page{margin:0;background:#071525;color:#f5f7fb;font-family:Arial,Helvetica,sans-serif}
.ml-join-shell{max-width:740px;margin:auto;padding:24px;box-sizing:border-box}
.ml-join-brand{color:#f0c24b;font-weight:900;letter-spacing:.06em}
.ml-join-shell h1{font-size:clamp(28px,5vw,40px);line-height:1.15;margin:8px 0;color:#fff}
.ml-join-summary{color:#cbd5e1;line-height:1.5}
.ml-join-shell input:not([type=checkbox]):not([type=radio]),.ml-join-shell select,.ml-join-shell textarea{background:#fff;color:#111827;border:1px solid #64748b;border-radius:8px;min-height:44px;font-size:16px}
.ml-join-shell label{color:#f5f7fb}.ml-join-shell #payment{background:#13253b;color:#fff}
.ml-join-shell button.button{background:#f0c24b;color:#071633;border:0;border-radius:10px;min-height:48px;font-size:17px;font-weight:800;padding:12px 20px}
.ml-join-notice{padding:20px;border:1px solid #f0c24b;border-radius:10px;line-height:1.5}
#ml-join-dialog :focus-visible,.ml-join-shell :focus-visible{outline:3px solid #f0c24b;outline-offset:3px}
@media(max-width:600px){.ml-join-shell{padding:18px}.ml-join-shell .col2-set .col-1,.ml-join-shell .col2-set .col-2{float:none;width:100%}}

/* Keep native checkout panels within the narrow Join page and dialog. */
.ml-join-shell,.ml-join-shell *{box-sizing:border-box}
.ml-join-shell .woocommerce,.ml-join-shell form.checkout,.ml-join-shell #customer_details,.ml-join-shell #order_review{width:100%;max-width:100%;min-width:0}
.ml-join-shell .woocommerce-input-wrapper{display:block;min-width:0}
.ml-join-shell input:not([type=checkbox]):not([type=radio]),.ml-join-shell select,.ml-join-shell textarea{max-width:100%}
@media(max-width:600px){
 .ml-join-shell #customer_details,.ml-join-shell #order_review{padding:16px}
 .ml-join-shell .woocommerce form .form-row-first,.ml-join-shell .woocommerce form .form-row-last{float:none;width:100%}
}