:root {
    --gm-bg: #f8fafc;
    --gm-surface: #ffffff;
    --gm-border: rgba(15, 23, 42, 0.12);
    --gm-text: #0f172a;
    --gm-muted: #475569;
    --gm-primary: #2563eb;
    --gm-primary-600: #1d4ed8;
}

html,
body {
    height: 100%;
}

body {
    background: var(--gm-bg);
    color: var(--gm-text);
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
}

.gm-auth-bg {
    min-height: 100vh;
    background: radial-gradient(1200px 600px at 20% 10%, rgba(37, 99, 235, 0.18), rgba(248, 250, 252, 0)),
        radial-gradient(900px 500px at 80% 30%, rgba(99, 102, 241, 0.14), rgba(248, 250, 252, 0)),
        var(--gm-bg);
}

.gm-card {
    border: 1px solid var(--gm-border);
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(2, 6, 23, 0.08);
}

.gm-brand {
    letter-spacing: -0.02em;
}

.gm-sidebar {
    width: 280px;
    border-right: 1px solid var(--gm-border);
    background: var(--gm-surface);
}

.gm-navlink {
    border-radius: 10px;
    color: var(--gm-muted);
    padding: 10px 12px;
    text-decoration: none;
    display: block;
    transition: background 120ms ease, color 120ms ease;
}

.gm-navlink:hover {
    background: rgba(37, 99, 235, 0.08);
    color: var(--gm-text);
}

.gm-navlink.is-active {
    background: rgba(37, 99, 235, 0.12);
    color: var(--gm-primary-600);
}

.gm-page {
    padding: 24px;
}

.gm-surface {
    background: var(--gm-surface);
    border: 1px solid var(--gm-border);
    border-radius: .5rem;
}

.btn-primary {
    background: var(--gm-primary);
    border-color: var(--gm-primary);
}

.btn-primary:hover {
    background: var(--gm-primary-600);
    border-color: var(--gm-primary-600);
}