/* Viewport and motion corrections for the September 12 release. */
.portal-main, .portal-view, .dashboard-panel, .metric-grid > *,
.dashboard-split > *, .chat-prompt-card, .chat-action-pills { min-width: 0; }
.portal-sidebar { overflow-y: auto; overscroll-behavior: contain; }
.portal-sidebar__bottom { padding-top: 20px; }
.portal-main { padding-top: clamp(20px, 4vh, 54px); }
#chat.portal-view.is-active {
  height: calc(100dvh - clamp(20px, 4vh, 54px) - 20px);
  max-height: none;
  min-height: 0;
}
.portal-main:has(#chat.is-active) { padding-bottom: 20px; }
.chat-container { grid-template-columns: minmax(180px, 230px) minmax(0, 1fr); }
.chat-viewport { overscroll-behavior: contain; }
.chat-bottom-bar { flex: 0 0 auto; }
.chat-prompt-actions, .chat-action-pills { flex-wrap: wrap; gap: 8px; }
.chat-prompt-submit-group { margin-left: auto; }
.chat-welcome { flex-shrink: 0; }
.chat-ag-menu { max-width: min(360px, calc(100vw - 52px)); max-height: min(420px, 55dvh); overflow-y: auto; }
.chat-voice-button {
  width: 36px; height: 36px; flex: 0 0 36px; display: grid; place-items: center;
  padding: 8px; border: 1px solid var(--line); border-radius: 11px;
  background: var(--paper); color: var(--ink); cursor: pointer;
  transition: background 160ms ease, color 160ms ease, box-shadow 160ms ease;
}
.chat-voice-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; }
.chat-voice-button:hover { background: var(--paper2); }
.chat-voice-button:focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.chat-voice-button[aria-pressed="true"] { color: #fff; background: #c93849; box-shadow: 0 0 0 4px #c938491a; }
.chat-voice-status { margin: 4px 0 0; font-size: 12px; line-height: 1.5; color: var(--muted); }
.chat-voice-status:empty { display: none; }
/* Keep data tables scrollable inside their panel rather than clipping the page. */
.keys-panel, .requests-panel, .referral-table, .contribution-grid { max-width: 100%; overflow-x: auto; }
@media (min-width: 761px) and (max-width: 1440px) {
  .portal-sidebar { width: 224px; padding: 24px 16px 18px; }
  .portal-main { margin-left: 224px; padding-left: 24px; padding-right: 24px; }
  .portal-plans-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 761px) and (max-width: 1100px) {
  .chat-container { grid-template-columns: 1fr; }
  .chat-sidebar { display: none; }
}
@media (max-width: 760px) {
  .portal-main { margin-left: 0; padding: 18px 12px 32px; }
  .portal-main:has(#chat.is-active) { padding-bottom: 10px; }
  #chat.portal-view.is-active { height: calc(100dvh - 96px); min-height: 0; }
  .chat-container { grid-template-columns: minmax(0, 1fr); }
  .chat-sidebar { display: none; }
  .chat-viewport { padding: 18px 12px; }
  .chat-bottom-bar { padding: 8px 10px max(10px, env(safe-area-inset-bottom)); }
  .chat-textarea { font-size: 16px; max-height: 25dvh; }
  .chat-welcome__title { margin-bottom: 20px; }
  .chat-get-started { grid-template-columns: 1fr; }
  .chat-char-counter { font-size: 10px; }
}
@media (max-width: 480px) {
  .portal-heading h1 { font-size: clamp(38px, 12vw, 48px); overflow-wrap: anywhere; }
}
@media (max-height: 800px) {
  .portal-sidebar { padding-top: 18px; padding-bottom: 12px; }
  .chat-welcome__title { font-size: clamp(24px, 3vw, 34px); margin-bottom: 18px; }
  .chat-get-started { margin-top: 18px; }
  .menu { overflow-y: auto; justify-content: flex-start; gap: 30px; padding-top: 100px; }
  .hero__visual { min-height: 320px; }
}
/* Restrained, consistent motion: short fades instead of bouncing data and controls. */
.portal-view.is-active { animation: henvori-view-enter 220ms cubic-bezier(.2,.7,.2,1) both; }
@keyframes henvori-view-enter { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: none; } }
.contribution-chart i { animation: none; }
.plan-card, .plan-card__cta, .text-button { --tx: 0px !important; --ty: 0px !important; }
.plan-card { transition: border-color 180ms ease, box-shadow 180ms ease; }
.plan-card:hover { transform: none; box-shadow: 0 8px 24px #00000014; }
.page-transition { background: var(--paper, #f1f1f9); color: var(--ink, #111); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}