:root{
    --vdl-ink:#111411;
    --vdl-soft:rgba(17,20,17,.62);
    --vdl-green:#04994C;
    --vdl-green-dark:#047A3D;
}

html,
body.valedados-login-screen{
    margin:0!important;
    min-height:100%;
}

body.valedados-login-screen{
    font-family:'Google Sans Flex','Inter','Segoe UI',Arial,sans-serif;
    color:var(--vdl-ink);
    background:#eef4ef;
}

.vdl-login-stage{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    min-height:100vh;
    min-height:100svh;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:28px;
    background:
        radial-gradient(circle at 12% 12%,rgba(232,72,161,.48) 0%,rgba(232,72,161,.16) 24%,transparent 47%),
        radial-gradient(circle at 88% 88%,rgba(59,205,165,.55) 0%,rgba(59,205,165,.18) 27%,transparent 49%),
        linear-gradient(145deg,#f2bfd8 0%,#edf4ef 52%,#aee7d3 100%);
}

.vdl-login-stage::before{
    content:"";
    position:absolute;
    inset:0;
    z-index:-3;
    background:rgba(255,255,255,.06);
    backdrop-filter:saturate(115%);
}

.vdl-orb{
    position:absolute;
    z-index:-2;
    border-radius:50%;
    filter:blur(2px);
    pointer-events:none;
}

.vdl-orb-a{
    width:360px;
    height:360px;
    left:-120px;
    bottom:-155px;
    background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.72),rgba(4,153,76,.18) 48%,transparent 73%);
}

.vdl-orb-b{
    width:420px;
    height:420px;
    right:-140px;
    top:-175px;
    background:radial-gradient(circle at 35% 30%,rgba(255,255,255,.60),rgba(232,72,161,.16) 48%,transparent 72%);
}

.vdl-login-card{
    width:min(430px,100%);
    padding:42px;
    border-radius:30px;
    background:linear-gradient(135deg,rgba(255,255,255,.48),rgba(255,255,255,.20));
    border:1px solid rgba(255,255,255,.72);
    box-shadow:
        inset 0 0 12px rgba(255,255,255,.22),
        inset 2px 2px 2px rgba(255,255,255,.58),
        inset -2px -2px 10px rgba(0,0,0,.06),
        0 28px 70px rgba(17,20,17,.14);
    backdrop-filter:blur(24px) saturate(145%);
    -webkit-backdrop-filter:blur(24px) saturate(145%);
}

.vdl-login-kicker{
    margin-bottom:9px;
    font-size:10px;
    line-height:1;
    font-weight:750;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--vdl-green-dark);
}

.vdl-login-card h1{
    margin:0;
    font-size:clamp(30px,5vw,38px);
    line-height:1.02;
    letter-spacing:-.05em;
    font-weight:700;
}

.vdl-login-copy{
    margin:13px 0 30px;
    max-width:340px;
    font-size:13px;
    line-height:1.6;
    color:var(--vdl-soft);
}

.vdl-google-wrap{
    min-height:44px;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
}

/* O Site Kit mantém o controle do botão oficial do Google. */
.vdl-google-wrap .googlesitekit-sign-in-with-google__frontend-output-button,
.vdl-google-wrap .valedados-google-button{
    margin-inline:auto;
    max-width:320px;
}

.vdl-login-security{
    margin:20px auto 0;
    max-width:320px;
    text-align:center;
    font-size:10.5px;
    line-height:1.55;
    color:rgba(17,20,17,.54);
}

.vdl-login-rule{
    height:1px;
    margin:24px 0 18px;
    background:linear-gradient(90deg,transparent,rgba(17,20,17,.14),transparent);
}

.vdl-login-terms{
    margin:0;
    text-align:center;
    font-size:9.5px;
    line-height:1.55;
    color:rgba(17,20,17,.42);
}

.vdl-login-error,
.vdl-already-logged{
    padding:12px 14px;
    border-radius:16px;
    background:rgba(255,255,255,.56);
    border:1px solid rgba(255,255,255,.75);
    font-size:12px;
    line-height:1.5;
}

/* Opcional: use [valedados_usuario] dentro do painel. */
.vdl-user-chip{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:6px 7px 6px 6px;
    border-radius:999px;
    background:rgba(255,255,255,.54);
    border:1px solid rgba(255,255,255,.72);
    backdrop-filter:blur(12px);
    -webkit-backdrop-filter:blur(12px);
}

.vdl-user-avatar{
    width:34px!important;
    height:34px!important;
    border-radius:50%!important;
}

.vdl-user-name{
    font-size:11px;
    font-weight:650;
}

.vdl-user-logout{
    padding:6px 9px;
    border-radius:999px;
    color:var(--vdl-ink);
    background:rgba(255,255,255,.62);
    text-decoration:none;
    font-size:10px;
    font-weight:650;
}

.vdl-user-logout:hover{
    background:#fff;
}

@media(max-width:620px){
    .vdl-login-stage{
        align-items:stretch;
        padding:14px;
    }

    .vdl-login-card{
        margin:auto;
        padding:32px 23px;
        border-radius:25px;
    }
}

/* Dashboard Glass 2.0 — mesma linguagem visual do painel. */
body.valedados-login-screen{
    background:#eaf2ec;
}

.vdl-login-stage{
    padding:clamp(18px,4vw,48px);
    background:
        radial-gradient(circle at 7% 4%,rgba(92,211,142,.42),transparent 29%),
        radial-gradient(circle at 96% 10%,rgba(196,224,255,.58),transparent 28%),
        radial-gradient(circle at 70% 92%,rgba(255,217,147,.22),transparent 31%),
        linear-gradient(145deg,#eaf3ed 0%,#f8fbf8 50%,#e3eee7 100%);
}

.vdl-login-stage::after{
    content:"";
    position:absolute;
    inset:0;
    z-index:-1;
    opacity:.18;
    pointer-events:none;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.12'/%3E%3C/svg%3E");
    mix-blend-mode:soft-light;
}

.vdl-login-shell{
    width:min(1040px,100%);
    display:grid;
    grid-template-columns:minmax(330px,420px) minmax(0,1fr);
    gap:18px;
    padding:18px;
    border:1px solid rgba(255,255,255,.9);
    border-radius:38px;
    background:linear-gradient(145deg,rgba(255,255,255,.58),rgba(255,255,255,.25));
    box-shadow:0 36px 100px rgba(29,72,49,.19),inset 0 1px 0 rgba(255,255,255,.98);
    backdrop-filter:blur(32px) saturate(155%);
    -webkit-backdrop-filter:blur(32px) saturate(155%);
}

.vdl-login-card{
    width:auto;
    padding:clamp(30px,4vw,48px);
    border-radius:28px;
    background:linear-gradient(145deg,rgba(255,255,255,.9),rgba(255,255,255,.6));
    border:1px solid rgba(255,255,255,.96);
    box-shadow:0 22px 65px rgba(29,72,49,.12),inset 0 1px 0 #fff;
}

.vdl-brand{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin-bottom:44px;
    color:var(--vdl-ink);
    text-decoration:none;
}

.vdl-brand-mark,
.vdl-icon{
    width:48px;
    height:48px;
    min-width:48px;
    display:grid;
    place-items:center;
    aspect-ratio:1/1;
    border-radius:15px;
    color:#fff;
    background:linear-gradient(145deg,#08a958,#047a3d);
    border:1px solid rgba(255,255,255,.8);
    box-shadow:0 13px 28px rgba(4,153,76,.25),inset 0 1px 0 rgba(255,255,255,.42);
    font-weight:800;
}

.vdl-brand span:last-child{display:grid;gap:2px}.vdl-brand b{font-size:15px}.vdl-brand small{font-size:9px;color:var(--vdl-soft)}
.vdl-login-card h1{font-size:clamp(32px,4vw,46px);max-width:320px}.vdl-login-copy{margin-bottom:26px}

.vdl-preview{
    position:relative;
    overflow:hidden;
    min-height:590px;
    padding:28px;
    border-radius:28px;
    color:#fff;
    background:
        radial-gradient(circle at 80% 12%,rgba(129,226,169,.34),transparent 28%),
        linear-gradient(145deg,rgba(3,83,43,.94),rgba(4,132,68,.88));
    border:1px solid rgba(255,255,255,.34);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.34),inset 0 -40px 90px rgba(0,40,21,.16);
}

.vdl-preview::before{
    content:"";
    position:absolute;
    width:360px;
    height:360px;
    right:-170px;
    bottom:-170px;
    border-radius:50%;
    border:60px solid rgba(255,255,255,.05);
}

.vdl-preview-head{position:relative;z-index:1;display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.vdl-preview-head small{font-size:9px;letter-spacing:.14em;color:rgba(255,255,255,.62)}.vdl-preview-head h2{margin:7px 0 0;max-width:320px;font-size:clamp(25px,3vw,38px);line-height:1.02;letter-spacing:-.05em}.vdl-live{display:flex;align-items:center;gap:7px;padding:8px 11px;border:1px solid rgba(255,255,255,.28);border-radius:999px;background:rgba(255,255,255,.1);font-size:9px;white-space:nowrap}.vdl-live i{width:7px;height:7px;border-radius:50%;background:#6aff9c;box-shadow:0 0 0 5px rgba(106,255,156,.12)}
.vdl-preview-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:42px}.vdl-preview-card{min-height:132px;padding:16px;display:flex;flex-direction:column;justify-content:flex-end;border:1px solid rgba(255,255,255,.28);border-radius:21px;background:linear-gradient(145deg,rgba(255,255,255,.19),rgba(255,255,255,.08));box-shadow:0 18px 44px rgba(0,45,24,.15),inset 0 1px 0 rgba(255,255,255,.28);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.vdl-preview-card .vdl-icon{width:42px;height:42px;min-width:42px;margin-bottom:auto;border-radius:14px;color:#047a3d;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(222,245,232,.82));font-size:18px}.vdl-preview-card small{font-size:9px;color:rgba(255,255,255,.62)}.vdl-preview-card b{margin-top:5px;font-size:14px}.vdl-preview-wide{grid-column:1/-1;min-height:190px}.vdl-mini-chart{height:62px;display:flex;align-items:flex-end;gap:8px;margin-top:18px}.vdl-mini-chart i{flex:1;border-radius:7px 7px 3px 3px;background:linear-gradient(to top,rgba(255,255,255,.18),rgba(126,255,174,.82))}.vdl-mini-chart i:nth-child(1){height:26%}.vdl-mini-chart i:nth-child(2){height:48%}.vdl-mini-chart i:nth-child(3){height:38%}.vdl-mini-chart i:nth-child(4){height:76%}.vdl-mini-chart i:nth-child(5){height:61%}.vdl-mini-chart i:nth-child(6){height:92%}

@media(max-width:820px){
    .vdl-login-shell{grid-template-columns:1fr;max-width:520px;border-radius:30px;padding:12px}
    .vdl-preview{display:none}
    .vdl-brand{margin-bottom:34px}
}

@media(max-width:620px){
    .vdl-login-stage{align-items:center;padding:12px}
    .vdl-login-shell{border-radius:27px}
    .vdl-login-card{padding:30px 22px;border-radius:22px}
    .vdl-brand-mark{width:44px;height:44px;min-width:44px;border-radius:14px}
}