#idMenuLayoutEditor .head { align-items: center; gap: 1em; }
#idMenuLayoutEditor .head p { margin: .35em 0 0; font-size: .9em; }
#idMenuLayoutEditor .head > div { flex: 1; }
#idMenuLayoutEditor .data { flex-flow: column nowrap; align-items: stretch; min-height: 0; overflow: auto; }
#idMenuLayoutEditor #menuLayoutMessage { flex: 0 0 auto; }
#idMenuLayoutEditor .menu-layout-workspace { display: grid; grid-template-columns: minmax(210px, 260px) minmax(0, 1fr); gap: 1.3em; width: 100%; align-items: start; flex: 0 0 auto; }
#idMenuLayoutEditor .menu-layout-properties { position: sticky; top: 0; display: flex; flex-direction: column; gap: .4em; padding: 1em; background: #f2f7f4; border: 1px solid #cadbd0; border-radius: .4em; }
#idMenuLayoutEditor .menu-layout-properties h3 { margin: 0 0 .5em; }
#idMenuLayoutEditor .menu-layout-properties input:not([type=color]), #idMenuLayoutEditor .menu-layout-properties select { width: 100%; min-width: 0; box-sizing: border-box; }
#idMenuLayoutEditor input[type=color] { width: 100%; height: 2.5em; padding: .15em; }
#idMenuLayoutEditor input[type=file] { font-size: .8em; }
#idMenuLayoutEditor .menu-layout-help { font-size: .85em; color: #56675b; line-height: 1.5; }
#idMenuLayoutEditor #menuLayoutBoard { min-width: 0; display: flex; flex-direction: column; gap: 1em; }
#idMenuLayoutEditor .menu-layout-section { border: 1px solid #d1dad4; border-left: .35em solid var(--menu-layout-accent, #555963); border-radius: .4em; overflow: hidden; background: #fff; }
#idMenuLayoutEditor .menu-layout-section.selected { outline: 2px solid var(--menu-layout-accent); outline-offset: 2px; }
#idMenuLayoutEditor .menu-layout-section > header { display: flex; align-items: center; gap: .55em; padding: .6em .75em; background: #f4f7f5; background-size: auto, auto 100%; background-position: center, right center; background-repeat: no-repeat; }
#idMenuLayoutEditor .menu-layout-section > header[draggable=true] { cursor: grab; }
#idMenuLayoutEditor .menu-layout-section h3 { flex: 1; margin: 0; font-size: 1.05em; color: var(--menu-layout-accent); overflow-wrap: anywhere; }
#idMenuLayoutEditor .menu-layout-count { font-size: .8em; background: #e5ede7; padding: .1em .45em; border-radius: 1em; }
#idMenuLayoutEditor .menu-layout-functions { margin: 0; padding: .35em .65em; list-style: none; }
#idMenuLayoutEditor .menu-layout-functions li { display: flex; align-items: center; gap: .5em; min-height: 2.6em; padding: .3em 0; border-bottom: 1px solid #edf1ee; cursor: grab; }
#idMenuLayoutEditor .menu-layout-functions li:last-child { border-bottom: 0; }
#idMenuLayoutEditor .menu-layout-function-label { flex: 1; min-width: 0; overflow-wrap: anywhere; }
#idMenuLayoutEditor .menu-layout-grip { color: #89958d; }
#idMenuLayoutEditor .menu-layout-tools { display: flex; align-items: center; gap: .3em; }
#idMenuLayoutEditor .menu-layout-tools button { border: 1px solid #bdcec3; border-radius: .2em; background: #fff; color: #3c5645; min-width: 1.8em; height: 1.8em; cursor: pointer; }
#idMenuLayoutEditor .menu-layout-tools button[hidden] { visibility: hidden; display: block; }
#idMenuLayoutEditor .menu-layout-tools select { width: 11em; max-width: 25vw; min-width: 0; font-size: .85em; padding: .25em; border: 1px solid #bdcec3; background: #fff; border-radius: .2em; }
#idMenuLayoutEditor .menu-layout-empty { margin: .5em 1em 1em; font-size: .85em; color: #718276; }
#idMenuLayoutEditor .menu-layout-other { background: #f8faf9; border-style: dashed; }
#idMenuLayoutEditor .drop-target { outline: 2px dashed #267744; outline-offset: -2px; background-color: #e5f4e9; }
#idMenuLayoutEditor .act { gap: .7em; align-items: center; }
#idMenuLayoutEditor #menuLayoutDirty { font-size: .85em; color: #8a5e20; }
#idMenuLayoutEditor button:disabled { opacity: .5; cursor: default; }
@media (max-width: 800px) {
    #idMenuLayoutEditor .menu-layout-workspace { grid-template-columns: 1fr; }
    #idMenuLayoutEditor .menu-layout-properties { position: static; }
    #idMenuLayoutEditor .menu-layout-functions li { flex-wrap: wrap; }
    #idMenuLayoutEditor .menu-layout-tools select { max-width: none; width: 10em; }
    #idMenuLayoutEditor .menu-layout-function-label { flex-basis: calc(100% - 2em); }
    #idMenuLayoutEditor .menu-layout-functions li > .menu-layout-tools { margin-left: 1.4em; }
}