.property-form .floor-numbers-label { min-width: min(380px, 100%); }
.property-form #floor-numbers { width: 100%; }
.property-form .floor-numbers-label small { color: #718099; font-size: .69rem; font-weight: 600; letter-spacing: 0; line-height: 1.35; }
.floor-count { align-self: end; color: #65748c; font-size: .76rem; font-weight: 700; margin: 0 0 12px; }
.floor-plan-editor { display: grid; gap: 10px; grid-column: 1 / -1; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); }
.floor-plan-card { background: #f8fafc; border: 1px solid #dfe5ed; border-radius: 10px; padding: 13px; }
.floor-plan-card header { align-items: center; display: flex; gap: 9px; justify-content: space-between; margin-bottom: 10px; }
.floor-plan-card header strong { color: #203252; font-size: .86rem; }
.floor-plan-card header span { background: #eaf0f8; border-radius: 999px; color: #526885; font-size: .62rem; font-weight: 800; letter-spacing: .05em; padding: 4px 7px; text-transform: uppercase; }
.floor-plan-card label { color: #4d5d76; display: grid; font-size: .65rem; font-weight: 800; gap: 6px; letter-spacing: .05em; }
.floor-plan-card input { margin: 0; width: 100%; }
.floor-plan-card small { color: #718099; display: block; font-size: .66rem; line-height: 1.4; margin-top: 8px; }
.floor-help { color: var(--muted); flex-basis: 100%; font-size: .79rem; line-height: 1.5; margin: 0; }
.property-form .button { min-height: 46px; }
.button-quiet { background: #f6f8fb; border-color: #dbe2eb; color: #2d4268; }
.button-quiet:hover { background: #ecf0f6; border-color: #cad5e4; }

.floor-board { margin-bottom: 16px; scroll-margin-top: 24px; }
.floor-board-legend { display: flex; flex-wrap: wrap; gap: 9px 16px; margin: -1px 0 20px; }
.floor-board-legend span { align-items: center; color: #627087; display: inline-flex; font-size: .72rem; font-weight: 700; gap: 6px; }
.floor-key { border-radius: 999px; height: 9px; width: 9px; }
.floor-key.ready { background: #3c9b78; }
.floor-key.occupied { background: #526caa; }
.floor-key.reserved { background: #8b6cc1; }
.floor-key.dirty { background: #d0a64d; }
.floor-key.out-of-service { background: #c96565; }
.floor-key.unconfigured { background: #c6ccd7; }

.floor-board-lanes { display: grid; gap: 14px; }
.floor-lane { background: #f8fafc; border: 1px solid #e5e9f0; border-radius: 12px; display: grid; gap: 16px; grid-template-columns: 104px minmax(0, 1fr); padding: 14px; }
.floor-lane header { align-items: flex-start; border-right: 1px solid #e2e7ee; display: flex; flex-direction: column; justify-content: center; padding: 4px 14px 4px 4px; }
.floor-lane header p { color: #8a6c35; font-size: .61rem; font-weight: 800; letter-spacing: .13em; margin: 0; }
.floor-lane h3 { color: #1d2b48; font-size: 2.15rem; letter-spacing: -.06em; line-height: 1; margin: 5px 0; }
.floor-lane header span { color: #748197; font-size: .67rem; line-height: 1.35; }
.floor-room-grid { display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); }
.floor-lane-empty { align-items: center; border: 1px dashed #ccd4df; border-radius: 9px; color: #64748b; display: flex; font-size: .74rem; justify-content: center; line-height: 1.45; margin: 0; min-height: 96px; padding: 16px; text-align: center; }

.floor-room { appearance: none; background: #fff; border: 1px solid #dfe5ed; border-radius: 10px; color: inherit; display: flex; flex-direction: column; font: inherit; min-height: 150px; padding: 13px; position: relative; text-align: left; transition: box-shadow 160ms ease, transform 160ms ease, border-color 160ms ease; }
.floor-room p { color: #738098; font-size: .59rem; font-weight: 800; letter-spacing: .1em; margin: 0; }
.floor-room strong { color: #1c2944; font-size: 1.55rem; letter-spacing: -.04em; line-height: 1.05; margin: 7px 0 3px; }
.floor-room span { color: #52627a; font-size: .71rem; font-weight: 750; line-height: 1.25; }
.floor-room small { color: #748197; font-size: .64rem; line-height: 1.35; margin: 8px 0; }
.floor-room b { font-size: .63rem; margin-top: auto; text-transform: capitalize; }
.floor-room:not(:disabled) { cursor: pointer; }
.floor-room:not(:disabled):hover { border-color: #6277a9; box-shadow: 0 8px 18px rgb(38 56 95 / 12%); transform: translateY(-2px); }
.floor-room:focus-visible { outline: 3px solid rgb(199 157 75 / 42%); outline-offset: 2px; }
.floor-room:disabled { cursor: not-allowed; opacity: 1; }
.floor-room.is-selected { box-shadow: 0 0 0 3px rgb(199 157 75 / 24%); border-color: #b68b37; }
.floor-room.is-selected b { color: #875f13; }
.floor-room--ready { background: #f5fbf8; border-top: 3px solid #3c9b78; }
.floor-room--ready b { color: #28745a; }
.floor-room--reserved { background: #f8f5fd; border-top: 3px solid #8b6cc1; }
.floor-room--reserved b { color: #6d4ba7; }
.floor-room--dirty { background: #fffaf0; border-top: 3px solid #d0a64d; }
.floor-room--dirty b { color: #946d1f; }
.floor-room--out_of_service { background: #fff6f6; border-top: 3px solid #c96565; }
.floor-room--out_of_service b { color: #a54949; }
.floor-room--unconfigured { background: #fff; border-color: #ccd4df; border-style: dashed; border-top: 3px solid #aeb8c7; }
.floor-room--unconfigured strong { color: #9aa6b7; }
.floor-room--unconfigured b { color: #526caa; }
.floor-board-help { color: #68768d; font-size: .72rem; line-height: 1.5; margin: 16px 0 0; }

@media (max-width: 900px) {
  .floor-lane { grid-template-columns: 1fr; }
  .floor-lane header { border-bottom: 1px solid #e2e7ee; border-right: 0; display: grid; grid-template-columns: auto 1fr; gap: 3px 10px; padding: 0 0 11px; }
  .floor-lane header p { grid-column: 1; }
  .floor-lane h3 { grid-column: 1; margin: 0; }
  .floor-lane header span { align-self: center; grid-column: 2; grid-row: 1 / 3; }
}

@media (max-width: 680px) {
  .property-form .floor-numbers-label { min-width: 100%; }
  .floor-board-legend { gap: 8px 12px; }
  .floor-lane { padding: 12px; }
  .floor-room-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .floor-room { min-height: 136px; padding: 11px; }
}
