:root {

    /* ===========================
       CORES PRINCIPAIS
    ============================ */

    --cyan: #45acab;
    --cyan-2: #3b8898;

    --blue: #284a6f;

    --navy: #151b3d;

    --deep: #0a0a24;


    /* ===========================
       TEXTO
    ============================ */

    --text: #f5f8ff;

    --muted: #9cb3c7;


    /* ===========================
       PAINÉIS
    ============================ */

    --panel: rgba(10, 10, 36, .76);

    --border: rgba(69, 172, 171, .30);


    /* ===========================
       SOMBRAS
    ============================ */

    --shadow:
        0 20px 50px rgba(0,0,0,.35);


    /* ===========================
       BORDAS
    ============================ */

    --radius: 24px;

    --radius-lg: 999px;

    --radius-md: 18px;

    --radius-sm: 14px;


    /* ===========================
       TRANSIÇÕES
    ============================ */

    --transition-fast: .2s ease;

    --transition: .3s ease;

    --transition-slow: .45s ease;


    /* ===========================
       GLASSMORPHISM
    ============================ */

    --glass:
        rgba(255,255,255,.03);

    --glass-strong:
        rgba(255,255,255,.06);


    /* ===========================
       BACKGROUND
    ============================ */

    --bg-dark:
        rgba(10,10,36,.78);

    --bg-dark-strong:
        rgba(7,10,25,.96);


    /* ===========================
       GLOW
    ============================ */

    --glow-cyan:
        rgba(69,172,171,.35);

    --glow-blue:
        rgba(110,130,255,.30);

}