* { box-sizing: border-box; }

:root {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #17202a;
    background: #f3f5f7;
}

body {
    margin: 0;
    min-height: 100vh;
    display: grid;
    place-items: center;
}

.container {
    width: min(92%, 720px);
}

.card {
    background: #fff;
    border-radius: 18px;
    padding: 32px;
    box-shadow: 0 12px 35px rgba(0,0,0,.08);
}

.brand {
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .12em;
    opacity: .65;
}

h1 {
    margin: 10px 0 8px;
    font-size: clamp(1.8rem, 6vw, 2.6rem);
}

p {
    line-height: 1.6;
}

.ok, .error {
    margin: 24px 0 12px;
    padding: 14px 16px;
    border-radius: 12px;
    font-weight: 700;
}

.ok {
    background: #e9f8ef;
    color: #176b38;
}

.error {
    background: #fdecec;
    color: #9b2525;
}

.muted {
    color: #68737d;
}

pre {
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}