:root{
    --bg1:#0b1220;
    --bg2:#0f1b33;
    --card: rgba(255,255,255,.08);
    --stroke: rgba(255,255,255,.14);
    --text: rgba(255,255,255,.92);
    --muted: rgba(255,255,255,.72);
    --shadow: 0 20px 60px rgba(0,0,0,.45);
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
    margin:0;
    font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
    color: var(--text);
    background:
        radial-gradient(1200px 700px at 10% 10%, rgba(124, 92, 255, .35), transparent 60%),
        radial-gradient(900px 600px at 90% 30%, rgba(46, 212, 255, .25), transparent 55%),
        linear-gradient(160deg, var(--bg1), var(--bg2));
    display:flex;
    align-items:center;
    justify-content:center;
    padding: 28px 16px;
}

.wrap{
    width: min(860px, 100%);
    display:grid;
    place-items:center;
    gap: 18px;
}

.card{
    width: min(720px, 100%);
    background: var(--card);
    border: 1px solid var(--stroke);
    border-radius: 20px;
    box-shadow: var(--shadow);
    backdrop-filter: blur(12px);
    padding: 28px 22px;
}

.brand{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap: 14px;
    text-align:center;
}

.logo{
    width: clamp(140px, 28vw, 220px);
    height:auto;
    filter: drop-shadow(0 10px 22px rgba(0,0,0,.35));
}

.subtitle{
    margin:0;
    color: var(--muted);
    font-size: 14.5px;
    line-height: 1.45;
}

.email{
    margin-top: 14px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
    gap: 10px;
}

.pill{
    display:inline-flex;
    align-items:center;
    gap: 10px;
    padding: 10px 14px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.18);
    background: rgba(255,255,255,.06);
}

.dot{
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: rgba(70,255,180,.9);
    box-shadow: 0 0 0 6px rgba(70,255,180,.12);
}

.mail-link{
    color: var(--text);
    text-decoration:none;
    font-weight: 600;
}

.mail-link:hover{ text-decoration: underline; }

.hint{
    font-size: 12.5px;
    color: rgba(255,255,255,.6);
    margin: 0;
}

.footer{
    font-size: 12px;
    color: rgba(255,255,255,.55);
    margin-top: 10px;
    text-align:center;
}