#gate.gate{background:linear-gradient(150deg,#291632,#100c1d 75%);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.8fr);max-width:1200px;margin:auto;min-height:100svh;overflow:hidden;}
#gate.gate[hidden]{display:none;}
#gate .reference-invite-art{container-type:inline-size;position:relative;border:0;padding:0;background:none;display:block;aspect-ratio:600/850;min-height:0;overflow:visible;}
#gate .gate-brand{position:absolute;left:8%;top:4%;width:34%;margin:0;display:block;}
#gate .gate-brand img{display:block;width:100%;height:auto;}
#gate .reference-invite-copy{position:absolute;left:43%;top:20%;right:6%;z-index:3;text-align:right;}
#gate .reference-invite-copy h1{font:800 8.8cqw/1.18 var(--sans,-apple-system,'PingFang SC',sans-serif);letter-spacing:.04em;color:#f6eaf2;margin:0;white-space:nowrap;}
#gate .reference-invite-copy p{font:400 2.25cqw/1.6 var(--sans,sans-serif);color:#ddcbdc;margin:5cqw 0 0;}
#gate .reference-invite-english{position:absolute;left:47%;right:2%;top:48%;height:37%;background:#f9be58;border-radius:0 12cqw 0 0;padding:8cqw 4cqw 5cqw 0;text-align:right;font:800 7.6cqw/1.3 var(--sans,sans-serif);color:#514843;z-index:0;}
#gate .reference-invite-person{position:absolute;z-index:2;left:-8%;top:18%;width:77%;height:auto;max-width:none;pointer-events:none;}
#gate .reference-invite-shadow{position:absolute;left:0;bottom:0;width:75%;height:8%;border-radius:50%;background:#af8cca55;filter:blur(15px);}
#gate .gate-entry{display:flex;align-items:center;padding:40px;background:none;border:0;}
#gate #invite-form{width:100%;max-width:none;}
#gate #invite-form>label{display:block;font:400 18px/1.5 var(--serif,serif);margin:0 0 10px;color:#f4e6f0;}
#gate .reference-invite-controls{display:flex;flex-wrap:wrap;gap:12px;}
#gate .reference-invite-controls input{flex:1 1 210px;min-width:0;height:62px;padding:15px 18px;border:1px solid #eee3be;border-radius:16px;background:#110d1b;color:#f5eef5;font:400 17px/1.5 var(--sans,sans-serif);outline-offset:3px;box-shadow:none;}
#gate .reference-invite-controls button{flex:1 1 130px;min-width:0;margin:0;background:#cfb7d8;border:0;border-radius:14px;box-shadow:none;color:#160d20;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:17px 22px;font:750 20px/1.3 var(--sans,sans-serif);}
#gate .recovery-entry{margin-top:18px;color:#c8b7cb;font-size:13px;}
#gate .recovery-entry summary{cursor:pointer;}
#gate .recovery-entry input{width:100%;margin-top:8px;}
#gate #gate-error{margin:8px 0;color:#ffc7d9;font-size:14px;}
#gate #gate-error:empty{display:none;}
@media(max-width:720px){
 #gate.gate{display:block;max-width:600px;min-height:100svh;}
 #gate .reference-invite-art{aspect-ratio:600/850;}
 #gate .gate-entry{padding:18px 7% 25px;display:block;}
 #gate .reference-invite-controls{flex-wrap:nowrap;gap:10px;}
 #gate .reference-invite-controls input{flex:1 1 auto;height:49px;padding:12px;font-size:14px;border-radius:12px;}
 #gate .reference-invite-controls button{flex:0 0 32%;padding:12px;font-size:15px;border-radius:12px;}
 #gate #invite-form>label{font-size:15px;margin-left:6px;margin-bottom:8px;}
 #gate .recovery-entry{font-size:11px;margin-top:14px;}
}

#gate .gate-story::after{display:none;}
#gate .reference-invite-controls button{white-space:nowrap;width:auto;gap:8px;}
#gate .reference-invite-english{border-bottom-right-radius:12cqw;}

/* Bring the shadow and entry up to the feet; preserve the reference's staggered title. */
#gate .reference-invite-shadow{bottom:10%;height:6%;width:70%;filter:blur(12px);}
#gate .reference-invite-copy h1{text-align:left;}
#gate .reference-invite-copy h1 span{display:block;}
#gate .reference-invite-copy h1 span:last-child{text-align:right;}
@media(max-width:720px){#gate .gate-entry{margin-top:-12%;padding-top:12px;position:relative;z-index:4;}}
