.web-referral{width:min(100%,540px);margin-top:24px;padding:15px 18px;border:1px solid rgba(255,255,255,.15);border-radius:14px;background:#1216148c;color:#eee;text-align:left;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-size:13px;line-height:1.6}.web-referral p{margin:6px 0 0;color:#c5cdc7;font-size:13px}.web-referral summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:550;list-style:none}.web-referral summary::-webkit-details-marker{display:none}.web-referral summary:after{content:"+";margin-left:auto;color:#b9c0ba}.web-referral details[open] summary:after{content:"−"}.web-referral form{display:flex;gap:8px;margin-top:12px}.web-referral input{width:100%;min-width:0;min-height:40px;border:1px solid #69736b;border-radius:8px;padding:8px 12px;background:#00000040;color:#fff;font:inherit}.web-referral input::-moz-placeholder{color:#adb7af}.web-referral input::placeholder{color:#adb7af}.web-referral button{flex-shrink:0;border:0;border-radius:8px;padding:8px 16px;background:#eef3ec;color:#1d2c21;font:inherit;font-weight:650;cursor:pointer}.web-referral button:disabled{opacity:.5;cursor:default}.web-referral :is(input,button,summary):focus-visible{outline:2px solid #c5e6bd;outline-offset:3px}.web-referral--applied{background:#223726b8;border-color:#b5daa959}.web-referral-confirmation{display:flex;align-items:center;gap:9px;color:#e1f0da}.web-referral [role=alert]{color:#f2d3b6}.web-referral .web-referral-retry{margin-top:10px;padding:5px 0;background:transparent;color:#e1f0da;text-decoration:underline}.web-login-referral{max-width:330px;margin:0;color:#c9dfc0;font-size:14px;line-height:1.6}.web-referral--invalid{border-color:#d77a70}.web-referral input[aria-invalid=true]{border-color:#ef9184}.web-referral--invalid [role=alert]{color:#ffb0a5}.web-referral-step{width:100%;display:flex;justify-content:center}.web-referral-step[hidden]{display:none!important}