:root {
    color-scheme: dark;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: #0F0E11;
    color: #F1EBE5;
}

* {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
    margin: 0;
}

body {
    background: #0F0E11;
    color: #F1EBE5;
}

.microculture-shell {
    min-height: 100vh;
    padding: clamp(0.75rem, 2vw, 1.5rem);
    background: #0F0E11;
    color: #F1EBE5;
}

.private-invitation,
.private-state,
.private-relationship {
    width: min(76rem, 100%);
    margin: 0 auto;
}

.private-invitation,
.private-state {
    display: grid;
    min-height: calc(100vh - 8rem);
    align-content: center;
    gap: 1rem;
    max-width: 42rem;
}

.private-kicker {
    margin: 0;
    color: var(--chat-primary, #725775);
    font-size: 0.72rem;
    font-weight: 780;
    letter-spacing: 0.16em;
    text-transform: uppercase;
}

.private-invitation h1,
.private-state h1,
.private-relationship h1,
.private-evidence-contract h2 {
    margin: 0;
    color: #2b202c;
    font-family: Georgia, "Times New Roman", serif;
    font-weight: 500;
    letter-spacing: -0.055em;
    line-height: 0.94;
}

.private-invitation h1,
.private-state h1,
.private-relationship h1 {
    font-size: clamp(2.65rem, 7vw, 5.75rem);
}

.private-invitation p:not(.private-kicker),
.private-state p:not(.private-kicker),
.private-description {
    max-width: 60ch;
    margin: 0;
    color: #665965;
    font-size: 1.05rem;
    line-height: 1.7;
}

.private-relationship {
    display: grid;
    gap: clamp(1.5rem, 3vw, 2.5rem);
    padding-block: clamp(0.5rem, 2vw, 2rem);
    font-family: var(--chat-font, Inter, ui-sans-serif, system-ui, sans-serif);
}

.private-relationship-header {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 1.5rem;
    padding-bottom: 1.35rem;
    border-bottom: 1px solid color-mix(in srgb, var(--chat-input-border, #b8aaa0) 65%, transparent);
}

.private-relationship-title {
    display: grid;
    gap: 0.7rem;
    max-width: 48rem;
}

.private-relationship-header h1 {
    color: var(--chat-assistant-text, #2b202c);
    font-size: clamp(2.7rem, 7vw, 5.5rem);
}

.private-description {
    color: color-mix(in srgb, var(--chat-assistant-text, #665965) 70%, #6d6159);
}

.private-thread-status {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    flex: 0 0 auto;
    margin: 0;
    color: color-mix(in srgb, var(--chat-assistant-text, #443b42) 78%, #796b62);
    font-size: 0.8rem;
    letter-spacing: 0.04em;
}

.private-thread-status span:first-child {
    color: var(--chat-primary, #725775);
    font-size: 0.7rem;
    font-weight: 780;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.private-thread-status span + span::before {
    content: "•";
    margin-right: 0.65rem;
    color: var(--chat-primary, #725775);
}

.private-relationship-workspace {
    display: grid;
    grid-template-columns: minmax(13rem, 0.32fr) minmax(0, 1fr);
    align-items: stretch;
    gap: clamp(1rem, 2vw, 1.6rem);
}

.private-evidence-contract {
    display: grid;
    align-content: start;
    gap: 1rem;
    padding: clamp(1.2rem, 2.4vw, 2rem);
    border: 1px solid color-mix(in srgb, var(--chat-input-border, #b8aaa0) 65%, transparent);
    border-radius: var(--chat-radius, 1.1rem);
    background:
        linear-gradient(155deg, color-mix(in srgb, var(--chat-assistant-bg, #fffdf8) 92%, white), var(--chat-bg, #f3efe7));
    color: var(--chat-assistant-text, #29231f);
    box-shadow: 0 1rem 2.5rem color-mix(in srgb, var(--chat-primary, #725775) 9%, transparent);
}

.private-evidence-contract h2 {
    color: inherit;
    font-size: clamp(1.65rem, 2.3vw, 2.3rem);
    line-height: 1;
}

.private-evidence-contract > p:not(.private-kicker) {
    margin: 0;
    color: color-mix(in srgb, var(--chat-assistant-text, #29231f) 74%, #6e625a);
    font-size: 0.95rem;
    line-height: 1.55;
}

.private-evidence-list {
    display: grid;
    gap: 0.65rem;
    margin: 0.35rem 0 0;
}

.private-evidence-list div {
    display: grid;
    gap: 0.2rem;
    padding-top: 0.65rem;
    border-top: 1px solid color-mix(in srgb, var(--chat-input-border, #b8aaa0) 55%, transparent);
}

.private-evidence-list dt {
    color: var(--chat-primary, #725775);
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.private-evidence-list dd {
    margin: 0;
    color: color-mix(in srgb, var(--chat-assistant-text, #29231f) 78%, #74685e);
    font-size: 0.84rem;
    line-height: 1.45;
}

.private-conversation {
    display: flex;
    flex-direction: column;
    min-height: min(46rem, 72vh);
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--chat-input-border, #b8aaa0) 70%, transparent);
    border-radius: var(--chat-radius, 1.1rem);
    background: var(--chat-bg, #f3efe7);
    box-shadow: 0 1.25rem 4rem color-mix(in srgb, var(--chat-primary, #725775) 12%, transparent);
}

.private-conversation-topline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex: 0 0 auto;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid color-mix(in srgb, var(--chat-input-border, #b8aaa0) 62%, transparent);
    background: color-mix(in srgb, var(--chat-assistant-bg, #fffdf8) 88%, white);
    color: var(--chat-primary, #725775);
    font-family: Inter, ui-sans-serif, system-ui, sans-serif;
    font-size: 0.68rem;
    font-weight: 800;
    letter-spacing: 0.13em;
    text-transform: uppercase;
}

.private-conversation .chat-window {
    flex: 1;
    min-height: 0;
    background: var(--chat-bg, #f3efe7);
}

.private-conversation .chat-window-body {
    background: var(--chat-bg, #f3efe7);
}

.private-conversation .chat-empty,
.private-conversation .chat-loading {
    color: color-mix(in srgb, var(--chat-assistant-text, #29231f) 64%, #8b7f73);
    font-family: var(--chat-font, Inter, ui-sans-serif, system-ui, sans-serif);
}

.private-conversation .chat-empty {
    padding: var(--chat-content-padding, clamp(1.5rem, 3vw, 3rem));
    text-align: center;
}

.private-conversation .chat-messages {
    padding: var(--chat-content-padding, clamp(1rem, 2vw, 2rem));
}

.private-conversation .assistant-message .message-bubble {
    padding: 0.85rem 1rem;
    border: 1px solid color-mix(in srgb, var(--chat-input-border, #b8aaa0) 55%, transparent);
    border-radius: var(--chat-radius, 1.1rem);
    background: var(--chat-assistant-bg, #fffdf8);
}

.private-conversation .assistant-message .message-content {
    padding-right: 0;
}

.private-conversation .user-message .message-bubble {
    border-color: color-mix(in srgb, var(--chat-input-border, #b8aaa0) 78%, transparent);
    border-radius: var(--chat-radius, 1.1rem);
}

.private-conversation .user-message .message-content,
.private-conversation .user-message .message-content p {
    color: var(--chat-user-text, #fffdf8);
}

.private-conversation .assistant-message .message-content,
.private-conversation .assistant-message .message-content p {
    color: var(--chat-assistant-text, #29231f);
}

.private-conversation .assistant-message .message-avatar,
.private-conversation .user-message .message-avatar {
    background: var(--chat-primary, #725775);
    color: var(--chat-send-text, #fffdf8);
}

.private-conversation .chat-window-footer {
    border-top: 1px solid color-mix(in srgb, var(--chat-input-border, #b8aaa0) 62%, transparent);
    background: var(--chat-input-bg, #fffdf8);
}

.private-conversation .input-icon-button.send-button:disabled {
    background-color: color-mix(in srgb, var(--chat-primary, #725775) 52%, var(--chat-input-bg, #fffdf8));
    color: var(--chat-send-text, #fffdf8);
    opacity: 0.78;
}

.private-conversation .message-input {
    background: var(--chat-input-bg, #fffdf8);
    color: var(--chat-assistant-text, #29231f);
    border-radius: var(--chat-radius, 0.8rem);
}

.private-relationship :is(a, button, textarea):focus-visible {
    outline: 3px solid color-mix(in srgb, var(--chat-primary, #725775) 38%, white);
    outline-offset: 3px;
}

@media (max-width: 840px) {
    .private-relationship-workspace {
        grid-template-columns: 1fr;
    }

    .private-evidence-contract {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr);
        column-gap: 1.4rem;
    }

    .private-evidence-contract .private-kicker,
    .private-evidence-contract h2 {
        grid-column: 1;
    }

    .private-evidence-contract > p:not(.private-kicker),
    .private-evidence-list {
        grid-column: 2;
    }

    .private-evidence-list {
        margin-top: 0;
    }
}

@media (max-width: 640px) {
    .microculture-shell {
        padding: 1rem;
    }

    .private-relationship {
        gap: 1.25rem;
        padding-block: 0.35rem;
    }

    .private-relationship-header {
        display: grid;
        gap: 1rem;
        align-items: start;
        padding-bottom: 1.1rem;
    }

    .private-thread-status {
        justify-self: start;
    }

    .private-evidence-contract {
        grid-template-columns: 1fr;
        gap: 0.85rem;
    }

    .private-evidence-contract .private-kicker,
    .private-evidence-contract h2,
    .private-evidence-contract > p:not(.private-kicker),
    .private-evidence-list {
        grid-column: auto;
    }

    .private-evidence-contract h2 {
        font-size: 1.7rem;
    }

    .private-conversation {
        order: 1;
    }

    .private-evidence-contract {
        order: 2;
    }

    .private-conversation {
        min-height: 34rem;
    }

    /* Interlocute's standalone mobile shell makes these elements viewport-fixed. The shared
       private surface nests the chat inside title context, so keep that behavior local. */
    .private-conversation .chat-window {
        position: relative;
        inset: auto;
        height: 34rem;
        min-height: 0;
        overflow: hidden;
    }

    .private-conversation .chat-window-body {
        min-height: 0;
    }

    .private-conversation .chat-window-footer {
        position: static;
        padding: 0.75rem;
    }

    .private-conversation .chat-empty {
        flex: 1;
    }
}