/* Holes intro: Figma frames 123:2 (auth), 123:13 (form), 127:152 (sent). */
.application-site{min-height:100svh;margin:0;overflow-x:clip;overflow-y:auto;background:#0e0e0e;font-family:var(--font);color:#f5f5f5;font-size:17px;line-height:1.4}
.application-site-header{display:flex;align-items:center;justify-content:center;width:min(800px,calc(100% - 48px));min-height:0;margin:auto;padding:25px 0}
.application-brand{display:flex;align-items:center;justify-content:center}
.application-brand img{display:block;width:auto;height:120px;max-width:100%;object-fit:contain}
.application-page{width:min(800px,calc(100% - 48px));margin:0 auto 64px;padding:0;border:0;background:none;box-shadow:none}
.application-card{padding:52px;border:0;border-radius:20px;background:#ffffff08;outline:none}
.application-card:focus-visible{outline:1px solid #ffffff70;outline-offset:5px}
.application-site .application-heading{display:block;margin:0 0 40px;padding:0;border:0;background:none}
.application-heading h1,.application-site .application-success h2{margin:0 0 20px;font:500 28px/1.2 var(--font);letter-spacing:0;text-transform:none;color:#fff}
.application-site .application-intro,.application-site .application-success p,.application-socials p{max-width:none;margin:0;font:400 17px/1.5 var(--font);color:#dedede;overflow-wrap:anywhere}
.application-site .glass-button{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;min-height:68px;margin:0;padding:19px 28px;border:1px solid #ffffff0d;border-radius:24px;background:#ffffff0d;color:#f4f4f4;box-shadow:inset 0 1px 1px #ffffff24,inset 0 -1px 1px #ffffff18;font:400 18px/1.4 var(--font);text-align:center;text-decoration:none;transition:background .16s,border-color .16s,box-shadow .16s}
.application-site .glass-button:hover:enabled,.application-site a.glass-button:hover{background:#ffffff15;border-color:#ffffff25;box-shadow:inset 0 1px 1px #ffffff30,inset 0 -1px 1px #ffffff20}
.application-site .glass-button:disabled{color:#959595;opacity:.65;cursor:default}
.application-site :is(button,a,input,textarea):focus-visible{outline:2px solid #dedede;outline-offset:4px}
.application-site .discord-binding{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px;margin:0 0 40px;padding:28px 0;border:0;border-top:1px solid #ffffff0b;border-bottom:1px solid #ffffff0b;background:none}
.application-site .discord-binding[data-connected=false]{display:block;margin:0;padding:0;border:0}
.discord-binding[data-connected=false] .account-copy{display:none}
.account-copy{min-width:0;flex:1}
.application-site .form-kicker{display:block;margin-bottom:12px;font:500 14px/1.4 var(--font);letter-spacing:.02em;text-transform:uppercase;color:#c5c5c5}
.account-identity{display:flex;align-items:baseline;flex-wrap:wrap;column-gap:8px;row-gap:4px}
.application-site .discord-binding p,.application-site .discord-binding small{display:inline;margin:0;font:400 16px/1.5 var(--font);color:#ddd;overflow-wrap:anywhere}
.application-site .discord-binding small{color:#bdbdbd;font-size:15px}
.application-site .account-switch{flex-shrink:0;max-width:100%;padding:6px 0;border:0;background:none;color:#adbdf1;font:400 15px/1.5 var(--font);text-decoration:underline;text-underline-offset:3px}
.application-site .account-switch:hover{color:#d0d9fa}
.application-privacy{margin:40px 0 0;font-size:15px;line-height:1.55;color:#969696}
.application-site .application-field{margin:0 0 24px}
.application-site .application-field .input-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.application-site .application-field input:not([type=checkbox]),.application-site .application-field textarea{display:block;width:100%;min-width:0;min-height:60px;padding:17px 24px;border:1px solid #ffffff0d;border-radius:20px;background:#ffffff0d;color:#eee;box-shadow:inset 0 1px 1px #ffffff1a,inset 0 -1px 1px #ffffff0d;font:400 16px/1.5 var(--font);transition:background .16s,border-color .16s}
.application-site .application-field textarea{resize:none;min-height:64px;max-height:none;overflow-y:hidden}
.application-site .application-field input::placeholder,.application-site .application-field textarea::placeholder{color:#a0a0a0;opacity:1}
.application-site .application-field input:hover,.application-site .application-field textarea:hover{border-color:#ffffff28;background:#ffffff10}
.application-site .application-field input:focus,.application-site .application-field textarea:focus{border-color:#ffffff55;outline:1px solid #ffffff55;outline-offset:2px}
.application-site .application-field [aria-invalid=true]{border-color:#d9a4aa}
.application-site .field-hint,.application-site .character-count,.application-site .field-error{font:400 13px/1.5 var(--font);margin-top:10px;color:#9b9b9b;overflow-wrap:anywhere}
.application-site .field-error{color:#e4b9bd}
.application-site .field-bottom{height:0;position:relative;margin:0;display:flex;justify-content:flex-end}
.application-site .character-count{position:absolute;top:3px;right:3px;font-size:11px}
.application-site .field-bottom .field-hint{margin:0}
.application-site .character-count{margin:0;color:#9b9b9b;visibility:hidden}
.application-field:focus-within .character-count{visibility:visible}
.application-site .field-required{color:#ccc}
.application-site .application-actions{display:flex;flex-direction:column;align-items:stretch;gap:12px;padding:16px 0 0;margin:0;border:0}
.application-site .application-actions p{margin:0;font:400 13px/1.4 var(--font);color:#999;text-align:center}
.application-site .application-status,.application-site .form-notice{margin:0 0 24px;padding:16px 20px;border:1px solid #ffffff14;border-radius:14px;background:#ffffff05;color:#c9c9c9;font:400 16px/1.5 var(--font)}
.application-site .form-error-summary{border-color:#b98e9555;color:#ecc9ce;background:#4c303329}
.application-site .application-retry{margin-bottom:24px}
.application-site .application-success{padding:0;text-align:left}
.application-site .application-success h2{font-size:28px}
.application-site .application-socials{margin-top:32px}
.application-socials p{margin-bottom:36px}
.application-socials .glass-button+.glass-button{margin-top:16px}
.application-socials svg{display:block;flex:0 0 26px;width:26px;height:26px}
.vrc-badge{flex-shrink:0;border:1.5px solid currentColor;border-radius:3px;padding:0 3px;font:700 12px/1.5 var(--font);letter-spacing:-1px}
.application-back{display:flex;align-items:center;justify-content:center;gap:10px;width:fit-content;margin:8px auto 0;padding:6px 12px;color:#aaa;font-size:15px;line-height:1.5}
.application-back:hover{color:#eee}
.application-back span{font-size:20px}
.application-site .noscript-message{margin:24px 0 0;border:1px solid #ffffff20;border-radius:12px;font-size:16px}
body[data-view=auth] .application-heading{margin-bottom:40px}
body[data-view=auth] .application-status{display:none}
body[data-view=sent] .application-heading,body[data-view=sent] .discord-binding{display:none}
@media(max-width:900px){
 .application-site{font-size:17px}
 .application-site-header{min-height:0;padding:16.5px 0}
 .application-brand img{width:auto;height:104px}
 .application-card{padding:36px}
 .application-heading h1,.application-site .application-success h2{font-size:25px;margin-bottom:16px}
 .application-site .application-intro,.application-site .application-success p,.application-socials p{font-size:16px}
 .application-site .application-heading{margin-bottom:32px}
 .application-site .glass-button{font-size:16px;min-height:60px;padding:17px 22px;border-radius:21px}
 .application-site .discord-binding{margin-bottom:32px;padding:24px 0}
 .application-site .discord-binding p{font-size:16px}
 .application-site .discord-binding small{font-size:13px}
 .application-privacy{font-size:14px;margin-top:26px}
 .application-socials p{margin-bottom:28px}
}
@media(max-width:600px){
 .application-site-header{width:calc(100% - 32px);min-height:0;padding:11.5px 0}
 .application-brand img{width:auto;height:94px}
 .application-page{width:calc(100% - 32px);margin-bottom:32px}
 .application-card{padding:26px 22px;border-radius:18px}
 .application-heading h1,.application-site .application-success h2{font-size:22px;line-height:1.3}
 .application-site .application-intro,.application-site .application-success p,.application-socials p{font-size:15px;line-height:1.55}
 .application-site .application-heading{margin-bottom:28px}
 .application-site .application-field{margin-bottom:22px}
 .application-site .application-field .input-label{position:static;display:block;width:auto;height:auto;margin:0 0 10px;clip-path:none;white-space:normal;color:#c4c4c4;font:400 14px/1.5 var(--font)}
 .application-site .application-field input:not([type=checkbox]),.application-site .application-field textarea{font-size:16px;padding:15px 17px;min-height:56px;border-radius:17px}
 .application-site .application-field textarea{min-height:82px}
 .application-site .application-field textarea::placeholder{color:transparent}
 .application-site .application-field input[name=vrchatName]::placeholder{font-size:14px}
 .application-site .field-hint,.application-site .field-error,.application-site .character-count{font-size:12px}
 .application-site .discord-binding{align-items:flex-start;gap:12px;flex-direction:column;padding:20px 0;margin-bottom:26px}
 .application-site .form-kicker{font-size:12px;margin-bottom:8px}
 .application-site .glass-button{font-size:15px;min-height:56px;padding:15px 17px;gap:10px;border-radius:18px}
 .application-site .account-switch{font-size:14px}
 .application-site .application-socials{margin-top:22px}
 .application-socials p{margin-bottom:24px}
 .application-privacy{font-size:13px;line-height:1.6}
 .application-back{font-size:14px;margin-top:6px}
 .application-socials svg{width:22px;height:22px;flex-basis:22px}
}
@media(prefers-reduced-motion:reduce){.application-site *{transition:none!important;scroll-behavior:auto}}

.application-site .footer-account-switch{display:block;max-width:100%;width:fit-content;margin:0 auto;padding:8px 12px;font-size:14px;color:#aaa;text-decoration:none}
.application-site .footer-account-switch:hover{color:#eee}
@media(max-width:600px){.application-site .application-field input[name=vrchatName]::placeholder{color:transparent}}

@media(max-width:600px){.application-site .application-field input::placeholder{color:transparent}}
