.auth-shell{max-width: 640px;padding-top: calc(var(--chrome-header-h,64px) + var(--band-clear,24px));} .auth-title{margin: 0 0 16px;} .auth-h2{margin: 0 0 12px;font-size: var(--fs-step-2);} .auth-card{margin: 0 0 20px;padding: 20px 22px;border: 1px solid var(--line,rgba(255,255,255,.12));border-radius: var(--radius-2);background: var(--panel,rgba(0,0,0,.25));} .auth-lede{margin: 0 0 14px;} .auth-fine{margin: 12px 0 0;font-size: var(--fs-step-n1);opacity: .8;} .auth-cta{margin: 18px 0 4px;} .auth-steam-button{display: inline-block;line-height: 0;padding: 10px 14px;border: 1px solid var(--gold,#d4a53a);border-radius: 6px;background: rgba(212,165,58,.12);} .auth-steam-button:hover{background: rgba(212,165,58,.2);} .auth-steam-button img{display: block;} .auth-steam-button:focus-visible{outline: 2px solid var(--gold,#d4a53a);outline-offset: 3px;} .auth-alt{margin: 4px 0 0;} .auth-alt-button{display: inline-block;padding: 4px 0;font-size: var(--fs-step-n1);font-weight: 600;color: var(--gold,#d4a53a);text-decoration: underline;text-underline-offset: 3px;} .auth-alt-button:hover{text-decoration-thickness: 2px;} .auth-alt-button:focus-visible{outline: 2px solid var(--gold,#d4a53a);outline-offset: 3px;border-radius: 2px;} .auth-alt-fine{margin-top: 8px;} .auth-notice{margin: 0 0 14px;padding: 10px 12px;border-left: 3px solid var(--gold,#d4a53a);background: rgba(212,165,58,.08);} .auth-notice-error{border-left-color: #c9524a;background: rgba(201,82,74,.1);} .auth-identity{display: flex;align-items: center;gap: 14px;margin: 0 0 20px;} .auth-avatar{width: 64px;height: 64px;border-radius: 8px;} .auth-persona{margin: 0 0 4px;font-weight: 700;} .auth-steamid{margin: 0;} .auth-steamid code{font-size: .95em;} .auth-form{margin: 0;} .auth-field{margin: 0 0 14px;} .auth-field label{display: block;margin: 0 0 6px;font-weight: 700;} .auth-field-row{display: flex;align-items: center;gap: 10px;flex-wrap: wrap;} .auth-field input{flex: 1 1 240px;min-width: 44px;min-height: 44px;padding: 9px 11px;font: inherit;color: inherit;background: rgba(0,0,0,.3);border: 1px solid var(--line,rgba(255,255,255,.18));border-radius: 6px;} .auth-field input:focus-visible{outline: 2px solid var(--gold,#d4a53a);outline-offset: 1px;} .auth-help{margin: 6px 0 0;font-size: var(--fs-step-n1);opacity: .75;} .auth-badge{display: inline-block;padding: 2px 8px;font-size: var(--fs-step-n2);letter-spacing: .04em;text-transform: uppercase;border: 1px solid currentColor;border-radius: 999px;opacity: .8;} .auth-badge-ok{color: #7fc68a;opacity: 1;} .auth-actions{margin: 16px 0 0;} .auth-handoff{margin: 18px 0 4px;} .auth-handoff-lede{padding-left: 12px;border-left: 3px solid var(--gold,#d4a53a);} .auth-handoff-web{text-decoration: underline;text-underline-offset: 3px;} .auth-handoff-web:hover{text-decoration-thickness: 2px;} .auth-handoff-web:focus-visible{outline: 2px solid var(--gold,#d4a53a);outline-offset: 3px;border-radius: 2px;} @media (max-width: 720px){.auth-shell{padding-top: calc(var(--chrome-header-h,64px) + var(--sp-6,32px));} .auth-alt-button,.auth-handoff-web{display: inline-block;padding-top: 11px;padding-bottom: 11px;}} .auth-shell:has(.auth-depth){max-width: var(--frame-document);padding-top: calc(var(--chrome-header-h,64px) + var(--sp-6,32px));} .auth-shell:has(.auth-depth) .auth-card{padding: var(--sp-5,24px);} .auth-shell:has(.auth-depth) > .auth-card{margin: 0;} .auth-shell:has(.auth-depth) p{max-width: 36em;} .auth-shell:has(.auth-depth) .auth-identity{gap: var(--sp-4,16px);} .auth-shell:has(.auth-depth) .auth-field,.auth-shell:has(.auth-depth) .auth-lede{margin-bottom: var(--sp-4,16px);} .auth-shell:has(.auth-depth) .auth-field label{margin-bottom: var(--sp-2,8px);} .auth-shell:has(.auth-depth) .auth-field input{padding: var(--sp-2,8px) var(--sp-3,12px);} .auth-shell:has(.auth-depth) .auth-help{margin-top: var(--sp-2,8px);} .auth-shell:has(.auth-depth) .auth-notice{padding: var(--sp-3,12px) var(--sp-4,16px);} .auth-depth{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: var(--sp-4,16px);} .auth-depth .auth-card{margin-bottom: 0;} .auth-depth-wide{grid-column: 1 / -1;} .auth-depth-entry{padding-block: var(--sp-3,12px);border-top: 1px solid var(--line);overflow-wrap: anywhere;} .auth-depth-entry p{margin: 0 0 var(--sp-2,8px);} .auth-depth-action{display: inline-block;margin: 0 var(--sp-2,8px) var(--sp-2,8px) 0;} .auth-depth .auth-form{margin-top: var(--sp-3,12px);} .auth-depth .auth-input:not([type="hidden"]){width: 100%;box-sizing: border-box;} .auth-depth{margin-bottom: var(--sp-5,24px);} @media (max-width: 720px){.auth-depth{grid-template-columns: minmax(0,1fr);}}