/* Keep all empty-chat elements in the same workspace coordinate system. */
#main .input-area{flex-direction:column;align-items:center;gap:12px;padding:16px max(20px,env(safe-area-inset-left)) max(20px,env(safe-area-inset-bottom))}
#main.welcome-active .input-area{transform:none}
/* Give prompts the composer's full track so compact buttons start at its edge. */
#main .input-wrapper,#main .moh-new-chat-suggestions{width:100%;max-width:760px;margin:0 auto}
#main.welcome-active .chat-area{padding:24px 20px calc(var(--welcome-composer-height,230px) + 24px)}
#main .welcome{margin:0;padding:0;max-width:100%}
#main .welcome-title-anchor{display:flex;flex-direction:column;align-items:center;gap:18px;position:relative}
#main .welcome-title{font:500 clamp(22px,3vw,28px)/1.3 system-ui;margin:0;letter-spacing:-.4px;color:var(--text-light)}
#main .welcome-crescent-link{position:static;transform:none;padding:4px;line-height:0}
#main .welcome-calligraphy{width:50px;height:50px}
#main .welcome-subtitle{font:400 16px/1.4 system-ui;margin:20px 0 0;color:var(--text-light);opacity:.75}
.moh-glossy-upgrade{width:fit-content;max-width:100%;min-height:46px;box-sizing:border-box;background:var(--bg-secondary,#222);color:var(--text,#fff);border:1px solid var(--border,#555);box-shadow:inset 0 1px #ffffff20,0 4px 14px #0000000d;gap:10px;padding:11px 18px;line-height:1.35;text-wrap:balance}
.moh-glossy-upgrade span{flex:initial}.new-chat-upgrade{margin:0 auto}.sidebar-upgrade{width:fit-content;max-width:calc(100% - 36px)}
.moh-new-chat-suggestions{display:none;flex-direction:column;gap:6px;align-items:flex-start}
.welcome-active .moh-new-chat-suggestions{display:flex}
/* Match the mobile suggestions: plain icon/text rows, without outlined cards. */
.moh-new-chat-suggestions button{display:flex;align-items:center;gap:8px;min-height:44px;padding:9px 13px;width:100%;max-width:440px;justify-content:flex-start;appearance:none;background:transparent;border:0;border-radius:0;box-shadow:none;color:var(--text-light);font:500 14px/1.35 system-ui;text-align:start;cursor:pointer}
.moh-new-chat-suggestions button>span:first-child{flex:none;font-size:20px;color:#6faabd}
.moh-new-chat-suggestions button>span:last-child{min-width:0;overflow-wrap:anywhere}
.moh-new-chat-suggestions button:hover{color:var(--text,var(--text-light))}
.moh-new-chat-suggestions button:focus-visible,.moh-glossy-upgrade:focus-visible{outline:2px solid currentColor;outline-offset:3px}
.moh-welcome-progress{display:flex;flex:none;gap:6px;height:3px;transition:opacity .3s ease}
.moh-welcome-progress span{flex:1;border-radius:99px;background:#ffffff38;transition:background .35s ease}
.moh-welcome-progress span.complete{background:#fffffff0}
/* visibility preserves the closing transition without leaving an interactive backdrop. */
.trial-offer-backdrop{display:flex;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .24s ease,visibility 0s .24s}
.trial-offer-backdrop.open{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .24s ease}
.trial-offer-modal{transform:translateY(22px) scale(.97);transition:transform .4s cubic-bezier(.18,.8,.25,1);max-height:calc(100dvh - 40px);overflow-y:auto}
.trial-offer-backdrop.open .trial-offer-modal{transform:none}
@media(max-width:600px){#main .input-area{padding:12px 14px max(12px,env(safe-area-inset-bottom));gap:10px}.moh-new-chat-suggestions{gap:4px}.moh-new-chat-suggestions button{font-size:13px;padding:8px 10px}#main .welcome-subtitle{display:none}}
@media(prefers-reduced-motion:reduce){.trial-offer-backdrop,.trial-offer-modal,.moh-welcome-progress,.moh-welcome-progress span{transition:none;transform:none}}

.stream-progress{display:flex;gap:12px;align-items:flex-start;padding:8px 0;color:var(--text-light);font:400 14px/1.5 system-ui}.stream-progress strong{font-weight:600}.stream-progress p{border-inline-start:2px solid #9d77d877;padding-inline-start:12px;margin:8px 0 0;white-space:pre-wrap;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.stream-progress p[hidden]{display:none}.stream-spinner{flex:none;width:22px;height:22px;margin-top:1px;color:var(--text-light,#aaa);background:radial-gradient(circle at 50.0% 14.0%,color-mix(in srgb,currentColor 30%,transparent) 2.1px,transparent 2.6px),radial-gradient(circle at 75.5% 24.5%,color-mix(in srgb,currentColor 40%,transparent) 2.1px,transparent 2.6px),radial-gradient(circle at 86.0% 50.0%,color-mix(in srgb,currentColor 50%,transparent) 2.1px,transparent 2.6px),radial-gradient(circle at 75.5% 75.5%,color-mix(in srgb,currentColor 60%,transparent) 2.1px,transparent 2.6px),radial-gradient(circle at 50.0% 86.0%,color-mix(in srgb,currentColor 70%,transparent) 2.1px,transparent 2.6px),radial-gradient(circle at 24.5% 75.5%,color-mix(in srgb,currentColor 80%,transparent) 2.1px,transparent 2.6px),radial-gradient(circle at 14.0% 50.0%,color-mix(in srgb,currentColor 90%,transparent) 2.1px,transparent 2.6px),radial-gradient(circle at 24.5% 24.5%,color-mix(in srgb,currentColor 100%,transparent) 2.1px,transparent 2.6px);animation:stream-rotate 2.667s linear infinite}.has-stream-progress>.typing-indicator,.has-stream-progress>.typing-dots{display:none}@keyframes stream-rotate{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.stream-spinner{animation:none}}

#main.welcome-active #modelNote{display:none}

@media(max-width:600px){.welcome-active .moh-new-chat-suggestions{display:flex}.moh-new-chat-suggestions button{justify-content:flex-start;text-align:start;min-width:0;line-height:1.3}}
.moh-new-chat-suggestions svg{height:20px;width:20px;flex:none;color:#6faabd}

/* Transcript changes never translate or blur existing words. */
#messages .message{animation:none;opacity:1;transform:none}
#messages .message.typing-swap .message-content,#messages .message.typing-swap .message-actions{animation:none;opacity:1;transform:none;filter:none}
.stream-progress[hidden]{display:none}
.stream-preview>.message-text-content>:first-child{margin-top:0}
#main .chat-area:not(.has-welcome) #messages{margin-top:0}
#main .chat-area:not(.has-welcome) .chat-container{min-height:0}
#main .chat-area{scroll-behavior:auto}

/* Only the ink changes opacity. Words retain their exact formatted footprint. */
.reply-ink-word { transition: opacity 100ms linear; }
.source-activity { margin-top: 14px; font-size: 13px; color: var(--text-secondary, #888); }
.source-activity summary { cursor: pointer; padding: 5px 0; width: fit-content; }
.source-activity-list { display: grid; gap: 6px; max-height: 240px; overflow: auto; margin-top: 8px; }
.source-activity-list a { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid rgba(128,128,128,.22); border-radius: 10px; color: inherit; text-decoration: none; }
.source-activity-list strong { display: block; font-weight: 500; color: var(--text-primary, inherit); }
.source-activity-list small { display: block; margin-top: 2px; opacity: .75; }
.source-site-icon { position: relative; display: grid; place-items: center; width: 22px; height: 22px; flex: 0 0 22px; border-radius: 5px; background: rgba(128,128,128,.12); }
.source-site-icon img { position: absolute; background: var(--bg-primary, #fff); border-radius: 3px; }
@media (prefers-reduced-motion: reduce) { .reply-ink-word { transition: none; } }
.source-activity-strip { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; font-size: 12px; opacity: .8; }
.stream-progress > div { min-width: 0; flex: 1; }
.stream-progress strong { display:block; min-width:0; height:21px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
/* Public summaries belong in the Thinking sheet. The live preview stays one
   actual search heading and two sites, without a second raw Markdown block. */
.stream-progress > div > p { display:none; }
#typingInline .message-content { min-height: 130px; }
.source-activity-live { display: flex; flex-wrap: nowrap; gap: 7px; height: 36px; overflow: hidden; margin-top: 6px; padding-inline-start: 10px; border-inline-start: 2px solid #9d77d866; }
.source-activity-live::-webkit-scrollbar { display: none; }
#messages .source-domain-chip { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; min-height: 28px; padding: 3px 9px 3px 5px; border: 1px solid rgba(128,128,128,.24); border-radius: 999px; color: var(--text-secondary, #888); text-decoration: none; font: 500 13px/1.35 system-ui; }
.source-domain-chip:hover, .source-domain-chip:focus-visible { border-color: currentColor; }
.source-domain-chip bdi { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#messages .source-activity-live .source-domain-chip { flex: 0 1 auto; min-width: 0; max-width: calc((100% - 7px) / 2); box-sizing: border-box; }
.research-topic-character { animation: research-topic-reveal 80ms ease-out both; }
@keyframes research-topic-reveal { from { opacity: .35; clip-path: inset(0 100% 0 0); } to { opacity: 1; clip-path: inset(0 0 0 0); } }
[dir=rtl] .research-live-trigger strong, .research-live-trigger strong:dir(rtl) { animation-name: research-topic-reveal-rtl; }
@keyframes research-topic-reveal-rtl { from { opacity: .35; clip-path: inset(0 0 0 100%); } to { opacity: 1; clip-path: inset(0 0 0 0); } }
@media(prefers-reduced-motion:reduce){.research-topic-character{animation:none}}
.source-domain-chip .source-site-icon { flex: none; width: 18px; height: 18px; border-radius: 50%; font-size: 11px; }
.research-live-trigger,.research-thinking-entry,.research-sources-entry { appearance:none; border:0; background:none; color:var(--text-light,#aaa); font:600 14px/1.5 system-ui; cursor:pointer; padding:0; text-align:start; }
.research-live-trigger { display:inline-flex; align-items:center; gap:8px; width:fit-content; max-width:100%; min-height:24px; vertical-align:top; }
.research-live-trigger strong::after { content:none; }
.research-live-chevron { flex:none; width:7px; height:7px; border-inline-end:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg); margin:0 2px 4px; transition:opacity 100ms linear; }
[dir=rtl] .research-live-chevron { transform:rotate(-45deg); }
.research-thinking-entry { display:block; min-height:38px; margin:0 0 12px; }
.research-thinking-entry::before { content:'◌'; color:#a36be8; font-size:22px; margin-inline-end:9px; vertical-align:-2px; }
.research-sources-entry { border:1px solid rgba(128,128,128,.24); border-radius:999px; padding:6px 13px; min-height:34px; }
.research-sheet { box-sizing:border-box; position:fixed; inset:auto 0 8px; margin:0 auto; width:min(640px,calc(100% - 16px)); height:min(76dvh,760px); max-height:calc(100dvh - 24px); padding:0; overflow:hidden; border:1px solid #ffffff26; border-radius:28px; color:#eee; background:#18181b; box-shadow:0 24px 90px #0008; }
.research-sheet::backdrop { background:#0005; }
.research-sheet[open] { display:flex; flex-direction:column; animation:research-sheet-enter 230ms cubic-bezier(.2,.75,.25,1); }
.research-sheet[open]::backdrop { animation:research-backdrop-enter 230ms ease-out; }
.research-sheet.is-closing { animation:research-sheet-exit 160ms ease-in forwards; pointer-events:none; }
.research-sheet.is-closing::backdrop { animation:research-backdrop-exit 160ms ease-in forwards; }
@keyframes research-sheet-enter { from { opacity:0; transform:translateY(22px); } to { opacity:1; transform:translateY(0); } }
@keyframes research-sheet-exit { from { opacity:1; transform:translateY(var(--research-close-offset,0px)); } to { opacity:0; transform:translateY(calc(var(--research-close-offset,0px) + 20px)); } }
@keyframes research-backdrop-enter { from { background:#0000; } to { background:#0005; } }
@keyframes research-backdrop-exit { from { background:#0005; } to { background:#0000; } }
@media(prefers-reduced-motion:reduce){.research-sheet[open],.research-sheet[open]::backdrop,.research-sheet.is-closing,.research-sheet.is-closing::backdrop{animation:none}}
.research-sheet-header { flex:none; position:relative; padding:12px 20px 16px; touch-action:none; }
.research-sheet-grab { width:42px; height:5px; border-radius:9px; background:#8888; margin:0 auto 25px; }
.research-sheet-close { position:absolute; top:12px; inset-inline-end:14px; width:30px; height:30px; border:0; border-radius:50%; background:#80808020; color:inherit; font:24px/1 system-ui; cursor:pointer; }
.research-sheet-tabs { display:flex; background:#80808018; border-radius:999px; padding:4px; gap:4px; }
.research-sheet-tabs button { flex:1; min-width:0; border:0; border-radius:999px; min-height:38px; background:none; color:inherit; font:600 15px/1.4 system-ui; cursor:pointer; }
.research-sheet-tabs button[aria-selected=true] { background:#ffffff18; }
.research-sheet-body { min-height:0; overflow-y:auto; overscroll-behavior:contain; padding:8px 23px 30px; scrollbar-width:thin; }
.research-sheet-step-list { list-style:none; padding:0; margin:0; }
.research-sheet-step-list li { position:relative; padding:0 0 25px 18px; border-inline-start:2px solid #80808030; margin-inline-start:5px; }
[dir=rtl] .research-sheet-step-list li { padding:0 18px 25px 0; }
.research-sheet-step-list li::before { content:''; position:absolute; inset-inline-start:-5px; top:8px; width:8px; height:8px; border-radius:50%; background:#888; }
.research-sheet-step-list h3 { margin:0 0 9px; font:600 15px/1.45 system-ui; overflow-wrap:anywhere; }
.research-sheet-chips { display:flex; flex-wrap:wrap; gap:6px; }
.research-sheet-chip,.research-sheet-chips button { display:inline-flex; align-items:center; gap:5px; min-height:28px; padding:3px 8px 3px 5px; border:1px solid #80808040; border-radius:999px; font:500 13px/1.4 system-ui; color:inherit; background:none; text-decoration:none; cursor:pointer; }
.research-sheet-reference-list { display:grid; gap:10px; }
.research-sheet-source { display:flex; align-items:center; gap:12px; padding:12px; border:1px solid #80808035; border-radius:14px; color:inherit; text-decoration:none; }
.research-sheet-source > span:last-child { min-width:0; }
.research-sheet-source strong { display:block; font:600 14px/1.4 system-ui; overflow-wrap:anywhere; }
.research-sheet-source bdi { display:block; margin-top:4px; font:13px/1.4 system-ui; opacity:.65; overflow-wrap:anywhere; }
.research-public-summary { white-space:pre-wrap; font:14px/1.5 system-ui; opacity:.75; }
.research-done { padding:10px 0; font:600 15px/1.4 system-ui; opacity:.75; }
.research-sheet [hidden] { display:none; }
@media(prefers-color-scheme:light){.research-sheet{background:#fff;color:#26262b;border-color:#0002}.research-sheet-tabs button[aria-selected=true]{background:#fff}.research-sheet .source-site-icon img{background:#fff}}
body.app-black-surfaces .research-sheet,html[data-theme=dark] .research-sheet,body[data-theme=dark] .research-sheet{color-scheme:dark;background:#18181b;color:#eee;border-color:#ffffff26}
body.app-black-surfaces .research-sheet-tabs button[aria-selected=true],html[data-theme=dark] .research-sheet-tabs button[aria-selected=true],body[data-theme=dark] .research-sheet-tabs button[aria-selected=true]{background:#ffffff18}
html[data-theme=light] .research-sheet,body[data-theme=light] .research-sheet{color-scheme:light;background:#fff;color:#26262b;border-color:#0002}
html[data-theme=light] .research-sheet-tabs button[aria-selected=true],body[data-theme=light] .research-sheet-tabs button[aria-selected=true]{background:#fff}
@media(prefers-reduced-motion:reduce){.research-live-chevron{transition:none}}

/* Suggestions loop three at a time: each new set slides up into place, one after the other. */
.moh-new-chat-suggestions button.is-entering{animation:moh-suggestion-in .42s cubic-bezier(.2,.7,.2,1) both}
@keyframes moh-suggestion-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.moh-new-chat-suggestions button.is-entering{animation:none}}
