/* Base reset + Module 1 boot screen. Real components arrive in Module 7. */

*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }

html { -webkit-text-size-adjust: 100%; }

body {
    min-height: 100vh;
    background: var(--paper);
    color: var(--ink);
    font-family: var(--font-body);
    font-size: var(--step-0);
    line-height: 1.65;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

img, picture, svg, video { display: block; max-width: 100%; height: auto; }
input, button, textarea, select { font: inherit; color: inherit; }
a { color: inherit; }

:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 3px;
}

/* --- Flash messages --- */
.flash-stack {
    position: fixed;
    inset-block-start: var(--sp-4);
    inset-inline-end: var(--sp-4);
    z-index: 60;
    display: grid;
    gap: var(--sp-2);
    max-width: min(92vw, 26rem);
}
.flash {
    padding: var(--sp-3) var(--sp-4);
    border-radius: var(--radius);
    background: var(--ink);
    color: var(--mist);
    border-inline-start: 3px solid var(--gold);
    box-shadow: var(--shadow-2);
    font-size: var(--step--1);
}
.flash--error   { border-inline-start-color: var(--error); }
.flash--success { border-inline-start-color: var(--ok); }

/* --- Boot / status screen --- */
.boot {
    min-height: 100vh;
    display: grid;
    align-content: center;
    gap: var(--sp-12);
    width: var(--shell);
    margin-inline: auto;
    padding-block: var(--sp-24);
}

.boot__eyebrow {
    font-family: var(--font-utility);
    font-size: var(--step--1);
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--brass);
}

.boot__title {
    font-family: var(--font-display);
    font-size: var(--step-3);
    font-weight: 700;
    line-height: 1.1;
    margin-block-start: var(--sp-2);
}

.boot__sub {
    max-width: var(--measure);
    margin-block-start: var(--sp-3);
    color: var(--slate);
}

.boot__checks {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: var(--sp-1);
    border-block-start: var(--hairline);
}
.boot__check {
    padding: var(--sp-4) 0;
    border-block-end: var(--hairline);
}
.boot__check dt {
    font-family: var(--font-utility);
    font-size: var(--step--1);
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--slate);
}
.boot__check dd {
    margin-block-start: var(--sp-1);
    font-size: var(--step-1);
}
.boot__check .is-ok      { color: var(--ok); }
.boot__check .is-pending { color: var(--warn); }

.boot__langs {
    display: flex;
    flex-wrap: wrap;
    gap: var(--sp-2);
}
.boot__langs a {
    padding: var(--sp-2) var(--sp-4);
    border: 1px solid var(--stone);
    border-radius: var(--radius);
    text-decoration: none;
    font-size: var(--step--1);
    transition: border-color var(--dur) var(--ease), background-color var(--dur) var(--ease);
}
.boot__langs a:hover { border-color: var(--gold); background: var(--gold-wash); }
.boot__langs a[aria-current="page"] { background: var(--ink); color: var(--mist); border-color: var(--ink); }