:root { --ink:#182a22; --muted:#65766d; --line:#d9e2dc; --canvas:#f5f7f5; --surface:#fff; --brand:#12663f; --brand-ink:#fff; --soft:#e8f2ec; --danger:#b53f38; --available:#237c4a; --discussion:#a86b0c; --booked:#196a9c; --sold:#b53f38; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; color:var(--ink); background:var(--canvas); }
* { box-sizing:border-box; } body { margin:0; min-width:320px; } button,input,select,textarea { font:inherit; } button { cursor:pointer; } .shell { min-height:100vh; display:grid; grid-template-columns:240px 1fr; }.sidebar { padding:22px 14px; border-right:1px solid var(--line); background:var(--surface); display:flex; flex-direction:column; gap:25px; }.brand { display:flex; gap:10px; align-items:center; padding:0 9px; font-weight:700; }.brand-mark { width:31px; height:31px; display:grid; place-items:center; border-radius:9px; color:var(--brand-ink); background:var(--brand); }.nav-label { color:var(--muted); text-transform:uppercase; font-size:10px; letter-spacing:.09em; padding:0 9px 5px; }.nav { display:grid; gap:3px; }.nav button { border:0; background:transparent; color:var(--muted); text-align:left; padding:9px; border-radius:7px; }.nav button:hover,.nav button.active { color:var(--ink); background:var(--soft); font-weight:600; }.profile { margin-top:auto; border-top:1px solid var(--line); padding:14px 9px 0; }.profile strong,.profile span { display:block; font-size:12px; }.profile span { color:var(--muted); margin-top:3px; }.content { min-width:0; }.topbar { min-height:70px; padding:14px 28px; display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--surface); border-bottom:1px solid var(--line); }.project-select { min-width:235px; padding:8px 10px; border:1px solid var(--line); background:var(--surface); border-radius:7px; color:var(--ink); }.logout { border:1px solid var(--line); color:var(--ink); padding:8px 10px; border-radius:7px; background:var(--surface); }.page { padding:27px 28px; max-width:1400px; }.eyebrow { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }.page h1 { margin:5px 0 5px; font-size:25px; letter-spacing:-.04em; }.subtext { color:var(--muted); margin:0; font-size:13px; }.cards { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin:20px 0; }.card { border:1px solid var(--line); border-radius:10px; padding:14px; background:var(--surface); }.card-label { color:var(--muted); font-size:11px; }.card-value { font-size:25px; font-weight:700; margin-top:4px; letter-spacing:-.04em; }.card-note { color:var(--muted); font-size:11px; margin-top:3px; }.grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(250px,.65fr); gap:15px; }.panel { border:1px solid var(--line); border-radius:10px; background:var(--surface); overflow:hidden; }.panel-head { padding:14px 15px; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; gap:12px; }.panel h2 { margin:0; font-size:14px; }.panel-body { padding:15px; }.empty-map { min-height:330px; display:grid; place-items:center; padding:25px; background:linear-gradient(135deg,#f8faf8,#eef4f0); color:var(--muted); text-align:center; }.empty-map strong { color:var(--ink); display:block; margin-bottom:5px; }.detail-list { display:grid; gap:11px; }.detail-list div { display:flex; justify-content:space-between; gap:10px; font-size:12px; }.detail-list span { color:var(--muted); }.btn { border:1px solid var(--line); background:var(--surface); color:var(--ink); padding:8px 10px; border-radius:7px; font-size:12px; font-weight:600; }.btn.primary { background:var(--brand); border-color:var(--brand); color:var(--brand-ink); }.btn.danger { color:var(--danger); }.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }.field { display:grid; gap:5px; }.field label { color:var(--muted); font-size:11px; }.field input,.field select,.field textarea { min-width:0; border:1px solid var(--line); border-radius:7px; padding:9px; color:var(--ink); background:var(--surface); }.field textarea { min-height:75px; resize:vertical; }.field.full { grid-column:1/-1; }.actions { margin-top:14px; display:flex; gap:8px; justify-content:flex-end; }.table-wrap { overflow:auto; }.table { border-collapse:collapse; width:100%; min-width:710px; font-size:12px; }.table th,.table td { text-align:left; padding:10px 14px; border-bottom:1px solid var(--line); }.table th { color:var(--muted); background:#f7f9f7; font-weight:600; }.status { font-size:11px; font-weight:600; text-transform:capitalize; }.status.available { color:var(--available); }.status.discussion { color:var(--discussion); }.status.booked { color:var(--booked); }.status.sold { color:var(--sold); }.map-wrap { min-height:510px; background:#f8faf8; }.map-wrap svg { width:100%; height:auto; max-height:610px; display:block; }.plot { fill:var(--soft); stroke:var(--brand); stroke-width:1; cursor:pointer; }.plot[data-status="discussion"] { fill:#faedce; }.plot[data-status="booked"] { fill:#dbeef9; }.plot[data-status="sold"] { fill:#f8deda; }.plot:hover { stroke-width:3; }.note { padding:11px 13px; border-radius:7px; background:#fff6dc; color:#6d531b; font-size:12px; }.import-box { border:1px dashed #aabbb1; border-radius:10px; padding:20px; background:#f8fbf9; }.login { min-height:100vh; display:grid; place-items:center; padding:20px; }.login-card { width:min(410px,100%); padding:28px; background:var(--surface); border:1px solid var(--line); border-radius:13px; }.login-card h1 { margin:7px 0; letter-spacing:-.04em; }.login-card p { color:var(--muted); font-size:13px; line-height:1.5; }.login-demo { margin-top:18px; border-top:1px solid var(--line); padding-top:15px; color:var(--muted); font-size:11px; }.error { color:var(--danger); font-size:12px; margin-top:9px; }.hidden { display:none!important; } @media(max-width:860px){.shell{grid-template-columns:1fr}.sidebar{display:none}.topbar,.page{padding-left:16px;padding-right:16px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.grid{grid-template-columns:1fr}} @media(max-width:520px){.topbar{align-items:flex-start;flex-direction:column}.cards{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}}