.mg-signup { color: var(--mg-blue); font-size: 11px; font-weight: 750; white-space: nowrap; }
.mg-hero-cover { background: #080b12; border-radius: 35px; box-shadow: 0 24px 65px #0b10252e; height: 405px; overflow: hidden; position: relative; }
.mg-hero-cover::after { background: linear-gradient(180deg, transparent 62%, #080b12aa); content: ""; inset: 0; pointer-events: none; position: absolute; }
.mg-hero-cover img { display: block; height: 100%; object-fit: cover; object-position: center; width: 100%; }
.mg-hero-cover .mg-online { z-index: 2; }

.mg-register { display: grid; grid-template-columns: .9fr 1.1fr; min-height: 760px; padding-block: 62px 80px; }
.mg-register-visual { background: radial-gradient(circle at 75% 25%, #5b70f555, transparent 35%), linear-gradient(145deg, #151a29, #080b12 72%); border-radius: 24px 0 0 24px; color: #fff; overflow: hidden; padding: 58px 52px; position: relative; }
.mg-register-visual::after { background-image: linear-gradient(#5b70f522 1px, transparent 1px), linear-gradient(90deg, #5b70f522 1px, transparent 1px); background-size: 34px 34px; content: ""; inset: 0; mask-image: linear-gradient(135deg, transparent 20%, #000); opacity: .45; pointer-events: none; position: absolute; transform: perspective(600px) rotateX(58deg) scale(1.6) translateY(220px); }
.mg-register-brand { align-items: center; display: flex; gap: 12px; margin-bottom: 85px; position: relative; z-index: 1; }
.mg-register-brand > i { background: #fff; border-radius: 12px; color: var(--mg-ink); display: grid; font: 800 12px monospace; height: 42px; place-items: center; position: relative; width: 42px; }
.mg-register-brand > i::after { background: var(--mg-lime); border-radius: 2px; content: ""; height: 8px; position: absolute; right: -3px; top: -3px; width: 8px; }
.mg-register-brand b { font-size: 21px; letter-spacing: -.8px; }.mg-register-brand b span { color: var(--mg-lime); }
.mg-register-visual > .mg-label { color: var(--mg-lime); position: relative; z-index: 1; }
.mg-register-visual h1 { font-size: 42px; letter-spacing: -2.5px; line-height: 1.07; margin: 12px 0 20px; max-width: 430px; position: relative; z-index: 1; }
.mg-register-visual > p { color: #adb2c0; font-size: 14px; line-height: 1.65; max-width: 420px; position: relative; z-index: 1; }
.mg-register-visual ul { display: grid; gap: 10px; list-style: none; margin: 32px 0 0; padding: 0; position: relative; z-index: 1; }
.mg-register-visual li { color: #d9dce5; font-size: 11px; }.mg-register-visual li::first-letter { color: var(--mg-lime); }
.mg-register-card { border: 1px solid var(--mg-line); border-left: 0; border-radius: 0 24px 24px 0; padding: 48px 54px; }
.mg-register-card h2 { font-size: 30px; letter-spacing: -1.4px; margin: 7px 0; }.mg-register-card > p { color: #787c84; font-size: 12px; margin-bottom: 22px; }
.mg-register-card form { display: grid; gap: 14px; }
.mg-register-card form > label,.mg-register-row label { display: grid; font-size: 10px; font-weight: 700; gap: 6px; }
.mg-register-card input[type="text"],.mg-register-card input[type="email"],.mg-register-card input[type="password"] { background: #fbfbfb; border: 1px solid #dfe0e4; border-radius: 9px; outline: 0; padding: 12px; width: 100%; }
.mg-register-card input:focus { border-color: var(--mg-blue); box-shadow: 0 0 0 3px #5b70f517; }
.mg-register-row { display: grid; gap: 10px; grid-template-columns: 1fr 1fr; }
.mg-register-card fieldset { border: 0; display: grid; gap: 8px; grid-template-columns: 1fr 1fr; margin: 3px 0; padding: 0; }
.mg-register-card legend { font-size: 10px; font-weight: 700; margin-bottom: 7px; }
.mg-role-option { align-items: center; border: 1px solid var(--mg-line); border-radius: 9px; cursor: pointer; display: flex; gap: 9px; padding: 11px; }
.mg-role-option:has(input:checked) { background: #f2f4ff; border-color: var(--mg-blue); }.mg-role-option input { accent-color: var(--mg-blue); }
.mg-role-option span { display: flex; flex-direction: column; }.mg-role-option b { font-size: 10px; }.mg-role-option small { color: #858990; font-size: 8px; font-weight: 400; }
.mg-terms { align-items: flex-start!important; display: flex!important; font-weight: 400!important; gap: 8px!important; line-height: 1.45; }.mg-terms input { accent-color: var(--mg-blue); margin-top: 2px; }
.mg-form-error { background: #fff1f2; border: 1px solid #f1c8cc; border-radius: 8px; color: #a53e48; font-size: 10px; margin-bottom: 15px; padding: 10px 12px; }
.mg-have-account { color: #858890!important; font-size: 10px!important; margin: 16px 0 0!important; text-align: center; }.mg-have-account a { color: var(--mg-blue); font-weight: 750; }
.mg-login-page { display: grid; grid-template-columns: 1fr 1fr; min-height: 700px; padding-block: 65px 85px; }
.mg-login-visual { background: radial-gradient(circle at 75% 25%,#5b70f555,transparent 35%),linear-gradient(145deg,#151a29,#080b12 72%); border-radius: 24px 0 0 24px; color: #fff; padding: 58px 52px; }
.mg-login-visual .mg-label { color: var(--mg-lime); }
.mg-login-visual h1 { font-size: 42px; letter-spacing: -2.5px; line-height: 1.07; margin: 12px 0 20px; }
.mg-login-visual > p { color: #adb2c0; font-size: 13px; line-height: 1.65; }
.mg-login-card { border: 1px solid var(--mg-line); border-left: 0; border-radius: 0 24px 24px 0; padding: 58px 54px; }
.mg-login-card h2 { font-size: 30px; letter-spacing: -1.4px; margin: 7px 0; }
.mg-login-card > p { color: #787c84; font-size: 12px; margin-bottom: 24px; }
.mg-login-card form { display: grid; gap: 15px; }
.mg-login-card form > label:not(.mg-remember) { display: grid; font-size: 10px; font-weight: 700; gap: 6px; }
.mg-login-card input[type="text"],.mg-login-card input[type="password"] { background: #fbfbfb; border: 1px solid #dfe0e4; border-radius: 9px; outline: 0; padding: 13px; width: 100%; }
.mg-login-card input:focus { border-color: var(--mg-blue); box-shadow: 0 0 0 3px #5b70f517; }
.mg-remember { align-items: center; color: #727680; display: flex; font-size: 9px; gap: 8px; }
.mg-remember input { accent-color: var(--mg-blue); }
@media (max-width: 900px) { .mg-register { grid-template-columns: 1fr; }.mg-register-visual { border-radius: 20px 20px 0 0; min-height: 390px; }.mg-register-brand { margin-bottom: 45px; }.mg-register-card { border-left: 1px solid var(--mg-line); border-radius: 0 0 20px 20px; } }
@media (max-width: 620px) { .mg-signup { display: none; }.mg-hero-cover { height: 315px; }.mg-hero-cover img { object-position: center; }.mg-register { padding-block: 25px 55px; }.mg-register-visual { min-height: 350px; padding: 35px 25px; }.mg-register-visual h1 { font-size: 34px; }.mg-register-brand { margin-bottom: 38px; }.mg-register-card { padding: 30px 20px; }.mg-register-row,.mg-register-card fieldset { grid-template-columns: 1fr; } }
@media (max-width: 900px) { .mg-login-page { grid-template-columns: 1fr; }.mg-login-visual { border-radius: 20px 20px 0 0; }.mg-login-card { border-left: 1px solid var(--mg-line); border-radius: 0 0 20px 20px; } }
@media (max-width: 620px) { .mg-login-page { padding-block: 25px 55px; }.mg-login-visual { padding: 35px 25px; }.mg-login-visual h1 { font-size: 34px; }.mg-login-card { padding: 32px 20px; } }