:root{
    --bg:#04080c;
    --bg2:#071118;
    --surface:#0c151d;
    --surface2:#101c25;

    --emerald:#19e6a2;
    --emerald2:#00c98b;
    --ice:#65c7ff;

    --text:#f2f7fa;
    --muted:#7e95a5;
    --border:#1c3440;

    --danger:#e43f52;
}

*{
    box-sizing:border-box;
}

html,body{
    margin:0;
    min-height:100%;
}

body{
    min-height:100vh;
    font-family:Inter,Segoe UI,Arial,sans-serif;
    color:var(--text);

    background:
        radial-gradient(circle at 15% 15%,rgba(25,230,162,.10),transparent 30%),
        radial-gradient(circle at 85% 80%,rgba(101,199,255,.09),transparent 32%),
        linear-gradient(135deg,#030609 0%,#071017 50%,#04080c 100%);
}

body:before{
    content:"";
    position:fixed;
    inset:0;
    pointer-events:none;

    background-image:
        linear-gradient(rgba(255,255,255,.016) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.016) 1px,transparent 1px);

    background-size:42px 42px;
}

.brand-gradient{
    background:linear-gradient(90deg,var(--emerald),var(--ice));
    -webkit-background-clip:text;
    -webkit-text-fill-color:transparent;
    background-clip:text;
}

a{
    color:inherit;
}

button,input{
    font:inherit;
}