.stg-app{min-block-size: 70vh;background: var(--stg-surface-2);padding-block: var(--stg-12);padding-inline: var(--stg-gutter)}.stg-shell{max-inline-size: var(--stg-container);margin-inline: auto}.stg-narrow{max-inline-size: 460px;margin-inline: auto}.stg-card{background: var(--stg-surface);border: 1px solid var(--stg-line);border-radius: var(--stg-r-lg);padding: var(--stg-8);box-shadow: var(--stg-shadow-sm)}.stg-app h1{font-size: var(--stg-t-h1);line-height: var(--stg-lh-heading);font-weight: var(--stg-fw-extrabold);letter-spacing: -0.02em;margin-block: 0 var(--stg-2);color: var(--stg-ink)}.stg-app h2{font-size: var(--stg-t-h3);font-weight: var(--stg-fw-bold);margin-block: 0 var(--stg-3);color: var(--stg-ink)}.stg-lede{color: var(--stg-muted);margin-block: 0 var(--stg-6);line-height: var(--stg-lh-body)}.stg-muted{color: var(--stg-muted);font-size: var(--stg-t-sm)}.stg-field{display: block;margin-block-end: var(--stg-4)}.stg-field > label{display: block;font-size: var(--stg-t-sm);font-weight: var(--stg-fw-semibold);margin-block-end: var(--stg-1);color: var(--stg-ink)}.stg-field .stg-hint{display: block;font-size: var(--stg-t-xs);color: var(--stg-muted);margin-block-start: var(--stg-1)}.stg-field input:not([type="hidden"], [type="checkbox"], [type="radio"], [type="file"], [type="range"], [type="color"], [type="submit"], [type="button"], [type="reset"]),.stg-field select,.stg-field textarea{inline-size: 100%;padding: var(--stg-3) var(--stg-4);font: inherit;font-size: var(--stg-t-body);color: var(--stg-ink);background: var(--stg-surface);border: 1px solid var(--stg-field-line);border-radius: var(--stg-r-md);transition: border-color var(--stg-fast) var(--stg-ease), box-shadow var(--stg-fast) var(--stg-ease)}.stg-field input[type="file"]{max-inline-size: 100%}.stg-field input:focus-visible,.stg-field select:focus-visible,.stg-field textarea:focus-visible{outline: none;border-color: var(--stg-primary);box-shadow: 0 0 0 3px var(--stg-primary-soft)}.stg-field[data-invalid="true"] input,.stg-field[data-invalid="true"] select,.stg-field[data-invalid="true"] textarea{border-color: var(--stg-danger)}.stg-error{display: block;font-size: var(--stg-t-xs);color: var(--stg-danger);margin-block-start: var(--stg-1)}.stg-optional{font-weight: var(--stg-fw-regular);color: var(--stg-faint)}.stg-notice{padding: var(--stg-3) var(--stg-4);border-radius: var(--stg-r-md);font-size: var(--stg-t-sm);margin-block-end: var(--stg-4);border: 1px solid transparent}.stg-notice--error{background: var(--stg-danger-bg);color: var(--stg-danger);border-color: color-mix(in srgb, var(--stg-danger) 25%, transparent)}.stg-notice--success{background: var(--stg-success-bg);color: var(--stg-success);border-color: color-mix(in srgb, var(--stg-success) 25%, transparent)}.stg-notice--info{background: var(--stg-info-bg);color: var(--stg-info);border-color: color-mix(in srgb, var(--stg-info) 25%, transparent)}.stg-notice[hidden]{display: none}.stg-notice__link{color: inherit;font-weight: 600;text-decoration: underline;white-space: nowrap}.stg-profile-head{display: flex;gap: var(--stg-5);align-items: flex-start;flex-wrap: wrap}.stg-avatar{inline-size: 88px;block-size: 88px;border-radius: 50%;object-fit: cover;background: var(--stg-primary-soft);color: var(--stg-primary-ink);display: grid;place-items: center;font-weight: var(--stg-fw-bold);font-size: 1.75rem;flex: 0 0 auto}.stg-empty{text-align: center;padding: var(--stg-12) var(--stg-4);color: var(--stg-muted)}.stg-empty h2{color: var(--stg-ink)}.stg-page-head{margin-block-end: var(--stg-8)}.stg-fieldset{border: 0;padding: 0;margin: 0 0 var(--stg-5)}.stg-fieldset > legend{font-size: 1rem;font-weight: var(--stg-fw-bold);color: var(--stg-ink);padding: 0;margin-block-end: var(--stg-3)}.stg-checkbox{display: flex;gap: var(--stg-2);align-items: center;font-weight: var(--stg-fw-regular)}.stg-checkbox--top{align-items: flex-start}.stg-checkbox input{inline-size: auto;flex: 0 0 auto;margin-block-start: 0}.stg-checkbox--top input{margin-block-start: 3px}.stg-links{margin-block-start: var(--stg-5);display: flex;gap: var(--stg-2);flex-wrap: wrap;align-items: center}.stg-field select[multiple]{min-block-size: 9rem;padding: var(--stg-2)}.stg-bio{color: var(--stg-ink);line-height: var(--stg-lh-body)}.stg-pagination{margin-block-start: var(--stg-8);display: flex;gap: var(--stg-2);justify-content: center;flex-wrap: wrap}.stg-pagination .page-numbers{display: inline-flex;align-items: center;justify-content: center;min-inline-size: 44px;min-block-size: 44px;padding-inline: var(--stg-3);border: 1px solid var(--stg-line-strong);border-radius: var(--stg-r-md);text-decoration: none;color: var(--stg-ink);background: var(--stg-surface)}.stg-pagination .page-numbers.current{background: var(--stg-primary);border-color: var(--stg-primary);color: #fff}.stg-field-row{display: grid;grid-template-columns: 1fr 1fr;gap: var(--stg-2)}.stg-breadcrumb{font-size: var(--stg-t-sm);color: var(--stg-muted);margin-block-end: var(--stg-5);display: flex;gap: var(--stg-2);flex-wrap: wrap}.stg-detail{display: grid;gap: var(--stg-6);grid-template-columns: minmax(0, 1fr) 340px;align-items: start}.stg-detail > *{min-inline-size: 0}@media (max-width: 1000px){.stg-detail{grid-template-columns: 1fr}}.stg-detail__main > * + *{margin-block-start: var(--stg-5)}.stg-detail__side > * + *{margin-block-start: var(--stg-5)}.stg-ref{font-family: ui-monospace, monospace;letter-spacing: 0.02em}.stg-files,.stg-list{list-style: none;padding: 0;margin: 0}.stg-files li,.stg-list li{padding-block: var(--stg-2);border-block-end: 1px solid var(--stg-line);display: flex;gap: var(--stg-3);justify-content: space-between}.stg-list li{display: list-item;list-style: disc;margin-inline-start: var(--stg-5);border: 0;color: var(--stg-muted);font-size: var(--stg-t-sm)}.stg-stack-below{margin-block-end: var(--stg-6)}.stg-section-head{display: flex;gap: var(--stg-4);align-items: center;justify-content: space-between;flex-wrap: wrap;margin-block-end: var(--stg-4)}.stg-section-head h2{margin: 0}.stg-actions{margin-block-start: var(--stg-4)}.stg-project-list{list-style: none;padding: 0;margin: 0}.stg-project-list li{display: flex;gap: var(--stg-4);justify-content: space-between;align-items: center;flex-wrap: wrap;padding-block: var(--stg-4);border-block-end: 1px solid var(--stg-line)}.stg-project-list li:last-child{border-block-end: 0}.stg-project-list a{color: var(--stg-ink);text-decoration: none}.stg-project-list a:hover{color: var(--stg-primary);text-decoration: underline}.stg-project-list p{margin: var(--stg-1) 0 0;font-size: var(--stg-t-sm)}.stg-project-list__actions{display: flex;gap: var(--stg-2);align-items: center;flex-wrap: wrap}.stg-project-list__actions form{margin: 0}.stg-project-list__actions .stg-hint{flex: 1 1 100%;font-size: var(--stg-t-sm);color: var(--stg-muted)}.stg-project-list__actions .stg-notice{display: none}.stg-tabs{display: flex;gap: var(--stg-2);flex-wrap: wrap;margin-block-end: var(--stg-6);border-block-end: 1px solid var(--stg-line);padding-block-end: var(--stg-2)}.stg-tab{display: inline-flex;align-items: center;gap: var(--stg-2);padding: var(--stg-2) var(--stg-4);border-radius: var(--stg-r-md);text-decoration: none;color: var(--stg-muted);font-size: var(--stg-t-sm);font-weight: var(--stg-fw-medium);min-block-size: 40px}.stg-tab:hover{background: var(--stg-neutral-bg);color: var(--stg-ink)}.stg-tab.is-current{background: var(--stg-navy);color: #fff}.stg-tab:focus-visible{outline: var(--stg-focus-ring);outline-offset: var(--stg-focus-offset)}.stg-tab__count{font-size: var(--stg-t-xs);background: rgb(255 255 255 / 20%);border-radius: var(--stg-r-pill);padding-inline: var(--stg-2);min-inline-size: 20px;text-align: center}.stg-tab:not(.is-current) .stg-tab__count{background: var(--stg-surface-2);color: var(--stg-muted)}.stg-files{list-style: none;margin: 0;padding: 0;display: grid;gap: var(--stg-3);grid-template-columns: repeat(auto-fill, minmax(min(10rem, 100%), 1fr))}.stg-report{margin-block: var(--stg-4);border: 1px solid var(--stg-line);border-radius: var(--stg-r-md);padding: var(--stg-3) var(--stg-4);background: var(--stg-surface);font-size: var(--stg-t-sm)}.stg-report summary{cursor: pointer;color: var(--stg-muted)}.stg-report form{display: flex;flex-direction: column;gap: var(--stg-2);margin-block-start: var(--stg-3)}.stg-report select,.stg-report textarea{inline-size: 100%}.stg-narrow{max-inline-size: 40rem}.stg-review-list{list-style: none;margin: 0;padding: 0;display: flex;flex-direction: column;gap: var(--stg-4)}.stg-review{padding: var(--stg-4)}.stg-review h3{margin: 0 0 var(--stg-2);font-size: var(--stg-t-h4)}.stg-review p{margin: 0 0 var(--stg-2)}.stg-app a:where(:not(.stg-btn)){color: var(--stg-primary-ink)}.stg-app a:where(:not(.stg-btn)):hover{color: var(--stg-primary)}.stg-app a.stg-tab.is-current:hover,.stg-app a.stg-pill.is-current:hover{color: #fff}.stg-app p a,.stg-app li a,.stg-app .stg-notice a{text-decoration: underline;text-underline-offset: 0.18em}.stg-app .stg-btn,.stg-app .stg-btn:hover,.stg-app .stg-opp__title a,.stg-app .stg-breadcrumb a,.stg-app .stg-langswitch a{text-decoration: none}.stg-notice a{color: inherit;font-weight: var(--stg-fw-semibold)}.stg-field input[type="text"],.stg-field textarea,.stg-opp__title,.stg-bio,.stg-message__bubble,.stg-proposal__message,.stg-review__body,.stg-review__headline,.stg-task__title,.stg-detail__main h1,.stg-qa__body,.stg-invite__option,.stg-opp-head h1,.stg-pro-hero__headline{unicode-bidi: plaintext}.stg-opp__title,.stg-opp-head h1,.stg-pro-hero__headline{text-align: start}.stg-stepper{display: flex;gap: var(--stg-2);margin: 0 0 var(--stg-3);padding: 0;list-style: none;counter-reset: stg-step}.stg-stepper li{counter-increment: stg-step;display: flex;align-items: center;gap: var(--stg-2);flex: 1 1 0;min-inline-size: 0;padding-block-start: var(--stg-2);border-block-start: 3px solid var(--stg-line);font-size: var(--stg-t-xs);font-weight: var(--stg-fw-semibold);color: var(--stg-muted)}.stg-stepper li::before{content: counter(stg-step);display: inline-grid;place-items: center;inline-size: 20px;block-size: 20px;border-radius: var(--stg-r-pill);background: var(--stg-surface-2);color: var(--stg-muted);font-size: 11px}.stg-stepper li.is-done{border-block-start-color: var(--stg-primary);color: var(--stg-text)}.stg-stepper li.is-done::before{content: "✓";background: var(--stg-primary);color: #fff}.stg-stepper li.is-current{border-block-start-color: var(--stg-primary);color: var(--stg-primary-ink)}.stg-stepper li.is-current::before{background: var(--stg-primary-soft);color: var(--stg-primary-ink)}.stg-questions:focus{outline: none}.stg-qa{display: flex;flex-direction: column;gap: var(--stg-5);margin: 0 0 var(--stg-5);padding: 0;list-style: none}.stg-qa__item{padding-block-end: var(--stg-5);border-block-end: 1px solid var(--stg-line)}.stg-qa__who{display: flex;flex-wrap: wrap;gap: var(--stg-2);margin: 0 0 var(--stg-1);font-size: var(--stg-t-sm);font-weight: var(--stg-fw-semibold);color: var(--stg-ink)}.stg-qa__who .stg-muted{font-weight: var(--stg-fw-regular)}.stg-qa__body{margin: 0;white-space: pre-line}.stg-qa__answer{margin-block-start: var(--stg-3);padding: var(--stg-3) var(--stg-4);border-inline-start: 3px solid var(--stg-primary);border-radius: var(--stg-r-sm);background: var(--stg-surface-2)}.stg-qa__reply,.stg-qa__ask{display: flex;flex-direction: column;align-items: flex-start;gap: var(--stg-2);margin-block-start: var(--stg-3)}.stg-qa__reply textarea,.stg-qa__ask textarea{inline-size: 100%}.stg-qa__item .stg-report{margin-block: var(--stg-2) 0;padding: 0;border: 0;background: none}.stg-qa__item .stg-report summary{font-size: var(--stg-t-xs)}.stg-save{display: inline-flex;align-items: center;gap: var(--stg-1);min-block-size: 36px;padding-inline: var(--stg-3);border: 1px solid var(--stg-line-strong);border-radius: var(--stg-r-pill);background: var(--stg-surface);color: var(--stg-text);font: inherit;font-size: var(--stg-t-xs);font-weight: var(--stg-fw-semibold);cursor: pointer}.stg-save:hover{border-color: var(--stg-primary);color: var(--stg-primary-ink)}.stg-save:focus-visible{outline: var(--stg-focus-ring);outline-offset: var(--stg-focus-offset)}.stg-save[aria-pressed="true"]{border-color: var(--stg-primary);background: var(--stg-primary-soft);color: var(--stg-primary-ink)}.stg-save[aria-pressed="true"] svg{fill: currentColor}.stg-save[aria-busy="true"]{opacity: 0.6}.stg-tabs--browse{margin-block-end: var(--stg-4)}.stg-invite{position: relative}.stg-invite > summary{list-style: none}.stg-invite > summary::-webkit-details-marker{display: none}.stg-invite__panel{position: absolute;inset-block-start: calc(100% + 6px);inset-inline-start: 0;z-index: 20;display: flex;flex-direction: column;gap: var(--stg-1);min-inline-size: min(320px, 90vw);padding: var(--stg-3);background: var(--stg-surface);border: 1px solid var(--stg-line);border-radius: var(--stg-r-md);box-shadow: var(--stg-shadow-lg)}.stg-invite__option{inline-size: 100%;min-block-size: 40px;padding-inline: var(--stg-3);border: 0;border-radius: var(--stg-r-sm);background: none;color: var(--stg-text);font: inherit;font-size: var(--stg-t-sm);text-align: start;cursor: pointer}.stg-invite__option:hover,.stg-invite__option:focus-visible{background: var(--stg-surface-2);color: var(--stg-primary-ink)}.stg-ref{direction: ltr;unicode-bidi: isolate}.stg-confirm > summary{list-style: none;cursor: pointer}.stg-confirm > summary::-webkit-details-marker{display: none}.stg-confirm[open] > summary{display: none}.stg-confirm__panel{display: flex;flex-direction: column;gap: var(--stg-3);padding: var(--stg-4);background: var(--stg-danger-bg);border-radius: var(--stg-r-md);font-size: var(--stg-t-sm)}.stg-confirm__panel p{margin: 0;color: var(--stg-text)}.stg-btn--danger{background: var(--stg-danger);border-color: var(--stg-danger);color: #fff}.stg-btn--danger:hover{filter: brightness(0.92);color: #fff}.stg-btn--danger:active{filter: brightness(0.82)}.stg-project-list__actions:has(.stg-confirm[open]){flex-basis: 100%}.stg-confirm__panel .stg-btn{max-inline-size: 100%;white-space: normal}.stg-confirm:not([open]) > .stg-confirm__panel{display: none}.stg-file-chips{list-style: none;margin: 0;padding: 0;display: flex;gap: var(--stg-2);flex-wrap: wrap}.stg-file-chip{padding: var(--stg-1) var(--stg-3);background: var(--stg-surface-2);border-radius: var(--stg-r-pill);font-size: var(--stg-t-xs)}.stg-file-chip__remove{border: 0;background: none;padding: 0 var(--stg-1);color: inherit;font: inherit;line-height: 1;cursor: pointer}.stg-file-chips:not(:empty){margin-block-end: var(--stg-2)}@media (max-width: 767px){.stg-save,.stg-btn--ghost,.stg-report select,.stg-report .stg-btn{min-block-size: 44px;box-sizing: border-box}}


.stg-app:has(.stg-auth) {
padding: 0;
}

.stg-app:has(.stg-auth) .stg-shell {
max-inline-size: none;
}

.stg-app .stg-auth {
display: flex;
flex-direction: row;
align-items: stretch;
gap: 0;

min-block-size: max(640px, calc(100svh - 75px));
padding: 0;
}



.stg-auth .stg-auth__visual {
position: relative;
display: flex;
flex: 1 1 55%;
min-inline-size: 0;
padding: 0;
color: #fff;

background-color: var(--stg-navy);
background-position: center;
background-size: cover;
isolation: isolate;
}


.stg-auth .stg-auth__visual::after {
content: "";
position: absolute;
inset: 0;
z-index: -1;
background:
linear-gradient(180deg, rgb(11 16 48 / 55%) 0%, rgb(11 16 48 / 20%) 45%, rgb(14 43 45 / 80%) 100%);
}


.stg-auth .stg-auth__visual {
flex-direction: column;
}

.stg-auth .stg-auth__visual > *,
.stg-auth .stg-auth__visual .elementor-widget-container {
display: flex;
flex: 1 1 auto;
flex-direction: column;
inline-size: 100%;
}

.stg-auth-brand {
display: flex;
flex: 1 1 auto;
flex-direction: column;
gap: var(--stg-6);
padding: var(--stg-16) var(--stg-12);
}

.stg-auth-brand .stg-auth-brand__title {
margin: 0;
max-inline-size: 12ch;
font-size: clamp(2.5rem, 1.6rem + 2.2vw, 3.5rem);
font-weight: var(--stg-fw-bold);
line-height: 1.08;
letter-spacing: -0.02em;
color: #fff;
text-wrap: balance;
}

.stg-auth-brand .stg-auth-brand__lede {
margin: 0;
max-inline-size: 24ch;
font-size: 1.1875rem;
line-height: 1.45;
color: rgb(255 255 255 / 88%);
}

.stg-auth-brand__points {
display: flex;
flex-direction: column;
gap: var(--stg-5);
margin: auto 0 0;
padding: 0;
list-style: none;
}

.stg-auth-brand__points li {
display: flex;
align-items: center;
gap: var(--stg-4);
font-size: var(--stg-t-body);
font-weight: var(--stg-fw-semibold);
color: #fff;
}

.stg-auth-brand__points svg {
flex: 0 0 auto;
color: var(--stg-accent);
}

.stg-auth-brand .stg-auth-brand__quote {
margin: var(--stg-4) 0 0;
font-family: var(--stg-font-script);
font-size: 1.625rem;
line-height: 1.25;
color: rgb(255 255 255 / 92%);
}


.stg-auth-brand .stg-auth-brand__quote:lang(ar) {
font-family: var(--stg-font);
font-size: 1.125rem;
font-weight: var(--stg-fw-semibold);
}


.stg-auth-brand .stg-auth-brand__title:lang(ar) {
line-height: 1.3;
letter-spacing: normal;
}



.stg-auth .stg-auth__pane {
display: flex;
flex: 1 1 45%;
align-items: center;
justify-content: center;
min-inline-size: 0;
padding: var(--stg-12) var(--stg-6);
background: var(--stg-surface-2);
}

.stg-auth .stg-auth__pane > * {
inline-size: min(100%, 480px);
}

.stg-auth-card {
padding: var(--stg-10);
background: var(--stg-surface);
border: 1px solid var(--stg-line);
border-radius: var(--stg-r-xl);
box-shadow: var(--stg-shadow-md);
}


.stg-auth-card__badge {
display: inline-grid;
place-items: center;
inline-size: 56px;
block-size: 56px;
margin-block-end: var(--stg-4);
border-radius: var(--stg-r-pill);
background: var(--stg-primary-soft);
color: var(--stg-primary);
}

.stg-auth-card .stg-auth-card__title {
margin: 0 0 var(--stg-1);
font-size: 1.875rem;
font-weight: var(--stg-fw-bold);
line-height: 1.2;
letter-spacing: -0.01em;
color: var(--stg-ink);
}

.stg-auth-card .stg-auth-card__lede {
margin: 0 0 var(--stg-8);
font-size: 0.9375rem;
color: var(--stg-muted);
}

.stg-auth-form .stg-field {
margin-block-end: var(--stg-5);
}

.stg-auth-form .stg-field input[type="email"],
.stg-auth-form .stg-field input[type="password"],
.stg-auth-form .stg-field input[type="text"] {
min-block-size: 48px;

font-size: max(16px, var(--stg-t-body));
}

.stg-auth-form .stg-field input::placeholder {
color: var(--stg-muted);
opacity: 1;
}



.stg-auth-form .stg-password input {
padding-inline-end: 52px;
}

.stg-auth-form .stg-password > .stg-password__toggle {
inset-block: 3px;
inset-inline-end: 4px;
}

.stg-auth-form .stg-auth-form__forgot {
display: block;
inline-size: fit-content;

margin-block: calc(-1 * var(--stg-3)) var(--stg-4);
margin-inline-start: auto;
font-size: var(--stg-t-sm);
font-weight: var(--stg-fw-semibold);
text-decoration: none;
}

.stg-auth-form .stg-auth-form__forgot:hover,
.stg-auth-form .stg-auth-form__forgot:focus-visible {
text-decoration: underline;
}

.stg-auth-form .stg-checkbox {
font-size: var(--stg-t-sm);
color: var(--stg-text);
}

.stg-auth-form .stg-checkbox input {
inline-size: 18px;
block-size: 18px;
accent-color: var(--stg-primary);
}

.stg-auth-form .stg-btn {
min-block-size: 48px;
margin-block-start: var(--stg-2);
font-size: var(--stg-t-body);
}

.stg-auth-card .stg-auth-card__switch {
margin: var(--stg-6) 0 0;
font-size: var(--stg-t-sm);
color: var(--stg-muted);
text-align: center;
}

.stg-auth-card__switch a {
font-weight: var(--stg-fw-semibold);
}


.stg-auth-card .stg-auth-card__sentto {
margin: 0 0 var(--stg-3);
font-size: var(--stg-t-sm);
color: var(--stg-muted);
text-align: center;
overflow-wrap: anywhere;
}

.stg-auth-card__sentto button {
min-block-size: 44px;
padding: 0 var(--stg-2);
border: 0;
background: none;
color: var(--stg-primary);
font: inherit;
font-weight: var(--stg-fw-semibold);
text-decoration: underline;
cursor: pointer;
}

.stg-auth-resend {
margin-block-start: var(--stg-4);
}

.stg-auth-resend .stg-btn {
min-block-size: 48px;
font-variant-numeric: tabular-nums;
}

.stg-auth-resend .stg-btn:disabled {
opacity: 0.6;
cursor: not-allowed;
}

.stg-auth-card__secure {
display: flex;
align-items: flex-start;
gap: var(--stg-3);
margin-block-start: var(--stg-6);
padding: var(--stg-3) var(--stg-4);
border-radius: var(--stg-r-md);
background: var(--stg-primary-soft);
}

.stg-auth-card__secure svg {
flex: 0 0 auto;
color: var(--stg-primary);
}

.stg-auth-card .stg-auth-card__secure p {
display: flex;
flex-direction: column;
gap: 2px;
margin: 0;
font-size: 0.8125rem;
line-height: 1.45;
color: var(--stg-muted);
}

.stg-auth-card__secure strong {
font-size: var(--stg-t-sm);
color: var(--stg-primary-ink);
}




.stg-auth-brand--join .stg-auth-brand__title {
max-inline-size: 11ch;
font-family: var(--stg-font-script);
font-size: clamp(3rem, 2rem + 2.6vw, 4.5rem);
font-weight: 600;
line-height: 1.02;
letter-spacing: 0;
}

.stg-auth-brand--join .stg-auth-brand__title:lang(ar) {
font-family: var(--stg-font);
font-size: clamp(2.25rem, 1.6rem + 2vw, 3.25rem);
font-weight: var(--stg-fw-bold);
line-height: 1.3;
}


.stg-roles {
margin: 0 0 var(--stg-5);
padding: 0;
border: 0;
min-inline-size: 0;
}

.stg-roles legend {
margin-block-end: var(--stg-2);
padding: 0;
font-size: var(--stg-t-sm);
font-weight: var(--stg-fw-semibold);
color: var(--stg-ink);
}

.stg-roles__list {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: var(--stg-3);
}

.stg-role {
position: relative;
display: flex;
flex-direction: column;
gap: var(--stg-1);
padding: var(--stg-4);
border: 1px solid var(--stg-field-line);
border-radius: var(--stg-r-lg);
background: var(--stg-surface);
cursor: pointer;
transition: border-color var(--stg-fast) var(--stg-ease), background var(--stg-fast) var(--stg-ease);
}

.stg-role:hover {
border-color: var(--stg-primary);
}

.stg-role input {
position: absolute;
inset-block-start: var(--stg-3);
inset-inline-end: var(--stg-3);
inline-size: 20px;
block-size: 20px;
margin: 0;
opacity: 0;
}

.stg-role:has(input:checked) {
border-color: var(--stg-primary);
background: var(--stg-primary-soft);
box-shadow: inset 0 0 0 1px var(--stg-primary);
}

.stg-role:has(input:focus-visible) {
outline: var(--stg-focus-ring);
outline-offset: var(--stg-focus-offset);
}

.stg-role__icon {
margin-block-end: var(--stg-2);
color: var(--stg-primary);
}

.stg-role__title {
font-size: var(--stg-t-body);
font-weight: var(--stg-fw-bold);
color: var(--stg-ink);
}

.stg-role__text {
font-size: 0.8125rem;
line-height: 1.4;
color: var(--stg-muted);
}


.stg-role__tick {
position: absolute;
inset-block-start: var(--stg-3);
inset-inline-end: var(--stg-3);
color: var(--stg-primary);
visibility: hidden;
pointer-events: none;
}

.stg-role:has(input:checked) .stg-role__tick {
visibility: visible;
}

.stg-roles .stg-hint {
margin-block-start: var(--stg-2);
}

.stg-auth-form__row {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: var(--stg-3);
}

.stg-auth-form .stg-auth-form__row .stg-field {
margin-block-end: 0;
}

.stg-auth-form .stg-auth-form__note {
margin: var(--stg-2) 0 var(--stg-5);
font-size: var(--stg-t-xs);
color: var(--stg-muted);
}

.stg-optional {
font-weight: var(--stg-fw-regular);
color: var(--stg-muted);
}

.stg-auth-form .stg-checkbox--top {
align-items: flex-start;
line-height: 1.5;
}



.stg-auth-done {
display: flex;
flex-direction: column;
align-items: center;
gap: var(--stg-3);
padding-block: var(--stg-4) 0;
text-align: center;
}

.stg-auth-done[hidden] {
display: none;
}

.stg-auth-done__icon {
padding: var(--stg-3);
border-radius: var(--stg-r-pill);
background: var(--stg-primary-soft);
color: var(--stg-primary);
box-sizing: content-box;
}

.stg-auth-card .stg-auth-done__title {
margin: var(--stg-2) 0 0;
font-size: 1.375rem;
font-weight: var(--stg-fw-bold);
color: var(--stg-ink);
}

.stg-auth-done__title:focus {
outline: none;
}

.stg-auth-card .stg-auth-done p {
margin: 0;
color: var(--stg-text);
line-height: 1.55;
}

.stg-auth-card .stg-auth-done .stg-auth-done__small {
font-size: var(--stg-t-sm);
color: var(--stg-muted);
}

.stg-auth-done .stg-btn {
margin-block-start: var(--stg-4);
}

.stg-auth-done__icon--ok {
background: var(--stg-success-bg);
color: var(--stg-success);
}


.stg-auth-card--center {
text-align: center;
}

.stg-auth-card--center .stg-auth-card__badge {
margin-inline: auto;
}

.stg-auth-card__badge--ok {
background: var(--stg-success-bg);
color: var(--stg-success);
}

.stg-auth-card__badge--warn {
background: var(--stg-warning-bg);
color: var(--stg-warning);
}


.stg-auth-card .stg-notice--warning {
display: block;
margin-block: var(--stg-4) var(--stg-5);
background: var(--stg-warning-bg);
color: var(--stg-warning);
border-color: color-mix(in srgb, var(--stg-warning) 25%, transparent);
text-align: start;
line-height: 1.5;
}

.stg-auth-card .stg-notice--warning strong {
display: block;
margin-block-end: var(--stg-1);
}



.stg-auth-card > .stg-notice {
margin-block: var(--stg-4);
}



@media (max-width: 1023px) {
.stg-app .stg-auth {
flex-direction: column;
min-block-size: 0;
}

.stg-auth .stg-auth__visual {
flex: 0 0 auto;
min-block-size: 240px;
}

.stg-auth-brand {
justify-content: flex-end;
padding: var(--stg-10) var(--stg-8);
}

.stg-auth-brand .stg-auth-brand__title {
max-inline-size: none;
font-size: 2.25rem;
}


.stg-auth-brand__points,
.stg-auth-brand .stg-auth-brand__quote {
display: none;
}

.stg-auth .stg-auth__pane {
flex: 1 1 auto;
padding: var(--stg-10) var(--stg-6) var(--stg-12);
}
}



@media (max-width: 767px) {
.stg-auth .stg-auth__visual {
display: none;
}

.stg-auth .stg-auth__pane {
padding: var(--stg-6) var(--stg-gutter) var(--stg-10);
}

.stg-auth-card {
padding: var(--stg-6) var(--stg-5);
box-shadow: var(--stg-shadow-sm);
}

.stg-auth-card .stg-auth-card__title {
font-size: 1.625rem;
}

.stg-auth-card .stg-auth-card__lede {
margin-block-end: var(--stg-6);
}
}


@media (max-width: 400px) {
.stg-roles__list,
.stg-auth-form__row {
grid-template-columns: minmax(0, 1fr);
}

.stg-auth-form .stg-auth-form__row .stg-field + .stg-field {
margin-block-start: var(--stg-5);
}
}
