/* Archived conversations: a calm transcript, not a miniature notebook.
   Kept separate from live-chat skins so saved custom CSS is untouched. */
.archive-reader-heading[hidden],
.archive-page-controls[hidden] { display:none !important; }

#page-chat.archive-reader {
    --archive-paper:#fcfcfa;
    --archive-user-paper:#f2f2ee;
    --archive-ink:#282826;
    --archive-muted:#71716c;
    --archive-soft:#f1f1ed;
    --archive-rule:#e6e6e0;
    --archive-font:var(--font-sans, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    color:var(--archive-ink);
    background:var(--archive-paper);
}
[data-theme="dark"] #page-chat.archive-reader {
    --archive-paper:#171817;
    --archive-user-paper:#111310;
    --archive-ink:#edede9;
    --archive-muted:#a2a49d;
    --archive-soft:#222421;
    --archive-rule:#30322d;
}
#page-chat.archive-reader :is(#chat-bg-layer,.chat-compose-stack,.chat-identity-btn,#btn-chat-model,.chat-conversation-caption) { display:none !important; }

#page-chat.archive-reader > .topbar {
    position:relative !important;
    inset:auto !important;
    flex:0 0 auto;
    display:grid !important;
    grid-template-columns:40px minmax(0,1fr) 40px;
    gap:14px;
    align-items:center;
    width:100%;
    height:auto !important;
    min-height:calc(76px + env(safe-area-inset-top,0px));
    padding:calc(12px + env(safe-area-inset-top,0px)) max(18px,env(safe-area-inset-right,0px)) 12px max(18px,env(safe-area-inset-left,0px)) !important;
    background:var(--archive-paper) !important;
    border:0;
    border-bottom:1px solid var(--archive-rule) !important;
    border-radius:0;
    box-shadow:none;
    filter:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
#page-chat.archive-reader :is(.chat-topbar-leading,.chat-topbar-actions) {
    position:static !important;
    inset:auto !important;
    grid-row:1;
    align-self:center;
    margin:0;
    padding:0;
    width:40px;
    height:40px;
    gap:0;
    background:transparent !important;
    border:0 !important;
    border-radius:0;
    box-shadow:none !important;
    filter:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
    overflow:visible;
}
#page-chat.archive-reader .chat-topbar-leading { grid-column:1; }
#page-chat.archive-reader .chat-topbar-actions { grid-column:3; }
#page-chat.archive-reader .topbar-btn,
#page-chat.archive-reader #btn-chat-search {
    width:40px !important;
    height:40px !important;
    min-width:40px;
    padding:0 !important;
    color:var(--archive-ink) !important;
    background:var(--archive-soft) !important;
    border:0 !important;
    border-radius:12px !important;
    box-shadow:none !important;
    filter:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
}
#page-chat.archive-reader .archive-reader-heading {
    position:static;
    grid-column:2;
    grid-row:1;
    width:100%;
    min-width:0;
    transform:none;
    color:var(--archive-ink);
    text-align:left;
}
#page-chat.archive-reader .archive-reader-heading strong {
    display:block;
    overflow:hidden;
    font:600 16px/1.5 var(--archive-font);
    white-space:nowrap;
    text-overflow:ellipsis;
}
#page-chat.archive-reader .archive-reader-heading time {
    display:block;
    margin-top:2px;
    color:var(--archive-muted);
    font:11px/1.5 var(--archive-font);
}

#page-chat.archive-reader .chat-messages,
#page-chat.archive-reader.search-open .chat-messages {
    display:block;
    flex:1 1 0;
    min-height:0;
    width:100%;
    margin:0;
    padding:22px max(18px,calc((100% - 740px) / 2)) 28px !important;
    color:var(--archive-ink);
    background:var(--archive-paper) !important;
    border:0;
    border-radius:0;
    box-shadow:none;
    filter:none;
    overflow-x:hidden;
    overflow-y:auto;
    overscroll-behavior:contain;
    scroll-padding-block:22px;
    scroll-behavior:auto;
    animation:none;
    transition:none;
}
#page-chat.archive-reader .chat-messages:focus { outline:none; }
#page-chat.archive-reader .chat-messages:focus-visible { outline:1px solid var(--archive-rule); outline-offset:-1px; }
#page-chat.archive-reader .chat-messages::before,
#page-chat.archive-reader .chat-messages::after,
#page-chat.archive-reader .msg-row::before { content:none !important; }
#page-chat.archive-reader .archive-page-caption {
    margin-bottom:26px;
    color:var(--archive-muted);
    font:12px/1.5 var(--archive-font);
    text-align:center;
}
#page-chat.archive-reader .msg-row,
#page-chat.archive-reader .msg-row.user,
#page-chat.archive-reader .msg-row.ai {
    display:block;
    width:100%;
    min-width:0;
    margin:0 0 28px !important;
    padding:0 !important;
    border:0;
}
#page-chat.archive-reader .msg-row.archive-continuation { margin-top:-16px !important; }
#page-chat.archive-reader :is(.msg-avatar,.mention-chip) { display:none !important; }
#page-chat.archive-reader .msg-body,
#page-chat.archive-reader .msg-row.ai .msg-body,
#page-chat.archive-reader .msg-row.user .msg-body {
    display:block;
    width:100%;
    max-width:none !important;
    min-width:0;
}
/* A subtle tone separates user content within the transcript. */
#page-chat.archive-reader .msg-row.user .msg-body {
    box-sizing:border-box;
    padding:12px 16px;
    border-radius:8px;
    background:var(--archive-user-paper);
}
#page-chat.archive-reader .archive-message-meta {
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:16px;
    margin-bottom:7px;
    color:var(--archive-muted);
    font:13px/1.6 var(--archive-font);
}
#page-chat.archive-reader .archive-message-meta strong { font-weight:600; overflow-wrap:anywhere; }
#page-chat.archive-reader .bubble,
#page-chat.archive-reader .msg-row.ai .bubble,
#page-chat.archive-reader .msg-row.user .bubble {
    display:block;
    width:100%;
    max-width:100%;
    margin:0 !important;
    padding:0 !important;
    color:var(--archive-ink) !important;
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    filter:none !important;
    font-family:var(--archive-font) !important;
    font-size:calc(var(--font-size,14px) + 2px) !important;
    line-height:1.8 !important;
    text-decoration:none;
    overflow-wrap:anywhere;
}
#page-chat.archive-reader :is(.bubble,.voice-bubble)::before,
#page-chat.archive-reader :is(.bubble,.voice-bubble)::after { display:none !important; }
#page-chat.archive-reader .bubble-time {
    display:inline-block;
    flex:0 0 auto;
    margin:0 !important;
    padding:0 !important;
    color:var(--archive-muted) !important;
    font:11px/1.6 var(--archive-font) !important;
    white-space:nowrap;
}
#page-chat.archive-reader .voice-bubble {
    width:fit-content;
    max-width:100%;
    color:var(--archive-ink) !important;
    background:var(--archive-soft) !important;
    border:0 !important;
    border-radius:12px !important;
    box-shadow:none !important;
    filter:none !important;
}
#page-chat.archive-reader .bubble-quote { margin:0 0 10px; background:var(--archive-soft) !important; color:var(--archive-muted) !important; }
#page-chat.archive-reader .bubble.markdown-body :is(pre,code) { background:var(--archive-soft) !important; }
#page-chat.archive-reader .bubble.markdown-body pre { max-width:100%; overflow-x:auto; white-space:pre; overflow-wrap:normal; }
#page-chat.archive-reader .bubble.markdown-body blockquote { color:var(--archive-muted); border-color:var(--archive-rule); }
#page-chat.archive-reader .bubble :is(img,video) { max-width:100%; height:auto; }
#page-chat.archive-reader .archive-empty-page { margin:48px 0; color:var(--archive-muted); font:14px/1.8 var(--archive-font); text-align:center; }

#page-chat.archive-reader .archive-page-controls {
    flex:0 0 auto;
    display:grid;
    grid-template-columns:1fr auto 1fr;
    align-items:center;
    gap:10px;
    width:100%;
    min-height:calc(61px + env(safe-area-inset-bottom,0px));
    margin:0;
    padding:8px 18px calc(8px + env(safe-area-inset-bottom,0px));
    color:var(--archive-ink);
    background:var(--archive-paper);
    border-top:1px solid var(--archive-rule);
}
#page-chat.archive-reader .archive-page-controls button {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    justify-self:start;
    gap:4px;
    min-height:44px;
    min-width:44px;
    padding:0 8px;
    color:var(--archive-muted);
    background:transparent;
    border:0;
    border-radius:10px;
    font:13px/1.5 var(--archive-font);
}
#page-chat.archive-reader .archive-page-controls button:last-child { justify-self:end; }
#page-chat.archive-reader .archive-page-controls button svg { width:18px; height:18px; }
#page-chat.archive-reader .archive-page-controls button:disabled { opacity:.3; cursor:default; }
#page-chat.archive-reader .archive-page-controls button:not(:disabled):active { background:var(--archive-soft); }
#page-chat.archive-reader .archive-folio { display:flex; align-items:center; gap:8px; color:var(--archive-muted); font:13px/1.5 var(--archive-font); }
#page-chat.archive-reader #archive-page-input {
    width:48px;
    height:40px;
    padding:0 4px;
    color:var(--archive-ink);
    background:var(--archive-soft);
    border:1px solid transparent;
    border-radius:9px;
    outline:none;
    font:16px/1.5 var(--archive-font);
    text-align:center;
    appearance:textfield;
    -moz-appearance:textfield;
}
#page-chat.archive-reader #archive-page-input:focus { border-color:var(--archive-muted); }
#archive-page-input::-webkit-inner-spin-button,
#archive-page-input::-webkit-outer-spin-button { -webkit-appearance:none; margin:0; }
.archive-page-announcement { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }

#page-chat.archive-reader .chat-search-bar {
    position:relative;
    inset:auto;
    margin:10px auto 0;
    background:var(--archive-paper);
    border-color:var(--archive-rule);
    box-shadow:none;
    filter:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}
#page-chat.archive-reader .chat-search-bar input { color:var(--archive-ink); background:var(--archive-soft); border-color:var(--archive-rule); font-size:16px; }
#page-chat.archive-reader :is(.chat-search-nav,#chat-search-count,.chat-search-nav button,.chat-search-close) { color:var(--archive-muted); }
@media(max-width:350px) {
    #page-chat.archive-reader > .topbar { gap:10px; }
    #page-chat.archive-reader .archive-page-controls button span { display:none; }
}
