@font-face {
  font-family: 'GenshinFont';
  src: url('/static/fonts/genshin-fonts.ttf') format('truetype');
}

:root {
    --bg-gray            : rgb(49, 53, 52);
    --bg-gray-light      : rgb(63, 68, 67);
    --bg-gray-lighter    : rgb(77, 83, 82);
    --bg-white           : rgb(236, 229, 216);
    --bg-yellow          : rgb(255, 231, 187);
    --bg-orange          : rgb(188, 105, 50); 

    --text-gray          : rgb(77, 86, 104);
    --text-gray-subtil   : rgb(112, 118, 129);
    --text-white         : rgb(200, 196, 188);
    --text-white-focus   : rgb(246, 242, 238);
    --text-yellow        : rgb(227, 203, 75);
    --text-yellow-subtil : rgb(211, 188, 142);
    --text-subtil        : rgb(199, 222, 255);

    /* Import de static/fonts/genshin-fonts.ttf */
    --fonts-genshin    : 'GenshinFont', sans-serif;
}

body{
    background-color:  var(--bg-);
    padding: 0;
    margin: 0;

    font-family: var(--fonts-genshin);
}

.chrome{
    padding: 5px 1rem 5px 1rem;
    background-color: var(--bg-gray);
    display: flex;
    justify-content: space-between;

    & .chrome-l{
        color: var(--text-yellow);
        font-size: 1.2rem;
        font-weight: bold;
    }

    & .chrome-r{
        color: var(--text-yellow-subtil);
        display: flex;
        align-items: center;
    }
}

.panel {
    padding: 0;
    margin: 0;
}