*{box-sizing:border-box}body{margin:0;background:#f4f7fa;color:#203b4c;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible{outline:3px solid #81ccd0;outline-offset:3px}button{touch-action:manipulation}button:disabled{cursor:default;opacity:.35}.app{max-width:1200px;padding:0 42px;margin:auto}.header{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:27px 0;border-bottom:1px solid #dfe7ec}.brand{display:flex;gap:13px;align-items:center}.brand-mark{display:grid;place-items:center;background:#e2f2f2;color:#006b73;border-radius:13px;width:45px;height:45px;font-size:28px}.brand strong{font-size:16px;letter-spacing:-.2px}.brand div>span{display:block;font-size:11px;color:#7c909f;margin-top:5px;letter-spacing:.1px}.demo-tag{font-size:11px;white-space:nowrap;color:#81939f;display:flex;gap:7px;align-items:center}.demo-tag i{width:6px;height:6px;border-radius:50%;background:#7fa895}.heading{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:37px 0 28px}.eyebrow{display:block;font-size:10px;font-weight:650;letter-spacing:1.7px;color:#8093a2}h1{font-size:31px;font-weight:600;letter-spacing:-1.1px;margin:10px 0 8px}p{margin:0}.heading p{font-size:13px;color:#788f9f}.text-button{background:none;border:0;color:#527b99;font-size:12px;padding:12px 0}.text-button span{margin-left:8px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 312px;gap:26px;align-items:start}.map-panel{background:#fff;border:1px solid #e4ebf0;border-radius:22px;box-shadow:0 12px 40px #35576d04;overflow:hidden}.map-toolbar{display:flex;justify-content:space-between;align-items:center;padding:18px 22px 7px;gap:15px}.floor-tabs{display:flex;gap:4px;padding:4px;border-radius:12px;background:#f1f5f8}.floor-tabs button{border:0;border-radius:9px;background:none;padding:10px 16px;font-size:12px;color:#7a8f9f;font-weight:550;transition:background .2s,color .2s}.floor-tabs button[aria-pressed=true]{background:#fff;color:#006b73;box-shadow:0 2px 6px #264c6b0d}.map-viewport{width:100%;overflow:auto;scrollbar-width:thin;scrollbar-color:#cfdae3 transparent}.map-viewport #map-host{width:100%;transition:width .2s;display:flex;justify-content:center;flex-shrink:0}.floor-plan{display:block;width:100%;max-width:570px;height:auto;flex:none}.map-legend{display:flex;gap:18px;align-items:center;flex-wrap:wrap;padding:15px 22px;border-top:1px solid #edf2f5;font-size:10px;color:#78909e}.map-legend>span{display:flex;align-items:center;gap:7px}.map-legend i{display:inline-block}.legend-user{width:8px;height:8px;background:#e87520;border-radius:50%;outline:4px solid #ffead9;margin:0 3px}.legend-route{width:22px;height:0;border-top:3px dashed #e87520}.legend-room{width:11px;height:11px;background:#e9f0f6;border:1px solid #bdcdda;border-radius:2px}.map-legend button{margin-left:auto;border:0;background:none;font-size:10px;color:#527b99;padding:6px 0}.sidebar{display:flex;flex-direction:column;gap:25px}.route-card{border-radius:20px;background:#fff;padding:24px;border:1px solid #e4ebf0}.route-status{display:flex;align-items:center;gap:7px;font-size:9px;letter-spacing:1.2px;font-weight:650;color:#638c7b}.status-dot{width:6px;height:6px;border-radius:50%;background:#76a591}.destination-title{display:flex;justify-content:space-between;align-items:center;margin-top:25px}.destination-title .eyebrow{font-size:9px;color:#89a0b0;letter-spacing:1.3px}.destination-title h2{font-size:25px;letter-spacing:-.8px;margin:7px 0 0;font-weight:600}.destination-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:14px;background:#eaf6f5;color:#007882;font-size:25px}.destination-name{font-size:12px;line-height:1.65;color:#7b91a1;margin-top:9px;max-width:235px;min-height:39px}.journey{margin:22px 0 20px;position:relative}.journey:before{content:"";position:absolute;left:5px;top:7px;bottom:8px;width:1px;background:#dfe8ef}.journey-item{display:flex;gap:12px;align-items:center;font-size:11px;line-height:1.4;color:#8599a8;position:relative;margin:0 0 15px}.journey-item:last-child{margin-bottom:0}.journey-item i{position:relative;z-index:1;width:11px;height:11px;border-radius:50%;background:#fff;border:2px solid #cad9e4;flex:none}.journey-item.current{color:#006b73;font-weight:600}.journey-item.current i{background:#01929c;border:3px solid #dbf0f0;box-shadow:0 0 0 2px #fff}.journey-item.end i{border-radius:3px;border-color:#74b6bc;background:#eaf6f5}.next-step{background:#f4f8fc;border-radius:12px;padding:16px;margin-bottom:18px}.next-step>span{font-size:8px;letter-spacing:1.25px;font-weight:650;color:#8ba0af}.next-step strong{display:block;font-size:12px;line-height:1.6;margin:8px 0 6px;font-weight:600}.next-step p{font-size:10px;line-height:1.65;color:#859bab}.primary-button{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#007882;color:#fff;border:0;border-radius:11px;min-height:45px;width:100%;padding:12px 15px;font-size:11px;font-weight:550;box-shadow:0 5px 12px #01929c21;transition:background .2s}.primary-button:hover{background:#006b73}.primary-button span{font-size:19px;font-weight:400}.quiet-button{display:block;border:0;background:none;font-size:10px;color:#8ba0b0;padding:15px 6px 0;width:100%}.directory-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.directory-title h2{font-size:14px;font-weight:600;margin:0}.directory-title>span{font-size:10px;color:#92a4b0}.search{display:flex;align-items:center;gap:8px;border:1px solid #dfe8ef;background:#fff;border-radius:10px;padding:12px}.search>span{color:#98aab6;font-size:23px;line-height:12px}.search input{border:0;outline:none;width:100%;min-width:0;font-size:10px;background:none;color:#35536b}.search input::placeholder{color:#91a4b1}.room-list-item{width:100%;display:flex;align-items:center;gap:12px;text-align:left;border:0;border-bottom:1px solid #e4ebf0;background:none;padding:13px 0;color:#537084;min-height:53px}.room-list-item:hover{color:#006b73}.room-list-item .room-badge{display:grid;place-items:center;min-width:35px;height:30px;border-radius:7px;background:#eaf0f5;color:#668092;font-size:11px;font-weight:600}.room-list-item.is-selected .room-badge{background:#def1f1;color:#006b73}.room-list-item .room-label{font-size:11px;line-height:1.5}.room-list-item .chevron{margin-left:auto;color:#a0b0bb;font-size:18px}.room-list-item small{color:#8ba0af}.map-note{font-size:10px;color:#91a2af;line-height:1.8}.empty-state{font-size:12px;color:#7e95a6;padding:20px 0}footer{display:flex;justify-content:space-between;gap:15px;padding:28px 0;font-size:10px;color:#9babb6}@media(min-width:1000px){.route-card{position:relative}.map-viewport{height:795px;display:block}}@media(max-width:1000px){.app{padding:0 24px}.workspace{grid-template-columns:minmax(0,1fr) 280px;gap:20px}.route-card{padding:20px}.map-toolbar{padding:15px 14px 7px}.floor-tabs button{padding:10px 11px}.map-legend{padding:12px 14px;gap:12px}.map-legend button{margin-left:0}.heading h1{font-size:28px}}@media(max-width:740px){.app{padding:0 16px}.header{padding:17px 0}.brand-mark{width:37px;height:37px;border-radius:11px;font-size:24px}.brand{gap:10px}.brand strong{font-size:13px}.brand div>span{font-size:9px}.demo-tag{display:none}.heading{margin:24px 0 19px;align-items:start}.heading h1{font-size:24px;letter-spacing:-.8px;line-height:1.2;margin-top:8px}.heading .eyebrow{font-size:8px}.heading p{font-size:11px;line-height:1.6}.text-button{font-size:10px;white-space:nowrap;padding-top:22px}.workspace{display:flex;flex-direction:column;gap:20px}.map-panel{width:100%;border-radius:17px}.map-toolbar{padding:13px 14px 3px}.floor-tabs button{font-size:11px;padding:10px 15px;min-height:40px}.map-viewport{max-height:none}.floor-plan{max-width:570px}.map-legend{gap:13px;font-size:9px}.map-legend button{margin-left:auto}.sidebar{width:100%;gap:24px}.route-card{padding:21px;border-radius:17px}.destination-title{margin-top:18px}.destination-name{min-height:0;max-width:none}.journey{margin:20px 0}.journey-item{font-size:12px}.next-step strong{font-size:14px}.next-step p{font-size:12px}.primary-button{font-size:13px;min-height:48px}.quiet-button{font-size:12px;min-height:40px;padding-top:12px}.room-directory{padding:0 4px}.room-list-item{min-height:60px}.room-list-item .room-label{font-size:13px}.search input{font-size:12px}.map-note{font-size:11px;margin:0 4px}footer{font-size:9px}.route-card{scroll-margin-top:18px}}@media(max-width:380px){.heading h1{font-size:21px}.heading{gap:10px}.text-button{font-size:9px}.floor-tabs button{padding:10px 11px}.map-legend button{width:100%;text-align:left}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

/* Official identity: supplied wordmark contains white lettering. */
:root{--brand:#01929c;--brand-dark:#006b73;--brand-button:#007882;--brand-light:#e5f4f4}
.header{background:var(--brand);border:0;margin:0 -42px;padding:25px 42px;min-height:104px}
.brand{display:block;width:76%;max-width:800px}
.brand-logo{display:block;width:100%;height:auto}
.brand-logo[hidden],.brand-fallback[hidden]{display:none}
.brand-fallback{color:#fff}
.brand .brand-fallback>span{color:#fff}
.demo-tag{background:#fff;color:var(--brand-dark);padding:9px 11px;border-radius:20px}
.demo-tag i{background:var(--brand)}
.primary-button{background:var(--brand-button)}
.primary-button:hover{background:var(--brand-dark)}
@media(max-width:1000px){.header{margin:0 -24px;padding:23px 24px}.brand{width:72%}}
@media(max-width:740px){.header{margin:0 -16px;padding:21px 16px;min-height:72px}.brand{width:100%;max-width:none}}

.brand-mobile{display:none}
@media(max-width:740px){
 .header{background:#007882}
 .brand-logo,.brand-fallback{display:none}
 .brand-mobile{display:flex;gap:12px;align-items:center;color:#fff}
 .brand-crest{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex:none}
 .brand-crest img{display:block;width:48px;height:auto}
 .brand-crest[hidden]{display:none}
 .brand-mobile strong{font-size:13px;font-weight:600;color:#fff}
 .brand-mobile div>span{display:block;font-size:9px;color:#fff;margin-top:5px;letter-spacing:.1px}
}

/* Confirmed position, QR scanning and the three navigation points. */
[hidden]{display:none!important}








.map-legend>a{margin-left:auto;color:#006b73;text-decoration:none;font-size:10px;padding:6px 0}
footer>a{color:#78959d;text-decoration:none}
.route-card.is-location-pending .route-status{color:#84949b}
.route-card.is-location-pending .status-dot{background:#a4b3b9}
.location-dialog{padding:0;border:0;width:min(480px,calc(100% - 32px));max-height:90dvh;border-radius:24px;background:#fff;color:#203b4c;box-shadow:0 30px 100px #17383d33;overflow:auto}
.location-dialog::backdrop{background:#153c4866;backdrop-filter:blur(4px)}
.location-dialog[open]{animation:location-open .18s ease-out}
.location-sheet{padding:26px}
.location-heading{display:flex;align-items:center;justify-content:space-between;gap:14px}
.location-heading .eyebrow{font-size:8px;color:#7b959f;letter-spacing:1.25px}
.location-heading h2{font-size:27px;letter-spacing:-.7px;font-weight:600;margin:9px 0 0}
.dialog-close{flex:none;border:0;background:#f0f5f6;color:#6a8793;width:40px;height:40px;border-radius:50%;font-size:25px;font-weight:400}
.location-intro{font-size:12px;line-height:1.8;color:#77909c;margin-top:18px}
.location-feedback{font-size:12px;color:#577a86;line-height:1.7;margin:0 0 16px}
.location-feedback:empty{margin-bottom:20px}
.location-feedback[data-tone=error]{color:#9a3d4a;background:#fff2f3;padding:12px;border-radius:10px;margin-top:14px}
.camera-button{font-size:13px;min-height:48px}
.photo-button{display:block;margin:8px 0 0;min-height:42px;width:100%;padding:10px;border:0;background:none;color:#6f8c97;font-size:12px}
.photo-button:hover{color:#006b73}
.location-divider{display:flex;align-items:center;gap:12px;color:#91a3ac;font-size:10px;margin:19px 0 10px;text-align:center}
.location-divider:before,.location-divider:after{content:"";height:1px;background:#e2eaf0;flex:1}
.point-option{width:100%;display:flex;align-items:center;gap:13px;padding:15px 0;min-height:72px;border:0;border-bottom:1px solid #e5edf0;background:none;text-align:left;color:#31525e}
.point-option:last-child{border-bottom:0}
.point-option:hover strong{color:#006b73}
.point-floor{display:grid;place-items:center;flex:none;width:40px;height:43px;background:#e9f5f3;border-radius:10px;font-size:19px;color:#007882;font-weight:600}
.point-option strong{display:block;font-size:13px;font-weight:600;line-height:1.5}
.point-option small{display:block;font-size:11px;line-height:1.5;color:#869ba5;margin-top:4px}
.point-chevron{font-size:22px;color:#9cb2b8;margin-left:auto}
.location-footnote{font-size:10px;line-height:1.8;color:#8b9ea7;margin-top:15px}
.location-print-link{display:inline-block;margin-top:17px;color:#007882;font-size:11px;text-underline-offset:4px;padding:6px 0}
.camera-stage{position:relative;aspect-ratio:1.25;border-radius:15px;overflow:hidden;background:#173a41;margin:18px 0 14px}
.camera-stage video{display:block;width:100%;height:100%;object-fit:cover}
@keyframes location-open{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:740px){.map-legend>a{font-size:10px}.location-dialog{width:100%;max-width:none;margin:auto 0 0;max-height:92dvh;border-radius:23px 23px 0 0}.location-sheet{padding:24px 22px max(24px,env(safe-area-inset-bottom))}.location-heading h2{font-size:27px}.point-option{min-height:78px}.point-option strong{font-size:14px}.point-option small{font-size:12px}.location-footnote{font-size:11px}.location-print-link{font-size:12px}.location-intro{font-size:13px}.location-feedback{font-size:13px}footer{flex-wrap:wrap}}

/* Keep the plan and the repeatable location action in the first screen. */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.header{min-height:76px;padding-top:16px;padding-bottom:16px}
main{padding-top:16px}
.map-toolbar{padding:10px 14px 0;gap:8px}
.floor-tabs{gap:0;padding:3px}
.floor-tabs button{min-height:44px;padding:10px 14px}



.locate-button{flex:none;border:0;min-height:44px;min-width:92px;padding:10px 16px;background:var(--brand-button);color:#fff;font-size:13px;font-weight:600;border-radius:9px}
.locate-button:hover{background:var(--brand-dark)}




footer{align-items:center}
footer .text-button{padding:8px 0;font-size:11px}
@media(min-width:1000px){.map-viewport{height:auto;min-height:0}}
@media(max-width:740px){
 .header{min-height:60px;padding:10px 16px}
 .brand-mobile{gap:10px}
 .brand-crest{width:36px;height:36px}
 .brand-crest img{width:36px}
 .brand-mobile strong{font-size:12px;line-height:1.35}
 .brand-mobile div>span{font-size:8px;margin-top:3px}
 main{padding-top:10px}
 .map-panel{border-radius:14px}
 .map-toolbar{padding:8px 10px 0}
 .floor-tabs button{font-size:11px;padding:10px 12px}
 
 
 
 footer .text-button{white-space:normal}
}

/* Gestures belong to the map surface; the rest of the page keeps normal scrolling. */
.map-viewport{touch-action:pan-x pan-y;overflow:hidden;overscroll-behavior:contain;margin-top:6px}
.map-viewport.is-zoomed{touch-action:none;cursor:grab}
.map-viewport.is-dragging{cursor:grabbing}
.map-viewport .floor-plan{user-select:none;-webkit-user-select:none}
.locate-button{display:flex;align-items:center;justify-content:center;gap:7px}
.navigation-arrow{display:block;flex:none}

.map-panel{scroll-margin-top:12px}

/* Composite one stable layer during gestures; restore crisp SVG when they end. */
.map-viewport .floor-plan{transform-origin:0 0;transform-box:border-box}
.map-viewport.is-interacting .floor-plan{will-change:transform}
.map-viewport.is-interacting .floor-plan *{animation-play-state:paused!important;transition:none!important}
.map-viewport.is-interacting .floor-plan [filter]{filter:none}

/* Show the vertical route at the lift itself, including its exit floor. */
.floor-plan .elevator.is-route-elevator>rect{fill:#fff0e3}
.floor-plan .elevator.is-route-elevator .wall{stroke:#e87520}
.floor-plan .elevator.is-route-elevator .door{stroke:#e3a36c}
.floor-plan .elevator.is-route-elevator>g[aria-hidden]{stroke:#d36a1c}
.floor-plan .elevator-hint{pointer-events:none}
.floor-plan .elevator-hint rect{fill:#e87520}
.floor-plan .elevator-hint text{fill:#fff;text-anchor:middle;font-weight:650}
.floor-plan .elevator-hint-line{font-size:18px}
.floor-plan .elevator-hint-detail{font-size:13px}