/* ══════════════════════════════════════════════
   AUTO-QUIZ — BASE CSS
   Tokens, reset, typography, and base layout.
   ══════════════════════════════════════════════ */

html {
    font-size: clamp(16px, 0.5vw + 14px, 18px);
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
}

/* ── RESET ── */
*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

button,
a,
input,
select,
textarea,
.upload-zone {
    touch-action: manipulation;
}

/* ── DESIGN TOKENS ── */
:root {
    --bg: #141313;
    --blue: #5364fd;
    --blue-dark: #1b2fe9;
    --blue-light: #16161a;
    --border: #31313131;
    --text-dark: #ffffff;
    --text-mid: #e2e2e9;
    --text-soft: #a0a0ab;
    --card-surface: #1c1b1b;
    --gradient: linear-gradient(90deg, #4145fa 0%, #b21fb1 50%, #fe006f 100%);
    color-scheme: dark;
}

body {
    background-color: var(--bg);
    color: var(--text-dark);
}

/* ── FONTS ── */
@font-face {
    font-family: "Lexend Deca";
    src: url("../../LAMBU-Fonts/LexendDeca-Medium.woff2") format("woff2");
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: "Lexend Deca";
    src: url("../../LAMBU-Fonts/LexendDeca-Regular.woff2") format("woff2");
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Lexend Deca";
    src: url("../../LAMBU-Fonts/LexendDeca-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../../LAMBU-Fonts/Poppins-Regular.woff2") format("woff2");
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../../LAMBU-Fonts/Poppins-Medium.woff2") format("woff2");
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../../LAMBU-Fonts/Poppins-SemiBold.woff2") format("woff2");
    font-weight: 600;
    font-display: swap;
}

@font-face {
    font-family: "Poppins";
    src: url("../../LAMBU-Fonts/Poppins-Bold.woff2") format("woff2");
    font-weight: 700;
    font-display: swap;
}

/* ── BODY ── */
body {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    background-color: var(--bg);
    -webkit-font-smoothing: antialiased;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100svh;
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
    position: relative;
}