.rauth-wrap{
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
padding:60px 20px;
}

.rauth-grid{
max-width:1100px;
width:100%;
display:grid;
grid-template-columns:1fr 460px;
gap:60px;
align-items:center;
}

.rauth-hero{
display:flex;
flex-direction:column;
gap:20px;
}

.rauth-badge{
font-size:13px;
font-weight:600;
opacity:.7;
}

.rauth-title{
font-size:40px;
font-weight:800;
line-height:1.2;
}

.rauth-sub{
opacity:.7;
max-width:480px;
}

.rauth-features{
display:grid;
gap:10px;
margin-top:10px;
}

.rauth-feature{
display:flex;
gap:10px;
align-items:center;
font-weight:500;
}

.rauth-card{
background:var(--rl-bg-card);
border-radius:24px;
padding:36px;
box-shadow:var(--rl-shadow-md);
}

.rauth-social{
display:grid;
gap:12px;
margin-bottom:22px;
}

.rauth-btn{
display:flex;
align-items:center;
justify-content:center;
gap:10px;
height:48px;
border-radius:14px;
font-weight:600;
text-decoration:none;
color:white;
background:var(--rl-global-orange-btn);
}

.rauth-btn.google{background:#ea4335}
.rauth-btn.facebook{background:#1877f2}
.rauth-btn.discord{background:#5865f2}
.rauth-btn.line{background:#06c755}

.rauth-divider{
text-align:center;
margin:18px 0;
opacity:.5;
font-size:13px;
}

@media(max-width:900px){

.rauth-grid{
grid-template-columns:1fr;
gap:30px;
}

.rauth-hero{
text-align:center;
}

}

.rauth-wrap{
min-height:100vh;
display:flex;
align-items:center;
justify-content:center;
padding:70px 20px;
}

.rauth-grid{
display:grid;
grid-template-columns:1fr 440px;
gap:70px;
max-width:1200px;
width:100%;
align-items:center;
}

.rauth-hero{
display:flex;
flex-direction:column;
gap:22px;
}

.rauth-title{
font-size:44px;
font-weight:900;
line-height:1.1;
}

.rauth-sub{
font-size:16px;
opacity:.75;
max-width:520px;
}

.rauth-features{
display:grid;
gap:12px;
margin-top:10px;
}

.rauth-feature{
display:flex;
gap:12px;
align-items:center;
font-weight:600;
}

.rauth-card{
background:var(--rl-bg-card);
border-radius:26px;
padding:38px;
box-shadow:var(--rl-shadow-md);
}

.rauth-btn{
display:flex;
align-items:center;
justify-content:center;
gap:12px;
height:50px;
border-radius:16px;
font-weight:700;
text-decoration:none;
color:white;
transition:.2s;
}

.rauth-btn:hover{
transform:translateY(-2px);
}

.rauth-btn.line{background:#06c755}
.rauth-btn.google{background:#ea4335}
.rauth-btn.facebook{background:#1877f2}
.rauth-btn.discord{background:#5865f2}

.rauth-divider{
text-align:center;
margin:22px 0;
opacity:.6;
font-size:13px;
}

@media(max-width:900px){

.rauth-grid{
grid-template-columns:1fr;
gap:30px;
}

.rauth-hero{
text-align:center;
}

}

.rauth-card{
animation:authfade .5s ease;
}

@keyframes authfade{

from{
opacity:0;
transform:translateY(10px);
}

to{
opacity:1;
transform:translateY(0);
}

}

.rauth-line-note{margin:10px 0 2px;font-size:13px;opacity:.7;text-align:center}