.official-form-pattern,.official-layout-pattern{color:var(--ui-body);font-size:14px;line-height:21px;min-width:0}
.official-form-pattern h4,.official-layout-pattern h4{font-size:14px;line-height:21px;font-weight:600;margin:0 0 12px}
:is(.official-form-pattern,.official-layout-pattern) .ofl-help{color:var(--ui-help)!important;font-size:12px!important;line-height:18px!important;font-weight:400!important;margin:8px 0 0;overflow-wrap:anywhere}
:is(.official-form-pattern,.official-layout-pattern) .ofl-intro{margin:0 0 16px}
:is(.official-form-pattern,.official-layout-pattern) .ofl-related{margin-top:24px;padding-top:16px;border-top:1px solid var(--ui-divider)}
:is(.official-form-pattern,.official-layout-pattern) a{color:var(--ui-action)}
.official-form-pattern .ofl-form{width:480px;max-width:100%;min-width:0}
.official-form-pattern .ofl-form-group+.ofl-form-group{margin-top:24px}
.official-form-pattern .el-form-item{margin-bottom:16px}
.official-form-pattern .el-form-item__label{font-size:14px!important;font-weight:400!important;color:var(--ui-body)!important;line-height:32px;padding:0 8px 0 0;text-align:left}
.official-form-pattern .el-form-item__label:before{margin-right:4px!important}
.official-form-pattern .el-form-item__content{min-width:0;line-height:21px;max-width:400px}
.official-form-pattern .el-input,.official-form-pattern .el-select,.official-form-pattern .el-textarea{width:100%;max-width:100%;min-width:0}
.official-form-pattern .el-textarea__inner{resize:vertical!important}
.official-form-pattern .ofl-help.is-error{color:var(--ui-danger)!important}
.official-form-pattern .ofl-form-actions .el-form-item__content{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:10px}
.official-form-pattern .ofl-form-actions .el-button{margin:0!important}
.official-form-pattern .ofl-form-notice{margin-left:80px;max-width:400px}
.official-form-pattern.is-narrow .el-form-item__label{float:none;display:block;width:100%!important;padding:0 0 8px;line-height:21px}
.official-form-pattern.is-narrow .el-form-item__content{margin-left:0!important;max-width:400px}
.official-form-pattern.is-narrow .ofl-form-notice{margin-left:0}
.official-form-pattern .ofl-saved{margin-top:16px;padding:16px;border:1px solid var(--ui-border);border-radius:4px;width:480px;max-width:100%;background:var(--ui-white)}
.official-form-pattern .ofl-saved dl{margin:0}.official-form-pattern .ofl-saved dl>div{display:grid;grid-template-columns:80px minmax(0,1fr);gap:8px;padding:8px 0}.official-form-pattern .ofl-saved dt,.official-form-pattern .ofl-saved dd{margin:0;font-size:14px;line-height:21px;font-weight:400;overflow-wrap:anywhere;white-space:pre-wrap}
.official-layout-pattern .ofl-tools{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0 16px}
.official-layout-pattern .ofl-tools .el-button{margin:0!important}
.official-layout-pattern .ofl-layout-preview{width:100%;max-width:100%;min-width:0}
.official-layout-pattern .ofl-layout-preview.is-narrow-demo{width:400px}
.official-layout-pattern .ofl-width-caption{margin-bottom:16px;padding-bottom:8px;border-bottom:1px solid var(--ui-border)}
.official-layout-pattern .ofl-example+.ofl-example{margin-top:24px}
.official-layout-pattern .ofl-shell{border:1px solid var(--ui-border);border-radius:4px;overflow:hidden;background:var(--ui-white);min-width:0}
.official-layout-pattern .ofl-shell .el-container{min-width:0}
.official-layout-pattern .ofl-shell-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;padding:12px 16px;background:var(--ui-subtle);border-bottom:1px solid var(--ui-divider)}
.official-layout-pattern .ofl-shell-header strong{font-size:14px;font-weight:600}.official-layout-pattern .ofl-shell-header>span,.official-layout-pattern .ofl-region-name{font-size:12px;line-height:18px;color:var(--ui-help)}
.official-layout-pattern .ofl-shell-aside{min-width:0;background:var(--ui-white);padding:16px;border-right:1px solid var(--ui-divider)}
.official-layout-pattern .ofl-shell-aside nav{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.official-layout-pattern .ofl-shell-aside button{border:0;background:transparent;color:var(--ui-body);font:400 14px/21px var(--font);padding:6px 8px;text-align:left;min-height:32px;border-radius:4px}
.official-layout-pattern .ofl-shell-aside button:hover{background:var(--ui-subtle)}
.official-layout-pattern .ofl-shell-aside button.is-current{background:var(--ui-selected);color:var(--ui-action)}
.official-layout-pattern .ofl-shell-aside button:focus-visible{outline:2px solid var(--ui-action)!important;outline-offset:2px}
.official-layout-pattern .ofl-shell-main{padding:16px;min-width:0;overflow-wrap:anywhere;min-height:160px}
.official-layout-pattern .ofl-shell-main h4{margin:8px 0}.official-layout-pattern .ofl-shell-main p{margin:0}
.official-layout-pattern .ofl-shell-footer{padding:12px 16px;border-top:1px solid var(--ui-divider);color:var(--ui-help);font-size:12px;line-height:18px}
.official-layout-pattern .is-stacked .ofl-shell-aside{border-right:0;border-bottom:1px solid var(--ui-divider)}
.official-layout-pattern .is-stacked .ofl-shell-aside nav{flex-direction:row;flex-wrap:wrap}
.official-layout-pattern .ofl-grid-boundary{padding:0 8px}
.official-layout-pattern .ofl-grid-boundary .el-row{margin-bottom:-16px}
.official-layout-pattern .ofl-grid-boundary .el-col{margin-bottom:16px;min-width:0}
.official-layout-pattern .ofl-grid-card{padding:16px;border:1px solid var(--ui-border);border-radius:4px;min-height:128px;overflow-wrap:anywhere;background:var(--ui-white)}
.official-layout-pattern .ofl-grid-card h4{margin-bottom:8px}.official-layout-pattern .ofl-grid-card p{margin:0 0 8px}