/* Mobile: dynamic viewport, notches, virtual keyboard (see app.js --keyboard-pad) */
:root {
    --keyboard-pad: 0px;
}
html {
    height: 100%;
}
/* Lock the shell to one viewport: only the message pane scrolls; composer stays visible (no document scroll). */
body.layout-root {
    height: 100dvh;
    max-height: 100dvh;
    min-height: 100dvh;
    overflow: hidden;
    padding-left: env(safe-area-inset-left, 0px);
    padding-right: env(safe-area-inset-right, 0px);
}
.nav-safe {
    padding-top: env(safe-area-inset-top, 0px);
}
.composer-pad {
    padding-bottom: calc(env(safe-area-inset-bottom, 0px) + var(--keyboard-pad, 0px));
}

/* Placeholder can wrap to two lines before input: min height + line-height avoid vertical clipping (esp. with items-center row). */
.composer-textarea {
    min-height: 3rem;
}

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

.prose-spark {
    line-height: 1.75;
    overflow-wrap: anywhere;
    word-break: break-word;
    min-width: 0;
}
.prose-spark p { margin-bottom: 0.75rem; }
.prose-spark p:last-child { margin-bottom: 0; }
.prose-spark ul { list-style-type: disc; margin-left: 1.5rem; margin-bottom: 0.75rem; }
.prose-spark ol { list-style-type: decimal; margin-left: 1.5rem; margin-bottom: 0.75rem; }
.prose-spark li { margin-bottom: 0.25rem; }
.prose-spark li > p { margin-bottom: 0.25rem; }
.prose-spark a { color: #E25A1C; text-decoration: underline; }
.prose-spark strong { font-weight: 600; }
.prose-spark h1 { font-weight: 700; font-size: 1.35rem; margin-top: 0; margin-bottom: 0.6rem; }
.prose-spark h2 { font-weight: 700; font-size: 1.25rem; margin-top: 1.25rem; margin-bottom: 0.5rem; }
.prose-spark h3 { font-weight: 600; font-size: 1.1rem; margin-top: 1rem; margin-bottom: 0.5rem; }
.prose-spark h4 { font-weight: 600; margin-top: 0.75rem; margin-bottom: 0.4rem; }
.prose-spark blockquote {
    border-left: 3px solid #E25A1C;
    padding-left: 1rem;
    margin: 0.75rem 0;
    color: #586064;
}
.prose-spark hr { border-color: #dbe4e7; margin: 1rem 0; }
.prose-spark table {
    display: block;
    overflow-x: auto;
    width: max-content;
    max-width: 100%;
    border-collapse: collapse;
    margin: 0.75rem 0;
    font-size: 0.875rem;
}
.prose-spark th { text-align: left; font-weight: 600; padding: 0.5rem 0.75rem; border-bottom: 2px solid #dbe4e7; white-space: nowrap; }
.prose-spark td { padding: 0.4rem 0.75rem; border-bottom: 1px solid #eaeff1; }

.prose-spark pre {
    background: #0d1117;
    border-radius: 0.5rem;
    padding: 1rem;
    overflow-x: auto;
    max-width: 100%;
    margin: 0.75rem 0;
    font-size: 0.85rem;
    line-height: 1.6;
}
/* Plain (un-highlighted) streaming fences use text color; .hljs leaves color to the theme */
.prose-spark pre code {
    background: none;
    padding: 0;
    border-radius: 0;
    font-size: inherit;
}
.prose-spark pre code:not(.hljs) {
    color: #e6edf3;
}
.prose-spark code {
    font-size: 0.875rem;
    font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, monospace;
}
.prose-spark :not(pre) > code {
    background: #eaeff1;
    padding: 0.15rem 0.4rem;
    border-radius: 0.25rem;
    font-size: 0.85em;
}

.dark .prose-spark pre { background: #0d1117; }
.dark .prose-spark a { color: #ff8a50; }
.dark .prose-spark :not(pre) > code { background: #333333; color: #e0e0e0; }
.dark .prose-spark blockquote { color: #a0a0a0; border-left-color: #ff8a50; }
.dark .prose-spark hr { border-color: #333333; }
.dark .prose-spark th { border-bottom-color: #3a3a3a; }
.dark .prose-spark td { border-bottom-color: #2c2c2c; }

/* Source badges */
.source-badge {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 4px;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.4;
    background: #eaeff1;
    color: #586064;
}
.dark .source-badge {
    background: #333333;
    color: #a0a0a0;
}
