:root { --green:#1b4332; --cream:#fbf7ef; --gold:#c9a24a; --line:#e8dfcf; --text:#16221b; --muted:#667065; }
* { box-sizing: border-box; }
body { margin:0; font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color:var(--text); background:linear-gradient(135deg,#fbf7ef,#eef7f0); min-height:100vh; }
.app-shell { width:min(1120px, calc(100% - 32px)); margin:0 auto; padding:48px 0; }
.login-card, .calendar-card, .portal-header { background:rgba(255,255,255,.92); border:1px solid var(--line); border-radius:24px; box-shadow:0 20px 60px rgba(27,67,50,.12); }
.login-card { max-width:440px; margin:5vh auto 0; padding:34px; }
.brand-mark { width:54px; height:54px; border-radius:16px; display:grid; place-items:center; background:var(--green); color:#fff; font-weight:900; letter-spacing:.08em; }
.eyebrow { color:var(--gold); text-transform:uppercase; letter-spacing:.12em; font-size:.75rem; font-weight:900; margin:18px 0 6px; }
h1, h2 { margin:.15rem 0; color:var(--green); }
.lede, .portal-header p, #calendarMeta { color:var(--muted); line-height:1.5; }
.login-form { display:grid; gap:14px; margin-top:24px; }
label { display:grid; gap:6px; font-size:.78rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); font-weight:900; }
input { border:1px solid var(--line); border-radius:14px; padding:14px 15px; font-size:1rem; color:var(--text); background:#fff; }
button { border:0; border-radius:14px; padding:13px 16px; font-weight:900; cursor:pointer; color:#fff; background:var(--green); }
button.secondary { background:#fff; color:var(--green); border:1px solid var(--line); }
.status { min-height:22px; color:#b45309; font-weight:700; }
.portal { display:grid; gap:18px; }
.portal-header { padding:24px; display:flex; justify-content:space-between; gap:16px; align-items:center; }
.property-picker { display:flex; flex-wrap:wrap; gap:10px; }
.property-chip { background:#fff; color:var(--green); border:1px solid var(--line); }
.property-chip.active { background:var(--green); color:#fff; border-color:var(--green); }
.calendar-card { padding:24px; }
.calendar-card-head, .showing-form { display:flex; justify-content:space-between; gap:12px; align-items:end; flex-wrap:wrap; }
.showing-form { margin:18px 0 20px; align-items:center; }
.showing-form input[type="text"] { flex:1; min-width:220px; }
.calendar-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(118px,1fr)); gap:10px; }
.day { min-height:96px; border:1px solid var(--line); border-radius:16px; background:#fff; padding:12px; display:flex; flex-direction:column; gap:4px; }
.day strong { font-size:1.35rem; color:var(--green); }
.day span { color:var(--muted); font-size:.82rem; }
.day.held { background:#fff7ed; border-color:#fdba74; }
.day em { margin-top:auto; color:#9a3412; font-style:normal; font-size:.78rem; font-weight:900; }
.day small { color:#9a3412; }
.empty { color:var(--muted); padding:18px; }
@media (max-width:700px) { .app-shell{width:min(100% - 18px,1120px); padding:18px 0;} .portal-header{align-items:flex-start; flex-direction:column;} .calendar-card-head,.showing-form{align-items:stretch; flex-direction:column;} }