/* UFOIndex night-sky theme: the base every page shares.
   Loaded by header.php after each page's own styles, so these basics win over a page's plain
   element rules (body, a, input...) while the page's class-based styles still apply. Pages'
   own colours were converted to this palette by tools/recolor.py. */
:root {
    --ufo-bg: #070b16;
    --ufo-surface: #0f1729;
    --ufo-surface-2: #141e35;
    --ufo-raise: #1b2742;
    --ufo-text: #e9edf6;
    --ufo-muted: #a3aec4;
    --ufo-faint: #7d89a3;
    --ufo-line: rgba(255, 255, 255, 0.10);
    --ufo-line-strong: rgba(255, 255, 255, 0.18);
    --ufo-amber: #f5b13d;
    --ufo-head: "Space Grotesk", "Inter", system-ui, sans-serif;
    color-scheme: dark;
}

html, body {
    background: var(--ufo-bg);
    color: var(--ufo-text);
}
body {
    font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
}
h1, h2, h3 {
    font-family: var(--ufo-head);
    letter-spacing: -0.015em;
}
a {
    color: var(--ufo-amber);
}
a:hover {
    color: #ffc35c;
}
hr {
    border: 0;
    border-top: 1px solid var(--ufo-line);
}

/* The shared white page box from stylesheet.css */
.container {
    background: var(--ufo-surface);
    border: 1px solid var(--ufo-line);
    border-radius: 20px;
    box-shadow: none;
    margin-top: 28px;
    margin-bottom: 28px;
}

/* Form fields a page hasn't styled itself */
input, select, textarea {
    background-color: #0b1222;
    color: var(--ufo-text);
    border: 1px solid var(--ufo-line-strong);
    border-radius: 10px;
}
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--ufo-amber);
    box-shadow: 0 0 0 3px rgba(245, 177, 61, 0.18);
}
input[type="checkbox"], input[type="radio"], input[type="range"], input[type="color"] {
    accent-color: var(--ufo-amber);
}
input[type="submit"], input[type="button"] {
    background: var(--ufo-amber);
    color: #1a1205;
    border: 0;
    font-weight: 600;
    cursor: pointer;
}
::placeholder {
    color: var(--ufo-faint);
    opacity: 1;
}
option {
    background: var(--ufo-surface);
    color: var(--ufo-text);
}

/* Tables a page hasn't styled itself */
table {
    border-color: var(--ufo-line);
}
th, td {
    border-color: var(--ufo-line);
}

::selection {
    background: rgba(245, 177, 61, 0.35);
}