/* 保留三端各自的配色；这里只约束视口、滚动边界和输入方式。 */
.stage, main, .feed-scroll { min-height: 0; }
.stage, #rail { height: 100vh; height: 100dvh; }
#rail-toggle, #rail-backdrop { display: none; }
#rail .rail-nav { overflow-y: auto; min-height: 0; }
.table-scroll { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.table-scroll table { width: max-content; min-width: 100%; }
.table-scroll td { white-space: nowrap; }
.table-scroll .wrap { white-space: pre-wrap; }
:is(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--accent); outline-offset: 3px;
}
.tray-open .face:is(button) { padding: 0; border: 1px solid var(--line); cursor: pointer; }
.deck:is(button) { padding: 0; border: 0; background: transparent; }
.tray-open { min-width: min(260px, calc(100vw - 16px)); max-width: min(380px, calc(100vw - 16px)); }
.tpl-overlay {
  top: var(--app-top, 0px); bottom: auto; height: var(--app-height, 100dvh);
  padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right))
    max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
}
.tpl-modal { max-height: 100%; overscroll-behavior: contain; }
.tpl-modal-video :is(video, img) {
  display: block; width: 100%; max-height: calc(var(--app-height, 100dvh) - 140px); object-fit: contain;
}
.asset-preview .tpl-modal-video { flex: 1; min-width: 0; }
.asset-preview .tpl-modal-side { flex: 0 1 220px; }

@media (max-width: 760px) {
  /* Safari 的键盘只缩小 visualViewport；100dvh 本身不能保证发送键仍可见。 */
  body { position: fixed; left: 0; right: 0; top: var(--app-top, 0px); height: var(--app-height, 100dvh); overflow: hidden; }
  .stage { width: 100%; height: 100%; }
  #rail-toggle {
    display: inline-grid; place-items: center; flex: 0 0 44px; width: 44px; height: 44px;
    padding: 0; border: 1px solid var(--line-soft); border-radius: var(--r-sm);
    background: transparent; color: var(--ink-2); font: inherit; font-size: 18px;
  }
  body.auth #rail-toggle { display: none; }
  #rail {
    position: fixed; left: 0; top: var(--app-top, 0px); z-index: 60;
    width: min(82vw, 300px); height: var(--app-height, 100dvh);
    transform: translateX(-100%); transition: transform .2s ease;
    padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom) env(safe-area-inset-left);
  }
  body.rail-open #rail { transform: translateX(0); box-shadow: 8px 0 30px rgba(0,0,0,.5); }
  #rail-backdrop {
    display: block; position: fixed; left: 0; right: 0; top: var(--app-top, 0px); bottom: auto;
    height: var(--app-height, 100dvh); z-index: 55; background: rgba(0,0,0,.5);
    opacity: 0; pointer-events: none; transition: opacity .2s ease;
  }
  body.rail-open #rail-backdrop { opacity: 1; pointer-events: auto; }
  #topbar {
    height: auto; min-height: 54px; gap: 8px;
    padding: env(safe-area-inset-top) max(10px, env(safe-area-inset-right)) 0 max(10px, env(safe-area-inset-left));
  }
  #topbar :is(h1, .title) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  #topbar #who { display: none; }
  #topbar #balance { font-size: 12px; padding-inline: 6px; white-space: nowrap; }
  #topbar #logout { flex-shrink: 0; }
  #banner { padding: max(4px, env(safe-area-inset-top)) 12px 4px; }
  #banner + #topbar { padding-top: 0; }
  main { padding: 14px max(12px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
  section { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }
  .card { padding: 12px; min-width: 0; }
  .tiles { grid-template-columns: repeat(auto-fit, minmax(min(128px, 100%), 1fr)); }
  .row { flex-wrap: wrap; }
  .row > * { max-width: 100%; }
  .row > .grow { min-width: 0; flex-basis: 100%; }
  body.auth main { display: block; min-height: 0; padding: 12px; overflow-y: auto; }
  body.auth main > section { margin: 16px auto; }
  input:not([type=checkbox]):not([type=radio]), select, textarea, .composer textarea, .link-row input { font-size: 16px; }
  .composer-dock {
    padding: 6px max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left));
    max-height: 65%; overflow-y: auto;
  }
  .composer textarea { min-height: 60px; max-height: min(160px, calc(var(--app-height, 100dvh) * .25)); }
  /* 手机键盘收缩后仍保留模型、附件和发送入口；重复的模式/统计徽标不占一整行。 */
  .composer-bar :is(.mode, .fact, .sep) { display: none; }
  .composer-bar select.pill { max-width: 150px; padding-inline: 6px; }
  .mentions { min-width: 0; width: 100%; max-width: 100%; }
  .hello { padding-top: 24px; }
  .hello h1 { font-size: clamp(21px, 6vw, 27px); text-align: center; }
  .home-glow { height: 280px; filter: blur(45px); }
  .tpl-modal { padding: 14px; gap: 14px; }
  .asset-preview .tpl-modal-side { flex-basis: auto; }
  .bulk { padding-bottom: max(10px, env(safe-area-inset-bottom)); }
  .more-menu { max-width: calc(100vw - 48px); }
}

/* 平板也没有可靠的悬停；入口常显，触控目标不依赖设备名称。 */
@media (hover: none), (pointer: coarse), (max-width: 760px) {
  button, button.act, button.link, .rail-more, #new-project, .composer-bar .pill, .tray-open .drop,
  .msg-act, .cell .acts :is(a, button), .tpl-manage button, .seg button {
    min-width: 44px; min-height: 44px;
  }
  .composer-bar .pill { height: auto; }
  .msg-act { display: inline-flex; align-items: center; justify-content: center; }
  .rail-acts { display: block; }
  .msg-actions { opacity: 1; }
  .cell { padding-bottom: 44px; }
  .cell .acts { top: auto; right: 0; bottom: 0; left: 0; opacity: 1; display: flex; justify-content: flex-end; background: var(--card); }
  .cell .clock { bottom: 50px; }
  .cell .pickbox { width: 44px; height: 44px; left: 0; top: 0; opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  #rail, #rail-backdrop, .msg-actions, .deck .card { transition: none; }
  .home-glow { animation: none; }
}

/* 确认删除弹窗（responsive.mjs 的 confirmDialog）：对照即梦——小而窄、标题一行、后果一段、右下「取消 / 删除」。 */
/* 遮罩自己写全：后台 / 代理商后台的页面里没有 index.html 里那套 .tpl-overlay。 */
.confirm-overlay {
  position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 20px;
  background: rgba(0,0,0,.65);
}
.confirm-modal {
  display: block; width: min(400px, 100%); max-width: 400px; padding: 22px 24px 20px;
  background: var(--card, #1c1c20); border: 1px solid var(--line, #2a2a31); border-radius: 14px;
  box-shadow: 0 18px 60px rgba(0,0,0,.55);
}
.confirm-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.confirm-head h3 { margin: 0; font-size: 15px; font-weight: 650; line-height: 1.5; word-break: break-all; }
.confirm-x {
  all: unset; box-sizing: border-box; cursor: pointer; flex: 0 0 auto; width: 26px; height: 26px; margin: -3px -6px 0 0;
  display: grid; place-items: center; border-radius: 8px; font-size: 20px; line-height: 1; color: var(--ink-3, #8a8a94);
}
.confirm-x:hover, .confirm-x:focus-visible { background: rgba(255,255,255,.08); color: var(--ink, #ececf0); }
.confirm-body { margin: 14px 0 0; font-size: 13px; line-height: 1.75; color: var(--ink-2, #b8b8c2); white-space: pre-wrap; }
.confirm-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 22px; }
.confirm-actions button {
  all: unset; box-sizing: border-box; cursor: pointer; min-width: 64px; padding: 8px 18px; text-align: center;
  border-radius: 9px; font-size: 13px; font-weight: 600;
}
.confirm-cancel { background: rgba(255,255,255,.1); color: var(--ink, #ececf0); }
.confirm-cancel:hover { background: rgba(255,255,255,.16); }
.confirm-ok { background: var(--accent, #5b8cff); color: #fff; }
.confirm-ok.danger { background: #fff; color: #111; }
.confirm-ok:hover { filter: brightness(.9); }
.confirm-actions button:focus-visible { outline: 2px solid rgba(255,255,255,.35); outline-offset: 2px; }