/* Message buttons retain their existing padding, font size and spacing. */
.message-actions .msg-more{margin-left:auto;letter-spacing:2px}
.reader-action-popover{position:fixed;z-index:10030;box-sizing:border-box;display:flex;flex-wrap:wrap;gap:8px;width:max-content;max-width:min(340px,calc(100vw - 16px));padding:8px;border:1px solid color-mix(in srgb,var(--reader-text,#d8dee8) 20%,transparent);border-radius:10px;background:var(--reader-surface,#172033);color:var(--reader-text,#d8dee8);box-shadow:0 8px 24px #0003}
.reader-action-popover .msg-action{padding:6px 9px;font-size:12px}
.reader-controller-view .input-bar textarea,.reader-controller-view .input-bar textarea:focus{height:auto;min-height:38px;max-height:140px;resize:none;overflow-y:auto;box-sizing:border-box}
.reader-controller-view .input-bar .input-expand{min-width:30px;min-height:30px;width:30px;height:30px;flex:0 0 30px;padding:0;background:transparent;color:var(--reader-text,#d8dee8);opacity:.75}
.input-expand svg{display:block;width:16px;height:16px;margin:auto}
.reader-symbol-picker{position:fixed;z-index:10050;box-sizing:border-box;width:min(320px,calc(100vw - 16px));padding:10px;border:1px solid color-mix(in srgb,var(--reader-text,#d8dee8) 20%,transparent);border-radius:10px;background:var(--reader-surface,#172033);color:var(--reader-text,#d8dee8);box-shadow:0 8px 24px #0003;font-size:12px}
.reader-symbol-options{display:flex;gap:6px;flex-wrap:wrap}
.reader-symbol-options button{display:flex;align-items:center;gap:5px;padding:6px 9px;border:1px solid color-mix(in srgb,var(--reader-text,#d8dee8) 20%,transparent);border-radius:7px;background:transparent;color:inherit;font:inherit}
.reader-symbol-options b{font-size:17px}
.reader-symbol-picker p{margin:8px 0 0;line-height:1.6}
.reader-composer-overlay{position:fixed;z-index:10040;box-sizing:border-box;display:flex;flex-direction:column;gap:10px;overflow:hidden;padding:12px 14px calc(12px + env(safe-area-inset-bottom,0px));background:var(--reader-input-bar,#111a2b);color:var(--reader-text,#d8dee8)}
.reader-composer-overlay header,.reader-composer-overlay footer{display:flex;flex:none;align-items:center;justify-content:space-between;gap:10px}
.reader-composer-overlay h2{margin:0;font-size:16px}
.reader-composer-overlay button{padding:6px 10px;border:1px solid color-mix(in srgb,var(--reader-text,#d8dee8) 20%,transparent);border-radius:7px;background:var(--reader-surface,#172033);color:inherit;font:inherit;font-size:13px}
.reader-composer-overlay textarea{flex:1;min-height:0;width:100%;box-sizing:border-box;padding:12px;border:1px solid color-mix(in srgb,var(--reader-text,#d8dee8) 20%,transparent);border-radius:10px;resize:none;background:var(--reader-surface,#172033);color:inherit;font-size:16px;font-family:inherit;line-height:1.7;outline-offset:-3px}
.reader-composer-overlay [data-composer-send]{background:var(--reader-action,#d9a441);color:#17120a;border-color:transparent}
.reader-composer-overlay button:disabled{opacity:.5;cursor:not-allowed}
.reader-composer-count{font-size:12px;opacity:.7}
.reader-composer-tools{display:flex;gap:6px;align-items:center}
.story-content .story-inner-thought{font-style:italic;color:var(--reader-quote,currentColor)}
@media(min-width:781px){.reader-composer-overlay{inset:0;margin:auto;max-width:800px;max-height:720px;border:1px solid color-mix(in srgb,var(--reader-text,#d8dee8) 20%,transparent);border-radius:14px;box-shadow:0 0 0 100vmax #0008}}

/* Fit the normal reader to the keyboard's visible area as well as the editor.
   Keep story scrolling inside the reader; the input and toolbar stay in flow. */
@media(max-width:780px){
  html.reader-viewport-fit .app-shell.is-reading{position:fixed;top:var(--reader-viewport-top,0px);left:var(--reader-viewport-left,0px);width:var(--reader-viewport-width,100%);height:var(--reader-viewport-height,100dvh);max-height:var(--reader-viewport-height,100dvh);margin:0;box-sizing:border-box}
  .reader-controller-view .input-bar textarea{font-size:16px}
}