/* Standalone web layout: keep the recovered visual assets and scope overrides. */
html { -webkit-text-size-adjust: 100%; }
body.web-account-mode {
  --web-header-height: calc(44px + env(safe-area-inset-top, 0px));
  --fd-safe-body-inset-top: 0px;
  --fd-safe-body-inset-bottom: env(safe-area-inset-bottom, 0px);
  --fd-bottom-tab-bar-height: calc(94px + env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
  padding-top: var(--web-header-height) !important;
  min-height: 100vh;
  min-height: 100dvh;
  background: #082e20;
}
body.web-account-mode .web-account-bar {
  height: var(--web-header-height);
  box-sizing: border-box;
  padding: env(safe-area-inset-top, 0px) max(14px, env(safe-area-inset-right, 0px)) 0 max(14px, env(safe-area-inset-left, 0px));
  font-size: 13px;
  background: #082e20;
}
.web-account-bar a { min-height: 44px; display: inline-flex; align-items: center; }
body.web-account-mode #app-root {
  height: calc(100vh - var(--web-header-height)) !important;
  height: calc(100dvh - var(--web-header-height)) !important;
}
body.web-account-mode .my-info { top: var(--web-header-height) !important; gap: 8px; }
body.web-account-mode .my-info-username { font-size: 14px; }
body.web-account-mode .my-info-tguser { font-size: 11px; opacity: .7; }
body.web-account-mode .home-page {
  height: calc(100vh - var(--web-header-height));
  height: calc(100dvh - var(--web-header-height));
  max-width: var(--fd-max-width, 540px);
}
body.web-account-mode .bottom-tab-bar {
  bottom: calc(8px + env(safe-area-inset-bottom, 0px));
  width: min(calc(100% - 16px), 520px);
}
body.web-account-mode .bottom-tab-bar button { min-width: 44px; min-height: 44px; touch-action: manipulation; }
body.web-account-mode :is(input, textarea, select) { font-size: 16px; }
body.web-account-mode :is(input, textarea) { scroll-margin-block: 100px; }
body.web-account-mode :is(.task-item-left, .task-item-title) { min-width: 0; overflow-wrap: anywhere; }
body.web-account-mode .task-item .action-go { min-height: 44px; }
body.web-account-mode .share-primary .share-area > :is(.invite-card, .copy-btn) { min-height: 44px; }
body.web-account-mode .share-primary .share-area > .copy-btn { flex-basis: 44px; width: 44px; }
body.web-account-mode :is(.popup-base, .drawer-content) {
  box-sizing: border-box;
  max-width: calc(100vw - 16px) !important;
  max-height: calc(100vh - 24px);
  max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  overflow-y: auto;
  overscroll-behavior: contain;
}
body.web-account-mode :is(.popup-body, .drawer-body) { min-width: 0; min-height: 0; }
body.web-account-mode :is(#web-invite-dialog, .web-task-dialog) {
  max-height: calc(100vh - 24px);
  max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
  overflow-y: auto;
  overscroll-behavior: contain;
  margin: auto;
  padding: 24px;
  border-radius: 20px;
}
body.web-account-mode :is(#web-invite-dialog .invite-close, .web-task-dialog .close-task) {
  width: 44px; height: 44px; right: 6px; top: 6px; padding: 0;
}
body.web-account-mode #web-invite-dialog input { font-size: 16px; }
body.web-account-mode :is(#web-invite-title, .web-task-dialog h2) { padding-right: 24px; }
body.web-account-mode .web-unavailable { margin: 8vh auto; box-sizing: border-box; width: 100%; }
@media (max-width: 360px) {
  body.web-account-mode .my-info { padding-inline: 10px; gap: 6px; }
  body.web-account-mode .my-info-avatar { width: 28px; height: 28px; }
  body.web-account-mode .my-info-left { gap: 6px; }
  body.web-account-mode .share-primary .share-area > .invite-card > span.title { font-size: 14px; }
  body.web-account-mode :is(#web-invite-dialog, .web-task-dialog) { padding: 20px; }
  body.web-account-mode #web-invite-title { font-size: 24px; }
}
@media (max-height: 480px) and (orientation: landscape) {
  body.web-account-mode .wheel-stack { max-width: 280px; }
  body.web-account-mode .share-primary { padding-top: 2px; }
  body.web-account-mode :is(#web-invite-dialog, .web-task-dialog) { padding-block: 16px; }
}
@media (prefers-reduced-motion: reduce) {
  body.web-account-mode .bottom-tab-bar *, body.web-account-mode dialog { animation: none !important; transition: none !important; }
}
/* Fit the whole wheel above the persistent actions on short portrait screens. */
body.web-account-mode .home-page .wheel-stack {
  max-width: clamp(200px, calc(100dvh - 360px), 480px);
}
@media (max-height: 480px) and (orientation: landscape) {
  body.web-account-mode .home-page { overflow-y: auto; }
  body.web-account-mode .home-page .wheel-zone { flex: 0 0 auto; min-height: 390px; }
  body.web-account-mode .home-page .wheel-scroll { position: relative; height: auto; overflow: visible; }
  body.web-account-mode .home-page .wheel-stack { max-width: 240px; }
}