/* Hallmark · theme: Импульс (by request) · genre: modern-minimal · shape: app screen · signature: graphite console, coral actions and a house facade */
/* Critique: give the journal a clear lead and keep everyday controls compact and readable. */
:root {
  --house-console-line: #414c57;
  --house-console-text: #e6ecf2;
  --house-console-muted: #b6c3d0;
  --house-shadow: 0 12px 28px #1726360d;
  --house-art-wash: #e8edf3;
}

.house-main { padding-block: 1.6rem 3rem; }
.house-masthead {
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  color: var(--ink);
}
.house-masthead .brand-copy span, .house-masthead #house-identity { color: var(--muted); }
.house-masthead .signout {
  color: var(--ink);
  border: 1px solid var(--line);
  min-height: 2.5rem;
}
.house-masthead .signout:hover:not(:disabled) {
  color: var(--ink);
  background: var(--mist);
  border-color: var(--field-border);
}
.house-masthead :focus-visible { outline-color: var(--focus); }
.house-masthead .house-top-links { align-items: center; }
#house-identity {
  max-width: 17rem;
  font-size: .875rem;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.house-status { color: var(--muted); margin: 0 0 .85rem; }
.house-status:empty, .house-auth-status:empty { display: none; }
.house-auth-status { min-width: 0; }
.house-error {
  color: var(--soft-red-text);
  background: var(--soft-red);
  border-radius: var(--small-radius);
  padding: .55rem .75rem;
}

.house-auth {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  align-items: stretch;
  max-width: 66rem;
  margin: clamp(.75rem, 4vw, 3.25rem) auto;
  overflow: clip;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--house-shadow);
}
.house-auth-copy { min-width: 0; padding: clamp(1.5rem, 4vw, 3.4rem); }
.house-auth-copy h1 {
  font-family: var(--font-display, var(--font));
  font-size: clamp(1.9rem, 4.1vw, 3rem);
  overflow-wrap: break-word;
}
.house-auth-copy > p:not([role]) {
  max-width: 38ch;
  color: var(--muted);
  margin: .8rem 0 1.45rem;
}
.house-auth-art {
  min-width: 0;
  min-height: 19rem;
  border-left: 1px solid var(--line);
  background: var(--house-art-wash) url('/requests/house-facade.svg') center / 120% auto no-repeat;
}
.house-auth-copy #resident-login { gap: .9rem; margin-bottom: 1.1rem; }
.house-auth-copy #resident-login > .primary { min-width: 8.5rem; }
.house-invitation {
  border-top: 1px solid var(--line);
  padding-top: .7rem;
}
.house-invitation summary {
  min-height: 2.75rem;
  padding-block: .58rem;
  cursor: pointer;
  color: var(--ink);
  font-weight: 650;
}
.house-invitation[open] summary { margin-bottom: .55rem; }

.house-workspace {
  display: grid;
  grid-template-columns: minmax(14rem, 15rem) minmax(0, 1fr);
  align-items: start;
  gap: clamp(1rem, 2.4vw, 2rem);
}
.house-sidebar {
  position: sticky;
  top: 1.2rem;
  min-width: 0;
  max-height: calc(100dvh - 2.4rem);
  overflow: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--house-console-line) var(--deep);
  color: var(--house-console-text);
  background: var(--deep);
  border-radius: var(--radius);
}
.house-navigation { padding: .5rem .7rem .75rem; }
.house-navigation > summary {
  display: flex;
  align-items: center;
  gap: .6rem;
  min-height: 2.75rem;
  padding: .5rem .55rem;
  color: var(--mast-text);
  cursor: pointer;
  list-style: none;
  font-size: .875rem;
  font-weight: 700;
}
.house-navigation > summary::-webkit-details-marker { display: none; }
.house-navigation > summary svg { width: 1.2rem; height: 1.2rem; flex: none; }
.house-navigation > summary::after {
  content: '';
  width: .4rem;
  height: .4rem;
  margin-inline-start: auto;
  border: solid currentColor;
  border-width: 0 1.5px 1.5px 0;
  transform: translateY(-.1rem) rotate(45deg);
}
.house-navigation[open] > summary::after { transform: translateY(.1rem) rotate(225deg); }
.house-sidebar :focus-visible { outline-color: var(--focus-on-dark, var(--mast-text)); }
.house-group { padding: .65rem 0 .3rem; border-top: 1px solid var(--house-console-line); }
.house-group h2 {
  margin: .1rem .65rem .4rem;
  color: var(--house-console-muted);
  font: 600 .8125rem/1.4 var(--font);
  letter-spacing: normal;
  text-wrap: wrap;
}
.house-nav-item {
  display: block;
  min-height: 2.55rem;
  padding: .57rem .65rem;
  margin-bottom: .15rem;
  border-inline-start: 2px solid transparent;
  border-radius: var(--small-radius);
  color: var(--house-console-text);
  font-size: .875rem;
  font-weight: 550;
  line-height: 1.4;
  overflow-wrap: anywhere;
  text-decoration: none;
}
.house-nav-item:hover { color: var(--mast-text); background: var(--deep-hover); }
.house-nav-item[aria-current] {
  border-inline-start-color: var(--accent);
  color: var(--mast-text);
  background: var(--deep-hover);
  font-weight: 700;
}
#house-owner-journal {
  color: var(--mast-text);
  border-block: 1px solid var(--house-console-line);
  border-radius: 0;
  margin-bottom: .35rem;
}

.house-panel, .house-card, .house-record, .house-form, .house-empty { min-width: 0; }
.house-heading {
  padding: .2rem 0 1rem;
  margin-bottom: 1rem;
  border-bottom: 1px solid var(--line);
}
.house-heading h1 {
  font-family: var(--font-display, var(--font));
  font-size: clamp(1.9rem, 3.2vw, 3rem);
  line-height: 1.1;
  overflow-wrap: break-word;
}
.house-heading p { color: var(--muted); margin: .55rem 0 0; max-width: 68ch; }
.house-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
}
.house-card {
  padding: 1rem 1.1rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.house-card h2, .house-card h3 { margin: 0 0 .55rem; }
.house-card p { margin: .15rem 0 .6rem; }
.house-section > section.house-card, .house-section > details.house-card { margin-bottom: .9rem; }
.house-section > .house-grid + section.house-card { margin-top: .95rem; }
.house-section > section.house-card > .house-grid { margin-block: .75rem; gap: .55rem; }
.house-section > section.house-card > .house-grid > .house-card {
  border: 0;
  border-top: 1px solid var(--line);
  border-radius: 0;
  background: transparent;
  padding: .65rem .25rem;
}
.house-stat-value {
  display: block;
  margin-top: .4rem;
  font-family: var(--font-display, var(--font));
  font-size: clamp(1.5rem, 2.5vw, 2.15rem);
  line-height: 1.12;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.house-stat-link { display: inline-block; margin-top: .55rem; font-size: .875rem; font-weight: 600; }
.house-section > .house-grid > .house-card:has(a[href='/requests/']) {
  position: relative;
  isolation: isolate;
  overflow: clip;
  background: var(--deep);
  color: var(--mast-text);
  border-color: var(--deep);
}
.house-section > .house-grid > .house-card:has(a[href='/requests/'])::before {
  content: '';
  position: absolute;
  inset: 0 0 0 32%;
  z-index: -1;
  background: url('/requests/house-facade.svg') right center / cover no-repeat;
  opacity: .26;
  mask-image: linear-gradient(to right, transparent, var(--ink));
  pointer-events: none;
}
.house-section > .house-grid > .house-card:has(a[href='/requests/']) .house-stat-link { color: var(--mast-text); }
.house-section > .house-grid > .house-card:has(a[href='/requests/']) :focus-visible {
  outline-color: var(--focus-on-dark, var(--mast-text));
}
.house-toolbar.house-directory {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: .25rem .75rem;
}
.house-directory a {
  min-width: 0;
  padding: .45rem .15rem;
  border-bottom: 1px solid var(--line);
  overflow-wrap: anywhere;
  text-decoration: none;
}
.house-directory a:hover { color: var(--action-hover); text-decoration: underline; }
.house-directory-panel { margin-top: .95rem; }
.house-directory-panel > summary { cursor: pointer; }
.house-directory-panel > summary h2 { display: inline-block; margin: 0; }

.house-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: .52rem .95rem;
  background: var(--action);
  color: var(--mast-text);
  font-weight: 650;
  border-radius: var(--small-radius);
  text-decoration: none;
}
.house-primary:hover, .house-primary:active { background: var(--action-hover); }
.house-toolbar, .house-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .55rem;
}
.house-toolbar { margin-block: .75rem; }
.house-section > .house-toolbar:has(input[type=search]) {
  padding: .75rem;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--small-radius);
}
.house-toolbar label:has(input[type=search]) { flex: 1 1 14rem; }
.house-toolbar label:has(select) { flex: 0 1 13rem; }
.house-toolbar label { min-width: 0; }
.house-section > .house-actions { margin-top: .8rem; }
.house-form { display: grid; gap: .85rem; margin-block: .8rem; }
.house-form label {
  display: grid;
  gap: .36rem;
  font-weight: 550;
  min-width: 0;
}
.house-form label:has(> input[type=checkbox]), .house-form label:has(> input[type=radio]) {
  display: flex;
  align-items: center;
  gap: .55rem;
}
.house-form fieldset { border: 1px solid var(--line); border-radius: var(--small-radius); min-width: 0; }
.house-form button { justify-self: start; }
.house-section > form.house-form {
  padding: 1rem 1.1rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
}
.house-section > details.house-card > summary,
.house-record > details.house-card > summary {
  min-height: 2rem;
  padding: .28rem 0;
  cursor: pointer;
  font-weight: 650;
}
.house-records {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
}
.house-records > h2 { padding: 1rem 1.1rem .35rem; }
.house-record {
  background: var(--surface);
  padding: .9rem 1.1rem;
  overflow-wrap: anywhere;
}
.house-records > .house-record + .house-record { border-top: 1px solid var(--line); }
.house-records > .house-record:first-of-type { border-top-left-radius: var(--radius); border-top-right-radius: var(--radius); }
.house-records > .house-record:last-of-type { border-bottom-left-radius: var(--radius); border-bottom-right-radius: var(--radius); }
.house-record > .house-toolbar { margin: 0 0 .6rem; }
.house-record h2 { font-size: 1.05rem; }
.house-record p { margin: .3rem 0 .65rem; }
.house-record > details.house-card {
  margin: .42rem 0 0;
  padding: .28rem .75rem;
  border-color: var(--line);
  border-radius: var(--small-radius);
}
.house-record > form.house-actions { margin: .72rem 0; }
.house-record-fields {
  display: grid;
  grid-template-columns: minmax(5.5rem, .46fr) minmax(0, 1fr);
  gap: .3rem .8rem;
  margin-block: .65rem;
  font-size: .9rem;
}
.house-record-fields dt { color: var(--muted); }
.house-record-fields dd { margin: 0; white-space: pre-wrap; }
.house-gis-facts dd { overflow-wrap: anywhere; }
.house-message-text { white-space: pre-wrap; }
.house-empty {
  padding: .9rem 1rem;
  margin-block: .55rem;
  color: var(--muted);
  background: var(--mist);
  border: 1px solid var(--line);
  border-radius: var(--small-radius);
}
.house-empty.house-error { color: var(--soft-red-text); background: var(--soft-red); }
.house-records > .house-empty { margin: .55rem; }
.house-pill {
  display: inline-block;
  padding: .18rem .55rem;
  background: var(--accent-wash);
  color: var(--action-hover);
  border-radius: var(--small-radius);
  font-size: .8125rem;
  font-weight: 650;
}
.house-record > .house-pill { margin: .15rem .4rem .15rem 0; }
.house-apartment-link { display: inline-block; min-width: 1.5rem; font-weight: 700; }
.house-apartment-back { display: inline-block; margin-bottom: .75rem; }
.house-apartment-source + .house-apartment-source { margin-top: 1rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.house-apartment-source .house-table { margin-top: .55rem; }
.house-apartment-history .house-table td:last-child { min-width: 8rem; }
.house-apartment-ticket-meta { display: block; margin-top: .25rem; color: var(--muted); }
.house-apartment-resident-list { margin: 0; padding-inline-start: 1.2rem; overflow-wrap: anywhere; }
.house-apartment-resident-list li + li { margin-top: .45rem; }
.house-apartment-resident-list li > span { display: block; color: var(--muted); }
.house-apartment-disclosure { margin: .5rem 0 .8rem; }
.house-apartment-disclosure > summary { min-height: 2.4rem; padding-block: .45rem; cursor: pointer; font-weight: 650; }
.house-directory-records-list .house-apartment-disclosure { margin: .1rem 0 .25rem; }
.house-apartment-local-requests .house-apartment-disclosure { margin: 0; }
.house-apartment-local-requests .house-apartment-disclosure + .house-apartment-disclosure { border-top: 1px solid var(--line); }
.house-table {
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--small-radius);
}
.house-panel .house-table table { display: table; background: var(--surface); }
.house-panel .house-table thead { position: static; width: auto; height: auto; clip-path: none; }
.house-panel .house-table tbody { display: table-row-group; }
.house-panel .house-table tr { display: table-row; }
.house-panel .house-table td, .house-panel .house-table th { display: table-cell; text-align: left; }
.house-panel .house-table td {
  padding: .63rem .78rem;
  border-bottom: 1px solid var(--line);
  white-space: normal;
  overflow-wrap: anywhere;
  font-variant-numeric: tabular-nums;
}
.house-panel .house-table th { padding: .63rem .78rem; }
.house-panel .house-table tr:last-child td { border-bottom: 0; }
.house-table:has(th:nth-child(5)) table { min-width: 36rem; }
.house-panel h3 { overflow-wrap: anywhere; }
.house-panel output { overflow-wrap: anywhere; white-space: pre-wrap; }

@media (min-width: 74rem) {
  .house-section > .house-grid { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .house-section > .house-grid > .house-card { grid-column: span 2; }
  .house-section > .house-grid:has(> .house-card > a[href='/requests/']) > .house-card:nth-child(-n+2) { grid-column: span 4; }
}
@media (max-width: 54rem) {
  .house-main { padding-top: 1rem; }
  .house-workspace { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .house-sidebar { position: static; max-height: min(45dvh, 18rem); }
  .house-navigation { padding: .25rem .65rem; }
  .house-nav-item { min-height: 2.75rem; }
  .house-toolbar.house-directory { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .house-form input:not([type=checkbox], [type=radio]),
  .house-form select, .house-form textarea,
  .house-toolbar input, .house-toolbar select, .house-actions select { font-size: 1rem; }
}
@media (max-width: 42rem) {
  .house-auth { grid-template-columns: minmax(0, 1fr); margin-block: .55rem 1rem; }
  .house-auth-art {
    border-left: 0;
    border-top: 1px solid var(--line);
    min-height: 9rem;
    background-size: cover;
  }
}
@media (max-width: 37rem) {
  .house-grid, .house-toolbar.house-directory { grid-template-columns: minmax(0, 1fr); }
  .house-section > .house-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .65rem; }
  .house-section > .house-grid > .house-card:has(> a[href='/requests/']) { grid-column: 1 / -1; }
  .house-section > .house-grid .house-stat-link { overflow-wrap: anywhere; }
  .house-card, .house-record { padding-inline: .85rem; }
  .house-heading h1 { font-size: 1.85rem; }
  #house-identity { display: none; }
}
@media print {
  .masthead, .house-sidebar, form, .house-status, .house-toolbar, .skip-link { display: none !important; }
  .house-workspace { display: block; }
  .frame, .house-panel { width: 100%; }
  .house-table { overflow: visible; }
}

