:root {
    color-scheme: light;
    --edukatro-blue: var(--edu-color-brand-600, #3454d1);
    --edukatro-ink: var(--edu-color-text, #243046);
    --edukatro-soft: var(--edu-color-brand-100, #eef2ff);
}

body {
    min-height: 100vh;
    background: linear-gradient(180deg, #f8fbff 0%, #ffffff 42%);
    color: var(--edukatro-ink);
}

.site-header {
    border-bottom: 1px solid #dbe5f3;
    background: rgb(255 255 255 / 92%);
}

.brand-mark {
    display: inline-grid;
    width: 2.25rem;
    height: 2.25rem;
    place-items: center;
    border-radius: 0.7rem;
    background: var(--edukatro-blue);
    color: #fff;
    font-weight: 800;
}

.hero-panel {
    border: 1px solid #dbe8fa;
    border-radius: 1.5rem;
    background: #fff;
    box-shadow: 0 1rem 3rem rgb(22 73 143 / 10%);
}

.status-card {
    height: 100%;
    border: 1px solid #dce6f2;
    border-radius: 1rem;
    background: #fff;
}

.status-dot {
    display: inline-block;
    width: 0.7rem;
    height: 0.7rem;
    margin-right: 0.45rem;
    border-radius: 50%;
    background: #198754;
    box-shadow: 0 0 0 0.2rem rgb(25 135 84 / 12%);
}

code {
    color: #8b2f66;
}