/* Vibe Coding Forum - Main Stylesheet */
/* Extracted from inline styles for CSP cache compatibility */

:root { color-scheme: light dark; }
html, body { height: 100%; margin: 0; }
body {
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell,
                 "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji",
                 "Segoe UI Emoji", sans-serif;
}
.wrap {
    min-height: 100%;
    display: grid;
    place-items: center;
    padding: 2rem;
}
.card {
    max-width: 720px;
    width: 100%;
    padding: 2rem;
    border-radius: 12px;
    border: 1px solid rgba(0,0,0,.1);
    background: rgba(255,255,255,.6);
    backdrop-filter: blur(6px);
}
.title {
    font-size: clamp(2rem, 3.5vw, 3rem);
    margin: 0 0 0.5rem;
}
.tagline {
    font-size: clamp(1.1rem, 2.3vw, 1.25rem);
    opacity: .8;
    margin: 0 0 1.25rem;
}
.muted {
    opacity: .6;
    font-size: .95rem;
}
@media (prefers-color-scheme: dark) {
    .card {
        background: rgba(16,16,16,.6);
        border-color: rgba(255,255,255,.1);
    }
}
/* Error page styles */
.error-container { text-align: center; padding: 2rem 0; }
.error-code { font-size: 6rem; margin: 0; opacity: 0.2; }
.error-message { opacity: 0.8; }
.error-link-wrapper { margin-top: 2rem; }
.error-link { color: inherit; text-decoration: underline; }
.error-details {
    margin-top: 2rem;
    text-align: left;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.error-summary { cursor: pointer; font-weight: bold; }
.error-pre {
    background: rgba(0,0,0,0.05);
    padding: 1rem;
    border-radius: 4px;
    overflow-x: auto;
    text-align: left;
}