/* Isolated viewport. Other worlds never receive these DOM nodes or classes. */
.metro-controls{display:flex;align-items:center;flex-wrap:wrap;gap:7px;padding:9px 10px;background:#f8f5e9;border-block:1px solid #cbd9c5;color:#365c4e;font-size:13px;font-weight:600;line-height:1.35}
.metro-controls label{display:flex;align-items:center;gap:5px;white-space:nowrap}
.metro-controls select,.metro-controls button{font:inherit;min-height:44px;min-width:44px;border:1px solid #adc5b2;border-radius:10px;background:#fdfbef;color:#315d4d;padding:6px 9px;touch-action:manipulation}
.metro-controls button[aria-pressed=true]{background:#34745c;color:#fff}
#metroStatus{flex:1 0 100%;font-size:12px;line-height:1.3;min-height:16px}
.metro-viewport{position:absolute;inset:0;z-index:3;background:#cadac5;overflow:hidden;touch-action:none;user-select:none;-webkit-user-select:none}
.metro-viewport canvas{display:block!important;width:100%!important;height:100%!important;touch-action:none;outline:none}
.metro-viewport canvas:focus-visible{outline:3px solid #d8ab48;outline-offset:-4px}
.metro-3d-active #mapWorld{display:none!important}
.metro-3d-active .city .map{position:relative!important;isolation:isolate;background:#cadac5!important}
.metro-3d-active #livingQuality,.metro-3d-active .living-settings>label,.metro-3d-active #livingQualityHint{display:none!important}
.metro-3d-active .living-settings .domiki-action-dock{grid-row:1!important}
.metro-3d-active #livingCityLayer,.metro-3d-active .living-road-layer{display:none!important}
.metro-help{box-sizing:border-box;max-width:540px;width:calc(100vw - 28px);max-height:calc(100dvh - 36px);overflow:auto;padding:22px;border:2px solid #b8cbb0;border-radius:24px;background:#faf8ed;color:#315548;font:inherit;box-shadow:0 16px 60px #173d3433}
.metro-help::backdrop{background:#284a3b77}
.metro-help h2{font-size:23px;margin-top:0;outline:none}.metro-help li{margin-bottom:12px;line-height:1.5}.metro-help ol{padding-left:22px}.metro-help button{min-height:44px;width:100%}.metro-help{text-align:left}
@media(max-width:700px){.metro-controls{display:grid;grid-template-columns:64px minmax(0,1fr) 44px;gap:5px;padding:6px 8px}.metro-controls label{font-size:0;min-width:0}.metro-controls label:first-child{grid-column:1}.metro-controls label:nth-child(2){grid-column:2/4}.metro-controls select{width:100%;max-width:100%}.metro-controls select,.metro-controls button{font-size:12px;padding:5px 6px}.metro-controls #metroStatus{grid-column:1/-1;font-size:11px}.metro-3d-active .living-settings{display:block!important}.metro-3d-active .city .map{min-height:240px!important}}