:root{font-family:"Leelawadee UI",Tahoma,sans-serif;color:#203f3c;background:#f6f8f7;font-synthesis:none}*{box-sizing:border-box}body{margin:0}.campus{max-width:1600px;margin:auto;padding:32px}.heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.eyebrow{font-size:11px;font-weight:700;letter-spacing:2.4px;color:#a33169}h1{font-size:clamp(24px,3vw,36px);margin:8px 0;font-weight:650;letter-spacing:-.7px}.heading p{margin:0;font-size:14px;color:#6a7c79}.version{padding:9px 14px;border:1px solid #dbe5e1;border-radius:30px;font-size:12px;background:#fff;white-space:nowrap}.map-shell{position:relative;border:1px solid #dbe4df;border-radius:20px;overflow:hidden;background:#edf2ec;box-shadow:0 12px 45px #234f3910}#viewport{height:clamp(440px,65vh,780px);position:relative;touch-action:none}canvas{display:block;width:100%;height:100%}#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}.marker{position:absolute;width:27px;height:27px;display:grid;place-items:center;background:#fff;color:#97285f;border:2px solid #fff;border-radius:50%;font-size:11px;font-weight:800;box-shadow:0 2px 9px #193b3d40;transform:translate(-50%,-50%)}.map-caption{position:absolute;left:22px;top:20px;display:flex;align-items:center;gap:9px;font-size:13px;font-weight:600;pointer-events:none}.caption-note{color:#73817a;font-size:11px;font-weight:400;margin-left:8px}.live-dot{width:7px;height:7px;border-radius:50%;background:#458b67}.tools{position:absolute;bottom:24px;right:24px;display:flex;gap:6px}.tools button{font:inherit;font-size:12px;color:#234e43;border:1px solid #d8e2dc;background:#ffffffee;padding:10px 12px;border-radius:9px;cursor:pointer;box-shadow:0 3px 10px #234f3910}.tools button:hover{background:#e1eee5}.tools button:focus-visible{outline:3px solid #bf3c7e;outline-offset:2px}.gesture{position:absolute;bottom:29px;left:24px;color:#526d60;font-size:11px;pointer-events:none}#status{position:absolute;inset:0;display:grid;place-items:center;color:#526d60;background:#edf2ec;z-index:2;padding:24px;text-align:center}#status[hidden]{display:none}.legend-head{display:flex;align-items:center;justify-content:space-between;margin:26px 0 16px}.legend-head h2{font-size:17px;margin:0}.legend-head>span{font-size:12px;color:#798983}#legend{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 22px;list-style:none;padding:0;margin:0}#legend li{display:flex;align-items:flex-start;gap:10px;font-size:12px;line-height:1.6}.legend-number{background:#f4e6ed;color:#a22a65;border-radius:7px;min-width:25px;height:25px;display:grid;place-items:center;font-size:11px;font-weight:700}.footnote{font-size:11px;color:#7e8d86;margin:24px 0 0;border-top:1px solid #e2e9e4;padding-top:16px}@media(max-width:850px){#legend{grid-template-columns:repeat(2,minmax(0,1fr))}.caption-note{display:none}.gesture{bottom:73px;left:16px;font-size:10px}.tools{bottom:16px;right:16px}.campus{padding:20px}}@media(max-width:500px){.campus{padding:14px}.heading{align-items:flex-start}.version{font-size:10px;padding:7px 9px}.heading p{font-size:12px}.eyebrow{font-size:9px;letter-spacing:1px}#viewport{height:480px}.map-caption{left:16px;top:16px}#legend{gap:12px}.map-shell{border-radius:14px}}
.marker[hidden]{display:none}
.marker{pointer-events:auto;cursor:pointer;font:700 11px "Leelawadee UI",Tahoma,sans-serif;padding:0;min-width:27px;transition:background .15s,color .15s}
.marker:hover,.marker.is-selected{background:#97285f;color:#fff}
.marker:focus-visible,.legend-button:focus-visible,#close-details:focus-visible{outline:3px solid #bd3d7e;outline-offset:3px}
.marker.is-selected{z-index:1;box-shadow:0 0 0 5px #97285f25}
#legend li{display:block;min-width:0}
.legend-button{display:flex;align-items:flex-start;gap:10px;width:100%;border:1px solid transparent;border-radius:10px;padding:9px 7px;text-align:left;font:inherit;color:inherit;background:transparent;cursor:pointer;line-height:1.7;overflow-wrap:anywhere}
.legend-button:hover,.legend-button.is-selected{background:#fff;border-color:#dfccd7}
.legend-number{flex-shrink:0}
.building-details{margin-top:20px;padding:22px 24px;background:#fff;border:1px solid #dbe4df;border-left:4px solid #a33169;border-radius:14px;box-shadow:0 6px 22px #234f3909;scroll-margin:16px}
.building-details[hidden]{display:none}
.building-details:focus{outline:2px solid #a3316933;outline-offset:3px}
.details-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.details-heading h2{margin:8px 0 0;font-size:22px;line-height:1.5;overflow-wrap:anywhere}
#close-details{font:inherit;border:1px solid #dbe4df;border-radius:8px;padding:8px 12px;background:#f6f8f7;color:#526d60;cursor:pointer;white-space:nowrap}
#building-description{margin:18px 0 0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.9;color:#52665e}
#viewport canvas{cursor:grab}
#viewport canvas:active{cursor:grabbing}
@media(max-width:500px){.building-details{padding:18px 16px}.details-heading h2{font-size:19px}.marker{width:30px;height:30px;min-width:30px}.legend-button{padding:8px 2px;gap:7px}#building-description{font-size:14px}}
@media(prefers-reduced-motion:reduce){.marker{transition:none}}
