/* Screen-only reading layer shared by the website and the installed app.
   Keep the conversation's existing viewport/scroll ownership and print layout. */
@media screen {
  .interview-module-toggle { display: none; }
}

@media screen and (max-width: 600px) {
  body.luwa-production {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
    font-size: 16px;
    line-height: 1.6;
  }

  /* Wrapping happens between words; labels never need a sideways swipe. */
  body.luwa-production :is(.button, .text-button, .interview-kind, .interview-module, .manual-side-tab) {
    white-space: normal;
    overflow-wrap: normal;
    word-break: normal;
    hyphens: none;
  }
  body.luwa-production :is(.button, .text-button) {
    min-block-size: 48px;
    max-inline-size: 100%;
    padding: 12px 16px;
    font-size: 16px;
    line-height: 1.55;
  }
  /* Touch browsers can retain :hover after navigation. Keep secondary actions
     on an opaque theme surface instead of inheriting the legacy white ink. */
  body.luwa-production :is(.button.outline, .button-secondary):is(:hover, :focus, :focus-visible, :active):not(:disabled) {
    background: var(--mc-theme-soft, var(--paper));
    color: var(--mc-theme-text, var(--ink));
    border-color: var(--mc-theme-link, var(--berry));
  }
  body.luwa-production :is(.button.outline, .button-secondary):focus-visible {
    outline: 3px solid var(--mc-theme-link, var(--berry));
    outline-offset: 3px;
  }
  body.luwa-production :is(input:not([type=checkbox]):not([type=radio]), textarea, select) {
    max-inline-size: 100%;
    min-inline-size: 0;
    font-size: 16px;
    line-height: 1.6;
  }
  body.luwa-production :is(input:not([type=checkbox]):not([type=radio]), select) { min-block-size: 48px; }
  body.luwa-production :is(textarea, input, select, button, summary) { scroll-margin-block: 18px; }
  body.luwa-production .site-header { flex-wrap: wrap; gap: 12px; }
  body.luwa-production .header-links { flex-wrap: wrap; gap: 12px; margin: 0; font-size: 14px; }
  body.luwa-production .header-links a { display: inline-flex; align-items: center; min-block-size: 44px; }
  body.luwa-production .intro-text { font-size: 17px; line-height: 1.65; color: var(--mc-theme-muted, var(--muted)); }

  /* Entry, consent, registration and account copy remains readable in both themes. */
  body.luwa-production :is(.entry-choice, .consent-panel, .production-section, .production-account-management, .guest-entry, .create-profile-panel) {
    min-inline-size: 0;
    padding: 22px 18px;
  }
  body.luwa-production :is(.entry-choice-grid, .auth-choices) { gap: 12px; }
  body.luwa-production .entry-choice-grid { grid-template-columns: minmax(0, 1fr); }
  body.luwa-production .entry-choice-card { padding: 20px; gap: 12px; min-block-size: 48px; }
  body.luwa-production .entry-choice-card strong { font-size: 20px; line-height: 1.4; }
  body.luwa-production :is(.entry-choice > p, .entry-choice-card span, .consent-intro > p:not(.eyebrow), .production-section p, .production-account-management p, .guest-entry p, .create-profile-panel > p:not(.eyebrow)) {
    font-size: 16px;
    line-height: 1.65;
    color: var(--mc-theme-muted, var(--muted));
  }
  body.luwa-production .consent-intro > .small { font-size: 16px !important; }
  body.luwa-production :is(.production-section .small, .save-form > .small, .save-form .checkbox, .save-form fieldset p) { font-size: 16px; line-height: 1.65; }
  body.luwa-production :is(.consent-intro h2, .section-copy h2, .entry-choice h2, .production-account-management h1, .production-account-management h2, .create-profile-panel h2) {
    font-size: 26px;
    line-height: 1.3;
    letter-spacing: -.025em;
  }
  body.luwa-production :is(.checkbox, .checkbox small, .field-label, .save-form legend, .production-account-management .consent-label) {
    font-size: 16px;
    line-height: 1.65;
    color: var(--mc-theme-text, var(--ink));
  }
  body.luwa-production .checkbox small { color: var(--mc-theme-muted, var(--muted)); }
  body.luwa-production .checkbox { gap: 12px; align-items: flex-start; }
  body.luwa-production .checkbox input { flex: none; margin-block-start: 5px; }
  body.luwa-production .save-form { gap: 20px; }
  body.luwa-production .save-form fieldset { padding: 16px; gap: 16px; min-inline-size: 0; }
  body.luwa-production .save-form .button,
  body.luwa-production .auth-choices > .button { inline-size: 100%; justify-content: center; }
  body.luwa-production :is(.account-status, .email-auth-status, .tiny-note, #share-expiry, #copy-status, #manage-account) {
    font-size: 16px;
    line-height: 1.6;
  }
  body.luwa-production .share-actions { flex-wrap: wrap; gap: 12px; }

  /* Short top controls keep a usable touch target without consuming the composer. */
  body.luwa-production .conversation-heading,
  body.luwa-production[data-cupidon-screen=conversation] .conversation-heading {
    gap: 7px;
    padding: calc(7px + env(safe-area-inset-top, 0px)) 10px 7px;
  }
  body.luwa-production .conversation-heading :is(.chat-icon-button, .chat-portrait-button) { min-block-size: 44px; }
  body.luwa-production .conversation-heading .chat-portrait-button {
    max-inline-size: 124px;
    padding: 9px 10px;
    font-size: 14px;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: normal;
  }
  body.luwa-production .conversation-heading .chat-identity h3 { font-size: 18px; line-height: 1.3; }
  body.luwa-production .conversation-heading .chat-identity p { font-size: 13px; line-height: 1.4; }
  body.luwa-production .mode-switch { gap: 8px; padding: 8px 12px; }
  body.luwa-production .mode-switch button {
    min-block-size: 48px;
    min-inline-size: 0;
    padding: 10px 12px;
    font-size: 16px;
    line-height: 1.4;
    white-space: normal;
    overflow-wrap: normal;
    border-color: var(--mc-theme-line, var(--line));
    background: var(--mc-theme-surface, var(--white));
    color: var(--mc-theme-text, var(--ink));
  }
  body.luwa-production .mode-switch button[aria-pressed=true] { background: var(--mc-theme-text, var(--ink)); color: var(--mc-theme-bg, var(--white)); }
  body.luwa-production .topic-choices-bar { padding: 8px 12px; gap: 10px; }
  body.luwa-production :is(.topic-choices-bar-label, .topic-choices-bar-copy > p) { font-size: 13px; line-height: 1.45; }
  body.luwa-production .topic-choices-open { min-block-size: 44px; padding: 9px 11px; font-size: 14px; line-height: 1.4; }

  /* Dialogue text and suggestions use the same comfortable reading size. */
  body.luwa-production[data-cupidon-screen=conversation] .messages { padding: 20px 12px 16px; scroll-padding-block: 16px; }
  body.luwa-production[data-cupidon-screen=conversation] .message { max-inline-size: 96%; }
  body.luwa-production .message-content,
  body.luwa-production[data-cupidon-screen=conversation] .message-content { font-size: 17px; line-height: 1.65; padding: 15px 16px; }
  body.luwa-production .message-meta { font-size: 13px; line-height: 1.45; }
  body.luwa-production :is(.guided-question, .guided-help, .guided-chip, .guided-status, .response-recovery > p, .rejected-response-copy) { font-size: 16px; line-height: 1.6; }
  body.luwa-production .guided-chip { min-block-size: 48px; padding: 12px; }
  body.luwa-production .guided-response { max-block-size: min(280px, 28dvh); }
  body.luwa-production .composer,
  body.luwa-production[data-cupidon-screen=conversation] .composer { padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px)); }
  body.luwa-production .composer textarea { font-size: 17px; line-height: 1.55; }
  body.luwa-production .composer-bottom { gap: 8px; }
  body.luwa-production .composer-bottom > p,
  body.luwa-production[data-cupidon-screen=conversation] .composer-bottom > p { font-size: 13px; line-height: 1.45; max-inline-size: 160px; }
  body.luwa-production .composer-bottom .button { min-block-size: 48px; padding: 10px 14px; font-size: 16px; line-height: 1.4; }
  body.luwa-production .dictate-button { min-inline-size: 44px; inline-size: 44px; block-size: 44px; }
  body.luwa-production :is(.dictation-status, .voice-consent-reset, .chat-feedback, .thinking) { font-size: 16px; line-height: 1.55; }

  /* The module disclosure is one vertical list, never an offscreen carousel. */
  body.luwa-production .interview-module-picker { display: grid; gap: 12px; min-inline-size: 0; }
  body.luwa-production .interview-module-toggle {
    display: block;
    inline-size: 100%;
    min-block-size: 52px;
    padding: 12px 14px;
    border: 1px solid var(--qe-line);
    border-radius: 12px;
    background: var(--qe-surface);
    color: var(--qe-text);
    text-align: start;
    font-size: 16px;
    font-weight: 600;
    line-height: 1.55;
    white-space: normal;
    overflow-wrap: normal;
  }
  body.luwa-production .interview-module-picker[data-expanded=false] .interview-modules { display: none; }
  body.luwa-production .interview-module-picker[data-expanded=true] .interview-modules {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    overflow: visible;
    padding: 3px;
    inline-size: 100%;
  }
  body.luwa-production .interview-module {
    inline-size: 100%;
    min-block-size: 60px;
    padding: 12px 14px;
    font-size: 16px !important;
    line-height: 1.55;
    flex-basis: auto;
  }
  body.luwa-production .interview-editor { gap: 20px; padding: 20px 14px 0; font-size: 16px; line-height: 1.6; }
  body.luwa-production .interview-title { font-size: 26px; line-height: 1.35; letter-spacing: -.02em; }
  body.luwa-production :is(.interview-question, .interview-answer-body) { gap: 20px; }
  body.luwa-production :is(.interview-position, .interview-module-title, .interview-help, .interview-status, .interview-field, .interview-error, .interview-question-list summary, .interview-legacy p, .interview-ambiguity p) { font-size: 16px; line-height: 1.6; }
  body.luwa-production :is(.interview-choice, .interview-essential) { min-block-size: 52px; padding: 14px 12px; gap: 12px; font-size: 16px; line-height: 1.65; }
  body.luwa-production .interview-choices { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  body.luwa-production :is(.interview-field textarea, .interview-kept textarea) { padding: 14px; font-size: 17px; line-height: 1.65; }
  body.luwa-production .interview-field textarea[data-field=condition] { min-block-size: 100px; }
  body.luwa-production :is(.interview-kind, .interview-link) { min-block-size: 48px; padding: 11px 14px; font-size: 16px !important; line-height: 1.5; }
  body.luwa-production .interview-kinds { gap: 10px; }
  body.luwa-production :is(.interview-exact-importance select, .interview-field select) {
    inline-size: 100%;
    min-block-size: 52px;
    padding: 12px 10px;
    border: 1px solid var(--qe-line);
    border-radius: 10px;
    background: var(--qe-surface);
    color: var(--qe-text);
    font-size: 16px;
    line-height: 1.5;
  }
  body.luwa-production .interview-exact-importance { gap: 12px; padding-block: 16px; }
  body.luwa-production .interview-actions {
    position: static;
    inset: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-block-start: 4px;
    padding-block: 16px max(16px, env(safe-area-inset-bottom, 0px));
  }
  body.luwa-production .interview-actions > button { min-block-size: 52px; padding: 12px 10px; font-size: 16px !important; line-height: 1.5; }
  body.luwa-production .interview-actions > [data-action=answer] { grid-column: 1 / -1; }
  body.luwa-production[data-cupidon-interview=granular] .conversation-content { scroll-padding-block: 16px 32px; }

  /* Legacy manual answers retain their tabs and drafts; only reading metrics change. */
  body.luwa-production .manual-questionnaire-panel { padding: 20px 14px 0; scroll-padding-block: 16px 32px; }
  body.luwa-production .manual-questionnaire-panel :is(.manual-help, .manual-side-help, .manual-counter, .manual-progress, .manual-label, .manual-answer-heading, .manual-answer-status, .manual-refinements > summary, .manual-pending-summary, .manual-error, .manual-finish p) { font-size: 16px; line-height: 1.6; }
  body.luwa-production .manual-questionnaire-panel .manual-title { font-size: 26px; line-height: 1.35; }
  body.luwa-production .manual-questionnaire-panel .manual-question { font-size: 17px; line-height: 1.65; }
  body.luwa-production .manual-questionnaire-panel .manual-actions { position: static; inset: auto; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; box-shadow: none; }
  body.luwa-production .manual-questionnaire-panel .manual-actions .button { min-block-size: 52px; padding: 12px 10px; font-size: 16px; line-height: 1.5; }
  body.luwa-production .manual-actions > .primary { grid-column: 1 / -1; }
  body.luwa-production .manual-questionnaire-panel :is(.manual-answer-tools button, .manual-side > .text-button, .manual-stale-draft button) { font-size: 16px; line-height: 1.55; min-block-size: 48px; }

  /* Private portrait only: these rules do not reach visual reports or PDFs. */
  body.luwa-production #portrait-panel { scroll-padding-block: 18px; }
  body.luwa-production #detailed-answers-section > .small { font-size: 16px; line-height: 1.6; }
  body.luwa-production #portrait-panel h2 { font-size: 26px; line-height: 1.3; letter-spacing: -.025em; }
  body.luwa-production #portrait-panel :is(.portrait-intro, .coverage .small, .fact-text, .fact-condition, .fact-meta, .empty-facts, .evidence, .evidence blockquote, .missing-section, .missing-section li, .optional-choice .small, .portrait-confirm p, .checkbox, .checkbox small) {
    font-size: 16px;
    line-height: 1.6;
  }
  body.luwa-production #portrait-panel :is(.portrait-intro, .coverage .small, .fact-condition, .fact-meta, .empty-facts, .evidence, .missing-section, .optional-choice .small, .portrait-confirm p, .checkbox small) { color: var(--mc-theme-muted, var(--muted)); }
  body.luwa-production #portrait-panel :is(.fact-text, .checkbox, .evidence summary) { color: var(--mc-theme-text, var(--ink)); }
  body.luwa-production #portrait-panel :is(.portrait-heading .eyebrow, .portrait-heading .pill, .fact-heading, .coverage > div:first-child) { font-size: 14px; line-height: 1.5; }
  body.luwa-production #portrait-panel .portrait-heading .pill { background: var(--mc-theme-soft, var(--paper)); color: var(--mc-theme-text, var(--ink)); border-color: var(--mc-theme-line, var(--line)); }
  body.luwa-production #portrait-panel :is(.portrait-heading .eyebrow, .fact-heading, .coverage > div:first-child) { color: var(--mc-theme-muted, var(--muted)); }
  body.luwa-production #portrait-panel .coverage > div:first-child { flex-wrap: wrap; gap: 8px 12px; }
  body.luwa-production #portrait-panel .facts { gap: 16px; }
  body.luwa-production #portrait-panel .fact { min-inline-size: 0; padding: 16px; }
  body.luwa-production #portrait-panel .fact-heading { margin-block-end: 10px; letter-spacing: .025em; }
  body.luwa-production #portrait-panel :is(.fact-text, .fact-condition, .fact-meta, .evidence blockquote) { overflow-wrap: anywhere; }
  body.luwa-production #portrait-panel .evidence blockquote { margin-block: 12px 0; padding-inline-start: 12px; }
  body.luwa-production #portrait-panel :is(.evidence summary, .missing-section > summary, .visual-portrait-entry > summary) { min-block-size: 48px; padding-block: 12px; font-size: 16px; line-height: 1.6; }
  body.luwa-production #portrait-panel :is(.button, .text-button) { min-block-size: 48px; font-size: 16px; line-height: 1.55; }
  body.luwa-production #portrait-panel .portrait-confirm .button { padding: 13px 14px; }

  /* Consent and voice dialogs scroll internally with no fixed action overlay. */
  body.luwa-production :is(#topic-choices-dialog, .dictation-dialog) { inline-size: calc(100vw - 24px); max-inline-size: 560px; max-block-size: calc(100dvh - 24px); scroll-padding-block: 18px; }
  body.luwa-production #topic-choices-dialog .topic-choices-form { padding: 22px 18px 18px; }
  body.luwa-production #topic-choices-dialog #topic-choices-title,
  body.luwa-production .dictation-title { font-size: 26px; line-height: 1.3; }
  body.luwa-production #topic-choices-dialog :is(.topic-choices-description, .topic-choice-copy strong, .topic-choice-copy > span, .topic-choices-notice, .topic-choices-status, .topic-choices-error, .topic-choices-refresh, .topic-choices-save, .topic-choices-back),
  body.luwa-production :is(.dictation-disclosure, .dictation-hint, .dictation-feedback, .dictation-consent, .dictation-actions button) { font-size: 16px; line-height: 1.65; }
  body.luwa-production #topic-choices-dialog .topic-choices-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  body.luwa-production #topic-choices-dialog .topic-choice-card { display: grid; grid-template-columns: 32px minmax(0, 1fr); align-items: start; padding: 16px 42px 16px 14px; gap: 12px; }
  body.luwa-production #topic-choices-dialog .topic-choice-card input { top: 18px; right: 13px; transform: none; }
  body.luwa-production #topic-choices-dialog :is(.topic-choices-save, .topic-choices-back, .topic-choices-refresh),
  body.luwa-production .dictation-actions button { min-block-size: 48px; white-space: normal; overflow-wrap: normal; }
  html[data-mc-theme] body.luwa-production #topic-choices-dialog :is(.topic-choices-description, .topic-choice-copy > span, .topic-choices-notice, .topic-choices-status, .topic-choices-back, .topic-choices-refresh) { color: var(--mc-theme-muted); }
  html[data-mc-theme] body.luwa-production :is(.composer-bottom > p, .dictation-status, .voice-consent-reset) { color: var(--mc-theme-muted); }
}

/* A keyboard-sized viewport still gives the existing scroll surface room.
   No new fixed element and no additional minimum composer height. */
@media screen and (max-width: 600px) and (max-height: 420px) {
  body.luwa-production[data-cupidon-screen=conversation] .conversation-heading { padding-block: 3px; }
  body.luwa-production[data-cupidon-screen=conversation] .conversation-heading .chat-identity p { display: none; }
  body.luwa-production .mode-switch { padding-block: 4px; gap: 6px; }
  body.luwa-production .mode-switch button { min-block-size: 44px; padding-block: 8px; }
  body.luwa-production .topic-choices-bar { padding-block: 4px; }
  body.luwa-production .topic-choices-bar-copy > p { display: none; }
  body.luwa-production .guided-response { max-block-size: 18dvh; }
  body.luwa-production[data-cupidon-screen=conversation] .composer { padding-block: 6px; }
  body.luwa-production .composer-bottom { margin-block-start: 4px; }
  body.luwa-production .composer-bottom > p[data-notice=hint] { display: none; }
}