:root{--bg:#f5f7fb;--panel:#fff;--text:#172033;--muted:#6b7280;--border:#dbe3ef;--primary:#1d4ed8;--primary-dark:#1e40af;--success:#dcfce7;--warning:#fef3c7;--danger:#fecaca;--weekend:#e5e7eb;--selected-border:#2563eb;--shadow:0 10px 25px #0f172a14;--radius:14px}*{box-sizing:border-box}body{color:var(--text);background:linear-gradient(#f8fbff 0%,#f3f6fb 100%);margin:0;font-family:Inter,Segoe UI,Roboto,Arial,sans-serif}a{color:var(--primary);text-decoration:none}a:hover{text-decoration:underline}button{font:inherit}.app-shell{min-height:100vh}.topbar{color:#fff;box-shadow:var(--shadow);background:linear-gradient(135deg,#0f172a,#1e3a8a);border-bottom:1px solid #ffffff14;padding:20px 28px}.topbar-inner{justify-content:space-between;align-items:center;max-width:1400px;margin:0 auto;display:flex}.brand h1{letter-spacing:-.02em;margin:0;font-size:2rem;font-weight:800}.brand p{color:#ffffffd9;margin:6px 0 0;font-size:.95rem}.admin-link{color:#fff;background:#ffffff1f;border-radius:999px;padding:10px 14px;font-weight:600}.admin-link:hover{background:#fff3;text-decoration:none}.main-wrap{max-width:1400px;margin:0 auto;padding:28px}.hero-card,.calendar-card,.side-card,.legend-card{background:var(--panel);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.hero-card{margin-bottom:20px;padding:24px}.hero-card h2{letter-spacing:-.02em;margin:0 0 10px;font-size:2rem;font-weight:800}.hero-card p{color:var(--muted);max-width:850px;margin:0;line-height:1.5}.month-nav{background:var(--panel);border:1px solid var(--border);width:fit-content;box-shadow:var(--shadow);border-radius:999px;align-items:center;gap:14px;margin-bottom:20px;padding:10px 14px;display:flex}.month-nav button{border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:999px;padding:10px 16px;font-weight:600}.month-nav button:hover:not(:disabled){background:#eff6ff;border-color:#bfdbfe}.month-nav button:disabled{opacity:.45;cursor:not-allowed}.month-nav strong{text-align:center;min-width:130px;font-size:1rem}.layout-grid{grid-template-columns:2.2fr 1fr;align-items:start;gap:22px;display:grid}.booking-layout-grid{align-items:start}.calendar-card{padding:22px}.calendar-card h3{margin:0 0 18px;font-size:1.4rem}.weekday-headings,.days-grid{grid-template-columns:repeat(7,1fr);gap:10px;display:grid}.weekday-headings{margin-bottom:10px}.weekday-headings div{color:var(--muted);text-align:center;font-size:.9rem;font-weight:700}.day-btn{border:1px solid var(--border);cursor:pointer;border-radius:12px;min-height:54px;font-weight:700;transition:transform .12s,box-shadow .12s,border-color .12s}.day-btn:hover{transform:translateY(-1px);box-shadow:0 6px 16px #2563eb1a}.day-btn.selected{border:3px solid var(--selected-border)}.side-card{min-height:300px;padding:22px}.side-card h3{margin-top:0;margin-bottom:8px;font-size:1.25rem}.muted{color:var(--muted);font-size:.95rem}.notice{border-radius:12px;margin-top:14px;padding:14px 16px;font-size:.95rem;line-height:1.45}.notice-warning{background:#fffbeb;border:1px solid #f59e0b}.notice-info{background:#eff6ff;border:1px solid #60a5fa;font-weight:700}.slot-list{gap:10px;margin-top:14px;display:grid}.slot-btn{text-align:left;border:1px solid var(--border);cursor:pointer;background:#fff;border-radius:12px;width:100%;padding:14px 16px;font-weight:700}.slot-btn:hover{background:#eff6ff;border-color:#93c5fd}.legend-card{margin-top:16px;padding:18px 20px}.legend-title{margin:0 0 10px;font-weight:800}.legend-row{flex-wrap:wrap;gap:16px;display:flex}.legend-item{color:var(--muted);align-items:center;gap:8px;font-size:.92rem;display:flex}.legend-swatch{border:1px solid #cbd5e1;border-radius:6px;width:16px;height:16px}.booking-access-card{padding:20px 22px}.booking-access-grid{grid-template-columns:minmax(240px,1fr) auto;align-items:end;gap:.75rem;display:grid}.logged-in-card{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;display:flex}.secondary-action-btn{cursor:pointer;white-space:nowrap;background:#fff;border:1px solid #d1d5db;border-radius:10px;padding:.75rem 1rem;font-weight:700}.bookings-header-row{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.customer-bookings-wrap{gap:1.25rem;margin-top:1rem;display:grid}.customer-bookings-section{gap:.85rem;display:grid}.customer-bookings-title{margin:0;font-size:1rem;font-weight:800}.customer-bookings-list{gap:.85rem;display:grid}.customer-booking-item{border:1px solid var(--border);background:#f8fbff;border-radius:12px;justify-content:space-between;align-items:flex-start;gap:1rem;padding:14px 16px;display:flex}.customer-booking-main{min-width:0}.customer-booking-date{margin-bottom:4px;font-weight:800}.customer-booking-meta{color:var(--muted);font-size:.95rem;line-height:1.45}.customer-booking-urn{color:#475569;word-break:break-word;margin-top:6px;font-size:.88rem}.booking-status-pill{text-transform:capitalize;white-space:nowrap;border:1px solid #0000;border-radius:999px;padding:8px 12px;font-size:.88rem;font-weight:800}.booking-status-unpaid{color:#9a3412;background:#fff7ed;border-color:#fdba74}.booking-status-paid{color:#166534;background:#ecfdf5;border-color:#86efac}.booking-status-cancelled{color:#991b1b;background:#fef2f2;border-color:#fca5a5}@media (width<=980px){.layout-grid{grid-template-columns:1fr}.main-wrap,.topbar{padding:18px}.brand h1{font-size:1.6rem}.booking-access-grid{grid-template-columns:1fr}.booking-access-grid button{width:100%}.customer-booking-item{flex-direction:column;align-items:stretch}.booking-status-pill{align-self:flex-start}}@media (width<=640px){.main-wrap{padding:14px}.hero-card,.calendar-card,.side-card,.legend-card{border-radius:12px}.hero-card,.calendar-card,.side-card,.legend-card,.booking-access-card{padding:16px}.hero-card h2{font-size:1.6rem}.calendar-card h3,.side-card h3{font-size:1.15rem}.month-nav{justify-content:space-between;gap:8px;width:100%;padding:8px 10px}.month-nav strong{flex:1;min-width:auto}.month-nav button{padding:9px 12px}.weekday-headings,.days-grid{gap:6px}.weekday-headings div{font-size:.78rem}.day-btn{border-radius:10px;min-height:44px;font-size:.95rem}.side-card{min-height:auto}.logged-in-card{align-items:stretch}.secondary-action-btn{width:100%}.customer-booking-item{padding:12px}.customer-booking-date{line-height:1.4}.legend-row{gap:10px}.legend-item{font-size:.85rem}}.slot{border:1px dashed #ccc;padding:8px}