/* Project-specific finishing layer. Kept separate from generated Tailwind CSS. */
:root {
    --background: oklch(14% .012 72);
    --surface: oklch(18% .012 72);
    --surface-2: oklch(23% .015 72);
    --card: oklch(18% .012 72);
    --popover: oklch(18% .012 72);
    --secondary: oklch(23% .015 72);
    --muted: oklch(23% .015 72);
    --muted-foreground: oklch(73% .012 72);
    --accent: oklch(27% .03 74);
    --border: oklch(32% .02 72);
    --input: oklch(26% .018 72);
    --primary-foreground: oklch(14% .012 72);
}

body {
    background-image:
        radial-gradient(circle at 0 12%, oklch(34% .07 76 / .18), transparent 28rem),
        radial-gradient(circle at 100% 36%, oklch(31% .04 50 / .16), transparent 34rem),
        linear-gradient(135deg, oklch(12% .012 72), var(--background) 45%, oklch(12% .008 55));
    background-attachment: fixed;
}

.quote-fab {
    position: fixed;
    right: 1rem;
    bottom: 1rem;
    z-index: 60;
    display: flex;
    align-items: center;
    gap: .55rem;
    padding: .85rem 1.1rem;
    background: var(--gradient-gold);
    color: var(--primary-foreground);
    box-shadow: var(--shadow-gold);
    font: 600 .72rem var(--font-sans);
    letter-spacing: .14em;
    text-transform: uppercase;
    transition: transform .2s ease;
}

.quote-fab:hover { transform: translateY(-3px); }

.footer-credit { color: var(--gold); text-decoration: none; }
.footer-credit:hover { text-decoration: underline; }

@media (min-width: 64rem) {
    .quote-fab { right: 2rem; bottom: 2rem; }
}