/* iOS standalone chrome, safe areas, and stable touch interaction. */
:root {
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
  --safe-left: env(safe-area-inset-left, 0px);
}
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; background: #fff; }
/* Give iOS system chrome a solid surface, without changing the content layout. */
html.is-standalone::before { content: ''; position: fixed; inset: 0 0 auto; height: var(--safe-top); background: #fff; pointer-events: none; z-index: 30; }
html.is-standalone .sidebar { background: #fff; opacity: 1; filter: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
body { min-height: 100svh; padding-left: var(--safe-left); padding-right: var(--safe-right); }
.drawer {
  top: var(--app-viewport-top, 0px); bottom: auto;
  height: var(--app-viewport-height, 100dvh); max-height: var(--app-viewport-height, 100dvh);
}
.home-install-entry {
  display: flex; align-items: center; justify-content: flex-end; gap: 14px;
  padding: 14px 42px 0; font-size: 12px; color: #6b7c70;
}
.home-install-entry .btn { min-height: 44px; font-size: 13px; }
.install-text-button {
  display: block; margin: 16px auto 0; min-height: 44px; padding: 8px 12px;
  border: 0; background: transparent; color: var(--green); font-size: 14px;
  text-decoration: underline; text-underline-offset: 4px;
}
html.is-standalone .home-install-entry, html.is-standalone [data-install-guide] { display: none; }
.connection-notice { margin: 16px 42px 0; padding: 12px 16px; border-radius: 8px; background: #fff3d9; color: #79551b; font-size: 14px; }
.install-dialog { width: min(460px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; }
.install-dialog .modal-top h2 { font-size: 22px; }
.install-dialog .icon-btn { width: 44px; height: 44px; }
.install-brand { display: flex; gap: 14px; align-items: center; margin: 22px 0; }
.install-brand img { flex-shrink: 0; border-radius: 15px; }
.install-brand strong { display: block; font-size: 18px; }
.install-brand span { display: block; margin-top: 3px; font-size: 13px; color: #7a897d; }
.install-dialog p, .install-dialog li { font-size: 14px; line-height: 1.8; }
.install-dialog ol { padding-left: 23px; margin: 16px 0; }
.install-dialog li + li { margin-top: 10px; }
.install-dialog .install-online-note { padding: 12px; border-radius: 8px; background: #f0f4ec; font-size: 13px; }
@media (pointer: coarse) {
  /* Allow ordinary scrolling and text selection, exclude browser pinch zoom. */
  html, body { touch-action: pan-x pan-y; }
  button, a, input, select, textarea, label { touch-action: pan-x pan-y; }
  input, select, textarea, .field input, .field textarea, .field select { font-size: 16px; }
}
@media (max-width: 1024px) {
  input, select, textarea, .field input, .field textarea, .field select { font-size: 16px; }
}
.amount-input input { font-size: 26px; }
@media (min-width: 761px) {
  .sidebar { left: var(--safe-left); top: var(--safe-top); bottom: var(--safe-bottom); }
  .main-content { padding-top: var(--safe-top); padding-bottom: var(--safe-bottom); }
  .drawer-head { padding-top: calc(22px + var(--safe-top)); height: auto; }
  .drawer-footer { padding-bottom: calc(17px + var(--safe-bottom)); padding-right: calc(30px + var(--safe-right)); }
  .drawer-body { padding-right: calc(30px + var(--safe-right)); }
}
@media (max-width: 760px) {
  .sidebar { padding-top: calc(18px + var(--safe-top)); }
  .home-install-entry { padding: 14px 20px 0; justify-content: space-between; gap: 8px; }
  .home-install-entry > span { font-size: 12px; max-width: 120px; }
  .connection-notice { margin: 14px 16px 0; }
  .page-footer { padding-bottom: calc(24px + var(--safe-bottom)); }
  .auth-main { padding-top: calc(32px + var(--safe-top)); padding-bottom: calc(32px + var(--safe-bottom)); }
  .drawer {
    width: 100%; max-width: 100vw; margin: 0;
  }
  .drawer-head, .drawer-body, .drawer-footer { padding-left: calc(18px + var(--safe-left)); padding-right: calc(18px + var(--safe-right)); }
  .drawer-head { padding-top: calc(16px + var(--safe-top)); height: auto; min-height: calc(76px + var(--safe-top)); }
  .drawer-body { overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; scroll-padding-block: 16px; }
  .drawer-footer { padding-bottom: calc(14px + var(--safe-bottom)); }
  .modal { max-height: calc(var(--app-viewport-height, 100dvh) - 24px); overflow-y: auto; }
  .toast-region { bottom: calc(18px + var(--safe-bottom)); }
}
@media (display-mode: standalone) {
  body { overscroll-behavior-y: contain; }
  .home-install-entry { display: none; }
}
@media (max-width: 760px) {
  html.is-standalone .sidebar { position: sticky; top: 0; z-index: 30; }
}
