:root{--ink:#183026;--muted:#65736c;--paper:#f4f1e8;--surface:#fffdfa;--forest:#1b4332;--forest-2:#2d6a4f;--mint:#d8f3dc;--line:#dce2db;--orange:#d96f32;--red:#a33a2a;--shadow:0 12px 32px rgba(24,48,38,.08);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--paper)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at 90% -10%,#d8f3dc 0,transparent 28rem),var(--paper)}a{color:var(--forest-2);text-decoration:none}button,input,select,textarea{font:inherit}.topbar{min-height:68px;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;background:var(--forest);color:#fff}.brand{font-weight:800;font-size:1.05rem;color:#fff;letter-spacing:.01em}.brand span{display:inline-grid;place-items:center;background:#f4f1e8;color:var(--forest);border-radius:50%;width:42px;height:42px;margin-right:.6rem}.account{display:flex;align-items:center;gap:1rem;font-size:.9rem}.account form{margin:0}.link-button{border:0;background:none;color:inherit;padding:.3rem;text-decoration:underline;cursor:pointer}.main-nav{display:flex;gap:.3rem;padding:.75rem 4vw;background:#fff;border-bottom:1px solid var(--line);overflow-x:auto}.main-nav a{padding:.65rem .9rem;border-radius:999px;color:var(--ink);font-size:.92rem;white-space:nowrap}.main-nav a:hover{background:var(--mint)}.page-shell{max-width:1180px;margin:0 auto;padding:2rem 4vw 5rem}.page-heading,.section-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}.page-heading h1,.section-heading h2{margin:.15rem 0}.page-heading h1{font-size:clamp(1.8rem,5vw,3rem);letter-spacing:-.04em}.eyebrow{text-transform:uppercase;font-size:.72rem;letter-spacing:.14em;font-weight:800;color:var(--orange)}.lede{font-size:1.15rem;color:var(--muted);line-height:1.6}.lede-small{font-size:1.05rem;line-height:1.7}.button{display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:12px;padding:.72rem 1rem;font-weight:750;cursor:pointer}.button.primary{background:var(--forest);border-color:var(--forest);color:#fff}.button.danger{background:var(--red);border-color:var(--red);color:#fff}.panel,.auth-card,.stat-card,.room-card{background:rgba(255,253,250,.94);border:1px solid rgba(220,226,219,.9);border-radius:20px;box-shadow:var(--shadow)}.panel{padding:1.35rem;margin-bottom:1.35rem}.panel h2{margin-top:0}.auth-card{max-width:480px;margin:7vh auto;padding:2rem}.stats-grid,.room-grid,.quick-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-bottom:1.35rem}.stat-card{padding:1.35rem}.stat-card strong{display:block;font-size:2.35rem;letter-spacing:-.05em}.stat-card span{color:var(--muted)}.content-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:1.35rem}.accent-panel{display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#d8f3dc,#fffdfa)}.manager-panel{margin-top:1.35rem}.action-card{display:flex;flex-direction:column;gap:.25rem;border:1px solid var(--line);border-radius:14px;padding:1rem;color:var(--ink);background:#fff}.action-card:hover{border-color:var(--forest-2);transform:translateY(-1px)}.action-card span,.list-row small,.muted,.empty,.privacy-note{color:var(--muted)}.list-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem .2rem;border-bottom:1px solid var(--line);color:var(--ink)}.list-row:last-child{border-bottom:0}.list-row>span:first-child{display:flex;flex-direction:column;gap:.25rem}.list-row.urgent{border-left:4px solid var(--red);padding-left:.8rem}.status{display:inline-flex;background:#eef1ed;border-radius:999px;padding:.35rem .65rem;font-size:.78rem;white-space:nowrap}.status.good{background:var(--mint);color:var(--forest)}.room-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.room-card{padding:1rem;display:grid;grid-template-columns:auto 1fr;gap:.85rem}.room-card.occupied{border-color:#95c9a4}.room-code{width:48px;height:48px;border-radius:14px;background:var(--forest);color:#fff;display:grid;place-items:center;font-weight:850}.room-card h2{font-size:1rem;margin:.2rem 0}.occupant-list{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:.4rem}.occupant-list span{background:#eef1ed;border-radius:8px;padding:.4rem .55rem;font-size:.85rem}.stacked-form{display:flex;flex-direction:column;gap:1rem}.form-wide{max-width:760px}.compact-form{max-width:520px}.field{display:flex;flex-direction:column;gap:.35rem}.field label{font-weight:700}.field small{color:var(--muted);line-height:1.4}.field input,.field select,.field textarea,.notice input{width:100%;border:1px solid #bdc8c0;border-radius:10px;padding:.75rem;background:#fff;color:var(--ink)}.field input[type=checkbox]{width:auto}.field ul{list-style:none;margin:.2rem 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem}.field ul label{font-weight:500;display:flex;gap:.45rem}.check-row{display:flex;align-items:center;gap:.55rem}.errorlist,.form-errors{color:var(--red);margin:.2rem 0;padding-left:1.2rem}.form-actions{display:flex;gap:.7rem;align-items:center;flex-wrap:wrap}.separated-form{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}.details{display:grid;grid-template-columns:max-content 1fr;gap:.65rem 1rem}.details dt{color:var(--muted)}.details dd{margin:0;font-weight:650}.comment{border-left:3px solid var(--mint);padding:.4rem 0 .4rem .9rem;margin:1rem 0}.comment p{margin:.3rem 0}.comment small{color:var(--muted)}.notice,.message{padding:1rem;border-radius:12px;margin-bottom:1rem;background:#fff2cc;border:1px solid #e7cb75}.notice.success,.message.success{background:var(--mint);border-color:#95c9a4}.message.error{background:#f8ddd8;border-color:#df9d90}.table-wrap{overflow-x:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:.85rem;border-bottom:1px solid var(--line);vertical-align:top}th{font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}code{font-size:.78rem;white-space:pre-wrap}.inline-form{display:flex;gap:.35rem;margin-top:.4rem}.inline-form select{max-width:110px}.privacy-note{text-align:center;font-size:.86rem}.availability-form{display:grid;grid-template-columns:1fr 1fr auto;gap:.8rem;align-items:end}.availability-results{display:flex;align-items:center;gap:1rem;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--line)}.room-pills{display:flex;flex-wrap:wrap;gap:.4rem}.room-pills span{background:var(--mint);border-radius:999px;padding:.35rem .6rem;font-weight:700}.mobile-booking-list{display:none}.booking-card{align-items:center;grid-template-columns:auto 1fr auto;gap:.8rem;color:var(--ink)}.booking-card>span:nth-child(2){display:flex;flex-direction:column;gap:.25rem}@media(max-width:820px){.stats-grid,.quick-actions{grid-template-columns:1fr 1fr}.room-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.content-grid{grid-template-columns:1fr}.page-shell{padding-top:1.25rem}.account>span{display:none}}@media(max-width:520px){.topbar{padding:0 1rem}.main-nav{position:fixed;z-index:20;left:0;right:0;bottom:0;padding:.55rem 1rem calc(.55rem + env(safe-area-inset-bottom));border-top:1px solid var(--line);border-bottom:0;box-shadow:0 -8px 24px rgba(24,48,38,.08)}.main-nav a{padding:.65rem .85rem}.page-shell{padding-left:1rem;padding-right:1rem;padding-bottom:7rem}.page-heading{align-items:flex-start;flex-direction:column}.page-heading>.button{width:100%}.stats-grid{grid-template-columns:1fr}.room-grid{grid-template-columns:1fr}.field ul{grid-template-columns:1fr}.panel{padding:1rem;border-radius:16px}.list-row{align-items:flex-start}.details{grid-template-columns:1fr;gap:.2rem}.details dd{margin-bottom:.7rem}.availability-form{grid-template-columns:1fr}.availability-results{align-items:flex-start;flex-direction:column}.table-panel{display:none}.mobile-booking-list{display:block}.booking-card{display:grid}.booking-card .status{justify-self:end}}
.attachment-section { margin-top: 1.25rem; }
.attachment-heading { align-items: flex-start; display: flex; gap: 1rem; justify-content: space-between; }
.attachment-heading h3 { margin: 0 0 .2rem; }
.attachment-heading p { margin: 0; }
.attachment-picker { cursor: pointer; flex: 0 0 auto; }
.attachment-picker input { height: 1px; opacity: 0; overflow: hidden; position: absolute; width: 1px; }
.attachment-grid { display: grid; gap: .8rem; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); margin-top: 1rem; }
.attachment-card { background: var(--paper); border: 1px solid var(--line); border-radius: .8rem; min-width: 0; overflow: hidden; }
.attachment-card img, .attachment-card video { aspect-ratio: 4 / 3; background: #17211d; display: block; object-fit: cover; width: 100%; }
.attachment-meta { display: grid; gap: .25rem; padding: .65rem; }
.attachment-meta strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attachment-meta form { margin: 0; }
.attachment-uploader { margin-top: .8rem; }
.attachment-uploader progress { height: .65rem; width: min(100%, 26rem); }
.attachment-upload-status { margin: .35rem 0; }
.upload-error, .danger-text { color: #9a2f28; }
.inspection-attachment-group { border-top: 1px solid var(--line); margin-top: 1rem; padding-top: 1rem; }
.inspection-attachment-group > div:first-child { display: flex; flex-wrap: wrap; gap: .4rem 1rem; justify-content: space-between; }

@media (max-width: 540px) {
  .attachment-heading { align-items: stretch; flex-direction: column; }
  .attachment-picker { text-align: center; }
  .attachment-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.media-composer { border: 1px dashed #a8b8ad; border-radius: 14px; padding: 1rem; }
.media-composer .attachment-heading { margin-bottom: .75rem; }
.media-picker-actions { display: flex; flex-wrap: wrap; gap: .55rem; }
.media-preview-grid { display: grid; gap: .65rem; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
.media-preview { background: var(--paper); border: 1px solid var(--line); border-radius: 12px; display: grid; gap: .45rem; min-width: 0; overflow: hidden; padding-bottom: .55rem; }
.media-preview img, .media-video-placeholder { aspect-ratio: 4 / 3; background: #17211d; color: #fff; display: grid; object-fit: cover; place-items: center; width: 100%; }
.media-preview > div:not(.media-video-placeholder), .media-preview > button { margin-left: .55rem; margin-right: .55rem; }
.media-preview strong, .media-preview small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.media-preview small { color: var(--muted); }
.media-composer progress { height: .65rem; margin-top: .7rem; width: 100%; }
.task-evidence-form { align-items: stretch; border-top: 1px solid var(--line); flex-basis: 100%; margin-top: .75rem; padding-top: 1rem; width: 100%; }
.submission-inspection { border-left: 3px solid var(--mint); margin-top: .8rem; padding: .7rem 0 .2rem .8rem; }
.submission-inspection.failed { border-left-color: #df9d90; }
.attachment-lightbox-dialog { background: transparent; border: 0; height: 100%; margin: auto; max-height: none; max-width: none; padding: 3rem 4rem; width: 100%; }
.attachment-lightbox-dialog::backdrop { background: rgba(9, 19, 15, .88); }
.attachment-lightbox-dialog figure { align-items: center; display: flex; flex-direction: column; height: 100%; justify-content: center; margin: 0; }
.attachment-lightbox-dialog img { border-radius: 10px; max-height: calc(100vh - 7rem); max-width: 100%; object-fit: contain; }
.attachment-lightbox-dialog figcaption { color: #fff; margin-top: .65rem; }
.attachment-lightbox-close, .attachment-lightbox-previous, .attachment-lightbox-next { background: rgba(255, 255, 255, .94); border: 0; border-radius: 999px; cursor: pointer; font-size: 1.8rem; height: 2.75rem; position: absolute; width: 2.75rem; }
.attachment-lightbox-close { right: 1rem; top: 1rem; }
.attachment-lightbox-previous, .attachment-lightbox-next { top: 50%; transform: translateY(-50%); }
.attachment-lightbox-previous { left: .75rem; }
.attachment-lightbox-next { right: .75rem; }

@media (max-width: 520px) {
  .media-picker-actions, .media-picker-actions .button { width: 100%; }
  .media-preview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.wishlist-month-nav { align-items: center; display: flex; gap: .75rem; justify-content: center; margin-bottom: 1.35rem; }
.wishlist-month-nav strong { min-width: 9rem; text-align: center; }
.wishlist-layout { display: grid; gap: 1.35rem; grid-template-columns: minmax(0,1.25fr) minmax(19rem,.75fr); }
.wishlist-category + .wishlist-category { border-top: 1px solid var(--line); margin-top: 1rem; padding-top: .5rem; }
.wishlist-category h3 { color: var(--muted); font-size: .78rem; letter-spacing: .08em; margin: .65rem 0 .2rem; text-transform: uppercase; }
.wishlist-regular { color: var(--forest-2) !important; font-weight: 750; }
.wishlist-row .form-actions form { margin: 0; }
.wishlist-item-content, .shopping-bag-item-content { align-items: center; display: flex; gap: .75rem; min-width: 0; }
.wishlist-item-content > span, .shopping-bag-item-content > span { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.wishlist-product-image, .wishlist-bag-image { flex: 0 0 auto; }
.wishlist-product-image img, .wishlist-bag-image img { background: var(--paper); border: 1px solid var(--line); border-radius: 10px; display: block; height: 64px; object-fit: cover; width: 64px; }
.wishlist-bag-image img { height: 48px; width: 48px; }
.wishlist-product-links { display: flex; flex-wrap: wrap; gap: .15rem; }
.wishlist-product-links a { font-weight: 700; }
.wishlist-link-editor, .wishlist-current-image { border-top: 1px solid var(--line); padding-top: 1rem; }
.wishlist-link-grid { display: grid; gap: .75rem; }
.wishlist-link-form { background: var(--paper); border: 1px solid var(--line); border-radius: 12px; display: grid; gap: .75rem; grid-template-columns: minmax(10rem,.65fr) minmax(15rem,1.35fr); padding: .85rem; }
.wishlist-link-form .check-row, .wishlist-link-form .form-errors { grid-column: 1 / -1; }
.shopping-bag-row { align-items: center; border-bottom: 1px solid var(--line); display: grid; gap: .7rem; grid-template-columns: auto minmax(0,1fr) auto; padding: .85rem 0; }
.shopping-bag-row small { color: var(--muted); }
.shopping-bag-row.purchased .shopping-bag-item-content { opacity: .62; text-decoration: line-through; }
.shopping-check { background: var(--surface); border: 1px solid var(--line); border-radius: 50%; color: var(--forest); cursor: pointer; font-size: 1.1rem; height: 2rem; padding: 0; width: 2rem; }
.wishlist-remove { color: var(--red); }
.garbage-row { align-items: flex-start; }
.garbage-meta { align-items: flex-end; display: flex; flex-direction: column; gap: .25rem; text-align: right; }

@media (max-width: 820px) {
  .wishlist-layout { grid-template-columns: 1fr; }
}

@media (max-width: 520px) {
  .wishlist-month-nav { gap: .35rem; justify-content: stretch; }
  .wishlist-month-nav .button { flex: 1; font-size: .84rem; padding-left: .4rem; padding-right: .4rem; white-space: nowrap; }
  .wishlist-month-nav strong { font-size: .86rem; min-width: 0; }
  .wishlist-row { align-items: stretch; flex-direction: column; }
  .wishlist-link-form { grid-template-columns: 1fr; }
  .garbage-meta { align-items: flex-start; text-align: left; }
}

.directory-map-panel { margin-bottom: 2.25rem; }
.directory-map-legend { color: var(--muted); display: flex; flex-wrap: wrap; gap: .75rem 1rem; margin-bottom: .8rem; }
.directory-map-legend span { align-items: center; display: inline-flex; gap: .4rem; white-space: nowrap; }
.directory-map-key { border: 2px solid #89978f; border-radius: 50%; height: .8rem; width: .8rem; }
.directory-map-key.occupied { background: var(--mint); border-color: var(--forest-2); }
.directory-map-key.empty { background: var(--surface); }
.directory-map-key.checked-in { background: var(--mint); border-color: var(--forest-2); }
.directory-map-key.confirmed { background: #dcecff; border-color: #527aa3; }
.directory-map-key.held { background: #fff2cc; border-color: #c49228; }
.directory-map-key.available { background: var(--surface); }
.directory-map-shell { background: #edf3e9; border: 1px solid var(--line); border-radius: 20px; margin: 0 auto; max-width: 760px; overflow: hidden; padding: .65rem; }
.directory-site-map { color: var(--ink); display: block; height: auto; width: 100%; }
.directory-site-map text { dominant-baseline: middle; fill: var(--ink); font-size: 24px; font-weight: 750; pointer-events: none; text-anchor: middle; }
.directory-site-map .map-site-line, .directory-site-map .map-house-line, .directory-site-map .map-door { fill: none; stroke: #718078; stroke-width: 2; vector-effect: non-scaling-stroke; }
.directory-site-map .map-site-line { stroke-width: 3; }
.directory-site-map .map-ground { fill: #e5f0e4; }
.directory-site-map .map-building-fill { fill: #e8e5dc; }
.directory-site-map .map-common-space { fill: #eef1ed; }
.directory-site-map .map-storage { fill: url(#directory-map-hatch); }
.directory-site-map .map-hatch-line { stroke: #b9c3bc; stroke-width: 3; }
.directory-site-map .map-trailer-shell { fill: #fff4cf; stroke: #d4b45b; stroke-width: 2; vector-effect: non-scaling-stroke; }
.directory-site-map .map-container-shell { fill: #e7eef6; stroke: #879aab; stroke-width: 2; vector-effect: non-scaling-stroke; }
.directory-site-map .map-place-label, .directory-site-map .map-facility-label { fill: var(--muted); font-weight: 600; }
.directory-site-map .map-facility-label { font-size: 19px; }
.directory-site-map .map-cowork-label { font-size: 14px; }
.directory-site-map .map-facility-short { display: none; }
.directory-site-map .map-room-shape { fill: var(--surface); stroke: #89978f; stroke-width: 3; transition: fill 150ms ease, stroke 150ms ease; vector-effect: non-scaling-stroke; }
.directory-site-map .directory-map-room { cursor: pointer; }
.directory-site-map .directory-map-room.is-occupied .map-room-shape { fill: var(--mint); stroke: var(--forest-2); }
.directory-site-map .directory-map-room.is-checked-in .map-room-shape { fill: var(--mint); stroke: var(--forest-2); }
.directory-site-map .directory-map-room.is-confirmed .map-room-shape { fill: #dcecff; stroke: #527aa3; }
.directory-site-map .directory-map-room.is-held .map-room-shape { fill: #fff2cc; stroke: #c49228; }
.directory-site-map .directory-map-room.is-draft .map-room-shape { fill: #eef1ed; stroke-dasharray: 6 4; }
.directory-site-map .directory-map-room.is-selected .map-room-shape { stroke: var(--orange); stroke-width: 5; }
.directory-site-map .directory-map-room:hover .map-room-shape, .directory-site-map .directory-map-room:focus-visible .map-room-shape { stroke: var(--orange); }
.directory-site-map .directory-map-room:focus-visible { outline: none; }
.directory-site-map .directory-map-room.is-unavailable { display: none; }
.directory-site-map .map-terrace-arrow { fill: none; stroke: var(--forest-2); stroke-width: 4; vector-effect: non-scaling-stroke; }
.directory-map-detail { align-items: center; background: rgba(255,253,250,.94); border: 1px solid var(--line); border-radius: 16px; display: grid; gap: 1rem; grid-template-columns: minmax(0,1fr) auto; margin: .8rem auto 0; max-width: 760px; padding: 1rem; }
.directory-map-detail strong, .directory-map-detail > div > span { display: block; }
.directory-map-detail > div > span { color: var(--muted); margin-top: .2rem; }
.directory-map-detail-occupants { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .6rem; }
.directory-map-detail-occupants .muted { background: #eef1ed; border-radius: 8px; padding: .4rem .55rem; }
.directory-list-heading { margin-top: 2.5rem; }
.room-card { scroll-margin-top: 1.25rem; }
.directory-room-card { align-items: center; }
.directory-room-card .occupant-list { grid-column: 2; }
.room-card:target { outline: 3px solid var(--orange); outline-offset: 3px; }

.booking-view-tabs { background: rgba(255,253,250,.94); border: 1px solid var(--line); border-radius: 14px; display: inline-flex; gap: .25rem; margin-bottom: 1.35rem; padding: .25rem; }
.booking-view-tabs a { border-radius: 10px; color: var(--ink); font-weight: 750; padding: .65rem 1rem; }
.booking-view-tabs a.active { background: var(--forest); color: #fff; }
.booking-workspace-heading { align-items: center; display: flex; gap: 1rem; justify-content: space-between; }
.booking-workspace-heading h2 { margin: .15rem 0; }
.booking-workspace-controls { align-items: stretch; display: flex; flex-direction: column; gap: .55rem; }
.booking-resolution-switch { background: #eef1ed; border-radius: 11px; display: flex; padding: .2rem; }
.booking-resolution-switch a { border-radius: 8px; color: var(--ink); flex: 1; font-size: .78rem; font-weight: 750; padding: .48rem .62rem; text-align: center; white-space: nowrap; }
.booking-resolution-switch a.active { background: var(--surface); box-shadow: 0 2px 8px rgba(24,48,38,.1); color: var(--forest); }
.booking-date-navigation { display: flex; gap: .45rem; }
.booking-status-legend { color: var(--muted); display: flex; flex-wrap: wrap; gap: .65rem 1rem; margin: 1rem 0; }
.booking-status-legend span { align-items: center; display: inline-flex; gap: .4rem; }
.booking-status-key { border: 2px solid #89978f; border-radius: 5px; height: .85rem; width: 1.25rem; }
.booking-status-key.checked-in { background: var(--mint); border-color: var(--forest-2); }
.booking-status-key.confirmed { background: #dcecff; border-color: #527aa3; }
.booking-status-key.held { background: #fff2cc; border-color: #c49228; }
.booking-status-key.draft { background: #eef1ed; border-style: dashed; }
.booking-timeline-shell { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; }
.booking-timeline-grid { background: var(--surface); min-width: 0; width: 100%; }
.booking-timeline-header, .booking-timeline-row { display: grid; grid-template-columns: 82px minmax(0,1fr); }
.booking-timeline-header { background: #eef1ed; border-bottom: 1px solid var(--line); position: sticky; top: 0; z-index: 2; }
.booking-timeline-header > strong, .booking-timeline-room { align-items: center; background: inherit; display: flex; padding: .7rem; position: sticky; left: 0; z-index: 2; }
.booking-timeline-days { display: grid; grid-template-columns: repeat(var(--booking-columns),minmax(0,1fr)); }
.booking-timeline-days span { border-left: 1px solid var(--line); display: flex; flex-direction: column; font-size: .78rem; min-width: 0; overflow: hidden; padding: .55rem .1rem; text-align: center; }
.booking-timeline-days small { color: var(--muted); font-size: .68rem; text-transform: uppercase; }
.booking-timeline-days .today { background: #fff2cc; }
.booking-timeline-months { display: grid; grid-template-columns: repeat(var(--booking-columns),minmax(0,1fr)); }
.booking-timeline-months span { border-left: 1px solid var(--line); font-size: .7rem; font-weight: 750; grid-column: var(--month-start) / span var(--month-span); min-width: 0; overflow: hidden; padding: .7rem .15rem; text-align: center; text-transform: uppercase; white-space: nowrap; }
.booking-timeline-months .current-month { background: #fff2cc; }
.booking-timeline-row { border-bottom: 1px solid var(--line); }
.booking-timeline-row:last-child { border-bottom: 0; }
.booking-timeline-room { background: var(--surface); border-right: 1px solid var(--line); }
.booking-timeline-track { background-image: linear-gradient(to right,transparent calc(100% - 1px),var(--line) 0); background-size: calc(100% / var(--booking-columns)) 100%; display: grid; gap: .2rem 0; grid-template-columns: repeat(var(--booking-columns),minmax(0,1fr)); grid-template-rows: repeat(var(--booking-lanes),2.55rem); min-height: 2.75rem; padding: .2rem 0; }
.timeline-quarter .booking-timeline-track, .timeline-half-year .booking-timeline-track, .timeline-year .booking-timeline-track { background-image: none; }
.booking-timeline-month-band { border-left: 1px solid var(--line); display: block; grid-column: var(--month-start) / span var(--month-span); grid-row: 1 / -1; min-width: 0; z-index: 0; }
.booking-timeline-month-band.current-month { background: #fffaf0; }
.booking-timeline-bar { align-self: stretch; border: 2px solid #89978f; border-radius: 8px; color: var(--ink); display: flex; flex-direction: column; grid-column: var(--booking-start) / span var(--booking-span); grid-row: var(--booking-lane); justify-content: center; margin: 0 .12rem; min-width: 0; overflow: hidden; padding: .25rem .45rem; position: relative; z-index: 1; }
.booking-timeline-bar strong, .booking-timeline-bar small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.booking-timeline-bar strong { font-size: .78rem; }
.booking-timeline-bar small { font-size: .66rem; }
.booking-timeline-bar.booking-status-checked-in { background: var(--mint); border-color: var(--forest-2); }
.booking-timeline-bar.booking-status-confirmed { background: #dcecff; border-color: #527aa3; }
.booking-timeline-bar.booking-status-held { background: #fff2cc; border-color: #c49228; }
.booking-timeline-bar.booking-status-draft { background: #eef1ed; border-style: dashed; }

@media (max-width: 520px) {
  .booking-view-tabs { display: flex; }
  .booking-view-tabs a { flex: 1; text-align: center; }
  .booking-workspace-heading { align-items: flex-start; flex-direction: column; }
  .booking-workspace-controls { width: 100%; }
  .booking-date-navigation { width: 100%; }
  .booking-date-navigation .button { flex: 1; }
  .directory-map-shell { border-radius: 14px; padding: .25rem; }
  .directory-site-map .map-facility-label { font-size: 24px; }
  .directory-site-map .map-facility-long { display: none; }
  .directory-site-map .map-facility-short { display: block; }
  .directory-map-detail { align-items: stretch; grid-template-columns: 1fr; }
  .directory-map-detail .button { width: 100%; }
}