:root {
    --ic-ink: #16372e;
    --ic-paper: #f5f3eb;
    --ic-line: #d7ddd3;
    --ic-accent: #c7663d;
    --bs-body-color: var(--ic-ink);
    --bs-body-font-family: "Trebuchet MS", "Gill Sans", sans-serif;
    --bs-secondary-color: #616e65;
    --bs-border-color: var(--ic-line);
}

body {
    min-height: 100vh;
    background: radial-gradient(ellipse at 88% 12%, #dce7d6 0, transparent 45%), var(--ic-paper);
}

.site-header { padding: 1.7rem 0; border-bottom: 1px solid var(--ic-line); }
.brand { display: inline-flex; align-items: center; gap: .6rem; color: var(--ic-ink); text-decoration: none; font-size: 1.4rem; font-weight: 700; letter-spacing: -.04em; }
.brand-period { color: var(--ic-accent); margin-left: -.5rem; }
.page-content { padding-top: 4.5rem; padding-bottom: 4rem; }
.workspace-intro { animation: arrive .45s ease-out both; }
.eyebrow, .card-kicker, .count-label { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; font-weight: 700; }
.eyebrow { display: flex; align-items: center; gap: .7rem; margin-bottom: 1.6rem; }
.status-dot { display: inline-block; height: .55rem; width: .55rem; background: var(--ic-accent); border-radius: 50%; }
h1 { font-size: clamp(2.6rem, 4.8vw, 4.8rem); line-height: 1.08; letter-spacing: -.055em; font-weight: 700; max-width: 14ch; }
h1 em { color: #4e6d57; font-family: Georgia, "Times New Roman", serif; font-weight: 400; }
.intro-copy { line-height: 1.7; margin-top: 1.8rem; font-size: 1.05rem; }
.intro-rule { width: 3rem; height: 2px; background: var(--ic-accent); margin: 2rem 0 1rem; }
.card { border-radius: 1.2rem; border-color: var(--ic-line); }
.create-card { background: #fffefa; box-shadow: 0 20px 50px #17382e0c; }
.card-kicker { color: #616e65; }
.form-control { border-radius: .65rem; border-color: #b8c5b8; background-color: #fffefa; font-size: 1rem; }
.form-control:focus { border-color: #466c51; box-shadow: 0 0 0 .2rem #466c5126; }
.btn { border-radius: .65rem; }
.btn-dark { --bs-btn-bg: var(--ic-ink); --bs-btn-border-color: var(--ic-ink); --bs-btn-hover-bg: #285543; --bs-btn-hover-border-color: #285543; }
.btn-dark span { margin-left: .5rem; }
.conversations-section { margin-top: 4.5rem; padding-top: 2rem; border-top: 1px solid var(--ic-line); animation: arrive .55s .08s ease-out both; }
.empty-state { text-align: center; border: 1px dashed #bdc9ba; padding: 2.5rem 1rem; border-radius: 1rem; }
.empty-symbol { display: inline-grid; place-items: center; border: 1px solid #bdc9ba; border-radius: 50%; width: 2.6rem; height: 2.6rem; margin-bottom: 1rem; font-size: 1.5rem; }
.conversation-card { background: #fffefa; }
.conversation-title { overflow-wrap: anywhere; }
.site-footer { display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; font-size: .8rem; color: #616e65; padding-top: 1.5rem; padding-bottom: 2rem; border-top: 1px solid var(--ic-line); }
.modal-content { border-radius: 1.2rem; background: #fffefa; }
.error-panel { padding: 3rem 0; }
.account-panel { max-width: 32rem; margin-inline: auto; }
.account-panel h1 { font-size: clamp(2.5rem, 4vw, 3.5rem); max-width: 20ch; }
.error-panel h1 { max-width: 20ch; margin-bottom: 1.5rem; }
.skip-link { position: absolute; top: -4rem; left: 1rem; z-index: 1100; background: #fff; padding: .6rem; }
.skip-link:focus { top: .5rem; }
.document-workspace h1 { font-size: clamp(2.5rem, 4vw, 3.7rem); max-width: 24ch; }
.document-name { overflow-wrap: anywhere; }
.project-tabs { display: flex; gap: .6rem; flex-wrap: wrap; }
.document-search { max-width: 34rem; }
.document-table-wrap { border: 1px solid var(--ic-line); border-radius: 1rem; background: #fffefa; }
.document-table { --bs-table-bg: transparent; min-width: 820px; font-size: .9rem; }
.document-table th, .document-table td { padding: 1rem; }
.document-table thead { background: #e8eee3; }
.document-table th:first-child { width: 22%; }
.document-preview { min-width: 14rem; max-width: 24rem; overflow-wrap: anywhere; white-space: pre-line; }
.document-danger { padding: 1.5rem; border: 1px solid #d5afa0; border-radius: 1rem; background: #fff5ef; }
.document-text { padding: 1.5rem; border: 1px solid var(--ic-line); border-radius: 1rem; background: #fffefa; white-space: pre-wrap; overflow-wrap: anywhere; font-size: .9rem; max-height: 70vh; overflow: auto; }
@keyframes arrive { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (max-width: 575.98px) {
    .page-content { padding-top: 2.5rem; }
    .site-header { padding: 1.1rem 0; }
    .conversations-section { margin-top: 2.5rem; }
    h1 { font-size: 2.75rem; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
}
