*{box-sizing:border-box}body{margin:0;font:14px/1.45 "Segoe UI",Roboto,"Noto Sans SC",sans-serif;display:flex;min-height:100vh;background:#f4f5f7;color:#1f2937}
aside{width:220px;background:#1e293b;color:#cbd5e1;display:flex;flex-direction:column;position:fixed;top:0;bottom:0}
.brand{padding:18px;font-weight:700;color:#fff;font-size:15px;border-bottom:1px solid #334155}
nav a{display:block;padding:10px 18px;color:#cbd5e1;text-decoration:none;cursor:pointer}nav a.on,nav a:hover{background:#334155;color:#fff;border-left:3px solid #c59d5f}
.sidefoot{margin-top:auto;padding:14px;display:flex;flex-direction:column;gap:8px}.sidefoot select{padding:6px}
main{margin-left:220px;flex:1;padding:0 26px 30px}header{display:flex;justify-content:space-between;align-items:center;padding:16px 0}h1{font-size:22px;margin:0}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:18px}
.card{background:#fff;border-radius:10px;padding:16px;box-shadow:0 1px 3px #0001}.card .v{font-size:24px;font-weight:700;color:#0f172a}.card .l{color:#64748b;font-size:12px;text-transform:uppercase}
.panel{background:#fff;border-radius:10px;padding:16px;box-shadow:0 1px 3px #0001;margin-bottom:16px}.panel h3{margin:0 0 10px;font-size:15px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:7px 8px;border-bottom:1px solid #eef0f3;font-size:13px}th{color:#64748b;font-weight:600;background:#f8fafc}
.btn{background:#9a7b4f;color:#fff;border:0;border-radius:6px;padding:7px 12px;cursor:pointer;font-size:13px}.btn:hover{filter:brightness(1.1)}.btn.ghost{background:#334155}.btn.small{padding:4px 8px;font-size:12px}.btn.sec{background:#e2e8f0;color:#1f2937}
.btn:disabled{opacity:.4;cursor:not-allowed}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px;align-items:center}select,input{padding:6px 8px;border:1px solid #cbd5e1;border-radius:6px;font:inherit}
.grid{display:grid;gap:4px}.niche{height:44px;border-radius:5px;font-size:10px;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;border:2px solid transparent}.niche:hover{border-color:#0f172a}
.rowlbl{font-weight:600;color:#64748b;font-size:11px;display:flex;align-items:center}
.s-Available{background:#16a34a}.s-Reserved{background:#f59e0b}.s-Occupied{background:#64748b}.s-FullyPaid{background:#2563eb}.s-Expired{background:#dc2626}
.legend{display:flex;gap:12px;font-size:12px}.legend span::before{content:"";display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:4px;vertical-align:-2px;background:var(--c)}
.badge{padding:2px 8px;border-radius:10px;font-size:11px;color:#fff;white-space:nowrap}
#modal{position:fixed;inset:0;background:#0007;display:flex;align-items:center;justify-content:center;z-index:9}#modal.hidden{display:none}
.mbox{background:#fff;border-radius:10px;padding:22px;width:720px;max-height:88vh;overflow:auto;position:relative}.x{position:absolute;right:12px;top:8px;border:0;background:none;font-size:24px;cursor:pointer}
.kv{display:grid;grid-template-columns:150px 1fr;gap:4px 10px;margin-bottom:12px}.kv b{color:#64748b;font-weight:600}
.pipeline{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.col{background:#eef1f5;border-radius:8px;padding:8px;min-height:200px}.col h4{margin:4px 0 8px;font-size:13px}
.lead{background:#fff;border-radius:6px;padding:8px;margin-bottom:6px;font-size:12px;box-shadow:0 1px 2px #0001}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.cal div{background:#fff;min-height:84px;border-radius:6px;padding:4px;font-size:11px}.cal .h{min-height:auto;background:none;font-weight:600;text-align:center}
.ev{background:#9a7b4f;color:#fff;border-radius:4px;padding:1px 4px;margin-top:2px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.ev.c{background:#2563eb}
.muted{color:#94a3b8}form.f{display:grid;grid-template-columns:1fr 1fr;gap:10px}form.f label{display:flex;flex-direction:column;font-size:12px;color:#64748b;gap:3px}
#toast{position:fixed;bottom:20px;right:20px;background:#0f172a;color:#fff;padding:10px 16px;border-radius:6px;opacity:0;transition:.3s}#toast.on{opacity:1}
.bar{height:8px;background:#e2e8f0;border-radius:4px;overflow:hidden}.bar i{display:block;height:100%;background:#9a7b4f}
.legend span.s-Availablex::before{background:#16a34a}.legend span.s-Reservedx::before{background:#f59e0b}.legend span.s-Occupiedx::before{background:#64748b}.legend span.s-FullyPaidx::before{background:#2563eb}.legend span.s-Expiredx::before{background:#dc2626}
@media print{aside,header,.x,.btn{display:none}main{margin:0}#modal{position:static;background:none}.mbox{box-shadow:none;width:auto}}

/* ===== Theme: Light · Electric Blue & Cyan ===== */
@font-face{font-family:"Orbitron";src:url("fonts/Orbitron.ttf") format("truetype");font-weight:400 900;font-display:swap}
:root{--bg:#EEF3FB;--card:#fff;--blue:#1D4ED8;--blue2:#2050E0;--teal:#0F7490;--cyan:#0891B2;--navy:#0F172A;--slate:#64748B;--chip:#E3EBFA;--r:16px;--sh:0 4px 18px rgba(29,78,216,.08),0 1px 3px rgba(15,23,42,.06);
  --disp:"Orbitron","Exo 2","Eurostile","Segoe UI",system-ui,sans-serif}
body{font-family:Inter,"Segoe UI",Roboto,"Noto Sans SC","PingFang SC",system-ui,sans-serif;background:var(--bg);color:var(--navy)}
h1,h2,h3,h4{color:var(--navy)}h1{font-family:var(--disp);font-size:20px;letter-spacing:.5px}
.muted{color:var(--slate)}
aside{background:#fff;color:var(--navy);box-shadow:var(--sh);border-right:1px solid #dfe7f5}
.brand{font-family:var(--disp);color:var(--blue);border-bottom:1px solid #e3ebfa;letter-spacing:.5px;font-size:14px}
nav{padding:8px}nav a{color:#334155;border-radius:12px;margin:2px 0;border-left:0!important;padding:9px 14px}
nav a:hover{background:var(--chip);color:var(--blue)}nav a.on{background:var(--blue);color:#fff;box-shadow:0 4px 12px rgba(29,78,216,.3)}
.sidefoot select{border-radius:10px}
.card,.panel,.mbox,.lead{border-radius:var(--r);box-shadow:var(--sh);border:0}
.card{background:var(--chip);box-shadow:none}.card .l{color:var(--slate);font-weight:600;letter-spacing:.4px}
.card .v{font-family:var(--disp);color:var(--blue);font-weight:800;font-size:22px}
.card.hero,.hero{background:linear-gradient(135deg,#1E40C8 0%,#0E7490 70%,#0891B2 100%);color:#fff;box-shadow:0 10px 26px rgba(14,116,144,.3)}
.card.hero .l{color:#dbeafe}.card.hero .v{color:#fff;font-size:30px}
.btn{background:var(--blue);border-radius:12px;padding:8px 14px;font-weight:600}.btn:hover{background:var(--blue2);filter:none}
.btn.ghost,.btn.tealbtn{background:var(--teal);border-radius:999px}.btn.ghost:hover,.btn.tealbtn:hover{background:var(--cyan)}
.btn.sec{background:var(--chip);color:var(--blue)}.btn.sec:hover{background:#d3e0f8}
.filters .btn:not(.sec):not(.ghost):not(.tealbtn){border-radius:999px}.filters .btn.sec{border-radius:999px}
select,input{border-radius:10px;border-color:#cdd9ef}select:focus,input:focus{outline:2px solid #93b4f5;border-color:var(--blue)}
th{background:#F3F7FD;color:var(--slate)}td,th{border-bottom-color:#E6EDF8}
.badge{border-radius:999px;font-weight:600;padding:2px 10px}
.pill{display:inline-block;background:#CCFBF1;color:var(--teal);border-radius:999px;padding:2px 10px;font-size:11px;font-weight:600}.pill.used{background:#E0E7FF;color:#3730A3}
.niche{border-radius:8px}.niche b{font-family:var(--disp);font-size:10px}
/* status colours kept clearly distinct from the blue theme */
.s-Available{background:#16a34a}.s-Reserved{background:#f59e0b}.s-Occupied{background:#475569}.s-FullyPaid{background:#7c3aed}.s-Expired{background:#dc2626}
.legend span::before{border-radius:4px}
.ev{background:var(--teal);border-radius:6px}.ev.c{background:var(--blue)}
.col{background:var(--chip);border-radius:var(--r)}.cal div{border-radius:10px}
.bar{background:var(--chip)!important;border-radius:999px;overflow:hidden}.bar i{background:linear-gradient(90deg,#1E40C8,#0891B2)!important}
.calc{background:var(--chip);border-radius:12px;padding:10px 12px;color:var(--blue)}.calc .err,.err{color:#dc2626;font-weight:600}
.kv b{color:var(--slate)}
.legend span.s-Occupiedx::before{background:#475569}.legend span.s-FullyPaidx::before{background:#7c3aed}
/* login */
body.locked aside,body.locked main{display:none}
#login{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 30% 20%,#e0f7ff,#cfe8ff 45%,#b9d8ff);z-index:20}
.loginbox{background:#fff;border-radius:14px;padding:28px 30px;width:340px;display:flex;flex-direction:column;gap:12px;box-shadow:0 10px 40px #0b5fff33;border:1px solid #bfe3ff}
.loginbox .brand{color:#0b4fd8;border:0;padding:0 0 6px;font-size:18px}.loginbox label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#475569}
.loginbox .err{color:#dc2626;min-height:1em;font-size:12px}
/* excel view */
.seg{display:inline-flex;border:1px solid #9cc9ff;border-radius:8px;overflow:hidden;margin-bottom:10px}.seg button{border:0;background:#fff;padding:6px 14px;cursor:pointer;font:inherit;color:#0b4fd8}.seg button.on{background:linear-gradient(90deg,#0b5fff,#00c2ff);color:#fff}
.xlwrap{max-height:68vh;overflow:auto;border:1px solid #cfe1f5;border-radius:6px;background:#fff}
table.xl{border-collapse:separate;border-spacing:0;width:max-content;font-size:12px}table.xl th,table.xl td{border-right:1px solid #e3ecf6;border-bottom:1px solid #e3ecf6;padding:4px 8px;white-space:nowrap;max-width:320px;overflow:hidden;text-overflow:ellipsis}
table.xl thead th{position:sticky;top:0;background:#eaf3ff;color:#0f2a4a;cursor:pointer;z-index:2;font-weight:700}table.xl thead tr:nth-child(2) th{top:29px}
table.xl .xltitle th{font-size:15px;text-align:left;background:#fff;cursor:default}table.xl .fz{position:sticky;background:#fff;z-index:1}table.xl thead .fz{z-index:3;background:#eaf3ff}table.xl .fz0{left:38px}table.xl .fz1{left:118px}
table.xl .rn{position:sticky;left:0;background:#f5f9ff;color:#64748b;z-index:1;width:38px;text-align:right}table.xl thead .rn{z-index:3}table.xl .num{text-align:right}
table.xl tbody tr:hover td{background:#f0f8ff}
.st-Available .stc{background:#dcfce7!important}.st-Reserved .stc{background:#fef3c7!important}.st-FullyPaid .stc{background:#ede9fe!important}.st-Occupied .stc{background:#e2e8f0!important}.st-Expired .stc{background:#fee2e2!important}
table.imp td{vertical-align:top;font-size:12px}.old{color:#b91c1c;text-decoration:line-through}.new{color:#15803d;font-weight:600}.warn{color:#b45309}.err{color:#dc2626}
.k-new{background:#dcfce7}.k-changed{background:#dbeafe}.k-error{background:#fee2e2}.k-unchanged{background:#f1f5f9}.ic-new .v{color:#15803d}.ic-changed .v{color:#0b5fff}.ic-error .v{color:#dc2626}.ic-warn .v{color:#b45309}
/* busy overlay + spinners */
#busy{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;background:rgba(234,244,255,0);transition:background .15s;cursor:progress}
#busy.block{display:flex}#busy .busybox{opacity:0;transform:scale(.96);transition:opacity .15s,transform .15s}
#busy.show{background:rgba(220,236,255,.6);backdrop-filter:blur(2px)}#busy.show .busybox{opacity:1;transform:none}
.busybox{background:#fff;border:1px solid #bfe3ff;border-radius:14px;padding:22px 30px;box-shadow:0 10px 40px #0b5fff33;display:flex;flex-direction:column;align-items:center;gap:12px;min-width:220px;color:#0b4fd8;font-weight:600}
.spin{width:38px;height:38px;border-radius:50%;border:4px solid #d6ecff;border-top-color:#0b5fff;border-right-color:#00c2ff;animation:spin .8s linear infinite}
.spinwrap{display:flex;align-items:center;gap:12px;padding:18px;color:#0b4fd8}.spinwrap .spin{width:26px;height:26px;border-width:3px}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spin{animation-duration:2s}}

.s-Onhold{background:#0891b2}.legend span.s-Onholdx::before{background:#0891b2}.st-Onhold td.stc{color:#0891b2}.holdbox{background:#ecfeff;border:1px solid #67e8f9;border-radius:12px;padding:10px 12px;margin:10px 0}.btn.red{background:#dc2626}