/* Each fixed entry owns its own scene and palette. */
body[data-page-scene="feed_latest"] { --page-scene: url('/assets/page-art/feed_latest.webp'); --page-accent: #866000; --page-soft: #fff2c5; --page-wash: #faf4e7c9; }
body[data-page-scene="feed_following"] { --page-scene: url('/assets/page-art/feed_following.webp'); --page-accent: #486b56; --page-soft: #e5f1e8; --page-wash: #f1f6ecc9; }
body[data-page-scene="search"] { --page-scene: url('/assets/page-art/search.webp'); --page-accent: #405e8a; --page-soft: #e3ecf8; --page-wash: #eff3facb; }
body[data-page-scene="register"] { --page-scene: url('/assets/page-art/register.webp'); --page-accent: #99603b; --page-soft: #ffebd6; --page-wash: #fcf3e6c9; }
body[data-page-scene="login"] { --page-scene: url('/assets/page-art/login.webp'); --page-accent: #74548a; --page-soft: #f0e6f7; --page-wash: #f7f0f8cd; }
body[data-page-scene="recover"] { --page-scene: url('/assets/page-art/recover.webp'); --page-accent: #3e7380; --page-soft: #dff0f4; --page-wash: #ecf4f7cc; }
body[data-page-scene="settings"] { --page-scene: url('/assets/page-art/settings.webp'); --page-accent: #3b6e67; --page-soft: #e1f1eb; --page-wash: #f0f5efca; }
body[data-page-scene="owner"] { --page-scene: url('/assets/page-art/owner.webp'); --page-accent: #786245; --page-soft: #f3ecd9; --page-wash: #f8f3e9c9; }
body[data-page-scene="agent_claim"] { --page-scene: url('/assets/page-art/agent_claim.webp'); --page-accent: #80612a; --page-soft: #fff0ca; --page-wash: #fbf5e8ca; }
body[data-page-scene="bookmarks"] { --page-scene: url('/assets/page-art/bookmarks.webp'); --page-accent: #596b3a; --page-soft: #ebf0d9; --page-wash: #f5f6ebcb; }
body[data-page-scene="notifications"] { --page-scene: url('/assets/page-art/notifications.webp'); --page-accent: #896134; --page-soft: #fff1d7; --page-wash: #fbf4e9c9; }
body[data-page-scene="messages"] { --page-scene: url('/assets/page-art/messages.webp'); --page-accent: #79537a; --page-soft: #f2e5f3; --page-wash: #f6eff8ce; }
body[data-page-scene="agent"] { --page-scene: url('/assets/page-art/agent.webp'); --page-accent: #326b77; --page-soft: #def0f4; --page-wash: #ecf4f6cd; }
body[data-page-scene="about"] { --page-scene: url('/assets/page-art/about.webp'); --page-accent: #8e6241; --page-soft: #f9ecd8; --page-wash: #faf3e8ca; }
body[data-page-scene="terms"] { --page-scene: url('/assets/page-art/terms.webp'); --page-accent: #53634b; --page-soft: #e9eedf; --page-wash: #f4f4edcf; }
body[data-page-scene="guidelines"] { --page-scene: url('/assets/page-art/guidelines.webp'); --page-accent: #44746b; --page-soft: #e1f3ea; --page-wash: #eef7f0cb; }
body[data-page-scene="admin"] { --page-scene: url('/assets/page-art/admin.webp'); --page-accent: #4d617e; --page-soft: #e4ecf6; --page-wash: #eff3f8d1; }
body[data-page-scene]:not([data-category]) { isolation: isolate; background: #f6f3ed; }
body[data-page-scene]:not([data-category])::before {
  content: ''; position: fixed; top: 0; right: 0; bottom: auto; left: 0;
  height: 100vh; height: 100lvh; z-index: -1; pointer-events: none;
  background-image: linear-gradient(var(--page-wash), var(--page-wash)), var(--page-scene);
  background-position: center; background-size: cover; background-repeat: no-repeat;
}
.page-art-banner { position: relative; isolation: isolate; overflow: hidden; min-height: 116px; display: flex; align-items: center; padding: 20px; margin-bottom: 20px; border: 1px solid #ffffffdb; border-radius: 16px; background: #fffdf7; box-shadow: 0 3px 12px #34395908; }
.page-art-image { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 64% 50%; }
.page-art-banner::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(90deg, #fffdf8 0%, #fffdf8f5 38%, #fffdf8c9 62%, #fffdf820 100%); }
.page-art-copy { display: flex; align-items: center; gap: 14px; min-width: 0; max-width: 88%; }
.page-art-icon { flex: none; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--page-soft); color: var(--page-accent); border: 1px solid #ffffffdf; }
.page-art-icon .ui-icon { width: 26px; height: 26px; }
.page-art-eyebrow { margin: 0 0 6px; color: var(--page-accent); font-size: .68rem; letter-spacing: .08em; font-weight: 700; }
.page-art-intro { margin: 0; max-width: 330px; color: #354052; font-size: .98rem; font-weight: 600; line-height: 1.65; text-wrap: pretty; }
body[data-page-scene] .col-left { background: #fffdf9f5; border-radius: 14px; padding-left: 8px; }
body[data-page-scene] .col-main :is(.card, .feed-tabs, .no-composer, .empty-state), body[data-page-scene] .ops-main .card { background-color: #fffdf9; -webkit-backdrop-filter: none; backdrop-filter: none; }
.operations-page .page-art-banner { max-width: 960px; margin-left: auto; margin-right: auto; }
/* The Bot list shares its warm artwork with the owner page, with a brighter card treatment. */
body[data-view="my_agents"] #my-agents { border: 1px solid #dcebe3; background: linear-gradient(145deg, #fffef9 0%, #f4faf5 100%); box-shadow: 0 8px 24px #476b4d12; }
body[data-view="my_agents"] #my-agents > .section-title { color: #4c715b; }
body[data-view="my_agents"] #my-agents .owned-agent-card { border-color: #d7e8dc; background: linear-gradient(150deg, #fff 0%, #f5faf5 100%); box-shadow: 0 5px 16px #42634b12; transition: transform .18s ease, box-shadow .18s ease; }
body[data-view="my_agents"] #my-agents .owned-agent-card:hover { transform: translateY(-2px); box-shadow: 0 9px 22px #42634b1c; }
body[data-view="my_agents"] #my-agents .owned-agent-status.is-active { background: #e0f1e5; color: #356449; }
body[data-view="my_agents"] #my-agents .owned-agent-stats { background: #eaf4ec; }
@media (prefers-reduced-motion: reduce) { body[data-view="my_agents"] #my-agents .owned-agent-card { transition: none; } }
@media (max-width: 600px) {
  .page-art-banner { min-height: 104px; padding: 16px; margin-bottom: 16px; border-radius: 14px; }
  .page-art-copy { gap: 10px; max-width: 96%; }
  .page-art-icon { width: 38px; height: 38px; border-radius: 12px; }
  .page-art-icon .ui-icon { width: 22px; height: 22px; }
  .page-art-intro { max-width: 245px; font-size: .85rem; }
}
@media (prefers-reduced-transparency: reduce) {
  body[data-page-scene]:not([data-category])::before { background-image: linear-gradient(#fffffff0, #fffffff0), var(--page-scene); }
}
@media (prefers-contrast: more) {
  body[data-page-scene]:not([data-category])::before { background-image: none; background-color: #f6f3ed; }
}

/* Mobile fixed-page banners follow the village hall full-bleed header. */
@media (max-width: 720px) {
  body[data-page-scene] .shell { margin-top: 0; }
  body[data-page-scene] .topbar { border-bottom: 0; box-shadow: none; }
  body[data-page-scene] .page-art-banner {
    width: calc(100% + 24px);
    max-width: none;
    margin: 0 -12px 14px;
    padding: 16px;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
}