/* parking.css - the parking page for names with no site on them.
   Tokens copied from the light theme in public/assets/css/panel.css
   (:root[data-theme="light"]), so the page is in the panel's family. No web
   fonts: the system stack keeps the page free of any request but this file. */

:root {
    --pnl-bg: #F3F7F5;
    --pnl-surface: #FFFFFF;
    --pnl-rule: #DCE6E0;
    --pnl-ink: #10201C;
    --pnl-body: #52635C;
    --pnl-faint: #5E6F68;
    --pnl-accent-text: #0B6A43;
    --pnl-accent-hover: #0B6A43;
    --pnl-focus: #0B7A4D;
    --pnl-sans: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --pnl-mono: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
    --pnl-radius: 12px;
    color-scheme: light;
}

* { box-sizing: border-box; }

html, body { margin: 0; }

body {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    background: var(--pnl-bg);
    color: var(--pnl-body);
    font-family: var(--pnl-sans);
    font-size: 16px;
    line-height: 1.55;
}

main {
    width: 100%;
    max-width: 560px;
    background: var(--pnl-surface);
    border: 1px solid var(--pnl-rule);
    border-radius: var(--pnl-radius);
    padding: 40px 32px;
}

.brand {
    margin: 0 0 28px;
    color: var(--pnl-ink);
    font-weight: 700;
    letter-spacing: -0.01em;
}

h1 {
    margin: 0 0 12px;
    color: var(--pnl-ink);
    font-family: var(--pnl-mono);
    font-size: clamp(1.25rem, 5vw, 1.75rem);
    font-weight: 600;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

p { margin: 0 0 8px; }

.en {
    margin-top: 20px;
    padding-top: 16px;
    border-top: 1px solid var(--pnl-rule);
    color: var(--pnl-faint);
    font-size: 14px;
}

.login { margin-top: 24px; font-size: 14px; }

a { color: var(--pnl-accent-text); text-underline-offset: 2px; }
a:hover { color: var(--pnl-accent-hover); }
a:focus-visible { outline: 3px solid var(--pnl-focus); outline-offset: 2px; border-radius: 2px; }

@media (max-width: 480px) {
    main { padding: 28px 20px; }
}
