/* Scoped navigation contracts. Palette and type values reuse the shared system. */
.official-navigation,.official-breadcrumb{min-width:0;color:var(--ui-body);font-size:14px;line-height:21px;font-weight:400}
.official-navigation .on-example{margin:0 0 24px;min-width:0}
.official-navigation h4,.official-breadcrumb h4{margin:0 0 12px;font-size:14px;line-height:21px;font-weight:600;color:var(--ui-body)}
.official-navigation p,.official-breadcrumb p{margin:0 0 12px}
.official-navigation .on-help,.official-breadcrumb .on-help{font-size:12px;line-height:18px;font-weight:400;color:var(--ui-help)}
.official-navigation .on-toolbar,.official-breadcrumb .on-toolbar{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.official-navigation .on-shell{display:grid;grid-template-columns:200px minmax(0,1fr);min-height:280px;border:1px solid var(--ui-border);border-radius:4px;min-width:0}
.official-navigation .on-shell.is-collapsed{grid-template-columns:64px minmax(0,1fr)}
.official-navigation .on-content{padding:20px;min-width:0;overflow-wrap:anywhere;background:var(--ui-white);border-radius:0 4px 4px 0}
.official-navigation .el-menu,.official-navigation .el-menu-item,.official-navigation .el-submenu__title{font-family:inherit;font-size:14px;font-weight:400}
.official-navigation .on-side{width:200px;border:0;border-radius:4px 0 0 4px;background:var(--ui-shell)!important}
.official-navigation .on-side.el-menu--collapse{width:64px}
.official-navigation .on-side .el-menu{background:var(--ui-shell)!important}
.official-navigation .on-side .el-menu-item,.official-navigation .on-side .el-submenu__title{height:50px;line-height:50px;background:var(--ui-shell)!important;color:var(--ui-white)!important}
.official-navigation .on-side .el-submenu .el-menu-item{height:44px;line-height:44px;min-width:0}
.official-navigation .on-side .el-menu-item i,.official-navigation .on-side .el-submenu__title i{color:var(--ui-white);font-size:16px}
.official-navigation .on-side .el-menu-item:not(.is-disabled):hover,.official-navigation .on-side .el-submenu:not(.is-disabled)>.el-submenu__title:hover{background:var(--ui-action)!important}
.official-navigation .on-side .el-menu-item.is-active,.official-navigation .on-side .el-menu-item.is-active:hover{background:var(--ui-primary)!important;color:var(--ui-white)!important}
.official-navigation .on-side .is-disabled,.official-navigation .on-side .is-disabled i{color:var(--ui-disabled)!important;opacity:1!important;cursor:not-allowed}
.official-navigation .on-side-popup .el-menu--popup{min-width:160px;border:1px solid var(--ui-border);border-radius:4px;box-shadow:0 4px 16px rgba(0,22,42,.12)}
.official-navigation .on-horizontal{display:flex;flex-wrap:wrap;background:var(--ui-white);border-bottom:1px solid var(--ui-border)}
.official-navigation .on-horizontal::after,.official-navigation .on-horizontal::before{display:none}
.official-navigation .on-horizontal>.el-menu-item,.official-navigation .on-horizontal>.el-submenu>.el-submenu__title{height:44px;line-height:42px;padding:0 16px;border-bottom:2px solid transparent;color:var(--ui-body)!important}
.official-navigation .on-horizontal .el-menu-item,.official-navigation .on-horizontal .el-submenu__title{background:var(--ui-white)!important;color:var(--ui-body)!important}
.official-navigation .on-horizontal .el-menu-item:not(.is-disabled):hover,.official-navigation .on-horizontal .el-submenu:not(.is-disabled)>.el-submenu__title:hover{background:var(--ui-subtle)!important;color:var(--ui-action)!important}
.official-navigation .on-horizontal>.el-menu-item.is-active,.official-navigation .on-horizontal>.el-submenu.is-active>.el-submenu__title{border-bottom-color:var(--ui-primary)!important;color:var(--ui-action)!important}
.official-navigation .on-horizontal .is-disabled{color:var(--ui-disabled)!important;opacity:1!important;cursor:not-allowed}
.official-navigation .on-horizontal-popup .el-menu--popup{min-width:160px;border:1px solid var(--ui-border);border-radius:4px;background:var(--ui-white);box-shadow:0 4px 16px rgba(0,22,42,.12)}
.official-navigation .on-horizontal .on-horizontal-popup .el-menu-item.is-active,.official-navigation .on-horizontal .on-horizontal-popup .el-menu-item.is-active:hover{background:var(--ui-selected)!important;color:var(--ui-action)!important}
.official-navigation .on-horizontal-content{border:1px solid var(--ui-border);border-top:0;border-radius:0 0 4px 4px;min-height:100px}
.official-navigation .el-menu-item:focus,.official-navigation .el-submenu:focus{outline:none}
.official-navigation .el-menu-item:focus-visible,.official-navigation .el-submenu:focus-visible>.el-submenu__title{outline:2px solid var(--ui-action)!important;outline-offset:-3px}
.official-navigation .on-side .el-menu-item:focus-visible,.official-navigation .on-side .el-submenu:focus-visible>.el-submenu__title{outline-color:var(--ui-white)!important}
.official-breadcrumb .ob-surface{min-width:0;padding:20px;border:1px solid var(--ui-border);border-radius:4px;background:var(--ui-white);box-sizing:border-box;margin-bottom:12px}
.official-breadcrumb .ob-surface.is-narrow{width:320px;max-width:100%}
.official-breadcrumb .el-breadcrumb{display:flex;flex-wrap:wrap;gap:4px 0;margin-bottom:20px;font-size:14px;line-height:21px}
.official-breadcrumb .el-breadcrumb::after,.official-breadcrumb .el-breadcrumb::before{display:none}
.official-breadcrumb .el-breadcrumb__item{float:none;display:inline-flex;min-width:0;max-width:100%;align-items:baseline}
.official-breadcrumb .el-breadcrumb__inner{color:var(--ui-body)!important;font-size:14px;font-weight:400!important;line-height:21px;overflow-wrap:anywhere;min-width:0}
.official-breadcrumb .el-breadcrumb__separator{color:var(--ui-border);font-weight:400;margin:0 8px;flex:none}
.official-breadcrumb .ob-link{margin:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--ui-action)!important;font:inherit;font-size:12px;line-height:24px;min-height:24px;cursor:pointer;text-align:left;overflow-wrap:anywhere}
.official-breadcrumb .el-breadcrumb .ob-link{font-size:14px;line-height:21px}
.official-breadcrumb .ob-link:hover{text-decoration:underline}
.official-breadcrumb .ob-link:focus-visible,.official-breadcrumb .el-page-header__left:focus-visible{outline:2px solid var(--ui-action);outline-offset:2px}
.official-breadcrumb .el-page-header{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:baseline;margin-bottom:20px;min-width:0}
.official-breadcrumb .el-page-header__left{margin:0;padding-right:20px;min-height:24px;align-items:center;flex:none;color:var(--ui-action);font-size:12px;line-height:18px}
.official-breadcrumb .el-page-header__left::after{background:var(--ui-divider)}
.official-breadcrumb .el-page-header__left .el-icon-back{font-size:16px;margin-right:8px}
.official-breadcrumb .el-page-header__title{font-size:12px;font-weight:400;line-height:18px}
.official-breadcrumb .el-page-header__content{min-width:0;max-width:100%;font-size:14px;line-height:21px;color:var(--ui-body);overflow-wrap:anywhere}
.official-breadcrumb .el-page-header__content h4{margin:0}
.official-breadcrumb .ob-content{min-width:0;overflow-wrap:anywhere}
.official-breadcrumb .ob-member{display:flex;align-items:baseline;justify-content:space-between;gap:16px;border-bottom:1px solid var(--ui-divider);padding:12px 0}
@media(max-width:560px){.official-navigation .on-shell{grid-template-columns:160px minmax(0,1fr)}.official-navigation .on-side{width:160px}.official-navigation .on-content,.official-breadcrumb .ob-surface{padding:16px}.official-navigation .on-horizontal>.el-menu-item,.official-navigation .on-horizontal>.el-submenu>.el-submenu__title{padding:0 12px}}
