/* Mori is a continuing conversation with a companion. The sidebar holds the rest. */
/* Pointer clicks keep the reading surface quiet; Tab restores the keyboard cues. */
:root[data-input-modality="pointer"] :is(button,a,input,select,textarea,summary,[tabindex],[contenteditable="true"],#journal-title,#journal-editor .tiptap):focus {
 outline:none; box-shadow:none;
}
:root[data-input-modality="pointer"] .avatar-option:has(input:focus-visible) { outline:none; }
.account-initial {
 display:grid; place-items:center; width:34px; height:34px; border-radius:50%;
 background:#e3edce; color:#243f34; font-size:14px; font-weight:700;
}
.sidebar-top { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 10px 26px; }
.sidebar .sidebar-top .brand { margin:0; }
.sidebar .history-search-toggle { display:grid; place-items:center; flex-shrink:0; width:36px; min-height:36px; padding:8px; border:0; border-radius:6px; color:#c4d1c5; background:transparent; }
.sidebar .history-search-toggle[aria-expanded="true"] { color:#f4f6e9; background:#345342; }
.sidebar .new-conversation { display:flex; align-items:center; justify-content:flex-start; gap:10px; flex-shrink:0; min-height:40px; padding:9px 12px; margin:4px 0 20px; width:100%; color:#233c32; background:#e3edce; border:1px solid transparent; border-radius:8px; font-size:13px; }
.sidebar .new-conversation:hover { background:#d2e1b7; color:#233c32; }
.sidebar .new-conversation:focus-visible { outline:2px solid #e3edce; outline-offset:3px; }
.sidebar-companion { margin-bottom:12px; }
.sidebar .history-panel { margin-top:20px; min-height:0; overflow:visible; }
.sidebar .history-panel summary { font-size:11px; font-weight:400; color:#c7d6ca; }
.sidebar .history-content { display:flex; flex-direction:column; min-height:0; }
.sidebar .sessions { max-height:clamp(100px,32dvh,320px); overflow-y:auto; overscroll-behavior:contain; }
.sidebar .history-actions { display:flex; margin:0; }
.sidebar .history-actions .text-button { padding:3px 10px; min-height:30px; font-size:12px; }
.sidebar .session { display:grid; gap:3px; height:auto; min-height:58px; padding:10px 12px; color:#eef2e8; }
.sidebar .session strong { font-size:13px; line-height:1.6; font-weight:500; }
.sidebar .session time { color:#c7d6ca; font-size:11px; line-height:1.5; font-variant-numeric:tabular-nums; }
.sidebar .session.selected { background:#416858; color:#f4f6e9; }
/* Scroll with the trackpad, wheel or keyboard without a permanent rail beside the paper. */
html,body,.main-content,.practice .messages,.sidebar .sessions,.sidebar .history-content { scrollbar-width:none; }
html::-webkit-scrollbar,body::-webkit-scrollbar,.main-content::-webkit-scrollbar,.practice .messages::-webkit-scrollbar,.sidebar .sessions::-webkit-scrollbar,.sidebar .history-content::-webkit-scrollbar { display:none; }
@media(min-width:901px){
 .sidebar .history-panel { position:relative; flex:1 1 0; overflow:hidden; }
 .sidebar .history-panel > summary { height:34px; padding:6px 10px; line-height:22px; }
 .sidebar .history-content { position:absolute; inset:34px 0 0; overflow:hidden; }
 .sidebar .history-actions { display:none; }
 .sidebar .search-label { flex-shrink:0; }
 .sidebar .search-label input { height:34px; margin:0; padding:6px 10px; font-size:12px; }
 .sidebar .sessions { flex:1; min-height:0; max-height:none; margin-top:8px; align-content:start; grid-auto-rows:max-content; }
 .sidebar .sidebar-account { flex-shrink:0; }
}
.practice[data-mode="conversation"] {
 width:100%; max-width:900px; min-height:0; height:100%; flex:1;
 padding:0 40px 32px;
}
.workspace[data-page="conversation"] .main-content { display:flex; flex-direction:column; min-height:0; overflow:hidden; }
#workspace-toolbar[hidden] { display:none; }
.practice[data-mode="conversation"] .practice-heading,
.practice.is-empty[data-mode="conversation"] .practice-heading {
 margin:0; min-height:78px; padding:16px 0; align-items:center; justify-content:flex-start;
 border-bottom:1px solid var(--line); gap:12px; flex-shrink:0;
}
.practice[data-mode="conversation"] .practice-heading h1,
.practice.has-conversation .practice-heading h1 { font-size:16px; font-weight:500; line-height:1.6; margin:0; overflow-wrap:anywhere; }
.practice[data-mode="conversation"] .practice-heading p { display:none; }
.practice[data-mode="conversation"] #companion-presence,
.practice[data-mode="conversation"] #companion-avatar,
.practice[data-mode="conversation"] #companion-avatar agent-avatar { width:44px; height:44px; }
.practice[data-mode="conversation"] #companion-avatar agent-avatar { --size:44px !important; }
.practice .companion-state { display:none; margin-top:3px; font-size:11px; color:var(--muted); }
.practice #companion-presence:is([data-state="working"],[data-state="attention"]) + .companion-heading-copy .companion-state { display:block; }
.companion-heading-copy { min-width:0; }
.conversation-date { margin-left:auto; flex-shrink:0; color:var(--muted); font-size:12px; font-variant-numeric:tabular-nums; }
.practice .mode-note { display:none; }
.practice[data-mode="conversation"] .messages {
 padding:34px 8px 16px 2px; min-height:0; flex:1; overflow-y:auto; scroll-padding-block:20px; scrollbar-gutter:stable;
}
.practice[data-mode="conversation"] .message {
 width:fit-content; max-width:min(82%,65ch); margin:0 0 26px; padding:0;
 background:transparent; border:0; border-radius:0;
}
.practice[data-mode="conversation"] .message.assistant { width:100%; max-width:100%; }
.practice[data-mode="conversation"] .message.assistant .message-bubble { padding:0; background:transparent; border:0; border-radius:0; }
.practice[data-mode="conversation"] .message.assistant .message-text { max-width:70ch; }
.practice[data-mode="conversation"] .message.user { margin-left:auto; }
.message-bubble {
 padding:14px 18px; background:#fff; border:1px solid #e1e5db;
 border-radius:16px 16px 16px 4px;
}
.message.user .message-bubble {
 background:#eaf0e2; border-color:transparent; border-radius:14px 14px 4px 14px;
}
.practice[data-mode="conversation"] .message p { font-size:15px; line-height:1.9; margin:0; white-space:pre-wrap; }
.practice[data-mode="conversation"] .message p + p { margin-top:12px; }
.message-text[tabindex] { cursor:default; }
.message-text[tabindex]:focus-visible { outline:2px solid var(--green); outline-offset:5px; border-radius:2px; }
.message-meta { display:flex; align-items:center; gap:8px; min-height:28px; padding:2px 3px 0; }
.message-meta time { font-size:11px; color:var(--muted); font-variant-numeric:tabular-nums; }
.message-meta time { opacity:0; transition:opacity .15s ease-out; }
.message:hover .message-meta time,.message:focus-within .message-meta time { opacity:1; }
.message.user .message-meta { justify-content:flex-end; }
.practice .reply-replay {
 display:grid; place-items:center; width:28px; height:28px; min-height:28px; margin:0;
 padding:5px; color:var(--muted); border:0; border-radius:50%; background:transparent;
 opacity:0; pointer-events:none;
}
.practice .message:hover .reply-replay,
.practice .message:focus-within .reply-replay { opacity:1; pointer-events:auto; }
.practice .reply-replay:hover { color:var(--green); background:var(--sage); }
.practice .practice-receipt { margin:8px 0 0; font-size:12px; }
.practice .preference-error { display:flex; flex-wrap:wrap; gap:4px 10px; margin-top:8px; color:var(--muted); font-size:12px; line-height:1.6; }
.practice .preference-error a { white-space:nowrap; }
.recommendation-card { max-width:70ch; margin:12px 0 4px; padding:0; border:1px solid #d7dfd1; border-radius:12px; background:#fffefb; color:var(--ink); overflow:hidden; overflow-wrap:anywhere; }
.message > .recommendation-card { margin-top:0; }
.recommendation-meta { display:block; margin:0; padding:10px 18px; background:#f0f3e9; color:#47604e; font-size:11px; line-height:1.5; }
.recommendation-body { padding:14px 18px 16px; }
.recommendation-title { margin:0; font-family:inherit; font-size:16px; line-height:1.6; font-weight:600; text-wrap:pretty; }
.practice[data-mode="conversation"] .message.assistant .recommendation-body .message-bubble { margin-top:12px; }
.practice[data-mode="conversation"] .message .recommendation-body .message-text { font-size:14px; line-height:1.8; }
.practice[data-mode="conversation"] .message .recommendation-metadata,.recommendation-metadata { margin:8px 0 0; max-width:65ch; color:#47604e; font-size:13px; line-height:1.7; white-space:normal; }
.recommendation-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px 18px; margin-top:12px; }
.recommendation-actions a { font-size:13px; line-height:1.5; text-underline-offset:4px; }
.recommendation-primary,.recommendation-actions .youtube-source-actions button { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:9px 14px; border:0; border-radius:8px; background:#2b5745; color:#fff; font-family:inherit; font-size:13px; line-height:1.5; text-decoration:none; }
.recommendation-primary:hover,.recommendation-actions .youtube-source-actions button:hover { background:#1e4435; color:#fff; text-decoration:none; }
.recommendation-actions .youtube-source-actions { display:contents; }
.recommendation-original { color:#375744; }
.recommendation-card :is(a,button,summary):focus-visible { outline:2px solid #2b5745; outline-offset:4px; }
.recommendation-card .practice-receipt { margin:16px 0 0; padding-top:12px; border-top:1px solid #d4decd; }
#saved-content .recommendation-card > .practice-receipt { margin:0 20px 20px; }
#saved-content .recommendation-card { margin:0 0 20px; }
.quick-responses { display:flex; flex-wrap:wrap; gap:8px; margin:4px 0 12px; }
.quick-responses[hidden] { display:none; }
.practice .quick-response { min-height:36px; padding:7px 12px; border:1px solid #ced9c5; border-radius:9px; background:transparent; color:#3e5a35; font-family:inherit; font-size:12px; line-height:1.5; text-align:left; }
.practice .quick-response:hover:not(:disabled) { background:#edf2e6; border-color:#91a583; }
.practice .quick-response:disabled { color:#697360; border-color:#d9dfd3; cursor:default; }
.practice .quick-response:focus-visible { outline:2px solid var(--green); outline-offset:3px; }
.learning-tool { margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.learning-tool strong { font-size:13px; }
.practice[data-mode="conversation"] .message .learning-tool p { font-size:13px; line-height:1.7; margin-top:5px; }
.learning-tool-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:6px; }
.learning-tool-actions .text-button { font-size:12px; padding:6px 0; }
.tool-copy-fallback { margin-top:12px; font-size:12px; }
.tool-copy-fallback textarea { font-size:13px; line-height:1.6; }
.practice .composer {
 display:flex; align-items:flex-end; gap:12px; border-radius:12px; padding:12px 12px 12px 18px;
 border:1px solid #becbbd; box-shadow:none; background:#fff; position:relative;
}
.practice .composer:focus-within { border-color:#becbbd; outline:none; }
:root[data-input-modality="keyboard"] .practice .composer:has(textarea:focus-visible) { border-color:var(--green); outline:1px solid var(--green); outline-offset:1px; }
.practice .composer textarea,.practice.has-conversation .composer textarea {
 flex:1; width:0; min-height:40px; height:40px; max-height:144px; margin:0; padding:8px 0;
 font-size:15px; line-height:24px; resize:none; overflow-y:auto;
}
.practice .composer-footer { margin:0; display:flex; flex-wrap:nowrap; gap:4px; align-items:center; flex-shrink:0; }
.practice .composer-icon {
 display:grid; place-items:center; width:36px; min-width:36px; height:40px; min-height:40px;
 border:0; padding:8px; border-radius:10px; color:var(--muted); background:transparent;
}
.practice .composer-icon:hover { background:var(--sage); color:var(--green); }
.practice #read-aloud-quick[aria-pressed="true"] { color:var(--green); background:#edf2e8; }
.practice .composer-footer .primary { min-width:40px; width:40px; min-height:40px; height:40px; border-radius:50%; padding:8px; margin-left:4px; display:grid; place-items:center; }
.practice #composer-hint { position:absolute; bottom:-23px; left:4px; font-size:11px; color:var(--muted); }
.practice #count { position:absolute; bottom:-23px; right:4px; font-size:11px; }
.practice .dictation-guidance { margin-top:30px; font-size:12px; line-height:1.7; color:var(--muted); max-width:64ch; }
.practice.is-empty[data-mode="conversation"] .messages { display:flex; flex-direction:column; }
.practice .empty { width:100%; max-width:52ch; margin:auto 0; padding:32px 0; text-align:left; }
.practice .empty h2 { font-family:inherit; font-size:22px; font-weight:700; }
.practice .empty p { max-width:46ch; font-size:15px; }
.practice .setup-bar { font-size:12px; margin-top:16px; }
.practice .turn-status:empty { display:none; }
.practice .speech-bar { margin-block:8px; font-size:12px; padding:0; }
.identity-choices { grid-template-columns:1fr; }
@media (hover:none), (pointer:coarse) {
 .message-meta time { opacity:1; }
 .practice .reply-replay { opacity:1; pointer-events:auto; width:44px; height:44px; min-height:44px; padding:12px; }
 .practice .composer-icon { min-width:44px; width:44px; }
 .practice .quick-response { min-height:44px; }
}
@media(max-width:900px){
 .workspace[data-page="conversation"] { display:flex; flex-direction:column; height:100dvh; min-height:0; }
 .workspace[data-page="conversation"] .sidebar { flex-shrink:0; }
 .workspace[data-page="conversation"] .main-content { flex:1; }
 .practice[data-mode="conversation"] { padding:0 24px 32px; }
 .practice[data-mode="conversation"] .message { max-width:86%; }
 .sidebar nav { padding-right:0; flex-wrap:wrap; }
 .sidebar .sidebar-top { grid-column:1; grid-row:1; margin:0; min-width:0; }
 .sidebar .history-panel { grid-column:1; grid-row:3; align-self:center; margin-top:0; }
 .sidebar .new-conversation { grid-column:2; grid-row:3; align-self:center; width:42px; min-height:42px; justify-content:center; margin:0; padding:8px; }
 .sidebar .new-conversation span { display:none; }
 .sidebar .sidebar-account { position:relative; grid-column:2; grid-row:1; inset:auto; align-self:center; min-width:0; max-width:40vw; z-index:7; }
 .sidebar #account-avatar { flex-shrink:0; }
 .sidebar #learner-name { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
 .sidebar .history-content { display:block; background:#2c5547; border-color:#6a8070; }
 .sidebar .sessions { max-height:35dvh; }
}
@media(max-width:600px){
 .practice[data-mode="conversation"] { padding:0 16px 20px; }
 .practice[data-mode="conversation"] .practice-heading { padding-block:14px; gap:10px; }
 .practice[data-mode="conversation"] .practice-heading h1 { font-size:15px; }
 .practice[data-mode="conversation"] .message { max-width:90%; }
 .message-bubble { padding:12px 14px; }
 .practice[data-mode="conversation"] .message p { font-size:15px; }
 .recommendation-meta { padding:10px 16px; }
 .recommendation-body { padding:16px; }
 #saved-content .recommendation-card > .practice-receipt { margin:0 16px 16px; }
 .recommendation-title { font-size:16px; }
 .recommendation-primary,.recommendation-actions .youtube-source-actions button { min-height:44px; }
 .practice .composer { padding-left:14px; gap:4px; }
 .practice .composer-footer { gap:0; }
 .practice .composer-footer .primary { margin-left:2px; }
 .practice #composer-hint { display:none; }
 .practice .dictation-guidance { margin-top:16px; }
}
@media(prefers-reduced-motion:reduce){ .message-meta time { transition:none; } }