.beto-breadcrumb{display:flex;align-items:center;gap:var(--space-2);margin-bottom:var(--space-5);color:var(--text-secondary);font-size:var(--font-small)}
.beto-breadcrumb a{color:var(--text-primary);font-weight:800}
.beto-intro{min-height:360px;border:1px solid var(--beto-light);border-radius:var(--radius-2xl);background:linear-gradient(135deg,var(--beto-paper),var(--beto-highlight-surface));display:grid;grid-template-columns:1.15fr .85fr;align-items:center;overflow:hidden;padding:var(--space-8) var(--space-9) 0;box-shadow:var(--shadow-sm)}
.beto-intro-copy{align-self:center;padding-bottom:38px}
.beto-intro h1{color:var(--text-primary);font-size:var(--font-display)}
.beto-intro p{max-width:650px;color:var(--text-primary);font-size:18px;line-height:var(--line-body)}
.beto-eyebrow{color:var(--text-primary);font-size:var(--font-label);font-weight:900;letter-spacing:.14em}
.beto-local-badge{display:inline-flex;margin-top:var(--space-2);padding:var(--space-2) var(--space-3);border:1px solid var(--beto-light);border-radius:var(--radius-pill);background:var(--surface);color:var(--text-primary);font-size:var(--font-small);font-weight:800}
.beto-assistant-image{width:min(330px,100%);height:350px;object-fit:contain;object-position:center bottom;justify-self:center;align-self:end;filter:drop-shadow(0 22px 25px color-mix(in srgb,var(--betooth-deep) 20%,transparent))}
.beto-assistant-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:var(--space-4);margin-top:var(--space-4)}
.beto-chat,.beto-quick-panel{border:1px solid var(--beto-light);border-radius:var(--radius-xl);background:var(--surface);padding:var(--card-padding);box-shadow:var(--shadow-sm)}
.beto-chat-head{display:flex;align-items:center;gap:var(--space-3);padding-bottom:var(--space-4);border-bottom:1px solid var(--beto-light)}
.beto-chat-head img{width:58px;height:58px;object-fit:contain;border-radius:18px;background:var(--beto-highlight-surface)}
.beto-chat h2,.beto-quick-panel h2{margin:0;color:var(--text-primary);font-size:26px;letter-spacing:-.5px}
.beto-chat-head p{margin:4px 0 0;color:var(--text-secondary)}
.beto-message-log{min-height:180px;padding:var(--space-5) 0;display:grid;gap:var(--space-3);align-content:start}
.beto-message{max-width:82%;padding:var(--space-4);border-radius:var(--radius-lg);line-height:1.55}
.beto-message-author{display:block;margin-bottom:4px;font-size:13px}
.beto-message p{margin:0}
.beto-message-assistant{justify-self:start;background:var(--beto-highlight-surface);border:1px solid var(--beto-light);color:var(--text-primary);border-bottom-left-radius:6px}
.beto-message-user{justify-self:end;background:var(--beto-deep);color:var(--text-on-dark);border-bottom-right-radius:6px}
.beto-composer{border-top:1px solid var(--beto-light);padding-top:var(--space-4)}
.beto-composer>label{display:block;margin-bottom:8px;color:var(--text-primary);font-weight:900}
.beto-composer-row{display:flex;align-items:stretch;gap:var(--space-3)}
.beto-composer textarea{flex:1;min-width:0;min-height:var(--control-height-touch);resize:vertical;border:1px solid var(--beto-light);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);color:var(--ink);background:var(--beto-paper);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}
.beto-composer textarea:focus{border-color:var(--beto-deep);outline-color:var(--beto-mint)}
/* Keep Arabic marks inside a generous line box without changing chat typography. */
.app #pageMount .beto-page .beto-composer textarea#betoMessage{box-sizing:border-box;min-height:80px;max-height:200px;height:auto;padding:12px 10px;font-size:16px;line-height:1.9;text-align:start;unicode-bidi:plaintext;field-sizing:content;overflow-y:auto;overflow-x:hidden;white-space:pre-wrap;overflow-wrap:break-word;resize:none}
.beto-composer button{align-self:stretch;min-height:var(--control-height);border:1px solid var(--beto-deep);border-radius:var(--radius-md);padding:0 var(--space-5);background:var(--beto-deep);color:var(--text-on-dark);font-weight:900;transition:box-shadow var(--transition-fast),transform var(--transition-fast)}
.beto-composer button:hover{box-shadow:inset 0 -3px 0 var(--beto-mint)}
.beto-composer button:active{transform:translateY(1px)}
.beto-composer-hint{margin:8px 0 0;color:var(--text-secondary);font-size:12px}
.beto-quick-panel{background:var(--beto-paper)}
.beto-quick-panel h2{margin:8px 0 16px}
.beto-quick-actions{display:grid;gap:var(--space-3)}
.beto-quick-actions a{display:grid;gap:var(--space-1);min-height:68px;padding:var(--space-4);border:1px solid var(--beto-light);border-radius:var(--radius-lg);background:var(--surface);color:var(--text-primary);text-decoration:none;transition:border-color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast)}
.beto-quick-actions a:hover{border-color:var(--beto-mint);box-shadow:inset 4px 0 0 var(--beto-mint)}
.beto-quick-actions a:active{transform:translateY(1px)}
.beto-quick-actions span{font-weight:900}
.beto-quick-actions small{color:var(--text-secondary)}
.beto-page :focus-visible{outline-color:var(--beto-deep)}
@media(max-width:900px){.beto-intro{grid-template-columns:1fr .65fr;padding:var(--space-7) var(--space-7) 0}.beto-assistant-grid{grid-template-columns:1fr}}
@media(max-width:640px){.beto-intro{grid-template-columns:1fr;padding:var(--space-6) var(--space-5) 0;text-align:left}.beto-intro-copy{padding-bottom:var(--space-3)}.beto-assistant-image{height:250px}.beto-chat,.beto-quick-panel{padding:var(--space-4)}.beto-message{max-width:94%}.beto-composer-row{flex-direction:column}.beto-composer button{min-height:var(--control-height-touch)}.beto-assistant-grid{gap:var(--space-3)}}

/* Phase 12: one integrated, source-grounded Beto workspace. */
.beto-intro{border-color:var(--border-subtle);background:radial-gradient(circle at 78% 48%,color-mix(in srgb,var(--betooth-muted) 22%,transparent),transparent 34%),linear-gradient(135deg,var(--bg-panel),var(--bg-card));box-shadow:var(--shadow-soft)}
.beto-intro p,.beto-eyebrow{color:var(--text-secondary)}
.beto-status{display:inline-flex;margin-top:var(--space-3);padding:8px 12px;border:1px solid var(--border-subtle);border-radius:var(--radius-pill);background:var(--bg-card);color:var(--text-secondary);font-size:var(--font-small);font-weight:800}.beto-status.is-ready{border-color:color-mix(in srgb,var(--betooth-light) 48%,transparent);color:var(--text-primary);box-shadow:0 0 18px color-mix(in srgb,var(--betooth-muted) 12%,transparent)}
.beto-workspace{display:grid;grid-template-columns:240px minmax(0,1fr) 300px;gap:var(--space-4);margin-top:var(--space-4)}
.beto-chat,.beto-source-panel,.beto-history{border:1px solid var(--border-subtle);border-radius:var(--radius-xl);background:var(--bg-panel);padding:var(--card-padding);box-shadow:var(--shadow-soft)}
.beto-history{align-self:start;display:grid;gap:var(--space-3);padding:var(--space-4)}.beto-history h2{margin:4px 0 0;font-size:var(--font-h4)}.beto-new-chat{width:100%;min-height:44px}
.beto-chat-list{
  display:grid;
  gap:6px;
  max-height:360px;
  overflow-y:auto;
  overflow-x:hidden;
}

.beto-chat-list-item{
  display:grid;
  grid-template-columns:1fr;
  gap:4px;
  width:100%;
  min-width:0;
  padding:6px;
  border:1px solid transparent;
  border-radius:var(--radius-md);
  background:var(--bg-card);
}

.beto-chat-link{
  width:100%;
  min-width:0;
  padding:5px 6px;
  text-align:start;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:600;
}

.beto-chat-actions-group{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:5px;
  width:100%;
  padding:0;
}

.beto-chat-actions-group[hidden],
.beto-chat-link[hidden]{
  display:none !important;
}

.beto-chat-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  min-height:27px;
  padding:4px 7px;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-sm);
  background:transparent;
  color:var(--text-secondary);
  font-size:10px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  transition:
    background .18s ease,
    border-color .18s ease,
    color .18s ease;
}

.beto-chat-action:hover{
  background:var(--bg-hover);
  color:var(--text-primary);
}

.beto-chat-rename{
  color:var(--text-secondary);
}

.beto-chat-delete{
  color:var(--betooth-orange);
}

.beto-chat-delete:hover{
  border-color:color-mix(in srgb,var(--betooth-orange) 42%,transparent);
  background:color-mix(in srgb,var(--betooth-orange) 10%,transparent);
  color:var(--text-primary);
}

.beto-chat-rename-editor{
  display:grid;
  grid-template-columns:minmax(0,1fr) 30px 30px;
  gap:5px;
  width:100%;
  align-items:center;
}

.beto-chat-rename-input{
  width:100%;
  min-width:0;
  min-height:32px;
  padding:5px 8px;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-sm);
  background:var(--bg-panel);
  color:var(--text-primary);
  font:inherit;
  outline:none;
}

.beto-chat-rename-input:focus{
  border-color:var(--accent-primary);
  box-shadow:var(--glow-active);
}

.beto-chat-rename-input[aria-invalid="true"]{
  border-color:var(--betooth-orange);
}

.beto-chat-rename-save,
.beto-chat-rename-cancel{
  width:30px;
  height:30px;
  min-height:30px;
  padding:0;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-sm);
  font-size:14px;
  font-weight:800;
  cursor:pointer;
}

.beto-chat-rename-save{
  background:var(--accent-primary);
  color:var(--text-primary);
}

.beto-chat-rename-cancel{
  background:transparent;
  color:var(--text-secondary);
}

.beto-chat-empty{
  margin:8px;
  color:var(--text-secondary);
  font-size:var(--font-small);
}

.beto-load-older{
  width:100%;
}
.beto-preferences{border-top:1px solid var(--border-subtle);padding-top:var(--space-3)}.beto-preferences summary{cursor:pointer;color:var(--text-primary);font-weight:700}.beto-preferences form{display:grid;gap:10px;margin-top:12px}.beto-preferences label{display:grid;gap:4px;color:var(--text-secondary);font-size:12px}.beto-preferences input,.beto-preferences select{width:100%;min-height:38px;border:1px solid var(--border-subtle);border-radius:var(--radius-sm);padding:7px 9px;background:var(--bg-card);color:var(--text-primary)}.beto-preference-actions{display:grid;gap:6px}.beto-preference-actions button{min-height:38px;padding:7px 10px;font-size:12px}.beto-preferences-status{min-height:1.2em;margin:0;color:var(--text-secondary);font-size:12px}
.beto-chat-head{border-color:var(--border-subtle)}.beto-chat-head p,.beto-source-panel>p{color:var(--text-secondary)}
.beto-message{white-space:normal}.beto-message-content{unicode-bidi:plaintext}.beto-message-content[dir="rtl"]{text-align:right}.beto-message-content[dir="ltr"]{text-align:left}.beto-message-content p,.beto-message-content ul,.beto-message-content ol,.beto-message-content h1,.beto-message-content h2,.beto-message-content h3{margin:0 0 .55em}.beto-message-content>:last-child{margin-bottom:0}.beto-message-content ul,.beto-message-content ol{padding-inline-start:1.4em}.beto-message-content h1,.beto-message-content h2,.beto-message-content h3{font-size:1.05em;line-height:1.35}.beto-ltr-term{direction:ltr;unicode-bidi:isolate;display:inline}.beto-message-assistant{background:var(--bg-card);border-color:var(--border-subtle)}.beto-message-user{background:linear-gradient(135deg,var(--accent-primary),var(--betooth-deep));color:var(--text-primary)}.beto-message-error{justify-self:start;border:1px solid color-mix(in srgb,var(--betooth-orange) 42%,transparent);background:color-mix(in srgb,var(--betooth-orange) 8%,transparent);color:var(--text-primary)}.beto-message-pending{color:var(--text-secondary)}
.beto-composer{border-color:var(--border-subtle)}.beto-composer textarea{border-color:var(--border-subtle);background:var(--bg-card);color:var(--text-primary)}.beto-composer textarea:focus{border-color:var(--accent-primary);box-shadow:var(--glow-active)}
.beto-mode-selector{display:flex;gap:8px;margin:0 0 10px}.beto-mode-selector label{position:relative;display:grid;grid-template-columns:auto 1fr;column-gap:7px;align-items:center;min-width:145px;padding:8px 10px;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--bg-card);cursor:pointer}.beto-mode-selector label:has(input:checked){border-color:var(--border-active);box-shadow:var(--glow-active)}.beto-mode-selector input{grid-row:1/3}.beto-mode-selector span{color:var(--text-primary);font-weight:800}.beto-mode-selector small{color:var(--text-secondary);font-size:10px}.beto-active-source{margin:12px 0 0;padding:8px 11px;border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:var(--text-secondary);font-size:var(--font-small)}
.beto-source-panel h2{margin:8px 0 6px}.beto-source-card{display:grid;width:100%;gap:4px;margin-top:10px;padding:12px;text-align:start;border:1px solid var(--border-subtle);border-radius:var(--radius-md);background:var(--bg-card);color:var(--text-primary)}.beto-source-card span,.beto-source-card small{
  line-height:1.45;
  display:-webkit-box;
  -webkit-line-clamp:3;
  line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.beto-mcq-tutor{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:10px;margin-top:var(--space-4);padding:var(--space-3);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);background:var(--bg-panel)}.beto-mcq-output{grid-column:1/-1;margin:0;color:var(--text-secondary);white-space:pre-wrap}
.beto-quiz{max-width:100%;width:100%}.beto-quiz fieldset{display:grid;gap:8px;margin-top:14px;padding:14px;border:1px solid var(--border-subtle);border-radius:var(--radius-md)}.beto-quiz legend{padding-inline:6px;font-weight:800}.beto-quiz label{display:flex;align-items:flex-start;gap:8px;padding:8px;border-radius:var(--radius-sm);background:var(--bg-panel)}.beto-quiz-feedback{margin:4px 0 0;color:var(--text-secondary)}
.lesson-document-card>div:last-child{display:flex;flex-wrap:wrap;gap:8px}
@media(max-width:1180px){.beto-workspace{grid-template-columns:220px minmax(0,1fr)}.beto-source-panel{grid-column:2}.beto-history{grid-row:1/3}}
@media(max-width:900px){.beto-workspace{grid-template-columns:1fr}.beto-history{grid-row:auto}.beto-chat-list{display:flex;max-height:none;overflow-x:auto;scroll-snap-type:x proximity;padding:2px}.beto-chat-list-item{min-width:190px;scroll-snap-align:start}.beto-source-panel{grid-column:auto;order:2}}
@media(max-width:640px){.beto-workspace{gap:var(--space-3)}.beto-history,.beto-chat,.beto-source-panel{padding:var(--space-4)}.beto-mode-selector{display:grid;grid-template-columns:1fr 1fr}.beto-mode-selector label{min-width:0}.beto-mode-selector small{display:none}.beto-mcq-tutor{grid-template-columns:1fr 1fr}}
.beto-chat-delete-confirm{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  align-items:center;
  gap:5px;
  width:100%;
}

.beto-chat-delete-confirm span{
  min-width:0;
  color:var(--text-secondary);
  font-size:11px;
}

.beto-chat-delete-confirm-yes,
.beto-chat-delete-confirm-cancel{
  min-height:30px;
  padding:5px 8px;
  border:1px solid var(--border-subtle);
  border-radius:var(--radius-sm);
  font-size:11px;
  font-weight:700;
  cursor:pointer;
}

.beto-chat-delete-confirm-yes{
  background:color-mix(in srgb,var(--betooth-orange) 12%,transparent);
  border-color:color-mix(in srgb,var(--betooth-orange) 42%,transparent);
  color:var(--betooth-orange);
}

.beto-chat-delete-confirm-cancel{
  background:transparent;
  color:var(--text-secondary);
}
@media(max-width:700px){.beto-chat-rename-editor,.beto-chat-delete-confirm{grid-template-columns:1fr}.beto-chat-actions-group{gap:4px}.beto-chat-action{padding:6px 7px;font-size:11px}}

/* One readable conversation column, independent of viewport or message language. */
.app #pageMount .beto-page{scroll-margin-top:calc(var(--topbar-height,76px) + 12px)}
.app #pageMount .beto-page .beto-chat .beto-message-log,
.app #pageMount .beto-page .beto-chat .beto-composer,
.app #pageMount .beto-page .beto-chat .beto-active-source,
.app #pageMount .beto-page .beto-chat .beto-privacy-notice{width:100%;max-width:820px;min-width:0;box-sizing:border-box;margin-inline:auto}
.app #pageMount .beto-page .beto-chat .beto-message-log{min-height:0;padding:8px 0 16px;gap:14px}
.app #pageMount .beto-page .beto-chat .beto-message-assistant{padding-inline-start:56px}
.app #pageMount .beto-page .beto-chat .beto-message-avatar{width:44px;height:54px;object-fit:contain}
.app #pageMount .beto-page .beto-chat .beto-message-author{margin-bottom:4px;font-size:14px}
.app #pageMount .beto-page .beto-chat .beto-message-continuation{margin-block-start:-4px}
.app #pageMount .beto-page .beto-chat .beto-message-continuation .beto-message-avatar{display:none}
/* Preserve sender text for assistive technology without repeating a visual header. */
.app #pageMount .beto-page .beto-chat .beto-message-continuation .beto-message-author{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.app #pageMount .beto-page .beto-chat .beto-composer{gap:10px;padding:12px;bottom:max(8px,env(safe-area-inset-bottom))}
.app #pageMount .beto-page .beto-chat .beto-composer-row{gap:12px;flex-wrap:wrap}
.app #pageMount .beto-page .beto-chat .beto-composer-hint{margin:0;line-height:1.6}
.app #pageMount .beto-page .beto-starters{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:100%}
.app #pageMount .beto-page .beto-starters button{min-height:44px;white-space:normal}
.app #pageMount .beto-page[data-page=beto] .beto-source-panel,
.app #pageMount .beto-page[data-page=beto] .beto-preferences form{top:calc(var(--topbar-height,76px) + 12px);max-height:calc(100dvh - var(--topbar-height,76px) - 28px)}
@media(max-width:1100px){.app #pageMount .beto-page[data-page=beto] .beto-history{top:calc(var(--topbar-height,76px) + 12px);max-height:calc(100dvh - var(--topbar-height,76px) - 28px)}}
@media(max-width:640px){.app #pageMount .beto-page .beto-chat .beto-message-assistant{padding-inline-start:48px}.app #pageMount .beto-page .beto-chat .beto-message-avatar{width:36px;height:46px}.app #pageMount .beto-page .beto-chat .beto-composer{padding:10px}.app #pageMount .beto-page .beto-chat .beto-welcome{min-height:220px}}

/* Bounded chat layout: history owns scrolling; the composer owns a separate row. */
.app:has(.beto-page){height:100dvh;grid-template-rows:auto minmax(0,1fr);overflow:hidden}
.app:has(.beto-page)>.content{height:100%;min-height:0;overflow:hidden}
.app #pageMount:has(.beto-page){height:100%;min-height:0;box-sizing:border-box;overflow:hidden}
.app #pageMount>.page.beto-page[data-page=beto]{height:100%;min-height:0;display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden}
.app #pageMount .beto-page .beto-breadcrumb{margin-bottom:8px;flex:none}
.app #pageMount .beto-page .beto-intro{flex:none}
.app #pageMount .beto-page[data-page=beto] .beto-workspace{flex:1;min-height:0;align-items:stretch;overflow:hidden;margin-top:12px}
.app #pageMount .beto-page[data-page=beto] .beto-chat{display:flex;flex-direction:column;min-height:0;overflow:hidden;gap:8px}
.app #pageMount .beto-page .beto-chat .beto-message-log{flex:1;min-height:64px;max-height:none;overflow-y:auto;overflow-x:hidden;align-content:start;grid-auto-rows:max-content;overscroll-behavior-y:contain;scrollbar-gutter:stable;padding:8px 8px 16px;gap:16px;overflow-anchor:none;scroll-behavior:auto}
.app #pageMount .beto-page .beto-chat .beto-composer{position:static;flex:none;bottom:auto;margin:0 auto;z-index:auto}
.app #pageMount .beto-page .beto-chat .beto-active-source{flex:none;margin:0 auto}
.app #pageMount .beto-page .beto-chat>.beto-composer-hint{flex:none;max-width:820px;width:100%;margin:0 auto;font-size:12px}
.app #pageMount .beto-page .beto-chat .beto-message{align-self:start;line-height:1.75}
.app #pageMount .beto-page .beto-chat .beto-message-assistant:has(.beto-message-avatar){display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:12px;row-gap:4px;padding:0;max-width:760px;width:100%;justify-self:start}
.app #pageMount .beto-page .beto-chat .beto-message-assistant:has(.beto-message-content[dir=rtl]){direction:rtl}
.app #pageMount .beto-page .beto-chat .beto-message-assistant:has(.beto-message-content[dir=ltr]){direction:ltr}
.app #pageMount .beto-page .beto-chat .beto-message-avatar{position:static;grid-column:1;grid-row:1/4;align-self:start}
.app #pageMount .beto-page .beto-chat .beto-message-assistant:has(.beto-message-avatar)>:not(.beto-message-avatar){grid-column:2;min-width:0}
.app #pageMount .beto-page .beto-chat .beto-message-author{text-align:start;margin:0;font-size:13px;line-height:1.5}
.app #pageMount .beto-page .beto-chat .beto-message-content>:last-child{margin-bottom:0}
.app #pageMount .beto-page .beto-chat .beto-message-sources{justify-self:start;margin-top:4px}
.app #pageMount .beto-page .beto-chat .beto-message-user{max-width:min(85%,680px)}
.app #pageMount .beto-page .beto-chat .beto-message-continuation{margin-block-start:-6px}
.app #pageMount .beto-page[data-page=beto] .beto-history{min-height:0;align-self:stretch;display:flex;flex-direction:column;overflow:hidden}
.app #pageMount .beto-page[data-page=beto] .beto-chat-list{flex:1;min-height:0;max-height:none;overflow-y:auto;overflow-x:hidden;align-content:start;grid-auto-rows:max-content;overscroll-behavior-y:contain}
.app #pageMount .beto-page .beto-chat-list-item{flex:none}
@media(min-width:981px){.app:has(.beto-page) .sidebar{height:calc(100dvh - var(--topbar-height));min-height:0;overflow-y:auto;overscroll-behavior:contain}.app:has(.beto-page) .sidebar::after{flex-shrink:1}}
@media(min-width:981px) and (max-height:820px){.app:has(.beto-page) .sidebar::after{display:none}}
@media(max-width:1100px){.app #pageMount .beto-page[data-page=beto] .beto-history{display:none}.app #pageMount .beto-page[data-page=beto] .beto-history.is-open{display:flex}}
@media(max-width:640px){.app #pageMount .beto-page .beto-chat .beto-message-assistant:has(.beto-message-avatar){grid-template-columns:36px minmax(0,1fr);column-gap:8px}.app #pageMount .beto-page .beto-chat .beto-message-log{padding-inline:2px;gap:14px}.app #pageMount .beto-page .beto-chat>.beto-composer-hint{font-size:11px}.app #pageMount .beto-page .beto-chat .beto-composer textarea#betoMessage{max-height:min(200px,25dvh)}}
/* Very short viewports retain page scrolling rather than trap the input. */
@media(max-height:520px){.app:has(.beto-page){height:auto;min-height:100dvh;overflow:visible}.app:has(.beto-page)>.content{height:auto;overflow:visible}.app #pageMount:has(.beto-page){height:auto;overflow:visible}.app #pageMount>.page.beto-page[data-page=beto]{height:auto;overflow:visible}.app #pageMount .beto-page .beto-chat .beto-message-log{flex:none;height:40dvh;min-height:100px}.app #pageMount .beto-page[data-page=beto] .beto-history{max-height:70dvh}}
.beto-vision-host { font-size: .875rem; display: grid; gap: .4rem; }
.beto-vision-host[hidden] { display: none; }
.beto-vision-host label { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; }
.beto-vision-host input[type="file"], .beto-vision-host select { max-width: 100%; min-width: 0; }
.beto-vision-host p { margin: 0; }
.beto-vision-previews { display: flex; gap: .4rem; flex-wrap: wrap; }
.beto-vision-previews img { width: 64px; height: 64px; object-fit: contain; }
/* Keep Send and the message history accessible when attachment details grow. */
@media(max-width:640px){.beto-vision-host{max-height:min(220px,20dvh);overflow-y:auto;overscroll-behavior:contain}}

/* ==========================================================================
   MODERN POLISH FOR ASK BETO (Intro, Chat, Bubbles, Composer)
   ========================================================================== */
.beto-page {
  max-width: 1300px;
  margin-inline: auto;
}

.beto-intro {
  border-radius: 12px;
  background: linear-gradient(135deg, #10242D 0%, #163643 55%, #0D1B21 100%);
  border: 1px solid rgba(143, 174, 184, 0.2);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.32);
  min-height: 280px;
}

.beto-intro h1 {
  font-size: clamp(26px, 2.8vw, 38px);
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 6px;
}

.beto-intro p {
  color: #CBD5E1;
  font-size: 15px;
}

.beto-status {
  background: rgba(45, 212, 191, 0.1);
  border: 1px solid rgba(45, 212, 191, 0.3);
  color: #2DD4BF;
  border-radius: 20px;
  padding: 6px 14px;
  font-weight: 700;
}

.beto-workspace {
  gap: 18px;
  margin-top: 18px;
}

.beto-chat {
  border-radius: 12px;
  background: linear-gradient(160deg, #172D36 0%, #0F1F26 100%);
  border: 1px solid rgba(143, 174, 184, 0.18);
  box-shadow: 0 6px 22px rgba(0, 0, 0, 0.28);
  padding: 24px;
}

.beto-history {
  border-radius: 12px;
  background: linear-gradient(160deg, #152730 0%, #0E1B21 100%);
  border: 1px solid rgba(143, 174, 184, 0.18);
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.25);
  padding: 20px;
}

.beto-history .beto-new-chat {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 11px 16px;
  border-radius: 8px;
  background: linear-gradient(135deg, #FF9E44 0%, #F57C00 100%) !important;
  color: #FFFFFF !important;
  font-weight: 700;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  box-shadow: 0 4px 14px rgba(245, 124, 0, 0.35);
  cursor: pointer;
  transition: transform 0.16s ease, filter 0.16s ease;
}

.beto-history .beto-new-chat:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
}

.beto-message-user {
  background: linear-gradient(135deg, #164E63 0%, #0E7490 100%) !important;
  color: #FFFFFF !important;
  border-radius: 14px 14px 2px 14px;
  padding: 14px 18px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}

.beto-message-assistant {
  background: #112229 !important;
  border: 1px solid rgba(143, 174, 184, 0.2) !important;
  color: #F1F5F9 !important;
  border-radius: 14px 14px 14px 2px;
  padding: 14px 18px;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.2);
}

.beto-composer {
  border-top: 1px solid rgba(143, 174, 184, 0.15);
  padding-top: 18px;
}

.beto-composer textarea#betoMessage {
  border-radius: 10px !important;
  background: #0E1A1F !important;
  border: 1px solid rgba(143, 174, 184, 0.22) !important;
  color: #FFFFFF !important;
  padding: 14px !important;
  font-size: 15px !important;
}

.beto-composer textarea#betoMessage:focus {
  border-color: #2DD4BF !important;
  box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.2) !important;
  outline: none !important;
}

.beto-composer button[type="submit"] {
  border-radius: 8px;
  background: linear-gradient(135deg, #FF9E44 0%, #F57C00 100%) !important;
  color: #FFFFFF !important;
  font-weight: 700;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  box-shadow: 0 4px 14px rgba(245, 124, 0, 0.35);
  padding: 0 24px;
  cursor: pointer;
  transition: transform 0.16s ease, filter 0.16s ease;
}

.beto-composer button[type="submit"]:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
}

/* Mode Selector styling */
.beto-mode-selector {
  display: inline-flex;
  background: #0E1A1F;
  border: 1px solid rgba(143, 174, 184, 0.2);
  border-radius: 8px;
  padding: 3px;
  gap: 4px;
}

.beto-mode-selector label {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  border-radius: 6px;
  color: #94A3B8;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.14s ease;
}

.beto-mode-selector label:has(input:checked) {
  background: rgba(45, 212, 191, 0.15);
  color: #2DD4BF;
  font-weight: 700;
}

.beto-mode-selector input[type="radio"] {
  display: none;
}

/* History Chat List */
.beto-chat-list .beto-chat-item {
  border-radius: 8px;
  border: 1px solid rgba(143, 174, 184, 0.12);
  background: #112229;
  padding: 10px 14px;
  margin-bottom: 8px;
  color: #CBD5E1;
  transition: all 0.14s ease;
}

.beto-chat-list .beto-chat-item:hover {
  background: rgba(45, 212, 191, 0.08);
  border-color: rgba(45, 212, 191, 0.3);
  color: #FFFFFF;
}

.beto-chat-list .beto-chat-item.is-active {
  border-inline-start: 3px solid #2DD4BF;
  background: rgba(45, 212, 191, 0.12);
  color: #2DD4BF;
}

/* Preferences Dropdown */
.beto-preferences form {
  border-radius: 12px;
  background: #10242D;
  border: 1px solid rgba(143, 174, 184, 0.25);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
  padding: 20px;
}

