@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700;800&display=swap');

:root {
    --brand-blue: #0b3a78;
    --brand-blue-deep: #07264f;
    --brand-orange: #ff6a2b;
    --brand-orange-deep: #c53a14;
    --page-bg: #f4f7fb;
    --page-ink: #10233f;
    --page-muted: #62748a;
    --page-line: rgba(12, 34, 67, 0.12);
}

* {
    box-sizing: border-box;
}

html {
    min-height: 100%;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-height: 100%;
    font-family: 'Sora', system-ui, sans-serif;
    color: var(--page-ink);
    background:
        radial-gradient(circle at top left, rgba(11, 58, 120, 0.11), transparent 24%),
        radial-gradient(circle at top right, rgba(255, 106, 43, 0.13), transparent 28%),
        linear-gradient(180deg, #f9fbff 0%, #f4f7fb 100%);
}

#root {
    min-height: 100vh;
}

a {
    color: inherit;
}

button,
input,
textarea,
select {
    font: inherit;
}

::selection {
    background: rgba(255, 106, 43, 0.18);
    color: var(--page-ink);
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: rgba(11, 58, 120, 0.05);
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--brand-blue), var(--brand-orange));
    border-radius: 999px;
}