/* Shared mobile header and drawer; desktop navigation is unchanged. */
@media(max-width:720px){
 html{scrollbar-gutter:stable}
 body>header{display:flex!important;align-items:center!important;justify-content:space-between!important;height:64px!important;min-height:64px!important;padding:8px 10px!important;gap:8px!important}
 body>header .brand{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;min-width:0;margin:0!important}
 body>header .brand small,body>header>.header-login-notice{display:none!important}
 body>header .brand-logo,body>header .map-logo{display:block!important;position:relative!important;width:145px!important;height:36px!important;overflow:hidden;flex-shrink:0}
 body>header .brand-logo img,body>header .map-logo img{position:absolute!important;width:193px!important;height:96.5px!important;max-width:none!important;left:-24px!important;top:-30.5px!important}

 body>header>.header-account-actions{display:block!important;width:auto!important;flex-shrink:0;margin:0!important}
 body>header .header-account-group>button{display:block!important;width:auto!important;min-height:40px!important;padding:7px 8px!important;font-size:11px!important;white-space:nowrap;border-radius:8px}
 body>.source-switch,.manual-workspace>.view-tabs{display:none!important}
 #mobileMenu,#mapMenu,#manualMenu{inset:0 auto 0 0;margin:0;width:320px;max-width:88vw;height:100dvh;max-height:100dvh;padding:20px 16px;border-radius:0;background:#0e1b25;overflow-y:auto}
 #mobileMenu .mobile-menu-actions,#mapMenu .map-menu-actions{display:none!important}
 .manual-menu-services,#mobileMenu .mobile-menu-sources,#mapMenu .mobile-menu-sources{display:grid;grid-template-columns:1fr;gap:4px;padding:0 0 18px;margin:0 0 18px;border:0;border-bottom:1px solid #293e4b;background:transparent;border-radius:0}
 .manual-menu-services::before,#mobileMenu .mobile-menu-sources::before,#mapMenu .mobile-menu-sources::before{content:'서비스';font-size:11px;color:#839caa;padding:0 10px 6px}
 .manual-menu-services button,#mobileMenu .mobile-menu-sources button,#mapMenu .mobile-menu-sources button{display:flex!important;align-items:center!important;justify-content:flex-start!important;width:100%!important;min-height:44px!important;margin:0!important;padding:10px 12px!important;border:1px solid transparent!important;border-radius:8px!important;background:transparent!important;color:#bdcfdc!important;font-size:13px!important;text-align:left!important;gap:8px!important}
 .manual-menu-services button.active,#mobileMenu .mobile-menu-sources button[aria-pressed=true],#mapMenu .mobile-menu-sources button.active{background:#1c4037!important;border-color:#396854!important;color:#b6f4dc!important}
 .manual-menu-services button small{margin-left:auto}
 #mobileMenu .mobile-menu-sources button::before,#mobileMenu .mobile-menu-sources button::after,#mapMenu .mobile-menu-sources button::before,#mapMenu .mobile-menu-sources button::after{content:none}
 .mobile-menu-sources .menu-tile-icon{display:none}
 #drawerTabs,#mobileMenu .map-menu-views,#mapMenu .map-menu-views{display:grid;grid-template-columns:1fr;gap:4px;margin:0}
 #drawerTabs::before,#mobileMenu .map-menu-views::before,#mapMenu .map-menu-views::before{content:'화면 이동';font-size:11px;color:#839caa;padding:0 10px 6px}
 #drawerTabs>button,#mobileMenu .map-menu-views>button,#mapMenu .map-menu-views>button{display:flex;flex-direction:row!important;align-items:center;justify-content:flex-start;gap:12px;min-height:46px!important;padding:10px 12px;margin:0;border:1px solid transparent;border-radius:8px;background:transparent;box-shadow:none;font-size:13px;color:#c5d6e0}
 #drawerTabs>button.active,#drawerTabs>button[aria-pressed=true],#mobileMenu .map-menu-views>button[aria-current=true]{background:#19382f;border-color:#38644f;color:#b5f4d7}
 #drawerTabs .desktop-menu-icon,#mobileMenu .menu-tile-icon,#mapMenu .menu-tile-icon{width:24px;height:24px;flex-shrink:0}
 #drawerTabs img,.menu-tile-icon img{width:22px;height:22px}
 #mobileMenu .map-menu-views>button::before,#mapMenu .map-menu-views>button::before{content:none}
 .mobile-local-note{display:none}
}
@media(max-width:350px){body>header .brand{gap:3px!important}body>header .brand-logo,body>header .map-logo{width:124px!important}body>header .brand-logo img,body>header .map-logo img{width:166px!important;height:83px!important;left:-21px!important;top:-25px!important}body>header .header-account-group>button{font-size:10px!important;padding:6px!important}}

/* Symmetric header and one drawer design across services. */
@media(max-width:720px){
 body>header{position:relative!important;display:grid!important;grid-template-columns:44px minmax(0,1fr) 44px!important;grid-template-areas:"menu logo account"!important;height:64px!important;padding:10px 12px!important;gap:0!important;border-bottom:1px solid #273a46}
 body>header .brand{display:contents!important}
 body>header .brand-logo,body>header .map-logo{grid-area:logo!important;justify-self:center!important;width:166px!important;height:42px!important;margin:0!important}
 body>header .brand-logo img,body>header .map-logo img{width:221px!important;height:110.5px!important;left:-27.5px!important;top:-34.8px!important}

 body>header>.header-account-actions{grid-area:account!important;justify-self:end!important;width:44px!important}
 body>header .header-account-group>button{width:44px!important;height:44px!important;min-height:44px!important;padding:0!important;border-radius:50%!important;border:1px solid #334c5b!important;background:#132633!important;font-size:0!important;color:transparent!important;position:relative}
 body>header .header-account-group>button>span{display:none!important}
 body>header .header-account-group>button::after{content:'';position:absolute;inset:10px;background:center/22px 22px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23c1dfdf' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 20v-2a7 7 0 0 1 14 0v2'/%3E%3C/svg%3E")}
 body>header button:focus-visible{outline:2px solid #65dbb5!important;outline-offset:2px}
 :is(#manualMenu,#mobileMenu,#mapMenu){box-sizing:border-box!important;width:320px!important;max-width:88vw!important;padding:20px 16px!important;background:#0e1b25!important;border:0!important;border-right:1px solid #2b424e!important;box-shadow:16px 0 50px #0006!important}
 :is(#manualMenu,#mobileMenu,#mapMenu)::backdrop{background:#02090cb3}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.dialog-head,.mobile-menu-heading,.map-menu-heading){display:flex!important;align-items:center!important;justify-content:space-between!important;min-height:40px!important;margin:0 0 22px!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.dialog-head,.mobile-menu-heading,.map-menu-heading) strong{font-size:18px!important;color:#e2edf3!important}

 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)>button{box-sizing:border-box!important;height:46px!important;min-height:46px!important;padding:10px 12px!important;font-weight:500!important;line-height:24px!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)>button.active{background:#1c4037!important;border-color:#396854!important;color:#b6f4dc!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-views,.map-menu-views)>button{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:flex-start!important;box-sizing:border-box!important;grid-column:auto!important;min-height:46px!important;height:46px!important;padding:10px 12px!important;gap:12px!important;border:1px solid transparent!important;background:transparent!important;border-radius:8px!important;box-shadow:none!important;font:500 13px/24px Inter,'Malgun Gothic',system-ui,sans-serif!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-views,.map-menu-views)>button:is([aria-pressed=true],[aria-current=true],.active){background:#19382f!important;border-color:#38644f!important;color:#b5f4d7!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-views,.map-menu-views)>button::after{content:none!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.desktop-menu-icon,.menu-tile-icon){display:grid!important;place-items:center;width:24px!important;height:24px!important;padding:0!important;border:0!important;background:transparent!important}
}

/* Account access lives at the top of the drawer; keep the logo centered. */
@media(max-width:720px){
 body>header>.header-account-actions{display:none!important}

 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.dialog-head,.mobile-menu-heading,.map-menu-heading){padding-bottom:18px!important;margin-bottom:18px!important;border-bottom:1px solid #293e4b!important}

}

/* Preserve the original deployed menu button; only its header position changes. */
@media(max-width:720px){
 body>header #mobileMenuOpen,body>header #manualMenuOpen,body>header #mapMenuOpen{display:block!important;position:static!important;grid-area:menu!important;width:44px!important;height:44px!important;margin:0!important;padding:0!important;font-size:24px!important;line-height:1!important;background:#182735!important;color:var(--text,#e6edf3)!important;border:1px solid var(--line,#243240)!important;border-radius:6px!important}
}

@media(max-width:720px){
 #manualMenu>#drawerMode,#manualMenu>hr{display:none!important}
 #drawerTabs::before,#mobileMenu .map-menu-views::before,#mapMenu .map-menu-views::before{content:attr(data-section-title)!important;display:block;font-size:11px;line-height:1.7;color:#90aab9;padding:0 10px 10px}
 .manual-menu-services,#mobileMenu .mobile-menu-sources,#mapMenu .mobile-menu-sources{padding-bottom:22px!important;margin-bottom:22px!important;border-bottom:1px solid #2c4350!important}
}

/* Drawer: distinct account action, service picker and detail list. */
@media(max-width:720px){
 :is(#manualMenu,#mobileMenu,#mapMenu){padding:18px 14px 24px!important;background:#0b1720!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.dialog-head,.mobile-menu-heading,.map-menu-heading){gap:10px!important;padding:0 0 18px!important;margin:0 0 18px!important;border-bottom:1px solid #263b47!important}



 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources){padding:12px!important;margin:0 0 16px!important;gap:5px!important;border:1px solid #2a414f!important;border-radius:14px!important;background:#142632!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)::before{content:'서비스 선택';display:block;padding:2px 8px 8px!important;font-size:11px!important;line-height:18px!important;font-weight:600;letter-spacing:.3px;color:#8eabba}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)>button{position:relative!important;min-height:44px!important;height:auto!important;padding:10px!important;line-height:22px!important;font-size:12px!important;border-radius:9px!important;color:#aac1cf!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)>button.active{background:#25483f!important;border-color:#427361!important;color:#d4fae8!important;font-weight:600!important;padding-right:30px!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)>button.active::after{content:'✓'!important;position:absolute;right:11px;font-size:14px;color:#7be2b9}
 #drawerTabs,#mobileMenu .map-menu-views,#mapMenu .map-menu-views{padding:12px!important;margin:0!important;gap:5px!important;border:1px solid #243946!important;border-radius:14px!important;background:#0f1f2a!important}
 #drawerTabs::before,#mobileMenu .map-menu-views::before,#mapMenu .map-menu-views::before{padding:3px 8px 12px!important;margin-bottom:5px!important;border-bottom:1px solid #263c49;font-size:11px!important;font-weight:600!important;line-height:19px!important;color:#90adbe!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-views,.map-menu-views)>button{padding:10px!important;border-radius:9px!important;color:#bad0dc!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-views,.map-menu-views)>button:is([aria-pressed=true],[aria-current=true],.active){background:#1c3936!important;border-color:#305951!important;color:#bdf4df!important}
 #drawerTabs>#drawerManageAccounts{margin-top:10px!important;border-top-color:#2b4350!important;border-radius:0 0 9px 9px!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) button:focus-visible{outline:2px solid #70dcb9!important;outline-offset:2px}

}

/* Refined drawer surfaces and account entry. */
@media(max-width:720px){
 :is(#manualMenu,#mobileMenu,#mapMenu){background:linear-gradient(165deg,#11212b 0%,#0b1720 48%)!important;padding:20px 14px 24px!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.dialog-head,.mobile-menu-heading,.map-menu-heading){border-bottom:0!important;padding-bottom:0!important;margin-bottom:22px!important;gap:10px!important}




 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources){background:#1a2d3b!important;border-color:#344c5c!important;box-shadow:inset 0 1px 0 #d8efff07,0 5px 16px #0001;border-radius:15px!important;padding:12px 10px!important;margin-bottom:20px!important;gap:4px!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)::before{color:#9eb9ca!important;font-size:10px!important;letter-spacing:.7px;padding:2px 10px 9px!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)>button{color:#b6cbd8!important;min-height:43px!important;padding:9px 11px!important;border-radius:9px!important;transition:background .15s,border-color .15s}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)>button.active{background:#284940!important;border-color:#466e60!important;color:#d9f7e8!important;box-shadow:inset 0 1px 0 #ceffe908!important}
 #drawerTabs,#mobileMenu .map-menu-views,#mapMenu .map-menu-views{background:#0c1b25!important;border-color:#293f4e!important;border-radius:15px!important;padding:12px 10px!important;box-shadow:inset 0 1px 5px #0002;gap:4px!important}
 #drawerTabs::before,#mobileMenu .map-menu-views::before,#mapMenu .map-menu-views::before{color:#8aa7b9!important;font-size:10px!important;padding:3px 10px 12px!important;margin-bottom:7px!important;border-color:#253c4b!important;letter-spacing:.2px}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-views,.map-menu-views)>button{min-height:46px!important;height:46px!important;padding:10px 11px!important;gap:12px!important;color:#b1c6d4!important;font-size:12px!important;transition:background .15s,border-color .15s}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-views,.map-menu-views)>button:is([aria-pressed=true],[aria-current=true],.active){background:#18322f!important;border-color:#2b5148!important;color:#bcf0d9!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-views,.map-menu-views)>button:is([aria-pressed=true],[aria-current=true],.active)::after{content:''!important;display:block;width:5px;height:5px;position:static!important;margin-left:auto;border-radius:50%;background:#7bd9b2}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.desktop-menu-icon,.menu-tile-icon){opacity:.85}
 #drawerTabs>#drawerManageAccounts{margin-top:9px!important;padding-top:12px!important}
 @media(hover:hover){:is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources,.manual-menu-views,.map-menu-views)>button:hover{background:#233d49!important;color:#e1f2f7!important}}
}
@media(prefers-reduced-motion:reduce){:is(#manualMenu,#mobileMenu,#mapMenu) button{transition:none!important}}

/* Compact account action and the close button from the deployed site shell. */
@media(max-width:720px){
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.dialog-head,.mobile-menu-heading,.map-menu-heading) button{width:auto!important;height:auto!important;min-height:32px!important;padding:5px 10px!important;font-size:12px!important;font-weight:400!important;line-height:1.55!important;color:#a7bac8!important;background:#152632!important;border:1px solid #29404e!important;border-radius:8px!important;box-shadow:none!important;flex:0 0 auto!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) .drawer-account-entry::before,:is(#manualMenu,#mobileMenu,#mapMenu) .drawer-account-entry::after{content:none!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources){background:#0c1b25!important;border-color:#293f4e!important;box-shadow:inset 0 1px 5px #0002!important;padding:12px 10px!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)::before{padding:3px 10px 12px!important;margin-bottom:7px!important;border-bottom:1px solid #253c4b!important;font-size:10px!important;font-weight:600!important;line-height:19px!important;color:#8aa7b9!important;letter-spacing:.2px!important}
}

@media(max-width:720px){
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources)>button:not(.active){border-color:transparent!important;box-shadow:none!important;background:transparent!important}
 :is(#manualMenu,#mobileMenu,#mapMenu) :is(.manual-menu-services,.mobile-menu-sources) .menu-tile-icon{display:none!important}
}

/* A single positioning context keeps the logo stable across every service. */
@media(max-width:720px){
 body>header,body:has(#mapMenuOpen)>header{position:relative!important;display:block!important;box-sizing:border-box!important;width:100%!important;height:64px!important;min-height:64px!important;margin:0!important;padding:0!important}
 body>header .brand{display:contents!important;position:static!important;width:auto!important;min-height:0!important;margin:0!important;padding:0!important}
 body>header .brand-logo,body>header .map-logo{position:absolute!important;left:50%!important;top:50%!important;right:auto!important;bottom:auto!important;transform:translate(-50%,-50%)!important;width:166px!important;height:42px!important;margin:0!important;padding:0!important}
 body>header #mobileMenuOpen,body>header #manualMenuOpen,body>header #mapMenuOpen{position:absolute!important;left:12px!important;top:10px!important;right:auto!important;bottom:auto!important;transform:none!important;margin:0!important;width:44px!important;height:44px!important}
}