.reg-wrap{max-width:520px;margin:56px auto;padding:0 20px}
    .card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:40px 36px;box-shadow:0 4px 20px rgba(0,0,0,.04)}
    .card h1{font-size:28px;font-weight:800;color:#0f172a;margin-bottom:6px}
    .card p.lead{color:#6b7280;font-size:14px;margin-bottom:28px}

    form .row{margin-bottom:18px}
    form label{display:block;font-size:13px;font-weight:600;color:#374151;margin-bottom:6px}
    form input[type=text],
    form input[type=email],
    form input[type=password]{
        width:100%;padding:11px 14px;border:1px solid #d1d5db;border-radius:8px;
        font-size:15px;font-family:inherit;color:#111827;background:#fff;
        transition:border-color .15s,box-shadow .15s;outline:none
    }
    form input:focus{border-color:#6366f1;box-shadow:0 0 0 3px rgba(99,102,241,.15)}
    form .hint{font-size:12px;color:#9ca3af;margin-top:4px}
    form .terms{display:flex;align-items:flex-start;gap:10px;margin:20px 0 24px}
    form .terms input{margin-top:3px}
    form .terms label{font-size:13px;font-weight:400;color:#4b5563;margin:0}
    form .terms a{color:#4f46e5}
    form button{width:100%;padding:13px;background:#4f46e5;color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s}
    form button:hover{background:#4338ca}

    .alt{text-align:center;margin-top:22px;font-size:13px;color:#6b7280}
    .alt a{color:#4f46e5;font-weight:600}

    .errs{background:#fef2f2;border:1px solid #fecaca;color:#991b1b;padding:12px 14px;border-radius:8px;font-size:13px;margin-bottom:20px}
    .errs ul{margin:4px 0 0 18px;padding:0}

    .trial-badge{display:inline-flex;align-items:center;gap:6px;background:#eef2ff;color:#4338ca;padding:6px 12px;border-radius:999px;font-size:12px;font-weight:600;margin-bottom:18px}

    /* ───── Extracted from former inline style="" attributes
       (CodeCanyon compliance — keep styles in CSS, not in markup). ───── */

    /* Workspace-slug URL preview pill rendered under the workspace-name
       input.  The JS in the view rewrites textContent only — the slug
       value itself is dynamic but the style is constant. */
    .ws-url-preview{
        font-family:ui-monospace,'SF Mono',monospace;
        color:#4f46e5;
        font-weight:600;
    }

    /* Validation warning rendered when the chosen slug collides with a
       reserved path.  Hidden by default; the JS sets style.display
       directly when it needs to show or hide it, so we only need the
       resting visual treatment here. */
    .ws-url-warn{
        display:none;
        color:#b45309;
        margin-top:4px;
        font-weight:600;
    }

    /* "(optional)" hint shown next to the coupon-code label. */
    .label-optional{
        color:#9ca3af;
        font-weight:400;
    }

    /* Coupon warning toast shown when the server returns a soft-fail. */
    .coupon-warning{
        background:#fef3c7;
        border:1px solid #fbbf24;
        border-radius:8px;
        padding:10px 14px;
        margin:0 0 16px;
        color:#92400e;
        font-size:13px;
    }