/* Design tokens and primitives shared by BOTH layouts (public + panel).
   Lives in one file on purpose: two copies of the palette drift apart, and
   the panel is supposed to look like the same product as the landing page,
   just a different room of it. */
:root {
    --bg: #0f1115;
    --panel: #181b22;
    --text: #e6e8ec;
    --muted: #9aa1ad;
    --accent: #4f8cff;
    --border: #262b35;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    background: var(--bg);
    color: var(--text);
    min-height: 100vh;
}

/* Auth forms (login, rejestracja) — public layout only, but kept here so the
   two forms cannot drift apart. */
.authbox { max-width: 22rem; margin: 3rem auto; }
.authbox h1 { font-size: 1.3rem; margin-bottom: .4rem; }
.authbox p.lead { color: var(--muted); font-size: .88rem; margin-bottom: 1.6rem; }
.authbox label { display: block; font-size: .82rem; color: var(--muted); margin-bottom: .35rem; }
.authbox label .hint { opacity: .7; }
.authbox input {
    width: 100%;
    padding: .6rem .7rem;
    margin-bottom: 1rem;
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 6px;
    color: var(--text);
    font-size: .95rem;
}
.authbox input:focus { outline: none; border-color: var(--accent); }
.authbox button {
    width: 100%;
    padding: .65rem;
    background: var(--accent);
    border: 0;
    border-radius: 6px;
    color: #fff;
    font-size: .95rem;
    font-weight: 600;
    cursor: pointer;
}
.authbox .error {
    background: #2a1a1d;
    border: 1px solid #5c2b31;
    color: #ffb4bc;
    border-radius: 6px;
    padding: .6rem .7rem;
    font-size: .85rem;
    margin-bottom: 1.2rem;
}
.authbox .alt { margin-top: 1.2rem; font-size: .85rem; color: var(--muted); text-align: center; }
.authbox .alt a { color: var(--accent); }