/* Blue preview theme and responsive calendar / detail companions. */
:root {
  --crm-canvas: #f4f6f9;
  --crm-surface: #ffffff;
  --crm-surface-subtle: #edf2f7;
  --crm-sidebar: #1268a8;
  --crm-field: #f7f9fc;
  --crm-avatar-bg: #e4effa;
  --crm-text: #1c2738;
  --crm-text-muted: #617086;
  --crm-brand: #126bac;
  --crm-brand-hover: #0e5a94;
  --crm-brand-pressed: #0b4879;
  --crm-brand-soft: #e9f2fc;
  --crm-grade-a: #ae4f08;
  --crm-grade-a-soft: #fff0df;
  --crm-grade-b: #126bac;
  --crm-grade-b-soft: #e6f1ff;
  --crm-grade-c: #087c5e;
  --crm-grade-c-soft: #e3f6ee;
  --crm-customer-fill-a: #ffd2a0;
  --crm-customer-fill-b: #b9d9fb;
  --crm-customer-fill-c: #a9e3ca;
  --crm-grade-none: #617086;
  --crm-grade-none-soft: #edf2f7;
  --crm-price: #bd5413;
  --crm-danger: #d52d43;
  --crm-danger-soft: #fff0f2;
  --crm-success: #087c5e;
  --crm-success-soft: #e3f6ee;
  --crm-warning: #9e610e;
  --crm-warning-soft: #fff5db;
  --crm-info: #126bac;
  --crm-info-soft: #e6f1ff;
  --crm-border: #e0e6ee;
  --crm-border-control: #aebdd0;
  --crm-disabled-bg: #e8edf3;
  --crm-disabled-fg: #69788b;
  --crm-overlay: rgb(14 35 58 / 44%);
  --crm-ink-blue: #126bac;
  --crm-gold: #9e610e;
  --crm-shadow-popover: 0 4px 18px rgb(22 56 89 / 12%);
  --crm-shadow-dialog: 0 20px 60px rgb(22 56 89 / 22%);
  --crm-grade-sheen: linear-gradient(165deg, rgb(255 255 255 / 6%), rgb(255 255 255 / 0%) 55%, rgb(0 24 50 / 8%));
  --crm-grade-highlight: inset 0 1px 0 rgb(255 255 255 / 24%), 0 2px 4px rgb(22 56 89 / 12%);
  --crm-shadow-card: 0 1px 2px rgb(22 56 89 / 6%), 0 5px 18px rgb(22 56 89 / 4%);
}

.sidebar {
  color: #ffffff;
  background: linear-gradient(165deg, #146db0 0%, #115f9d 58%, #0c5088 100%);
  border-right-color: #0e5994;
  box-shadow: 4px 0 18px rgb(22 56 89 / 6%);
}
.brand small, .sidebar-bottom { color: #c8e3f8; }
.brand-mark {
  background: rgb(255 255 255 / 12%);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 22%);
}
.brand-mark::after { border-color: rgb(255 255 255 / 28%); }
.nav-link { color: #e4f1ff; }
.nav-link > svg { color: #b9ddfa; }
.nav-link.active {
  color: #ffffff;
  background: linear-gradient(110deg, #2070d8, #1d66c5);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 16%), 0 3px 8px rgb(0 33 80 / 14%);
}
.nav-link.active > svg { color: #ffffff; }
.nav-divider { background: rgb(255 255 255 / 18%); }
.sidebar .preview-dot { background: #8cdcca; }
.sidebar .badge { box-shadow: 0 1px 3px rgb(0 30 70 / 16%); }
.sidebar :focus-visible { outline-color: #ffffff; }
.preview-bar { background: #ffffff; border-bottom-color: #e3e9f0; }

.section, .customer-preview-card, .prop-card, .community-card, .resource-card {
  box-shadow: var(--crm-shadow-card);
}
.section {
  background-image: linear-gradient(180deg, rgb(244 249 255 / 36%), rgb(255 255 255 / 0%) 110px);
}
.prop-cover, .community-card-cover {
  background: linear-gradient(145deg, #eef5fc, #e3edf7);
  color: #517493;
}
.avatar, .customer-preview-detail-avatar { color: #175d92; }
.btn:not(.secondary), .prop-owner {
  background-image: linear-gradient(160deg, rgb(255 255 255 / 9%), rgb(0 29 61 / 7%));
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 18%), 0 2px 4px rgb(22 56 89 / 16%);
}
.btn.secondary { box-shadow: inset 0 1px 0 rgb(255 255 255 / 75%); }
.search, .form-field input, .form-field textarea, .form-field select,
.followup-composer textarea, .customer-preview-composer textarea, .prop-followup textarea {
  border-color: #cad5e2;
  box-shadow: inset 0 1px 2px rgb(22 56 89 / 3%);
}
.task-wrap { box-shadow: 0 1px 3px rgb(22 56 89 / 6%); }
.task-body { box-shadow: inset 0 1px 0 rgb(255 255 255 / 65%); }
.mobile-nav {
  background: #ffffff;
  box-shadow: 0 -3px 16px rgb(22 56 89 / 7%);
}
.mobile-nav a.active {
  color: #126bac;
  background: #e6f1ff;
  box-shadow: inset 0 1px 0 #ffffff;
}
@media (hover: hover) {
  .sidebar .nav-link:not(.active):hover { color: #ffffff; background: rgb(255 255 255 / 11%); }
  .prop-card:hover, .community-card:hover, .resource-card:hover {
    box-shadow: 0 2px 5px rgb(22 56 89 / 8%), 0 8px 22px rgb(22 56 89 / 7%);
  }
}

/* Orange, blue and jade from the supplied dashboard reference. */
:root {
  --blue-grade-a: linear-gradient(125deg, #ff9800 0%, #ff7900 48%, #ff4d00 100%);
  --blue-grade-b: linear-gradient(125deg, #106fb2 0%, #1066a4 50%, #10578c 100%);
  --blue-grade-c: linear-gradient(125deg, #00c18b 0%, #00ae8b 48%, #00998b 100%);
  --crm-grade-a: #934000;
  --crm-grade-b: #105c97;
  --crm-grade-c: #00634f;
  --crm-customer-fill-a: #ffdbb0;
  --crm-customer-fill-b: #bbddf8;
  --crm-customer-fill-c: #a7e9d4;
}
.grade.a { background: var(--blue-grade-a); color: #572500; }
.grade.b { background: var(--blue-grade-b); color: #ffffff; }
.grade.c { background: var(--blue-grade-c); color: #003e32; }
.grade:not(.all) { box-shadow: inset 0 1px 0 rgb(255 255 255 / 45%), inset 0 -1px 0 rgb(0 36 67 / 15%), 0 3px 6px rgb(20 63 99 / 14%); }
.customer-preview-card::before { background: linear-gradient(120deg, color-mix(in srgb,var(--customer-grade-soft),white 12%),var(--customer-grade-soft) 65%,color-mix(in srgb,var(--customer-grade-soft),var(--customer-grade) 12%)); }
.customer-preview-card .avatar, .customer-preview-detail-avatar, .blue-related .avatar { border-radius: 50%; box-shadow: inset 0 1px 0 rgb(255 255 255 / 75%); }
.customer-preview-card .avatar { background: rgb(255 255 255 / 80%); }
.task-wrap.a { --blue-task-tint: #ffe0b9; --blue-grade-gradient: var(--blue-grade-a); --blue-grade-text: #572500; }
.task-wrap.b { --blue-task-tint: #c9e3fa; --blue-grade-gradient: var(--blue-grade-b); --blue-grade-text: white; }
.task-wrap.c { --blue-task-tint: #b6eddb; --blue-grade-gradient: var(--blue-grade-c); --blue-grade-text: #003e32; }
.task-wrap:not(.is-done) .task-body { background: linear-gradient(110deg,var(--blue-task-tint),var(--grade-soft)); }
.task-grade { display: grid; place-items: center; width: 28px; height: 32px; flex: 0 0 28px; border-radius: 8px; background: var(--blue-grade-gradient); color: var(--blue-grade-text); box-shadow: inset 0 1px 0 rgb(255 255 255 / 40%); }

/* A single-column default keeps the core workflow readable on phones. */
.agenda:has(.blue-agenda-layout) { max-width: none; }
.blue-agenda-layout, .blue-detail-layout { display: grid; gap: 20px; align-items: start; }
.blue-agenda-list, .blue-detail-main { min-width: 0; }
.blue-agenda-list > .agenda-day:first-child { margin-top: 0; }
.blue-calendar, .blue-related { min-width: 0; background: var(--crm-surface); border-radius: 12px; box-shadow: var(--crm-shadow-card); }
.blue-calendar { grid-row: 1; }
.blue-calendar > summary, .blue-related summary { display: flex; align-items: center; gap: 8px; padding: 12px 16px; min-height: 48px; cursor: pointer; list-style: none; color: var(--crm-brand); }
.blue-calendar summary::-webkit-details-marker, .blue-related summary::-webkit-details-marker { display: none; }
.blue-calendar summary > span, .blue-related summary > span { margin-left: auto; color: var(--crm-text-muted); font-size: 13px; }
.blue-calendar[open] > summary > svg:last-child, .blue-related details[open] > summary > svg:last-child { transform: rotate(90deg); }
.blue-calendar-content { padding: 0 12px 12px; }
.blue-month-head, .blue-month-head > div { display: flex; align-items: center; justify-content: space-between; gap: 4px; }
.blue-month-head { margin-bottom: 8px; }
.blue-month-head h2 { font-family: var(--crm-font-sans); font-size: 17px; white-space: nowrap; }
.blue-month-head .icon-btn, .blue-month-head .text-btn { min-width: 40px; min-height: 44px; }
.blue-weekdays, .blue-month-grid { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 3px; }
.blue-weekdays { padding: 4px 0 8px; text-align: center; color: var(--crm-text-muted); font-size: 12px; }
.blue-day { display: flex; flex-direction: column; gap: 2px; align-items: stretch; min-width: 0; min-height: 62px; padding: 4px 3px; border: 1px solid transparent; border-radius: 7px; background: var(--crm-field); color: var(--crm-text); text-align: left; }
.blue-day-number { display: flex; align-items: center; justify-content: center; gap: 4px; position: relative; font-size: 14px; line-height: 20px; text-align: center; font-variant-numeric: tabular-nums; }
.blue-day.outside .blue-day-number { color: var(--crm-text-muted); }
.blue-day.outside { background: var(--crm-surface); }
.blue-day[aria-current=date] .blue-day-number { color: var(--crm-brand); font-weight: 800; text-decoration: underline; text-underline-offset: 3px; }
.blue-day[aria-pressed=true] { border-color: var(--crm-brand); background: var(--crm-brand-soft); box-shadow: inset 0 0 0 1px var(--crm-brand); }
.blue-day-agenda { margin-top: 12px; padding-top: 8px; border-top: 1px solid var(--crm-border); }
.blue-day-agenda > header { display: flex; align-items: center; justify-content: space-between; }
.blue-day-agenda h3 { font-family: var(--crm-font-sans); font-size: 15px; }
.blue-day-task { padding: 10px 0; border-bottom: 1px solid var(--crm-border); }
.blue-day-task:last-child { border: 0; padding-bottom: 0; }
.blue-day-task-heading { display: flex; align-items: baseline; gap: 8px; font-size: 14px; }
.blue-day-task-heading strong { min-width: 0; overflow-wrap: anywhere; }
.blue-day-task-heading time { font-variant-numeric: tabular-nums; color: var(--grade-color); font-weight: 600; }
.blue-grade-dot { align-self: center; flex: 0 0 7px; height: 7px; border-radius: 50%; background: var(--grade-color); }
.blue-day-task p { margin: 5px 0 0 15px; font-size: 13px; line-height: 1.6; color: var(--crm-text-muted); overflow-wrap: anywhere; }
.blue-day-task-actions { display: flex; justify-content: flex-end; gap: 8px; }
.blue-day-task-actions .text-btn { min-height: 40px; font-size: 13px; }
.blue-day-task.done strong { text-decoration: line-through; color: var(--crm-text-muted); }
.blue-calendar-empty { padding: 16px 8px; font-size: 14px; color: var(--crm-text-muted); }

.blue-detail-main > .page-content { max-width: none; }
.blue-related { grid-row: 1; }
.blue-related nav { max-height: 65dvh; overflow-y: auto; overscroll-behavior-y: contain; padding: 0 8px 8px; }
.blue-related-card { display: flex; align-items: center; gap: 10px; padding: 12px 8px; border-radius: 8px; border-bottom: 1px solid var(--crm-border); min-width: 0; }
.blue-related-card:last-child { border-bottom-color: transparent; }
.blue-related-image { display: grid; place-items: center; width: 48px; height: 48px; flex: 0 0 48px; border-radius: 8px; background: linear-gradient(140deg,#e7f2fc,#dce9f6); color: var(--crm-brand); overflow: hidden; }
.blue-related-image img { width: 100%; height: 100%; object-fit: cover; }
.blue-related-copy { display: grid; min-width: 0; flex: 1; gap: 3px; }
.blue-related-title { display: flex; gap: 6px; align-items: center; }
.blue-related-title strong { min-width: 0; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.blue-related-price { color: var(--crm-price); font-size: 14px; font-weight: 600; font-variant-numeric: tabular-nums; }
.blue-related-copy small { font-size: 12px; color: var(--crm-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.blue-related-copy .blue-related-reason { color: var(--crm-brand); }
.blue-related-card > svg { width: 14px; color: var(--crm-text-muted); }
@media (hover:hover) {
  .blue-day:hover, .blue-related-card:hover { background-color: var(--crm-brand-soft); }
}
@media (min-width:1100px) {
  .blue-agenda-layout { grid-template-columns: minmax(0,1fr) minmax(400px,48%); }
  .blue-detail-layout { grid-template-columns: minmax(0,1fr) 280px; }
  .blue-calendar, .blue-related { grid-column: 2; grid-row: 1; position: sticky; top: 16px; }
  .blue-agenda-list, .blue-detail-main { grid-column: 1; grid-row: 1; }
  .blue-related nav { max-height: calc(100dvh - 156px); }
  .blue-detail-layout .field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:767px) {
  .blue-agenda-layout, .blue-detail-layout { gap: 12px; }
  .blue-calendar-content { padding-inline: 8px; }
  .blue-day { min-height: 62px; }
  .blue-day-task-actions .text-btn { min-height: 44px; }
  .blue-related nav { max-height: 340px; }
  .blue-detail-main .customer-preview-detail-avatar { grid-row: 1; }
  .blue-detail-main .customer-preview-profile-actions { grid-column: 2 / -1; justify-content: flex-end; flex-wrap: nowrap; }
  .blue-related-card { padding-block: 10px; }
  .task-grade { flex-basis: 24px; width: 24px; height: 28px; font-size: 16px; }
}

/* Sharper edges and layered, blue-tinted elevation. */
:root {
  --crm-border: #cbd8e5;
  --crm-shadow-card: inset 0 1px 0 rgb(255 255 255 / 95%), 0 2px 3px rgb(18 55 89 / 8%), 0 9px 22px -8px rgb(18 55 89 / 18%);
}
.section, .customer-preview-card, .prop-card, .community-card, .resource-card,
.blue-calendar, .blue-related, .task-wrap {
  border: 1px solid var(--crm-border);
  box-shadow: var(--crm-shadow-card);
}
.blue-related-card { border: 1px solid #dae4ed; background: linear-gradient(145deg,#ffffff,#f6f9fc); box-shadow: inset 0 1px 0 white, 0 2px 3px rgb(18 55 89 / 5%); margin-bottom: 8px; }
.blue-related-card:last-child { border-bottom-color: #dae4ed; margin-bottom: 0; }
.blue-related-card.is-current { border-color: var(--crm-brand); background: linear-gradient(130deg,#e6f2ff,#dbeafb); box-shadow: inset 0 0 0 1px rgb(18 107 172 / 20%); }
.blue-related-card[aria-current=page] > svg { color: var(--crm-brand); }
.blue-related-image { width: 48px; height: 48px; flex-basis: 48px; border: 1px solid #d7e4f0; box-shadow: inset 0 1px 0 white; }
.blue-related-title strong { font-size: 15px; }
.blue-related-copy small { font-size: 12px; }
.blue-related-price { font-size: 14px; }
.grade:not(.all) { position: relative; overflow: hidden; }
.grade:not(.all)::after { content: ''; position: absolute; width: 26px; height: 26px; right: -9px; top: -9px; border-radius: 50%; background: rgb(255 255 255 / 12%); pointer-events: none; }
.blue-customer-pager { grid-column: 1 / -1; display: flex; justify-content: flex-end; align-items: center; gap: 10px; padding-top: 4px; }
.blue-customer-pager > span { color: var(--crm-text-muted); font-size: 13px; font-variant-numeric: tabular-nums; }
.blue-customer-pager .btn { min-height: 36px; font-size: 14px; padding: 4px 10px; }
.blue-customer-pin[aria-pressed=true] { color: var(--crm-brand); background: var(--crm-brand-soft); border-radius: 6px; }
.blue-pin-indicator { display: inline-flex; color: var(--crm-brand); }
.blue-pin-indicator svg, .customer-preview-card-head strong svg { width: 13px; height: 13px; }
.customer-preview-card-head strong svg { margin-left: 4px; vertical-align: baseline; }
@media (min-width:1100px) {
  body[data-theme=blue] #view { padding-inline: 24px; }
  :is(.blue-detail-layout--customers,.blue-detail-layout--properties) > .blue-related { position: relative; top: auto; align-self: stretch; }
  :is(.blue-detail-layout--customers,.blue-detail-layout--properties) > .blue-related > details { position: absolute; inset: 0; }
  :is(.blue-detail-layout--customers,.blue-detail-layout--properties) > .blue-related > details[open] { display: flex; flex-direction: column; }
  :is(.blue-detail-layout--customers,.blue-detail-layout--properties) .blue-related details[open] > nav { position: absolute; inset: 48px 0 0; min-height: 0; max-height: none; }
  :is(.blue-detail-layout--customers,.blue-detail-layout--properties) .blue-related summary { flex-shrink: 0; }
  .blue-related-card { padding: 12px 8px; }
  .blue-calendar .blue-day { min-height: 74px; }
  .blue-detail-main .customer-preview-profile-header { grid-template-columns: 32px 64px minmax(0,1fr) auto; column-gap: 8px; }
  .blue-detail-main .customer-preview-detail-avatar { width: 64px; height: 64px; }
  .blue-detail-main .customer-preview-profile-actions { gap: 2px; }
  .blue-detail-main .customer-preview-profile-actions .text-btn { padding-inline: 6px; }
}
@media (max-width:767px) {
  .blue-related-image { width: 48px; height: 48px; flex-basis: 48px; }
  .blue-detail-main .customer-preview-profile-actions { grid-column: 1 / -1; }
  .blue-customer-pager { justify-content: space-between; gap: 8px; }
  .blue-customer-pager .btn { min-height: 44px; }
}

/* Grade belongs to the entire card; neutral detail surfaces remain calm. */
.a, [data-rank="A"], .customer-preview-grade-a { --blue-card-color: var(--blue-grade-a); --blue-card-ink: #431d00; }
.b, [data-rank="B"], .customer-preview-grade-b { --blue-card-color: var(--blue-grade-b); --blue-card-ink: #ffffff; }
.c, [data-rank="C"], .customer-preview-grade-c { --blue-card-color: var(--blue-grade-c); --blue-card-ink: #003a30; }
:root { --blue-card-light: radial-gradient(circle at 100% 0, rgb(255 255 255 / 12%) 0 42px, transparent 43px); }
.task-wrap:not(.is-done) .task-body,
.prop-card[data-rank], .blue-related-card[data-rank]:not([data-rank=""]),
.blue-day-task:not(.done) {
  background: var(--blue-card-light),var(--blue-card-color);
  color: var(--blue-card-ink);
}
.task-wrap:not(.is-done) :is(.task-grade,.task-copy p,.task-time,.task-more,.due-label),
.prop-card[data-rank] :is(.price,.prop-room,.prop-card-facts),
.blue-related-card[data-rank]:not([data-rank=""]) :is(.blue-related-price,small,.blue-pin-indicator),
.blue-related-card[data-rank]:not([data-rank=""]) > svg,
.blue-day-task:not(.done) :is(time,p,.text-btn) { color: var(--blue-card-ink); }
.task-wrap:not(.is-done) .task-grade { background: rgb(255 255 255 / 16%); box-shadow: inset 0 1px 0 rgb(255 255 255 / 32%); }
.task-wrap:not(.is-done) .due-label { font-weight: 700; text-decoration: underline; text-underline-offset: 2px; }
.prop-card[data-rank] .prop-cover { background: rgb(255 255 255 / 10%); color: var(--blue-card-ink); border-bottom: 1px solid rgb(255 255 255 / 22%); }
.blue-related-card.is-current { outline: 2px solid var(--crm-brand); outline-offset: 2px; }
.blue-related nav { padding-top: 4px; }
.blue-day-task { padding: 10px; margin-top: 8px; border: 1px solid var(--crm-border); border-radius: 8px; box-shadow: var(--crm-shadow-card); }
.blue-day-task:last-child { padding-bottom: 10px; border: 1px solid var(--crm-border); }
.blue-day-task:not(.done) .blue-grade-dot { background: var(--blue-card-ink); }
.customer-preview-card::before { background: var(--blue-card-light),var(--blue-card-color); }
.customer-preview-profile, .prop-info, .community-basics {
  background: linear-gradient(130deg,#e7f1fa 0%,#f0f6fc 56%,#e3edf7 100%);
  border-color: #bccfe0;
}
.customer-preview-profile .blue-customer-pin[aria-pressed=true] { background: #d3e5f5; }
.blue-related-card, .blue-day-task, .followup-record, .form-dialog,
.community-image, .community-figure video, .media-thumb {
  border-color: var(--crm-border);
  box-shadow: var(--crm-shadow-card);
}
.followup-record { border: 1px solid var(--crm-border); border-radius: 8px; background: var(--crm-surface); padding: 12px; }

/* Full reminder content, with grade carried by the surface rather than a letter. */
.blue-agenda-list .task-grade { display: none; }
.blue-agenda-list .task-body { align-items: flex-start; }
.blue-agenda-list .task-title, .blue-agenda-list .task-copy p { white-space: pre-wrap; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
.blue-agenda-list .task-more { flex-shrink: 0; }
.blue-agenda-list .task-time { padding-top: 2px; }
.blue-day { position: relative; isolation: isolate; overflow: hidden; padding: 5px; }
.blue-day-colors { position: absolute; inset: 0; z-index: -1; display: flex; flex-wrap: wrap; gap: 1px; }
.blue-day-block { flex: 1 0 calc(100% / var(--day-columns) - 1px); background: var(--blue-card-color); }
.blue-day-block.done { background: #ced8e3; }
.blue-day-number { align-self: flex-start; display: grid; place-items: center; width: 25px; height: 25px; border-radius: 7px; background: rgb(255 255 255 / 94%); color: #1c2738; font-size: 13px; }
.blue-day[aria-pressed=true] { outline: 2px solid var(--crm-brand); outline-offset: 1px; }

.blue-back, .icon-btn[aria-label^="返回"] { background: linear-gradient(145deg,#fff,#dceaf6); border: 1px solid #b5cadc; border-radius: 8px; box-shadow: inset 0 1px 0 white,0 3px 6px rgb(20 55 85 / 16%); color: var(--crm-brand); }
.blue-back svg, .icon-btn[aria-label^="返回"] svg { stroke-width: 2.5; }
.blue-property-title, .blue-property-price-row, .blue-profile-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.blue-property-title h1 { flex: 0 1 auto; }
.blue-room-badge { padding: 4px 10px; background: #d4e6f7; color: #104d7c; border: 1px solid #a6c4de; border-radius: 6px; box-shadow: inset 0 1px 0 white; font-weight: 700; font-size: 15px; }
.blue-property-price-row { margin: 10px 0 12px; }
.blue-property-price-row .prop-detail-actions { margin-left: 4px; gap: 4px; }
.blue-property-price-row .btn, .blue-profile-toolbar .btn, .blue-profile-toolbar .text-btn { min-height: 32px; padding: 4px 8px; font-size: 13px; line-height: 20px; }
.blue-property-price-row svg, .blue-profile-toolbar .customer-preview-profile-actions svg { width: 15px; height: 15px; }
.blue-property-body { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 16px; align-items: start; }
.blue-property-data { min-width: 0; }
.blue-property-tax { display: flex; gap: 8px; flex-wrap: wrap; font-size: 13px; margin-bottom: 12px; color: #355574; }
.blue-property-tax > span { padding: 3px 7px; background: rgb(255 255 255 / 64%); border: 1px solid #c4d6e5; border-radius: 5px; }
.blue-property-data .field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 8px; }
.blue-property-data .field-grid > div { display: grid; grid-template-columns: 56px minmax(0,1fr); gap: 4px; }
.blue-property-data .field-grid dd { white-space: normal; overflow-wrap: anywhere; }
.blue-property-notes { border-top: 1px solid #c7d7e5; margin-top: 12px; padding-top: 8px; }
.blue-property-notes .section-head { margin-bottom: 4px; }
.blue-property-notes h2 { font-family: var(--crm-font-sans); font-size: 14px; }
.blue-property-notes p { font-size: 14px; white-space: pre-wrap; overflow-wrap: anywhere; }
.blue-property-notes .text-btn { font-size: 13px; min-height: 32px; }
.blue-property-media { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; min-width: 0; border-left: 1px solid #c2d4e4; padding-left: 12px; }
.blue-video-symbol { position: absolute; inset: 0; display: grid; place-items: center; color: white; background: rgb(0 20 40 / 20%); pointer-events: none; }
.prop-album-stage video { max-width: 100%; max-height: 65dvh; }
.blue-profile-toolbar { margin-bottom: 12px; }
.blue-profile-toolbar .customer-preview-profile-actions { margin-left: 4px; }
.blue-customer-profile-body { display: grid; grid-template-columns: 132px minmax(0,1fr); gap: 16px; align-items: start; }
 .blue-customer-contact { padding: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; min-width: 0; border: 0; background: none; box-shadow: none; }
.blue-customer-contact .avatar { flex: 0 0 auto; width: 104px; height: 104px; aspect-ratio: 1; font-size: 34px; }
.blue-customer-name h1 { font: 700 22px/28px var(--crm-font-sans); margin: 0; }
.blue-customer-phone { display: flex; align-items: center; gap: 3px; color: #244f73; font-size: 14px; white-space: nowrap; }
.blue-customer-phone svg { width: 13px; height: 13px; }
.blue-customer-profile-body .field-grid { margin: 0; column-gap: 12px; }
.blue-customer-profile-body .field-grid > div { display: grid; grid-template-columns: 56px minmax(0,1fr); gap: 6px; }
.blue-customer-profile-body .field-grid dd { white-space: normal; overflow-wrap: anywhere; }
.blue-customer-profile .blue-customer-pager { padding-top: 12px; }
@media (min-width:768px) and (max-width:1199px) {
  .blue-property-body { grid-template-columns: 1fr; gap: 12px; }
  .blue-property-media { border-left: 0; padding: 8px 0 0; border-top: 1px solid #c2d4e4; }
  .blue-property-data .field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .blue-customer-profile-body { grid-template-columns: 130px minmax(0,1fr); gap: 12px; }
  .blue-customer-profile-body .field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:767px) {
  .blue-property-body, .blue-customer-profile-body { grid-template-columns: 1fr; gap: 12px; }
  .blue-property-media { padding: 10px 0 0; border-left: 0; border-top: 1px solid #c2d4e4; }
  .blue-customer-contact { display: flex; padding: 0; }
  .blue-customer-contact .avatar { width: 104px; height: 104px; }
  .blue-customer-phone { align-self: center; font-size: 14px; }
  .blue-property-price-row .btn, .blue-profile-toolbar .btn, .blue-profile-toolbar .text-btn { min-height: 44px; }
  .blue-property-data .field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .blue-agenda-list .task-body { flex-wrap: wrap; }
  .blue-agenda-list .task-copy { flex-basis: calc(100% - 42px); }
  .blue-agenda-list .task-more { position: absolute; top: 12px; right: 10px; }
  .blue-agenda-list .task-time { flex-direction: row; align-items: center; gap: 8px; padding: 0; }
  .blue-agenda-list .task-time time { max-width: none; white-space: nowrap; }
}

/* Dense days use square tiles, while one-to-four reminders retain split colors. */
.blue-day:has(.blue-day-colors.is-grid) { aspect-ratio: 1; }
.blue-day-colors.is-grid { display: grid; grid-template-columns: repeat(var(--day-columns),minmax(0,1fr)); align-content: center; }
.blue-day-colors.is-grid .blue-day-block { aspect-ratio: 1; }
.blue-community-overview { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,1fr); gap: 16px; align-items: start; }
.blue-community-data { min-width: 0; }
.blue-community-data .detail-header { gap: 8px; flex-wrap: wrap; }
.blue-community-data .detail-title { flex: 0 1 auto; min-width: 0; }
.blue-community-data .detail-header > .icon-btn { margin-left: 0; }
.blue-community-data .community-edit { margin-left: 0; min-height: 32px; padding: 4px 8px; font-size: 13px; }
.blue-community-data .community-fields { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.blue-community-data .community-fields > div { grid-template-columns: 56px minmax(0,1fr); gap: 4px; }
.blue-community-data .community-field-long { grid-column: 1 / -1; }
.blue-community-media { min-width: 0; border-left: 1px solid #c2d4e4; padding-left: 12px; }
.community-image-view video { display: block; max-width: 100%; max-height: 70dvh; margin: auto; }
@media (max-width:1199px) {
  .blue-community-overview { grid-template-columns: 1fr; }
  .blue-community-media { border-left: 0; padding: 8px 0 0; border-top: 1px solid #c2d4e4; }
}
@media (max-width:767px) {
  .blue-community-data .community-edit { min-height: 44px; }
  .blue-customer-profile-body .field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .blue-customer-profile-body .field-grid > div { grid-template-columns: 56px minmax(0,1fr); gap: 4px; }
  .blue-community-data .community-fields > div { grid-template-columns: 56px minmax(0,1fr); }
  .blue-community-data .community-fields dt { width: auto; }
}

@media (max-width:360px) {
  .blue-customer-name { grid-column: 1 / -1; }
  .blue-customer-profile-body .field-grid > div, .blue-community-data .community-fields > div { grid-template-columns: 52px minmax(0,1fr); font-size: 13px; }
}

/* Single media surface and a compact contact row. */
.blue-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.blue-property-body { gap: 12px 16px; }
.blue-property-title h1 a { color: inherit; text-decoration: none; text-underline-offset: 4px; }
.blue-property-title h1 a:hover { color: var(--crm-brand); text-decoration: underline; }
.blue-cover-area { position: relative; display: block; padding: 0; border: 0; border-radius: 8px; overflow: hidden; background: #e0eaf3; }
.blue-property-media.blue-cover-area { min-height: 220px; align-self: stretch; }
.blue-cover-open { position: absolute; inset: 0; display: block; padding: 0; border: 0; width: 100%; height: 100%; background: none; cursor: zoom-in; }
.blue-cover-open > img, .blue-cover-open > video { display: block; width: 100%; height: 100%; object-fit: contain; }
.blue-cover-empty { position: absolute; inset: 0; display: grid; place-items: center; color: #94b2ca; }
.blue-cover-empty > svg { width: 40px; height: 40px; }
.blue-cover-add { position: absolute; right: 8px; top: 8px; width: 36px; min-height: 36px; border: 1px solid #b5cadc; background: #f8fbff; color: var(--crm-brand); border-radius: 8px; box-shadow: var(--crm-shadow-card); }
.blue-property-pager { position: absolute; bottom: 8px; right: 8px; display: flex; gap: 4px; }
.blue-property-pager .btn { background: #f8fbff; font-size: 13px; min-height: 32px; padding: 4px 8px; gap: 2px; box-shadow: 0 2px 5px rgb(20 55 85 / 12%); }
.blue-property-pager svg { width: 14px; height: 14px; }
.blue-property-notes { display: flex; align-items: flex-start; gap: 8px; border: 0; margin: 0; padding: 0; }
.blue-property-notes p { flex: 1; margin: 0; line-height: 24px; }
.blue-property-notes > .text-btn { flex-shrink: 0; min-height: 24px; padding: 0; line-height: 24px; }
.blue-property-body > .prop-owners { align-self: start; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin: 0; padding: 0; }
.blue-property-body .prop-owner { min-height: 32px; padding: 4px 8px; font-size: 13px; gap: 4px; line-height: 24px; }
.blue-property-body .prop-owners > .text-btn { min-height: 32px; padding: 4px; }
.prop-card-inline { flex-wrap: nowrap; gap: 8px; font-size: 13px; margin-top: 4px; }
.prop-card-inline > span:first-child { overflow: hidden; text-overflow: ellipsis; }
.prop-card-inline > span:not(:first-child) { flex-shrink: 0; }
.blue-customer-footer { display: flex; align-items: flex-start; gap: 12px; margin-top: 8px; }
.blue-customer-note { display: flex; gap: 8px; flex: 1; min-width: 0; font-size: 14px; line-height: 24px; }
.blue-customer-note > span { flex-shrink: 0; color: var(--crm-text-muted); }
.blue-customer-note p { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.blue-customer-profile .blue-customer-footer .blue-customer-pager { flex-shrink: 0; padding-top: 0; gap: 6px; }
.blue-customer-footer .blue-customer-pager .btn { min-height: 28px; padding: 2px 6px; font-size: 13px; }
.customer-preview-card { --crm-avatar-list: 72px; padding: 12px; }
.customer-preview-card .avatar { align-self: start; font-size: 30px; }
.prop-followup-list .followup-record, .customer-preview-record { padding: 8px; margin-bottom: 8px; }
.customer-preview-record::before { display: none; }
.prop-record-top .text-btn, .customer-preview-record-top .text-btn { min-height: 28px; padding: 2px 4px; }
.prop-followup-text, .customer-preview-record-text { margin: 0; line-height: 24px; }
.prop-followup-list .prop-gallery, .customer-preview-record .customer-preview-attachments { margin-top: 4px; }
.prop-followup-list .prop-photo { width: 72px; height: 72px; min-height: 0; overflow: hidden; border-radius: 6px; }
.prop-followup-list .prop-photo img { width: 100%; height: 100%; object-fit: cover; }
.community-card-cover { height: auto; aspect-ratio: 16 / 9; }
.blue-community-card-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-bottom: 4px; }
.blue-community-card-head > strong { min-width: 0; max-width: 100%; font-size: 17px; line-height: 24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.blue-community-card-head > span { color: var(--crm-text-muted); font-size: 12px; white-space: nowrap; }
.blue-community-card-head > .price { font-size: 15px; line-height: 24px; white-space: nowrap; }
.community-card-facts { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 2px 8px; }
.community-card-facts > div { min-width: 0; gap: 4px; }
.community-card-facts dt { width: 3em; flex-basis: 3em; }
.blue-community-overview { grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 12px; }
.blue-community-media.blue-cover-area { aspect-ratio: 16 / 9; padding: 0; border: 0; }
.blue-community-media .blue-cover-open > img { object-fit: cover; }
.blue-gallery-navigation { display: flex; align-items: center; gap: 8px; font-variant-numeric: tabular-nums; }
.community-image-dialog .prop-album-tabs { margin-bottom: 12px; }
@media (max-width:1199px) {
  .blue-community-overview { grid-template-columns: 1fr; }
  .blue-property-media.blue-cover-area { aspect-ratio: 16 / 9; min-height: 0; }
}
@media (max-width:767px) {
  .blue-property-pager .btn, .blue-cover-add { min-height: 44px; }
  .blue-cover-add { width: 44px; }
  .blue-customer-footer { flex-wrap: wrap; }
  .blue-customer-note { flex-basis: 100%; }
  .blue-customer-profile .blue-customer-footer .blue-customer-pager { margin-left: auto; }
  .blue-customer-footer .blue-customer-pager .btn { min-height: 44px; }
  .prop-record-top .text-btn, .customer-preview-record-top .text-btn { min-height: 44px; }
  .prop-record-top, .customer-preview-record-top { align-items: flex-end; }
}

@media (max-width:767px) { .blue-property-body .prop-owner { min-height: 44px; } }

/* Let the image lead; navigation and editing sit outside it. */
.blue-property-media { display: flex; flex-direction: column; gap: 8px; align-self: start; padding: 0; border: 0; min-width: 0; }
.property-hero-stage { position: relative; aspect-ratio: 16 / 10; min-width: 0; border-radius: 8px; overflow: hidden; background: #e0eaf3; }
.property-hero-stage .blue-cover-open > img { object-fit: cover; }
.property-upload-space { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 12px; border: 1px dashed #95b4cc; border-radius: 8px; color: #315e80; background: #e9f1f8; cursor: pointer; }
.property-hero-stage > .property-upload-space { width: 100%; height: 100%; font: 14px/24px var(--crm-font-sans); }
.property-upload-space:hover { background: #dceaf5; border-color: var(--crm-brand); }
.blue-property-media .blue-property-pager { position: static; align-self: flex-end; }
.media-thumbnail-strip { display: flex; gap: 8px; overflow-x: auto; padding: 4px 2px; max-width: 100%; min-width: 0; align-items: center; }
.media-thumbnail { position: relative; display: block; flex: 0 0 88px; width: 88px; height: 64px; padding: 0; border: 2px solid transparent; border-radius: 6px; overflow: hidden; cursor: pointer; background: #e5edf4; }
.media-thumbnail > img, .media-thumbnail > video { display: block; width: 100%; height: 100%; object-fit: cover; }
.media-thumbnail[aria-pressed=true] { border-color: var(--crm-brand); box-shadow: 0 1px 4px rgb(20 55 85 / 20%); }
.media-thumbnail.property-upload-space { display: grid; place-items: center; border: 1px dashed #95b4cc; }
.media-cover-label { position: absolute; bottom: 4px; right: 4px; background: #f8fbff; color: #205679; border-radius: 4px; padding: 0 4px; font-size: 12px; }
.prop-album-compact-header { margin-bottom: 8px; }
.prop-album-compact-header > div { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.prop-album-stage { min-height: 160px; }
.prop-album-stage > img, .prop-album-stage > video { max-height: calc(100dvh - 260px); }
.prop-media-manager { display: grid; grid-template-columns: repeat(auto-fill,minmax(144px,1fr)); gap: 12px; padding: 4px; max-height: 58dvh; overflow-y: auto; }
.prop-media-manager .media-thumbnail { width: 100%; height: auto; aspect-ratio: 4 / 3; }
.prop-tasks .task-grade { display: none; }
@media (max-width:767px) {
  .prop-media-manager { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
  .prop-album-compact-header .text-btn { min-height: 44px; }
}

.community-image-dialog:has(.media-thumbnail-strip) .community-image-view :is(img,video) { max-height: calc(100dvh - 340px); }

/* Compact media, independent notes, property tags and contacts. */
body[data-theme="blue"] .blue-property-body{grid-template-columns:minmax(290px,.88fr) minmax(0,1.12fr);gap:12px}
body[data-theme="blue"] .blue-property-media{align-self:stretch;min-width:0}
body[data-theme="blue"] .property-hero-stage{aspect-ratio:16/11;flex:1;min-height:240px}
body[data-theme="blue"] .blue-property-data .blue-property-notes{margin-top:10px;padding-top:8px;border-top:1px solid #c8d8e4;align-items:flex-start}
body[data-theme="blue"] .blue-property-media .prop-owners{margin:0;padding:0;display:flex;flex-wrap:wrap;gap:5px;box-shadow:none;border:0;background:none}
body[data-theme="blue"] .blue-property-media .prop-owner{min-height:32px;padding:5px 9px;font-size:12px}
body[data-theme="blue"] .blue-property-media .blue-property-pager{margin-top:auto;padding-top:2px;align-self:flex-end}
body[data-theme="blue"] .community-upload-space{position:absolute;inset:0;width:100%;height:100%}
.community-album-edit{display:flex;flex-wrap:wrap;gap:6px;padding:0 16px 10px}
.community-album-edit[hidden]{display:none}
body[data-theme="blue"] .blue-customer-note{align-items:center;gap:8px}
body[data-theme="blue"] .blue-customer-note .text-btn{flex-shrink:0}
.property-tags{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}
.property-tag{--tag-ink:#176141;--tag-bg:#e3f5e9;--tag-border:#a6d9b7;display:inline-flex;align-items:center;gap:5px;padding:3px 8px;border:1px solid var(--tag-border);border-radius:7px;background:var(--tag-bg);color:var(--tag-ink);font-size:12px;line-height:1.5;font-weight:650;box-shadow:inset 0 1px 0 #ffffffb3}
.property-tag.tag-1{--tag-ink:#155b92;--tag-bg:#e4f0fc;--tag-border:#a9cde8}
.property-tag.tag-2{--tag-ink:#645294;--tag-bg:#eee9f8;--tag-border:#c8bce2}
.property-tag.tag-3{--tag-ink:#94600d;--tag-bg:#fff1d8;--tag-border:#e8ce92}
.property-tag.tag-4{--tag-ink:#983e51;--tag-bg:#fbe7ed;--tag-border:#e6b6c1}
.property-tag.tag-5{--tag-ink:#13716c;--tag-bg:#e0f3f1;--tag-border:#9fd4d0}
fieldset.tag-options{margin:0;padding:0;border:0;min-width:0}
.tag-options legend{font-size:14px;font-weight:650;margin-bottom:8px}
.tag-options>div{display:flex;flex-wrap:wrap;gap:7px}
.tag-options .property-tag{padding:8px 10px;font-size:14px;cursor:pointer}
.tag-options input[type="checkbox"]{width:16px;height:16px;min-height:0;margin:0;accent-color:var(--tag-ink)}
.tag-options .property-tag:has(:checked){border-color:var(--tag-ink);box-shadow:inset 0 0 0 1px var(--tag-ink),0 2px 4px #18385112}
.contacts-page h1{margin:0;font-size:21px}
.contact-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:12px}
.contact-card{margin:0;padding:10px;min-width:0}
.contact-identity{display:flex;align-items:center;gap:10px}
.contact-avatar{width:60px;height:60px;flex:0 0 60px;border-radius:17px;background:linear-gradient(145deg,#e4f2ff,#b7d6ee);color:#155f95;font-size:24px;border:1px solid #a8c9e1;box-shadow:inset 0 1px 0 #fff,0 3px 7px #1a507218}
.contact-avatar img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.contact-identity>div{flex:1;min-width:0}
.contact-identity h2{margin:0 0 5px;font-size:18px;overflow-wrap:anywhere}
.contact-phone{display:flex;gap:5px;align-items:center;color:#236699;font-size:14px;font-variant-numeric:tabular-nums}
.contact-phone svg{width:14px;height:14px}
.contact-facts{display:grid;grid-template-columns:minmax(0,.66fr) minmax(0,1.34fr);gap:8px;margin:8px 0 6px;font-size:14px;line-height:20px}
.contact-facts>div{display:flex;gap:4px;align-items:baseline;min-width:0}
.contact-facts dt{flex:0 0 auto;white-space:nowrap;color:#667a8b;font-size:13px}
.contact-facts dd{margin:0;min-width:0;color:#223e55;overflow-wrap:anywhere}
.contact-note{margin:0;padding-top:6px;border-top:1px solid #e0e9f0;font-size:13px;line-height:1.5;color:#607486;overflow-wrap:anywhere}
@media(max-width:1199px){body[data-theme="blue"] .blue-property-body{grid-template-columns:1fr}body[data-theme="blue"] .property-hero-stage{flex:auto;min-height:0;aspect-ratio:16/10}}
@media(max-width:640px){body[data-theme="blue"] .blue-property-media .prop-owner{min-height:40px}body[data-theme="blue"] .blue-property-media .blue-property-pager{width:100%;justify-content:space-between}body[data-theme="blue"] .blue-customer-note{width:100%}.contacts-page .toolbar{gap:8px}.contacts-page .toolbar>.meta{flex-basis:100%;font-size:12px}.contact-card{padding:10px}.contact-grid{gap:10px}}


/* Keep property actions together and put identifying tags on the cover. */
.property-media-footer{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:8px;margin-top:auto}
body[data-theme="blue"] .property-media-footer .prop-owners{flex:1 1 190px;align-items:center}
body[data-theme="blue"] .property-media-footer .blue-property-pager{flex:0 0 auto;width:auto;align-self:flex-start;margin:0;padding:0;gap:4px}
body[data-theme="blue"] .property-media-footer .prop-owner,body[data-theme="blue"] .property-media-footer .blue-property-pager .btn{min-height:34px}
.prop-cover>.property-tags{position:absolute;top:8px;left:8px;right:8px;z-index:1;align-content:start;margin:0;gap:4px}
.prop-cover .property-tag{font-size:12px;padding:2px 6px;box-shadow:0 2px 5px #102e4529,inset 0 1px 0 #ffffffb3}
.prop-card-school{display:flex;align-items:center;gap:5px;margin:5px 0 0;font-size:12px;line-height:18px;min-width:0}
.prop-card-school svg{width:14px;height:14px;flex:0 0 14px}
.prop-card-school span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:767px){body[data-theme="blue"] .property-media-footer .prop-owner,body[data-theme="blue"] .property-media-footer .blue-property-pager .btn{min-height:44px}body[data-theme="blue"] .property-media-footer .blue-property-pager{margin-left:auto}}


/* Dense, aligned summary cards: name and price share one reading line. */
.blue-related-card{padding:6px 8px;gap:8px;margin-bottom:6px}
.blue-related-title{gap:5px;line-height:21px;min-width:0}
.blue-related-title strong{flex:1 1 auto}
.blue-related-title .blue-related-price{flex:0 0 auto;white-space:nowrap;font-size:13px;line-height:21px}
.blue-related-copy{gap:2px}
.blue-related-copy small{line-height:18px}
.blue-related-card>svg{flex:0 0 10px;width:10px}
.blue-related .blue-related-summary-icon{margin:0;display:flex;color:inherit}
.blue-related-summary-icon svg{width:18px;height:18px}
.blue-detail-layout--properties .blue-related summary{min-height:36px;padding:6px 12px}
.customer-preview-card{min-height:0;padding:8px;column-gap:10px}
.community-card-facts{grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr)}
.community-card-facts>div:nth-child(odd) dt,.community-card-facts>div:nth-child(4) dt{width:2em;flex-basis:2em}
@media(min-width:1100px){.blue-detail-layout--properties .blue-related details[open]>nav{inset:36px 0 0}}

/* Workbench identity and distraction-free property viewer. */
.brand-mark:has(img){padding:0;background:none;border:0;box-shadow:none;}
.brand-mark img{width:40px;height:40px;display:block;}
.workbench-preview-brand{display:flex;align-items:center;gap:5px;}
.workbench-preview-brand img{width:20px;height:20px;}
.customer-extra-fields{grid-column:2;}
.prop-card[data-rank]{--blue-card-ink:#fff;}
.prop-card[data-rank="A"]{--blue-card-color:linear-gradient(125deg,#bd4f00,#a63b08);}
.prop-card[data-rank="C"]{--blue-card-color:linear-gradient(125deg,#087962,#076451);}
.prop-card[data-rank] .prop-card-school{color:#fff;}
.property-hero-stage{touch-action:pan-y;}
.property-fullscreen-album{position:fixed;inset:0;width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;padding:max(8px,env(safe-area-inset-top)) 12px max(8px,env(safe-area-inset-bottom));border:0;border-radius:0;background:#101923;color:#f2f7fa;box-sizing:border-box;overflow:hidden;}
.property-fullscreen-album[open]{display:flex;flex-direction:column;gap:8px;}
.fullscreen-album-header{display:flex;align-items:center;justify-content:space-between;min-height:36px;flex-shrink:0;font-size:13px;color:#cbdae5;}
.property-fullscreen-album .icon-btn{background:#263746;color:#fff;border:1px solid #496071;border-radius:8px;}
.property-fullscreen-album .prop-album-stage{flex:1;min-height:0;padding:0;overflow:hidden;}
.property-fullscreen-album .prop-album-stage>img,.property-fullscreen-album .prop-album-stage>video{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;}
.property-fullscreen-album .prop-album-prev{left:2px;}
.property-fullscreen-album .prop-album-next{right:2px;}
.fullscreen-album-actions{display:flex;justify-content:flex-end;align-items:center;flex-wrap:wrap;gap:5px;flex-shrink:0;}
.fullscreen-album-actions .text-btn{font:500 12px/20px var(--crm-font-sans);min-height:34px;padding:5px 8px;border:1px solid #496071;background:#263746;border-radius:7px;color:#f2f7fa;}
.property-fullscreen-album .prop-album-status{color:#c5dbe8;margin:0;min-height:0;font-size:12px;line-height:18px;}
.property-fullscreen-album .prop-album-status:empty{display:none;}
.photo-sort-hint{font-size:12px;line-height:20px;margin:0;color:#cbdae5;}
.prop-photo-sort-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;align-content:start;overflow:auto;flex:1;min-height:0;padding:4px;}
.sort-photo{position:relative;min-width:0;aspect-ratio:4/3;padding:0;border:2px solid transparent;border-radius:9px;overflow:hidden;cursor:grab;background:#263746;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;}
.sort-photo img{width:100%;height:100%;object-fit:cover;pointer-events:none;}
.sort-photo>span{position:absolute;bottom:4px;left:5px;border-radius:4px;padding:1px 5px;background:#102838dd;color:white;font-size:12px;}
.sort-photo[aria-pressed=true]{border-color:#9dccdf;}
.sort-photo.is-dragging{opacity:.55;transform:scale(.95);cursor:grabbing;}
.sort-photo.drop-target{outline:3px solid #9dccdf;outline-offset:0;}
.property-fullscreen-album button:disabled{opacity:.4;cursor:default;}
@media(max-width:767px){.prop-photo-sort-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;}.fullscreen-album-actions{gap:4px;}.fullscreen-album-actions .text-btn{padding:5px 6px;font-size:11px;}.property-fullscreen-album .prop-album-prev,.property-fullscreen-album .prop-album-next{width:28px;min-width:28px;height:36px;min-height:36px;background:#26374699;}}
body:has(.property-fullscreen-album[open]){overflow:hidden;}

/* Light photo viewers and compact detail actions. */
.property-fullscreen-album{background:rgba(244,248,252,.94);color:#20394d;backdrop-filter:blur(14px);}
.property-fullscreen-album::backdrop{background:rgba(232,240,248,.4);}
.property-fullscreen-album .fullscreen-album-header,.property-fullscreen-album .prop-album-status{color:#38566d;}
.property-fullscreen-album .icon-btn,.property-fullscreen-album .fullscreen-album-actions .text-btn{background:#ffffffdd;color:#234e70;border-color:#b5cddd;box-shadow:0 2px 5px #28577512;}
.property-fullscreen-album .prop-album-stage{touch-action:none;}
.property-fullscreen-album .plan-zoom-stage{display:block;overflow:auto;touch-action:pan-x pan-y pinch-zoom;}
.property-fullscreen-album .plan-zoom-stage>img{display:block;width:calc(100% * var(--plan-zoom));height:calc(100% * var(--plan-zoom));max-width:none;max-height:none;object-fit:contain;}
.community-fullscreen-album .prop-photo-sort-grid video{width:100%;height:100%;object-fit:cover;}
.price-edit-control{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;text-align:inherit;white-space:inherit;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:3px;}
.price-edit-control:focus-visible{outline:2px solid #1268a7;outline-offset:3px;}
.prop-card a,.customer-card a{color:inherit;text-decoration:none;}
.prop-card .prop-cover{display:flex;}
.price-history{border-top:1px solid #d6e3ed;margin-top:12px;padding-top:10px;}
.price-history h3{font-size:14px;margin:0 0 8px;}
.price-history ol{list-style:none;padding:0;max-height:220px;overflow:auto;}
.price-history li{display:flex;flex-wrap:wrap;gap:6px 16px;padding:8px 0;border-bottom:1px solid #e3ebf1;font-size:13px;}
.price-history time{color:#60798c;}.price-history p{width:100%;margin:0;}
.detail-sector{font-size:12px;color:#58718a;margin:5px 0 8px;}.sector-map-link{color:#176da5;text-decoration:none;font-weight:600;}
#customer-followup-text{min-height:36px!important;max-height:none!important;box-sizing:border-box;line-height:22px;padding:6px 9px;resize:none;overflow:hidden;}
.share-dialog{max-width:480px;width:calc(100% - 24px);}.share-card-preview{background:#eef5fa;border:1px solid #c2d8e7;border-radius:12px;padding:20px;color:#20394d;}.share-card-preview>span{font-size:12px;color:#176aa6;}.share-card-preview h2{font-size:24px;margin:10px 0 18px;}.share-card-preview dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0;}.share-card-preview dt{font-size:12px;color:#637f92;}.share-card-preview dd{margin:3px 0 0;font-size:16px;overflow-wrap:anywhere;}.share-dialog .dialog-footer{flex-wrap:wrap;}.share-dialog [data-share-status]{flex-basis:100%;font-size:12px;color:#53738c;}
.calendar-weather{font:500 12px/18px var(--crm-font-sans);color:#648294;padding:0 12px 2px;}.calendar-weather:empty{display:none;}
@media(max-width:767px){.calendar-mobile-date{font-size:12px;}.calendar-mobile-controls .icon-btn{min-width:22px;width:22px;}.blue-property-price-row .prop-detail-actions{gap:3px;flex-wrap:wrap;}.blue-property-price-row .prop-detail-actions .btn{padding:3px 5px;font-size:10px;}.community-detail .detail-header{gap:5px;}.community-detail .detail-header .community-edit{padding:3px 5px;font-size:11px;}.calendar-weather{padding-left:8px;}}
#calendar-day-popup{box-sizing:border-box;max-width:calc(100vw - 16px);}

.share-dialog>.meta{padding:0 16px;font-size:12px;line-height:18px;}
.share-link-value{display:block;width:calc(100% - 32px);margin:12px 16px;padding:10px;border:1px solid #bdd3e3;border-radius:7px;color:#285d83;background:#f4f8fc;font:12px/20px var(--crm-font-sans)}

/* Date and forecast share one compact calendar header. */
.blue-calendar summary > .calendar-date-weather { display:flex;align-items:center;gap:10px;margin:0;color:#234d6b;min-width:0; }
.calendar-current-date { font:600 14px/22px var(--crm-font-sans);white-space:nowrap; }
.calendar-date-weather .calendar-weather { padding:0;white-space:nowrap;color:#355574; }
.blue-calendar summary > .calendar-header-controls { display:flex;align-items:center;gap:2px;margin-left:auto; }
.calendar-header-controls .icon-btn { width:28px;min-width:28px; }
.calendar-header-controls .text-btn { padding:4px 6px;white-space:nowrap; }
.calendar-browsed-month { margin:0 0 6px;font-size:12px;color:#355574; }
@media(min-width:768px) {
  .mobile-property-heading { display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px; }
  .mobile-property-heading .blue-property-price-row { margin:0;gap:8px;flex-wrap:nowrap; }
  .mobile-property-heading .prop-detail-actions { flex-wrap:nowrap; }
  .blue-property-meta { display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;margin-bottom:8px; }
  .blue-property-meta .detail-sector,.blue-property-meta .blue-property-tax { margin:0; }
}