/* Shared page language from reise_landing: calm surfaces, travel accents,
   generous spacing. Loaded after page styles; selectors stay component-scoped. */
.page-shell {
  --page-accent: var(--blog-accent-color, var(--primary));
}
.page-shell > *,
.page-heading > *,
.profile-section-body > *,
.notifications-layout > * {
  min-width: 0;
}
.page-shell :is(.page-heading, .editor-page-heading, .travel-home-heading,
  .guides-hero, .steps-header, .studio-heading) {
  overflow-wrap: anywhere;
}
.page-shell :is(.page-heading, .editor-page-heading) {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0 0 1.5rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid var(--border);
  border-radius: 16px;
  background: linear-gradient(125deg, color-mix(in srgb, var(--page-accent) 8%, transparent), transparent 70%), var(--surface);
  box-shadow: var(--shadow-sm);
}
.page-shell :is(.page-heading, .editor-page-heading) h1,
.admin-design .admin-page-header h1 {
  margin: .35rem 0 .65rem;
  color: var(--text);
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -.04em;
  overflow-wrap: anywhere;
}
.page-shell :is(.page-heading, .editor-page-heading) p {
  max-width: 42rem;
  margin: 0;
  color: var(--muted);
  font-weight: 400;
  line-height: 1.65;
}
.page-shell :is(.page-heading, .editor-page-heading, .guides-page,
  .notifications-page, .profile-container, .post-detail, .travel-overview) .section-kicker {
  margin: 0 0 .4rem;
  color: var(--muted);
  font-size: .72rem;
  font-weight: 650;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.page-heading-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}
.page-shell .global-search-page { padding: clamp(1.25rem, 3vw, 2rem); }
.page-shell .global-search-page h1 {
  margin: .35rem 0 .65rem;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 650;
  letter-spacing: -.04em;
  line-height: 1.2;
  overflow-wrap: anywhere;
}
.page-shell .editor-page-heading { display: block; }

/* Account and notification subpages use independent cards like the home. */
.page-shell .profile-container,
.page-shell .notifications-page {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  gap: 1.5rem;
}
.page-shell .profile-container > .page-heading,
.page-shell .notifications-page > .page-heading { margin-bottom: 0; }
.profile-container .profile-section {
  margin: 0;
  border-radius: 16px;
  overflow-wrap: anywhere;
}
.profile-container .profile-section > summary {
  padding: 1.25rem;
  font-size: 1rem;
  font-weight: 650;
  letter-spacing: -.02em;
}
.profile-container .profile-summary > div {
  min-width: 0;
  background: linear-gradient(140deg, color-mix(in srgb, var(--page-accent) 7%, transparent), transparent), var(--surface);
}
.profile-container .profile-summary span {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .07em;
}
.profile-container .profile-summary strong {
  font-weight: 650;
  letter-spacing: -.04em;
  font-variant-numeric: tabular-nums;
}
.notifications-page .notifications-hero { display: flex; }
.notifications-page :is(.push-settings-panel, .notification-group,
  .notification-archive, .notification-item) {
  border-radius: 16px;
  box-shadow: var(--shadow-sm);
}
.notifications-page .notification-item {
  padding: 1.25rem;
  gap: 1rem;
  transition: border-color 200ms ease, box-shadow 200ms ease;
}
.notifications-page .notification-copy { min-width: 0; overflow-wrap: anywhere; }
.notifications-page .notification-summary span {
  background: var(--surface-muted);
  border-radius: var(--radius);
  font-weight: 500;
}
.notifications-page .notification-item.is-unread {
  border-color: color-mix(in srgb, var(--page-accent) 40%, var(--border));
  background: linear-gradient(115deg, color-mix(in srgb, var(--page-accent) 6%, transparent), transparent), var(--surface);
}

/* Reading pages: maintain image/block layouts and separate comments. */
.page-shell .post-detail { max-width: none; }
.page-shell .post-detail .post-hero { display: block; }
.post-detail :is(.post-body, .rating-panel, .comments-section, .management-bar) {
  border-radius: 16px;
  margin-bottom: 1.5rem;
}
.post-detail .post-hero h1 {
  max-width: 48rem;
  margin: .85rem 0 1.25rem;
  font-size: clamp(1.65rem, 4vw, 2.6rem);
  text-wrap: balance;
}
.post-detail .post-card-meta { color: var(--muted); font-size: .82rem; }
.post-detail .post-body { padding: clamp(1.25rem, 3vw, 2rem); }
.post-detail :is(.post-content, .comment-content) { overflow-wrap: anywhere; }
.post-detail .management-bar { background: var(--surface-muted); }
.post-detail .comments-header h2 {
  font-size: 1.4rem;
  font-weight: 650;
  letter-spacing: -.035em;
}

/* Existing tools and help keep their layouts, adopting the home hierarchy. */
.guides-page > *, .guides-page .guides-layout > * { min-width: 0; }
.guides-page :is(.guide-body, .guides-sidebar) { overflow-wrap: anywhere; }
.guides-page .guides-hero h1 {
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 650;
  letter-spacing: -.04em;
}
.guides-page .guides-shortcuts a {
  min-width: 0;
  border-radius: 16px;
  background: linear-gradient(145deg, color-mix(in srgb, var(--page-accent) 8%, transparent), transparent 65%), var(--surface);
  box-shadow: var(--shadow-sm);
  overflow-wrap: anywhere;
  transition: transform 200ms ease, border-color 200ms ease, box-shadow 200ms ease;
}
.guides-page :is(.guide-article, .guides-footer) { border-radius: 16px; }
.guides-page .guides-stamp {
  border-radius: 16px;
  background: var(--surface);
  color: var(--text);
  box-shadow: var(--shadow-sm);
}
.page-shell :is(.error-container, .comment-edit-container, .tripgpt-page) {
  width: 100%;
  max-width: 860px;
  margin: 0 auto;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
}
.error-container > p {
  padding: 1.25rem;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  overflow-wrap: anywhere;
}
.comment-edit-form, .tripgpt-form { display: grid; gap: .85rem; }
.comment-edit-form textarea { min-height: 12rem; }
.comment-edit-form .form-footer { margin: .5rem 0 0; }

/* Consistent touch targets and keyboard focus, including admin icon actions. */
.page-shell :is(.primary-action, .secondary-action, .admin-button) { min-height: 44px; }
.page-shell :is(.primary-action, .secondary-action) { font-weight: 650; }
.page-shell .primary-action { color: #052e16; }
.page-shell .comment-action-button {
  min-width: 44px;
  min-height: 44px;
}
.admin-design .admin-row-actions .comment-action-button {
  width: 44px;
  padding: 0;
  border-radius: 50%;
}
.page-shell :is(a, button, summary, input, select, textarea):focus-visible {
  outline: 3px solid var(--page-accent);
  outline-offset: 3px;
}
.page-shell :is(.empty-state, .travel-empty-state, .guides-empty) {
  border: 1px dashed var(--border-strong);
  border-radius: 16px;
  padding: clamp(1.25rem, 3vw, 2rem);
  background: linear-gradient(125deg, color-mix(in srgb, var(--page-accent) 5%, transparent), transparent), var(--surface);
  box-shadow: none;
  overflow-wrap: anywhere;
}
@media (hover: hover) {
  .guides-page .guides-shortcuts a:hover {
    transform: translateY(-3px);
    border-color: var(--page-accent);
    box-shadow: var(--shadow-md);
  }
  .notifications-page .notification-item:hover { border-color: var(--border-strong); }
}
@media (max-width: 640px) {
  .page-shell :is(.page-heading, .editor-page-heading) { padding: 1.25rem; }
  .notifications-page .notification-read-form { width: 100%; }
  .notifications-page .notification-read-form button { width: 100%; }
  .notifications-page .notification-item { flex-wrap: wrap; padding: 1rem; }
  .profile-container .profile-summary { grid-template-columns: 1fr; }
  .profile-container .profile-summary > div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
  }
  .profile-container .profile-summary strong { margin: 0; }
  .post-detail .post-body { padding: 1rem; }
  .page-heading-actions { width: 100%; }
  .guides-page .guides-search label { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .page-shell *, .page-shell *::before, .page-shell *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
  .guides-page .guides-shortcuts a:hover { transform: none; }
}