/* Form sizing follows the mobile library canvas without changing the design previews. */
body.new-entry-page {
  width: 100%;
  max-width: 440px;
  margin-inline: auto;
}

.new-entry-page .topbar { height: 54px; }
.new-entry-page .content { padding: 4px 16px 24px; }
.new-entry-page .intro { padding: 12px 4px 18px; }
.new-entry-page .intro-title { font-size: 23px; }
.new-entry-page .intro p { margin-top: 6px; }
.new-entry-page .intro .signature { margin-top: 6px; }
.new-entry-page .panel { padding: 16px; }
.new-entry-page .panel-header { margin-bottom: 10px; }
.new-entry-page .panel-header h2 { font-size: 14px; }
.new-entry-page #raw-input {
  min-height: 176px;
  padding: 12px;
  font-size: 16px;
  line-height: 1.65;
  resize: vertical;
}
.new-entry-page .parse-action { margin-top: 14px; }
.new-entry-page .parse-action .button { width: 100%; min-height: 44px; }
.new-entry-page .design-note { margin-top: 20px; }
.new-entry-page .input-note:empty { display: none; }
.new-entry-page dialog.copy-sheet { max-width: 440px; }

.assets-page .asset-dialog {
  width: calc(100% - 24px);
  max-width: 416px;
  max-height: calc(100svh - 24px);
  max-height: calc(100dvh - 24px);
  padding: 18px;
  border-radius: 20px;
}
.assets-page .asset-dialog-heading { margin-bottom: 12px; }
.assets-page .asset-dialog-heading h2 { font-size: 17px; }
.assets-page .asset-dialog .field {
  display: grid;
  gap: 6px;
  margin-block: 12px;
}
.assets-page .asset-dialog .field-label { font-size: 13px; }
.assets-page .asset-dialog .field-control {
  min-height: 44px;
  padding: 10px 12px;
  font-size: 16px;
  line-height: 1.5;
}
.assets-page .asset-dialog .asset-value-input { height: 70px; }
.assets-page .asset-dialog .asset-note-input { min-height: 76px; height: 76px; }
.assets-page[data-asset-kind="p"] #create-value,
.assets-page[data-asset-kind="p"] #create-note { height: 46px; min-height: 46px; }
.assets-page .asset-dialog .input-note { margin-top: 8px; }
.assets-page .asset-dialog .input-note:empty { display: none; }
.assets-page .asset-dialog-actions { margin-top: 14px; }
.assets-page .asset-dialog-actions .button { min-height: 44px; }

@media (max-width: 359px) {
  .new-entry-page .content { padding-inline: 12px; }
  .new-entry-page .panel { padding: 14px; }
  .new-entry-page .intro-title { font-size: 21px; }
  .assets-page .asset-dialog { padding: 16px; }
}

@media (min-width: 520px) {
  body.new-entry-page,
  .new-entry-page dialog.copy-sheet { max-width: 390px; }
  .assets-page .asset-dialog { max-width: 366px; }
}

/* Only the middle section scrolls; close, copy and copy feedback stay reachable. */
.compose-page #copy-dialog,
.compose-page #category-manager-dialog {
  width: 100%;
  max-width: 440px;
  height: min(88svh, 820px);
  height: min(88dvh, 820px);
  max-height: calc(100dvh - 16px);
  padding: 0;
  overflow: hidden;
}
.compose-page #copy-dialog[open],
.compose-page #category-manager-dialog[open] { display: flex; flex-direction: column; }
.copy-sheet-header { flex-shrink: 0; padding: 12px 20px 8px; background: #fff; }
.copy-sheet-header .sheet-handle { margin-bottom: 10px; }
.copy-sheet-header .sheet-title h2,
.copy-sheet-header.sheet-title h2 { font-size: 20px; }
.copy-sheet-header .icon-button { width: 44px; height: 44px; flex-shrink: 0; font-size: 24px; }
.copy-sheet-body {
  flex: 1;
  min-height: 0;
  padding: 0 20px 16px;
  overflow-y: auto;
  overscroll-behavior: contain;
}
.copy-sheet-actions { flex-shrink: 0; padding: 0 20px max(12px, env(safe-area-inset-bottom)); background: #fff; }
.copy-sheet-actions .sheet-footer { margin-top: 0; padding: 12px 0 4px; }
.copy-sheet-actions .button { min-height: 44px; }
.copy-sheet-actions .input-note { margin-top: 8px; }
.copy-sheet-actions .input-note:empty { display: none; }
body.compose-page:has(dialog[open]) { overflow: hidden; }

body.organize-page { width: 100%; max-width: 440px; margin-inline: auto; }
.organize-page .topbar { height: 54px; }
.organize-page .content { padding: 4px 16px 24px; }
.organize-page .hero { padding: 12px 4px 16px; }
.organize-page .category-hero-title { font-size: 24px; }
.organize-page .hero-description { margin-top: 6px; font-size: 12px; }
.category-manager .archive-toolbar { margin-bottom: 12px; }
.category-manager .category-heading { margin: 16px 0 10px; }
.category-manager .category-heading h2 { font-size: 14px; }
.category-manager .category-grid { gap: 8px; }
.category-manager .category-card { padding: 12px; border-radius: 14px; }
.category-manager .category-card h3 { margin-bottom: 4px; font-size: 16px; }
.category-manager .category-row { gap: 8px; padding: 12px; border-radius: 14px; }
.category-manager .category-row h3 { font-size: 14px; }
.category-manager .category-row .button { min-height: 40px; padding: 8px 10px; }
.category-manager .category-create { margin-top: 16px; padding: 16px; }
.category-manager .field { gap: 8px; }
.category-manager .field-label { font-size: 14px; }
.category-manager .field-control { padding: 10px 12px; font-size: 16px; line-height: 1.5; }
.category-manager .action-bar { margin: 12px 0 0; }
.category-manager .action-bar .button { flex: 1; min-height: 44px; }
.category-manager .input-note:empty { display: none; }
.category-manager .category-help { margin-top: 12px; }
.category-manager dialog.copy-sheet { max-width: 440px; }

@media (min-width: 520px) {
  .compose-page #copy-dialog,
  .compose-page #category-manager-dialog,
  .category-manager dialog.copy-sheet,
  body.organize-page { max-width: 390px; }
}