/* Shells: the public/customer app and the operator console. */

/* ── customer shell ── */
.site-header{position:sticky;top:0;z-index:var(--z-header);background:var(--surface-nav);backdrop-filter:var(--blur-glass);border-bottom:var(--divider)}
.site-header .bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-16);min-height:var(--site-header-h)}
.brand{display:inline-flex;align-items:center;gap:var(--space-8);text-decoration:none;color:var(--text-heading);font:var(--type-wordmark);letter-spacing:var(--tracking-tight);text-transform:none}
.brand img{height:var(--space-32);width:auto}
.brand .word{font:var(--weight-bold) var(--text-xl)/1 var(--font-core)}
.site-nav{display:flex;align-items:center;gap:var(--space-4)}
.site-nav a{display:inline-flex;align-items:center;min-height:var(--tap-target-min);padding:0 var(--space-12);border-radius:var(--radius-control);font:var(--type-label);color:var(--text-body);text-decoration:none}
.site-nav a:hover{background:var(--surface-hover);color:var(--text-heading)}
.site-nav a[aria-current="page"]{color:var(--text-heading);background:var(--surface-selected)}
.header-actions{display:flex;align-items:center;gap:var(--space-8)}
.nav-toggle{display:none}
@media (max-width:900px){
  .site-nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;padding:var(--space-12) var(--space-20) var(--space-20);background:var(--surface-card);border-bottom:var(--divider);box-shadow:var(--shadow-md)}
  .site-nav.open{display:flex}
  .site-nav a{min-height:var(--control-h-lg)}
  .nav-toggle{display:inline-flex}
  .header-actions .hide-sm{display:none}
}
.who{display:inline-flex;align-items:center;gap:var(--space-8);font:var(--type-body-sm);color:var(--text-muted)}
.avatar{width:var(--space-32);height:var(--space-32);border-radius:var(--radius-avatar);background:var(--surface-brand);color:var(--text-on-brand);display:inline-flex;align-items:center;justify-content:center;font:var(--type-label)}

/* hero */
.hero{position:relative;color:var(--df-white);background:var(--surface-inverse) url('/assets/hero-generated.webp') center/cover no-repeat;min-height:min(78vh,720px);display:flex;align-items:center;isolation:isolate}
.hero::before{content:"";position:absolute;inset:0;background:var(--hero-scrim);z-index:-1}
.hero .container{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:var(--space-48);align-items:center;padding-top:var(--space-64);padding-bottom:var(--space-64)}
.hero h1{font:var(--type-h1);color:var(--df-white);letter-spacing:var(--tracking-tightest);max-width:18ch;font-size:clamp(3rem,6vw,4.4rem);line-height:var(--leading-tight)}
.hero .lead{color:var(--teal-100);max-width:52ch}
.hero .eyebrow{color:var(--glow-300)}
.hero-cta{display:flex;gap:var(--space-12);flex-wrap:wrap;margin-top:var(--space-8)}
.hero-stats{display:flex;gap:var(--space-32);flex-wrap:wrap;margin-top:var(--space-16)}
.hero-stats strong{display:block;font:var(--weight-bold) var(--text-2xl)/1 var(--font-core);color:var(--df-white);white-space:nowrap}
.hero-stats span{font:var(--type-caption);color:var(--teal-200)}
.search-card{background:var(--surface-card);color:var(--text-body);border-radius:var(--radius-panel);padding:var(--gutter-card);box-shadow:var(--shadow-xl);display:flex;flex-direction:column;gap:var(--space-12)}
.search-card h2{font:var(--type-h3)}
@media (max-width:900px){.hero .container{grid-template-columns:minmax(0,1fr);gap:var(--space-32);padding-top:var(--space-48);padding-bottom:var(--space-48)}.hero{min-height:0}}

/* listing cards */
.listing-card{padding:0;overflow:hidden}
.listing-media{position:relative;aspect-ratio:16/10;background:var(--surface-inverse) url('/assets/hero-generated.webp') center/cover no-repeat}
.listing-media::after{content:"";position:absolute;inset:0;background:var(--imagery-tint)}
.listing-media .chip{position:absolute;top:var(--space-12);left:var(--space-12);z-index:var(--z-raised)}
.listing-media .kind{position:absolute;bottom:var(--space-12);left:var(--space-12);z-index:var(--z-raised);color:var(--df-white);font:var(--type-label);background:var(--brand-primary-strong);padding:var(--space-4) var(--space-8);border-radius:var(--radius-tag)}
.listing-body{padding:var(--gutter-card-compact) var(--gutter-card) var(--gutter-card);display:flex;flex-direction:column;gap:var(--space-8)}
.listing-body h3{font:var(--type-h4);font-size:var(--text-lg)}
.listing-meta{display:flex;gap:var(--space-12);flex-wrap:wrap;font:var(--type-body-sm);color:var(--text-muted)}
.listing-foot{display:flex;justify-content:space-between;align-items:flex-end;gap:var(--space-12);margin-top:auto;padding-top:var(--space-8)}
.filters{display:grid;grid-template-columns:2fr 1fr 1fr 1fr auto;gap:var(--space-12);align-items:end}
@media (max-width:900px){.filters{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.filters{grid-template-columns:minmax(0,1fr)}}
.trust-line{display:flex;align-items:center;gap:var(--space-8);font:var(--type-body-sm);color:var(--text-muted)}
.score-pill{display:inline-flex;align-items:center;gap:var(--space-6);padding:var(--space-4) var(--space-8);border-radius:var(--radius-badge);background:var(--surface-inverse);color:var(--text-on-inverse);font:var(--type-label);white-space:nowrap}
.score-pill.none{background:var(--surface-sunken);color:var(--text-muted)}

/* how it works */
.how{counter-reset:step}
.how .card{position:relative}
.how .card h3{font:var(--type-h4);font-size:var(--text-lg)}
.how .n{width:var(--space-40);height:var(--space-40);border-radius:var(--radius-md);background:var(--surface-brand);color:var(--text-on-brand);display:inline-flex;align-items:center;justify-content:center;font:var(--weight-bold) var(--text-lg)/1 var(--font-core)}
.fee-card{align-items:flex-start}
.fee-card .price{display:block;margin-top:var(--space-4)}
.fee-card .price-lg{font-size:var(--text-3xl);line-height:1}

/* footer */
.site-footer{background:var(--surface-inverse);color:var(--text-on-inverse-muted);padding:var(--space-48) 0 var(--space-32);margin-top:var(--space-40)}
.site-footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--space-32)}
.site-footer h4{color:var(--text-on-inverse);font:var(--type-h4);margin-bottom:var(--space-12)}
.site-footer a{color:var(--text-on-inverse-muted);text-decoration:none;display:block;padding:var(--space-4) 0;min-height:var(--space-32)}
.site-footer a:hover{color:var(--text-on-inverse)}
.site-footer .brand{color:var(--text-on-inverse)}
.site-footer .trust{display:flex;gap:var(--space-16);flex-wrap:wrap;margin-top:var(--space-16);font:var(--type-caption)}
.site-footer .trust span{display:inline-flex;align-items:center;gap:var(--space-6)}
.site-footer .legal{border-top:var(--border-width-hairline) solid var(--border-inverse);margin-top:var(--space-32);padding-top:var(--space-16);display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--space-12);font:var(--type-caption)}
@media (max-width:900px){.site-footer .cols{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.site-footer .cols{grid-template-columns:minmax(0,1fr)}}

/* sign-in */
.auth{max-width:440px;margin:var(--space-64) auto}

/* ── admin shell ── */
.admin{display:grid;grid-template-columns:var(--app-sidebar-w) minmax(0,1fr);min-height:100vh;background:var(--surface-page-alt)}
.admin-side{background:var(--brand-charcoal);color:var(--df-frost);display:flex;flex-direction:column;padding:var(--space-16);gap:var(--space-16);position:sticky;top:0;height:100vh}
.admin-side .brand{color:var(--df-white);padding:var(--space-8)}
.admin-side .brand small{display:block;font:var(--type-caption);color:var(--teal-300);text-transform:none;letter-spacing:0}
.admin-nav{display:flex;flex-direction:column;gap:var(--space-4)}
.admin-nav a{display:flex;align-items:center;gap:var(--space-12);min-height:var(--tap-target-min);padding:0 var(--space-12);border-radius:var(--radius-control);color:var(--teal-100);text-decoration:none;font:var(--type-label)}
.admin-nav a:hover{background:var(--brand-charcoal-3);color:var(--df-white)}
.admin-nav a[aria-current="page"]{background:var(--brand-primary);color:var(--df-white)}
.admin-nav .group{font:var(--type-eyebrow);letter-spacing:var(--tracking-widest);text-transform:uppercase;color:var(--teal-300);padding:var(--space-16) var(--space-12) var(--space-4)}
.admin-side .foot{margin-top:auto;font:var(--type-caption);color:var(--teal-300);display:flex;flex-direction:column;gap:var(--space-8)}
.admin-side .foot a{color:var(--teal-100)}
.admin-main{display:flex;flex-direction:column;min-width:0}
.admin-top{display:flex;align-items:center;justify-content:space-between;gap:var(--space-16);min-height:var(--app-topbar-h);padding:0 var(--space-24);background:var(--surface-card);border-bottom:var(--divider);position:sticky;top:0;z-index:var(--z-sticky)}
.admin-top h1{font:var(--type-h3)}
.admin-content{padding:var(--space-24);display:flex;flex-direction:column;gap:var(--space-24)}
.admin-burger{display:none}
@media (max-width:900px){
  .admin{grid-template-columns:minmax(0,1fr)}
  .admin-side{position:fixed;inset:0 auto 0 0;width:min(84vw,var(--app-sidebar-w));transform:translateX(-100%);transition:transform var(--duration-panel) var(--ease-standard);z-index:var(--z-scrim)}
  .admin.side-open .admin-side{transform:none;box-shadow:var(--shadow-xl)}
  .admin-burger{display:inline-flex}
  .admin-content{padding:var(--space-16)}
}
.kpi-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--space-16)}
@media (max-width:1100px){.kpi-row{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.kpi-row{grid-template-columns:minmax(0,1fr)}}
.chart{width:100%;height:auto;display:block}
.chart text{font:var(--type-caption);fill:var(--text-muted)}
.chart .grid line{stroke:var(--chart-grid)}
.chart .bar-rent{fill:var(--chart-1)}
.chart .bar-comm{fill:var(--chart-2)}
.legend{display:flex;gap:var(--space-16);font:var(--type-caption);color:var(--text-muted)}
.legend i{display:inline-block;width:var(--space-12);height:var(--space-12);border-radius:var(--radius-xs);margin-right:var(--space-6);vertical-align:middle}
.status-dot{display:inline-block;width:var(--space-8);height:var(--space-8);border-radius:var(--radius-pill);background:var(--text-disabled);margin-right:var(--space-6)}
.status-dot.on{background:var(--glow-500)}
.status-dot.off{background:var(--rust-400)}
.queue-item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-12);align-items:start}
@media (max-width:640px){.queue-item{grid-template-columns:minmax(0,1fr)}}
.review-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-16)}
@media (max-width:760px){.review-pair{grid-template-columns:minmax(0,1fr)}}
.room-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-12);align-items:start}
@media (max-width:640px){.room-card{grid-template-columns:minmax(0,1fr)}}
.photo-row{display:flex;gap:var(--space-8);flex-wrap:wrap}
.file-btn{position:relative;overflow:hidden}
.file-btn input{position:absolute;inset:0;opacity:0;cursor:pointer}
