.layerAssetsPanel{
  --layer-panel-bg:rgba(27,37,65,1.0);
  --layer-panel-card:rgba(255,255,255,.04);
  --layer-panel-card-strong:rgba(255,255,255,.055);
  --layer-panel-row:rgba(27,37,65,1.0);
  --layer-panel-row-hover:rgba(27,37,65,1.0);
  --layer-panel-text:rgba(230,230,255,1);
  --layer-panel-muted:rgba(230,230,255,.52);
  --layer-panel-soft:rgba(230,230,255,.72);
  --layer-assets-playable-margin:32px;
  --layer-assets-panel-height-trim:8.5%;
  position:absolute;
  left:14px;
  top:calc(var(--canvas-clip-top, 0px) + var(--layer-assets-playable-margin) + var(--layer-assets-panel-height-trim));
  bottom:calc(var(--canvas-clip-bottom, 0px) + var(--layer-assets-playable-margin) + var(--layer-assets-panel-height-trim));
  width:419px;
  height:auto;
  max-height:none;
  min-height:0;
  display:none;
  z-index:30;
  padding:8px;
  border:0;
  border-radius:21px;
  background:var(--layer-panel-bg);
  box-shadow:
    0 26px 54px rgba(3,8,20,.56),
    0 8px 18px rgba(3,8,20,.3),
    inset 0 1px 0 rgba(255,255,255,.08);
  color:var(--layer-panel-text);
  overflow:visible;
  pointer-events:auto;
  opacity:1;
  transition:opacity .16s ease, transform .18s ease;
}

.layerAssetsPanel.is-visible{
  display:block;
}

.layerAssetsPanel.is-visible.is-auto-hidden{
  opacity:0;
  pointer-events:none;
  transform:translateX(calc(-100% - 32px));
}

.layerAssetsPanel.is-visible.is-automap-builder-open{
  left:0;
  top:0;
  bottom:0;
  width:100%;
  padding:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  opacity:1;
  pointer-events:none;
  transform:none;
  z-index:985;
}

.layerAssetsPanel.is-automap-builder-open .layerAssetsShell{
  display:none;
}

.layerAssetsShell{
  display:flex;
  flex-direction:column;
  gap:22px;
  width:100%;
  height:100%;
  padding:32px 16px 32px 16px;
  border-radius:21px;
  background:var(--layer-panel-card);
  min-height:0;
  overflow:hidden;
  box-sizing:border-box;
}

.layerAssetsTabs{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  flex:0 0 auto;
  align-self:center;
  width:260px;
  min-height:50px;
  padding:5px;
  margin-bottom:14px;
  gap:6px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.04);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -1px 0 rgba(0,0,0,.16),
    0 6px 18px rgba(0,0,0,.14);
}

.layerAssetsTab{
  min-width:0;
  min-height:24px;
  border:0;
  border-radius:999px;
  background:transparent;
  color:rgba(220,228,245,.5);
  font:700 14px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  cursor:pointer;
  transition:background-color .14s ease, color .14s ease, box-shadow .14s ease;
}

.layerAssetsTab:hover{
  background:rgba(255,255,255,.035);
  color:rgba(231,237,249,.78);
}

.layerAssetsTab.is-active{
  background:rgba(27,37,65,1.0);
  color:#F4F7FF;
}

.layerAssetsContent{
  flex:1 1 auto;
  min-height:0;
  align-content:start;
  overflow:auto;
  padding:0px 0px 0 0px;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.16) transparent;
}

.layerAssetsContent::-webkit-scrollbar{
  width:2px;
}

.layerAssetsContent:hover::-webkit-scrollbar{
  width:4px;
}

.layerAssetsContent::-webkit-scrollbar-track{
  background:transparent;
}

.layerAssetsContent::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:rgba(255,255,255,.16);
}

.layerAssetsAssetWorkspace{
  display:grid;
  grid-template-rows:minmax(0, 1.7fr) minmax(128px, .72fr);
  gap:16px;
  height:100%;
  min-height:0;
}

.layerAssetsAssetPane{
  display:flex;
  flex-direction:column;
  min-height:0;
  gap:8px;
}

.layerAssetsAssetPaneHeader{
  flex:0 0 auto;
  padding:0 12px;
  color:var(--layer-panel-muted);
  font:800 14px/1.1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
}

.layerAssetsAssetPaneHeader--search{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 118px;
  align-items:center;
  gap:10px;
}

.layerAssetsAssetSearch{
  position:relative;
  display:grid;
  align-items:center;
  min-width:0;
}

.layerAssetsAssetSearch input{
  width:100%;
  min-width:0;
  height:24px;
  border:0;
  border-bottom:1px solid rgba(220,228,245,.16);
  border-radius:0;
  outline:none;
  background:transparent;
  color:rgba(230,230,255,.86);
  font:600 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  padding:0 2px 0 18px;
}

.layerAssetsAssetSearch input::placeholder{
  color:rgba(220,228,245,.38);
}

.layerAssetsAssetSearch input:focus{
  border-bottom-color:rgba(220,228,245,.34);
}

.layerAssetsAssetSearch input::-webkit-search-cancel-button{
  opacity:.55;
}

.layerAssetsSearchIcon{
  position:absolute;
  left:2px;
  top:50%;
  width:10px;
  height:10px;
  border:1.5px solid rgba(220,228,245,.46);
  border-radius:999px;
  transform:translateY(-56%);
  pointer-events:none;
}

.layerAssetsSearchIcon::after{
  content:"";
  position:absolute;
  right:-4px;
  bottom:-3px;
  width:5px;
  height:1.5px;
  border-radius:999px;
  background:rgba(220,228,245,.46);
  transform:rotate(45deg);
  transform-origin:left center;
}

.layerAssetsAssetList{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  display:grid;
  align-content:start;
  gap:8px;
  padding:10px 9px;
  border-radius:14px;
  background:var(--layer-panel-card-strong);
  box-shadow:inset 0 1px 0 rgba(255, 255, 255, .06), 0 5px 0px rgba(0, 0, 0, .28), 0 0 0 1px rgba(20, 30, 55, .35);
  outline:none;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.16) transparent;
}

.layerAssetsAssetList::-webkit-scrollbar{
  width:2px;
}

.layerAssetsAssetList:hover::-webkit-scrollbar{
  width:4px;
}

.layerAssetsAssetList::-webkit-scrollbar-track{
  background:transparent;
}

.layerAssetsAssetList::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:rgba(255,255,255,.16);
}

.layerAssetsAssetRow{
  display:grid;
  grid-template-columns:30px minmax(0, 1fr) auto;
  align-items:center;
  gap:8px;
  min-height:42px;
  border:0;
  border-radius:12px;
  background:rgba(27,37,65,.78);
  color:var(--layer-panel-text);
  padding:0 12px;
  text-align:left;
  cursor:pointer;
}

.layerAssetsAssetRow.is-sounds-asset{
  grid-template-columns:30px minmax(0, 1fr) auto auto;
}

.layerAssetsAssetPane--picks .layerAssetsAssetList{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.layerAssetsAssetPane--picks .layerAssetsAssetEmpty{
  grid-column:1 / -1;
}

.layerAssetsAssetPane--picks .layerAssetsAssetRow{
  grid-template-columns:24px minmax(0, 1fr) 28px;
  gap:6px;
  min-height:42px;
  padding:0 9px;
}

.layerAssetsAssetPane--picks .layerAssetsAssetRow.is-sounds-asset{
  grid-template-columns:24px minmax(0, 1fr) auto 28px;
}

.layerAssetsAssetPane--picks .layerAssetsAssetIcon{
  width:24px;
  height:24px;
}

.layerAssetsAssetPane--picks .layerAssetsAssetName{
  font-size:12px;
}

.layerAssetsAssetRow:hover,
.layerAssetsAssetRow:focus-visible{
  background:rgba(31,43,74,1);
  outline:none;
}

.layerAssetsAssetRow.is-selected,
.layerAssetsAssetRow.is-previewed{
  background:rgba(37,51,87,1);
  box-shadow:
    inset 3px 0 0 rgba(166,190,245,.52),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 0 0 1px rgba(205,218,255,.16),
    0 5px 12px rgba(5,10,24,.16);
}

.layerAssetsAssetIcon{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
}

.layerAssetsAssetName{
  min-width:0;
  overflow:hidden;
  font-size:13px;
  font-weight:640;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.layerAssetsAssetImportInline{
  justify-self:end;
  min-width:58px;
  height:26px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:999px;
  background:rgba(42,56,93,.72);
  color:rgba(231,237,249,.9);
  font:700 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  cursor:pointer;
  opacity:0;
  transform:translateX(3px);
  transition:opacity .12s ease, transform .12s ease, background-color .14s ease, border-color .14s ease;
}

.layerAssetsAssetAudioInline{
  justify-self:end;
  min-width:52px;
  height:26px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:999px;
  background:rgba(42,56,93,.72);
  color:rgba(231,237,249,.9);
  font:700 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  cursor:pointer;
  opacity:0;
  transform:translateX(3px);
  transition:opacity .12s ease, transform .12s ease, background-color .14s ease, border-color .14s ease;
}

.layerAssetsAssetAudioInline.is-playing{
  border-color:rgba(190,210,255,.18);
  background:rgba(51,70,118,.92);
}

.layerAssetsAssetDeleteInline{
  display:grid;
  place-items:center;
  justify-self:end;
  width:26px;
  height:26px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:9px;
  background:rgba(42,56,93,.72);
  cursor:pointer;
  opacity:0;
  transform:translateX(3px);
  transition:opacity .12s ease, transform .12s ease, background-color .14s ease, border-color .14s ease;
}

.layerAssetsAssetDeleteInline .layerAssetsIcon{
  width:16px;
  height:16px;
  opacity:.86;
}

.layerAssetsAssetRow:hover .layerAssetsAssetImportInline,
.layerAssetsAssetRow:focus-within .layerAssetsAssetImportInline,
.layerAssetsAssetImportInline:focus-visible,
.layerAssetsAssetRow:hover .layerAssetsAssetAudioInline,
.layerAssetsAssetRow:focus-within .layerAssetsAssetAudioInline,
.layerAssetsAssetAudioInline:focus-visible,
.layerAssetsAssetRow:hover .layerAssetsAssetDeleteInline,
.layerAssetsAssetRow:focus-within .layerAssetsAssetDeleteInline,
.layerAssetsAssetDeleteInline:focus-visible{
  opacity:1;
  transform:translateX(0);
}

.layerAssetsAssetImportInline:hover,
.layerAssetsAssetImportInline:focus-visible,
.layerAssetsAssetAudioInline:hover,
.layerAssetsAssetAudioInline:focus-visible,
.layerAssetsAssetDeleteInline:hover,
.layerAssetsAssetDeleteInline:focus-visible{
  border-color:rgba(255,255,255,.14);
  background:rgba(49,66,109,.92);
  outline:none;
}

.layerAssetsAssetImportInline.is-imported,
.layerAssetsAssetImportInline:disabled{
  cursor:not-allowed;
  opacity:1;
  transform:translateX(0);
  border-color:rgba(190,210,255,.14);
  background:rgba(51,70,118,.58);
  color:rgba(231,237,249,.62);
}

.layerAssetsAssetImportInline.is-imported:hover,
.layerAssetsAssetImportInline:disabled:hover{
  border-color:rgba(190,210,255,.14);
  background:rgba(51,70,118,.58);
}

.layerAssetsAssetEmpty{
  display:grid;
  place-items:center;
  min-height:54px;
  color:rgba(220,228,245,.42);
  font:600 13px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsGroup{
  display:grid;
  gap:10px;
  margin:0 0 22px;
}

.layerAssetsGroupTitle{
  display:inline-grid;
  grid-auto-flow:column;
  grid-auto-columns:max-content;
  align-items:center;
  gap:7px;
  padding:0 12px;
  color:var(--layer-panel-muted);
  font:800 17px/1.1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  cursor:pointer;
  list-style:none;
}

.layerAssetsGroupTitleText{
  min-width:0;
}

.layerAssetsGroup.is-selected > .layerAssetsGroupTitle{
  color:rgba(230,230,255,.68);
}

.layerAssetsGroupTitle::-webkit-details-marker{
  display:none;
}

.layerAssetsRenameButton{
  display:grid;
  place-items:center;
  width:24px;
  height:24px;
  border:0;
  border-radius:8px;
  padding:0;
  background:transparent;
  opacity:0;
  cursor:pointer;
  transition:opacity .14s ease, background-color .14s ease;
}

.layerAssetsGroupTitle:hover .layerAssetsRenameButton,
.layerAssetsGroup.is-selected > .layerAssetsGroupTitle .layerAssetsRenameButton,
.layerAssetsRenameButton:focus-visible{
  opacity:.46;
}

.layerAssetsRenameButton:hover,
.layerAssetsRenameButton:focus-visible{
  background:rgba(255,255,255,.04);
  opacity:.72;
}

.layerAssetsGroupBody{
  display:grid;
  gap:8px;
  padding:30px 9px 35px;
  border-radius:14px;
  background:var(--layer-panel-card-strong);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 5px 0px rgba(0, 0, 0, .28), 0 0 0 1px rgba(20, 30, 55, .35);
}

.layerAssetsGroup:not([open]) .layerAssetsGroupBody{
  display:none;
}

.layerAssetsItem{
  display:grid;
  grid-template-columns:18px minmax(0, 1fr) 30px;
  align-items:center;
  min-height:62px;
  margin:0 0 0 -4px;
  outline:0;
}

.layerAssetsItemBody{
  display:grid;
  grid-template-columns:30px minmax(0, auto) 1fr 34px 34px;
  align-items:center;
  gap:8px;
  min-width:0;
  min-height:62px;
  padding:0 16px;
  border-radius:14px;
  background:var(--layer-panel-row);
  color:var(--layer-panel-text);
}

.layerAssetsItem:hover .layerAssetsItemBody,
.layerAssetsItem:focus-visible .layerAssetsItemBody{
  background:var(--layer-panel-row-hover);
}

.layerAssetsItem.is-selected .layerAssetsItemBody{
  background:rgba(37,51,87,1);
  box-shadow:
    inset 3px 0 0 rgba(166,190,245,.52),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 0 0 1px rgba(205,218,255,.16),
    0 5px 12px rgba(5,10,24,.16);
}

.layerAssetsItem.is-hidden-layer .layerAssetsItemBody{
  background:rgba(27,37,65,.58);
}

.layerAssetsItem.is-hidden-layer .layerAssetsItemIcon,
.layerAssetsItem.is-hidden-layer .layerAssetsItemLabel{
  opacity:.42;
}

.layerAssetsItem.is-hidden-layer .layerAssetsVisibilityButton .layerAssetsIcon{
  opacity:.32;
}

.layerAssetsItem.is-unassigned-asset .layerAssetsItemIcon .layerAssetsIcon{
  opacity:.32;
}

.layerAssetsItemLabel{
  overflow:hidden;
  min-width:0;
  border:0;
  background:transparent;
  padding:0;
  color:var(--layer-panel-text);
  font-size:14px;
  font-weight:640;
  line-height:1;
  letter-spacing:0;
  text-align:left;
  text-overflow:ellipsis;
  white-space:nowrap;
  cursor:text;
}

.layerAssetsItemLabel.is-renaming,
.layerAssetsGroupTitleText.is-renaming{
  overflow:visible;
}

.layerAssetsRenameInput{
  width:100%;
  min-width:52px;
  max-width:190px;
  height:20px;
  border:0;
  border-bottom:1px solid rgba(230,230,255,.28);
  border-radius:0;
  outline:none;
  background:transparent;
  color:inherit;
  font:inherit;
  line-height:1;
  letter-spacing:inherit;
  padding:0;
  box-shadow:none;
}

.layerAssetsGroupTitleText .layerAssetsRenameInput{
  width:132px;
}

.layerAssetsRenameInput::selection{
  background:rgba(230,230,255,.18);
}

.layerAssetsItemIcon{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
}

.layerAssetsIcon{
  display:block;
  width:20px;
  height:20px;
  object-fit:contain;
}

.layerAssetsIcon--picture{
  width:24px;
  height:24px;
}

.layerAssetsIcon--sound{
  width:30px;
  height:30px;
}

.layerAssetsIcon--visual{
  width:26px;
  height:26px;
}

.layerAssetsIcon--lock{
  width:24px;
  height:24px;
}

.layerAssetsIcon--crayon{
  width:22px;
  height:22px;
  margin-top:3px;
  opacity:1.0;
}

.layerAssetsIconButton,
.layerAssetsItemHandle,
.layerAssetsItemSettings,
.layerAssetsTrashButton{
  border:0;
  background:transparent;
  color:var(--layer-panel-text);
  appearance:none;
  cursor:pointer;
  padding:0;
}

.layerAssetsIconButton{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
}

.layerAssetsVisibilityButton .layerAssetsIcon{
  width:17px;
  height:17px;
}

.layerAssetsAssignedPickerSlot{
  display:block;
  width:34px;
  height:34px;
}

.layerAssetsAssignedPickerButton{
  opacity:0;
  pointer-events:none;
  transition:opacity .12s ease, background-color .14s ease;
}

.layerAssetsAssignedPickerButton .layerAssetsIcon{
  width:20px;
  height:20px;
  opacity:1;
}

.layerAssetsIcon--brush{
  width:18px;
  height:18px;
}

.layerAssetsIcon--plus{
  width:20px;
  height:20px;
}

.layerAssetsAssignedAddButton .layerAssetsIcon{
  opacity:.94;
}

.layerAssetsAssignedPickerButton .layerAssetsIcon--textInput{
  width:24px;
  height:24px;
}

.layerAssetsItemHandle,
.layerAssetsItemSettings{
  display:grid;
  place-items:center;
  width:30px;
  height:62px;
  opacity:0;
  transition:opacity .12s ease;
}

.layerAssetsItemHandle .layerAssetsIcon{
  width:17px;
  height:17px;
  opacity:.42;
}

.layerAssetsItemSettings .layerAssetsIcon{
  width:22px;
  height:22px;
}

.layerAssetsItem:hover .layerAssetsItemHandle,
.layerAssetsItem:hover .layerAssetsItemSettings,
.layerAssetsItem.is-selected .layerAssetsItemHandle,
.layerAssetsItem.is-selected .layerAssetsItemSettings,
.layerAssetsItem.is-settings-open .layerAssetsItemSettings{
  opacity:1;
}

.layerAssetsItem:hover .layerAssetsAssignedPickerButton,
.layerAssetsItem.is-selected .layerAssetsAssignedPickerButton{
  opacity:1;
  pointer-events:auto;
}

.layerAssetsAssignedPickerButton:hover,
.layerAssetsAssignedPickerButton:focus-visible{
  border-radius:10px;
  background:rgba(42,56,93,.62);
  outline:none;
}

.layerAssetsAssignedPickerButton.is-active{
  opacity:1;
  pointer-events:auto;
  border-radius:10px;
  background:rgba(66,116,214,.34);
  box-shadow:inset 0 0 0 1px rgba(190,214,255,.24);
}

.layerAssetsItem.is-settings-open .layerAssetsItemSettings{
  border-radius:11px;
  background:rgba(42,56,93,.62);
}

.layerAssetsItem.is-settings-open .layerAssetsItemSettings .layerAssetsIcon{
  opacity:1;
}

.layerAssetsFooter{
  flex:0 0 auto;
  display:grid;
  grid-template-columns:40px minmax(0, 1fr) 40px 40px;
  grid-template-areas:"reorder add more trash";
  align-items:center;
  gap:12px;
  min-height:112px;
  margin:0 -8px -8px;
  padding:24px 8px 12px;
  border-radius:21px;
  background:rgba(27,37,65,1.0);
}

.layerAssetsReorder{
  grid-area:reorder;
  display:grid;
  gap:0;
  align-self:start;
  justify-self:center;
  width:40px;
  height:50px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.07);
  border-radius:14px;
  background:linear-gradient(180deg, #2A385D 0%, #243252 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 6px 18px rgba(0,0,0,.16);
}

.layerAssetsReorder .layerAssetsIconButton{
  width:100%;
  height:25px;
  background:transparent;
  border-radius:0;
  transition:background-color .14s ease;
}

.layerAssetsReorder .layerAssetsIconButton:hover{
  background:rgba(255,255,255,.04);
}

.layerAssetsReorder .layerAssetsIconButton:disabled,
.layerAssetsTrashButton:disabled{
  cursor:not-allowed;
  opacity:.38;
}

.layerAssetsReorder .layerAssetsIconButton:disabled:hover{
  background:transparent;
}

.layerAssetsReorder .layerAssetsIcon{
  width:8px;
  height:8px;
  opacity:.92;
}

.layerAssetsAddCluster{
  grid-area:add;
  display:grid;
  grid-template-rows:50px auto;
  align-items:start;
  row-gap:16px;
  min-width:0;
  width:100%;
  justify-self:center;
  align-self:start;
}

.layerAssetsAddKinds{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  min-width:0;
  width:100%;
  height:50px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.07);
  border-radius:21px;
  background:linear-gradient(180deg, #2A385D 0%, #243252 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 6px 18px rgba(0,0,0,.18);
}

.layerAssetsAddKinds button{
  position:relative;
  min-width:0;
  border:0;
  background:transparent;
  color:#E7EDF9;
  font:600 13px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  cursor:pointer;
  transition:background-color .14s ease, color .14s ease;
}

.layerAssetsAddKinds button + button::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:1px;
  background:linear-gradient(
    180deg,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,.10) 20%,
    rgba(255,255,255,.10) 80%,
    rgba(255,255,255,0) 100%
  );
  pointer-events:none;
}

.layerAssetsAddKinds button:hover{
  background:rgba(255,255,255,.04);
  color:#F4F7FF;
}

.layerAssetsAddMore{
  grid-area:more;
  position:relative;
  display:grid;
  justify-items:center;
  align-self:start;
  justify-self:center;
  width:40px;
  height:50px;
}

.layerAssetsAddMore::before{
  content:"";
  position:absolute;
  left:50%;
  bottom:100%;
  width:132px;
  height:18px;
  transform:translateX(-50%);
  pointer-events:auto;
}

.layerAssetsAddMoreButton{
  display:grid;
  place-items:center;
  width:40px;
  height:50px;
  border:0;
  border-radius:14px;
  background:transparent;
  color:rgba(220,228,245,.78);
  font:300 35px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  cursor:pointer;
  transition:color .14s ease, background-color .14s ease, transform .14s ease;
}

.layerAssetsAddMore:hover .layerAssetsAddMoreButton,
.layerAssetsAddMore:focus-within .layerAssetsAddMoreButton,
.layerAssetsAddMore.is-open .layerAssetsAddMoreButton{
  color:#F4F7FF;
  background:rgba(255,255,255,.04);
}

.layerAssetsAddMoreMenu{
  position:absolute;
  left:50%;
  bottom:calc(100% + 6px);
  z-index:34;
  display:grid;
  min-width:96px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:linear-gradient(180deg, #2A385D 0%, #243252 100%);
  box-shadow:
    0 14px 28px rgba(3,8,20,.32),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 -1px 0 rgba(0,0,0,.18);
  opacity:0;
  pointer-events:none;
  transform:translate(-50%, 8px);
  transition:opacity .14s ease, transform .14s ease;
}

.layerAssetsAddMore:hover .layerAssetsAddMoreMenu,
.layerAssetsAddMore:focus-within .layerAssetsAddMoreMenu,
.layerAssetsAddMore.is-open .layerAssetsAddMoreMenu{
  opacity:1;
  pointer-events:auto;
  transform:translate(-50%, 0);
}

.layerAssetsAddMoreMenu button{
  position:relative;
  height:38px;
  min-width:0;
  border:0;
  background:transparent;
  color:#E7EDF9;
  font:600 13px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  cursor:pointer;
  transition:background-color .14s ease, color .14s ease;
}

.layerAssetsAddMoreMenu button + button{
  border-top:1px solid rgba(255,255,255,.08);
}

.layerAssetsAddMoreMenu button:hover,
.layerAssetsAddMoreMenu button:focus-visible{
  background:rgba(255,255,255,.05);
  color:#F4F7FF;
  outline:none;
}

.layerAssetsAddLabel{
  min-width:0;
  overflow:hidden;
  color:rgba(220,228,245,.42);
  font:600 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.layerAssetsTrashButton{
  grid-area:trash;
  display:grid;
  place-items:center;
  justify-self:center;
  width:40px;
  height:50px;
  align-self:start;
  border:1px solid rgba(255,255,255,.07);
  border-radius:14px;
  background:linear-gradient(180deg, #2A385D 0%, #243252 100%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 6px 18px rgba(0,0,0,.16);
  transition:background-color .14s ease, border-color .14s ease;
}

.layerAssetsTrashButton:hover{
  border-color:rgba(255,255,255,.11);
  background:linear-gradient(180deg, #2D3D64 0%, #263656 100%);
}

.layerAssetsTrashButton:disabled:hover{
  border-color:rgba(255,255,255,.07);
  background:linear-gradient(180deg, #2A385D 0%, #243252 100%);
}

.layerAssetsTrashButton .layerAssetsIcon{
  width:24px;
  height:24px;
}

.layerAssetsAssignOverlay{
  position:absolute;
  left:var(--layer-assets-settings-left, calc(100% + 14px));
  top:var(--layer-assets-settings-top, 24px);
  z-index:32;
  display:grid;
  gap:14px;
  width:248px;
  padding:16px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:
    linear-gradient(180deg, rgba(49,64,104,.22) 0%, rgba(27,37,65,.08) 100%),
    var(--layer-panel-bg);
  box-shadow:
    0 22px 42px rgba(3,8,20,.42),
    0 8px 18px rgba(3,8,20,.26),
    inset 0 1px 0 rgba(255,255,255,.08);
  color:var(--layer-panel-text);
  pointer-events:auto;
}

.layerAssetsAssignOverlay.is-sound-assign{
  width:320px;
}

.layerAssetsAssignOverlay::before{
  content:"";
  position:absolute;
  left:-7px;
  top:var(--layer-assets-settings-callout-top, 34px);
  width:14px;
  height:14px;
  border-left:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  border-bottom-left-radius:4px;
  background:var(--layer-panel-bg);
  transform:rotate(45deg);
}

.layerAssetsAssignOverlayHeader{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 24px;
  align-items:start;
  gap:10px;
}

.layerAssetsAssignOverlayHeading{
  min-width:0;
}

.layerAssetsAssignOverlayEyebrow{
  color:rgba(220,228,245,.52);
  font:700 11px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.layerAssetsAssignOverlayTitle{
  margin-top:6px;
  overflow:hidden;
  color:#F4F7FF;
  font:700 15px/1.15 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.layerAssetsAssignOverlayClose{
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border:0;
  border-radius:0;
  background:transparent;
  color:rgba(231,237,249,.82);
  font:500 23px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  cursor:pointer;
  padding:0;
  transition:color .14s ease, transform .14s ease;
}

.layerAssetsAssignOverlayClose:hover,
.layerAssetsAssignOverlayClose:focus-visible{
  color:#F4F7FF;
  transform:scale(1.06);
  outline:none;
}

.layerAssetsAssignOverlayBody{
  display:grid;
  gap:20px;
  position:relative;
}

.layerAssetsAssignControl{
  display:grid;
  gap:11px;
  position:relative;
}

.layerAssetsAssignOverlayField{
  display:grid;
  min-height:60px;
  padding:0 14px;
  border-radius:14px;
  background:var(--layer-panel-card-strong);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 0 1px rgba(20,30,55,.34);
}

.layerAssetsAssignOverlayField--compact{
  min-height:51px;
  border-radius:13px;
}

.layerAssetsAssignOverlayField--trigger{
  width:100%;
  border:0;
  color:inherit;
  cursor:pointer;
  grid-template-columns:minmax(0, 1fr) 14px;
  grid-template-areas:"value caret";
  align-items:center;
  text-align:left;
}

.layerAssetsAssignOverlayField--trigger:hover,
.layerAssetsAssignOverlayField--trigger:focus-visible{
  background:rgba(255,255,255,.07);
  outline:none;
}

.layerAssetsAssignOverlayField--trigger:disabled{
  cursor:not-allowed;
  opacity:.58;
}

.layerAssetsAssignOverlayLabel{
  color:rgba(220,228,245,.48);
  font:700 11px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:.03em;
  text-transform:uppercase;
}

.layerAssetsAssignOverlayValue{
  grid-area:value;
  overflow:hidden;
  color:rgba(231,237,249,.94);
  font:700 15px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.layerAssetsAssignOverlayCaret{
  grid-area:caret;
  justify-self:end;
  width:8px;
  height:8px;
  border-right:2px solid rgba(220,228,245,.52);
  border-bottom:2px solid rgba(220,228,245,.52);
  transform:rotate(45deg) translateY(-2px);
  transition:transform .14s ease, border-color .14s ease;
}

.layerAssetsAssignOverlayField--trigger[aria-expanded="true"] .layerAssetsAssignOverlayCaret{
  transform:rotate(-135deg) translateY(-1px);
  border-color:rgba(231,237,249,.86);
}

.layerAssetsAssignOverlayMeta{
  display:grid;
  gap:4px;
  color:rgba(220,228,245,.58);
  font:600 12px/1.35 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAssignOverlayMeta--tileHint{
  margin-top:-6px;
  margin-bottom:14px;
}

.layerAssetsTileTintRow{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:12px;
  margin-top:-8px;
}

.layerAssetsTileTintControl{
  position:relative;
  display:flex;
  align-items:center;
  gap:10px;
  min-width:96px;
  min-height:42px;
  padding:0 12px;
  border-radius:14px;
  background:rgba(27,37,65,.78);
  color:rgba(231,237,249,.72);
  font:700 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  cursor:pointer;
}

.layerAssetsTileTintControl.is-disabled{
  opacity:.48;
  cursor:default;
}

.layerAssetsTileTintSwatch{
  width:31px;
  height:31px;
  border:1px solid rgba(174,188,225,.34);
  border-radius:999px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 0 0 2px rgba(10,15,30,.34);
}

.layerAssetsTileTintInput,
.layerAssetsTileTintAlphaInput{
  position:absolute;
  left:12px;
  top:50%;
  width:31px;
  height:31px;
  opacity:0;
  pointer-events:none;
  transform:translateY(-50%);
}

.layerAssetsAssignOverlayOptions{
  position:absolute;
  z-index:4;
  left:0;
  right:0;
  top:calc(100% + 8px);
  display:grid;
  gap:8px;
  max-height:var(--layer-assets-settings-options-max-height, 320px);
  overflow:auto;
  padding:8px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:14px;
  background:rgba(21,30,54,.98);
  box-shadow:
    0 18px 32px rgba(3,8,20,.42),
    inset 0 1px 0 rgba(255,255,255,.06);
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.16) transparent;
}

.layerAssetsAssignOverlayOptions::-webkit-scrollbar{
  width:4px;
}

.layerAssetsAssignOverlayOptions::-webkit-scrollbar-track{
  background:transparent;
}

.layerAssetsAssignOverlayOptions::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:rgba(255,255,255,.16);
}

.layerAssetsAssignOverlayOption{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:10px;
  min-height:38px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  background:rgba(27,37,65,.78);
  color:rgba(231,237,249,.9);
  cursor:pointer;
  padding:0 12px;
  text-align:left;
  transition:background-color .14s ease, border-color .14s ease, box-shadow .14s ease;
}

.layerAssetsAssignOverlayOption.has-sound-preview{
  grid-template-columns:minmax(0, 1fr) 24px auto;
}

.layerAssetsAssignOverlayOption:hover,
.layerAssetsAssignOverlayOption:focus-visible{
  border-color:rgba(255,255,255,.12);
  background:rgba(31,43,74,1);
  outline:none;
}

.layerAssetsAssignOverlayOption.is-active{
  background:rgba(37,51,87,1);
  box-shadow:
    inset 3px 0 0 rgba(166,190,245,.52),
    inset 0 1px 0 rgba(255,255,255,.06),
    inset 0 0 0 1px rgba(205,218,255,.16),
    0 5px 12px rgba(5,10,24,.16);
}

.layerAssetsAssignOverlayOption.is-none-option{
  background:rgba(24,33,58,.92);
}

.layerAssetsAssignOverlayOptionText{
  min-width:0;
  overflow:hidden;
  font:600 12px/1.25 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.layerAssetsAssignSoundPreviewIcon{
  position:relative;
  width:24px;
  height:24px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:999px;
  background:rgba(42,56,93,.72);
  cursor:pointer;
  transition:background-color .14s ease, border-color .14s ease, transform .12s ease;
}

.layerAssetsAssignSoundPreviewIcon::before{
  content:"";
  position:absolute;
  left:9px;
  top:7px;
  width:0;
  height:0;
  border-top:5px solid transparent;
  border-bottom:5px solid transparent;
  border-left:7px solid rgba(231,237,249,.86);
}

.layerAssetsAssignSoundPreviewIcon.is-playing{
  border-color:rgba(190,210,255,.18);
  background:rgba(51,70,118,.92);
}

.layerAssetsAssignSoundPreviewIcon.is-playing::before,
.layerAssetsAssignSoundPreviewIcon.is-playing::after{
  content:"";
  position:absolute;
  top:7px;
  width:3px;
  height:10px;
  border:0;
  border-radius:1px;
  background:rgba(244,247,255,.92);
}

.layerAssetsAssignSoundPreviewIcon.is-playing::before{
  left:8px;
}

.layerAssetsAssignSoundPreviewIcon.is-playing::after{
  left:13px;
}

.layerAssetsAssignSoundPreviewIcon:hover{
  border-color:rgba(255,255,255,.14);
  background:rgba(49,66,109,.92);
  transform:translateY(-1px);
}

.layerAssetsAssignOverlayOptionBadge{
  min-width:56px;
  height:24px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:999px;
  color:rgba(231,237,249,.74);
  display:grid;
  place-items:center;
  font:700 11px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAssignOverlayOption.is-active .layerAssetsAssignOverlayOptionBadge{
  border-color:rgba(190,210,255,.18);
  background:rgba(51,70,118,.92);
  color:#F4F7FF;
}

.layerAssetsTileTypeOptions{
  padding:6px;
}

.layerAssetsTileTypeOption{
  grid-template-columns:minmax(0, 1fr);
  min-height:34px;
}

.layerAssetsTileTypeOption .layerAssetsAssignOverlayOptionText{
  font:700 13px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAssignOverlayActions{
  display:flex;
  justify-content:flex-end;
  margin-top:2px;
}

.layerAssetsAutomapButton{
  min-width:88px;
  height:33px;
  border:0;
  border-radius:9px;
  background:
    linear-gradient(180deg, rgba(75,96,151,.96) 0%, rgba(48,67,118,.94) 100%);
  color:rgba(244,247,255,.94);
  cursor:pointer;
  font:800 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:.01em;
  padding:0 14px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -1px 0 rgba(3,8,20,.18),
    0 5px 10px rgba(5,10,24,.20);
  transition:transform .14s ease, box-shadow .14s ease, opacity .14s ease, filter .14s ease;
}

.layerAssetsAutomapButton:hover,
.layerAssetsAutomapButton:focus-visible{
  filter:brightness(1.05);
  transform:translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(3,8,20,.18),
    0 7px 13px rgba(5,10,24,.24);
  outline:none;
}

.layerAssetsAutomapButton:disabled{
  cursor:not-allowed;
  opacity:.42;
  transform:none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 3px 7px rgba(5,10,24,.12);
}

.layerAssetsTilePicker{
  position:fixed;
  left:var(--layer-assets-tile-picker-left, 50vw);
  top:var(--layer-assets-tile-picker-top, 50vh);
  z-index:982;
  transform:translate(-50%, -50%);
  pointer-events:none;
}

.layerAssetsTilePickerPanel{
  display:grid;
  grid-template-rows:auto minmax(0, 1fr) auto;
  gap:14px;
  width:calc(var(--layer-assets-tile-picker-width, 448px) + 28px);
  padding:14px;
  box-sizing:border-box;
  border-radius:20px;
  background:rgba(27,37,65,1.0);
  box-shadow:
    0 24px 48px rgba(3,8,20,.44),
    0 8px 18px rgba(3,8,20,.28);
  color:var(--layer-panel-text);
  pointer-events:auto;
  overflow:hidden;
  isolation:isolate;
}

.layerAssetsTilePickerHeader{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto 28px;
  align-items:center;
  gap:12px;
  min-height:28px;
}

.layerAssetsTilePickerEyebrow{
  color:rgba(226,234,250,.86);
  font:800 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.layerAssetsTilePickerControls{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:22px;
  min-width:0;
}

.layerAssetsTilePickerSelectControl{
  display:flex;
  align-items:center;
  gap:9px;
  min-width:0;
  color:rgba(194,207,236,.9);
  font:780 14px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:.02em;
}

.layerAssetsTilePickerSelect{
  height:28px;
  appearance:none;
  -webkit-appearance:none;
  border:0;
  border-radius:8px;
  padding:0 30px 0 12px;
  background:
    linear-gradient(45deg, transparent 50%, rgba(220,228,245,.62) 50%) calc(100% - 17px) 12px / 6px 6px no-repeat,
    linear-gradient(135deg, rgba(220,228,245,.62) 50%, transparent 50%) calc(100% - 12px) 12px / 6px 6px no-repeat,
    rgba(46,60,98,.92);
  color:rgba(239,245,255,.96);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 1px rgba(20,30,55,.22);
  font:760 14px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
  outline:none;
  cursor:pointer;
}

.layerAssetsTilePickerSelect option{
  font-size:14px;
}

.layerAssetsTilePickerAutomapSelect{
  width:136px;
}

.layerAssetsTilePickerTypeSelect{
  width:154px;
}

.layerAssetsTilePickerSelect:hover,
.layerAssetsTilePickerSelect:focus-visible{
  background:
    linear-gradient(45deg, transparent 50%, rgba(235,241,255,.84) 50%) calc(100% - 17px) 12px / 6px 6px no-repeat,
    linear-gradient(135deg, rgba(235,241,255,.84) 50%, transparent 50%) calc(100% - 12px) 12px / 6px 6px no-repeat,
    rgba(55,70,112,.96);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 0 1px rgba(143,184,255,.28);
}

.layerAssetsTilePickerSelect:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.layerAssetsTilePickerClose{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#F4F7FF;
  font:400 28px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  cursor:pointer;
  padding:0;
  transition:opacity .14s ease, color .14s ease, transform .14s ease;
}

.layerAssetsTilePickerClose:hover,
.layerAssetsTilePickerClose:focus-visible{
  color:#F4F7FF;
  opacity:.78;
  transform:scale(1.04);
  outline:none;
}

.layerAssetsAutomapCreateOption .layerAssetsAssignOverlayOptionText{
  display:flex;
  align-items:center;
  gap:8px;
  color:rgba(235,241,255,.96);
}

.layerAssetsAutomapCreateOption .layerAssetsIcon{
  width:13px;
  height:13px;
}

.layerAssetsAutomapBuilder{
  position:fixed;
  inset:var(--canvas-clip-top, 0px) 0 var(--canvas-clip-bottom, 0px) 0;
  z-index:984;
  display:grid;
  place-items:center;
  padding:28px;
  pointer-events:none;
}

.layerAssetsAutomapBuilderPanel{
  width:min(1680px, calc(100vw - 56px));
  height:min(980px, calc(100vh - var(--canvas-clip-top, 0px) - var(--canvas-clip-bottom, 0px) - 56px));
  min-height:720px;
  display:grid;
  grid-template-rows:auto auto minmax(0, 1fr) auto;
  overflow:hidden;
  pointer-events:auto;
  border-radius:16px;
  background:linear-gradient(180deg, rgba(27,37,65,.99), rgba(19,30,55,.99));
  box-shadow:
    0 24px 52px rgba(3,8,20,.46),
    0 0 0 1px rgba(111,136,190,.28),
    inset 0 1px 0 rgba(255,255,255,.06);
  color:rgba(231,238,255,.94);
}

.layerAssetsAutomapBuilderHeader{
  min-height:68px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:15px 20px 13px 22px;
  border-bottom:1px solid rgba(118,143,197,.16);
}

.layerAssetsAutomapBuilderEyebrow,
.layerAssetsAutomapSectionTitle{
  color:rgba(170,185,224,.9);
  font:800 12px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.layerAssetsAutomapBuilderTitle{
  margin-top:6px;
  color:rgba(246,249,255,.96);
  font:800 21px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAutomapBuilderHeaderActions,
.layerAssetsAutomapBuilderFooter > div,
.layerAssetsAutomapRuleActions{
  display:flex;
  align-items:center;
  gap:8px;
}

.layerAssetsAutomapBuilderMeta{
  display:grid;
  grid-template-columns:minmax(320px, 520px) auto minmax(0, 1fr);
  align-items:center;
  gap:20px;
  padding:14px 22px;
  border-bottom:1px solid rgba(118,143,197,.13);
}

.layerAssetsAutomapBuilderMeta label,
.layerAssetsAutomapProps label{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  color:rgba(194,207,236,.9);
  font:760 14px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAutomapInput{
  min-width:0;
  height:38px;
  border:1px solid rgba(111,136,190,.25);
  border-radius:7px;
  padding:0 12px;
  background:rgba(10,17,34,.64);
  color:rgba(244,247,255,.96);
  outline:none;
  font:760 15px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAutomapBuilderMeta .layerAssetsAutomapInput{
  flex:1;
}

.layerAssetsAutomapInput:focus-visible{
  border-color:rgba(143,184,255,.52);
  box-shadow:0 0 0 2px rgba(94,139,226,.18);
}

.layerAssetsAutomapBuilderAsset,
.layerAssetsAutomapBuilderSaveStatus{
  color:rgba(189,202,233,.86);
  font:700 14px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAutomapBuilderSaveStatus{
  justify-self:end;
  color:rgba(132,225,197,.9);
}

.layerAssetsAutomapBuilderBody{
  min-height:0;
  display:grid;
  grid-template-columns:minmax(560px, 720px) minmax(390px, 1fr) 340px;
  gap:18px;
  padding:18px;
  overflow:hidden;
}

.layerAssetsAutomapTilesetPanel,
.layerAssetsAutomapRulePanel,
.layerAssetsAutomapRulesPanel{
  min-width:0;
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.layerAssetsAutomapPickModes{
  display:flex;
  gap:7px;
}

.layerAssetsAutomapPickModes button,
.layerAssetsAutomapGhostButton,
.layerAssetsAutomapPrimaryButton,
.layerAssetsAutomapIconButton{
  height:40px;
  border:1px solid rgba(111,136,190,.25);
  border-radius:7px;
  background:rgba(42,57,96,.8);
  color:rgba(235,241,255,.92);
  cursor:pointer;
  font:800 14px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAutomapPickModes button{
  flex:1;
}

.layerAssetsAutomapPickModes button.is-active,
.layerAssetsAutomapPrimaryButton{
  border-color:rgba(142,179,255,.38);
  background:linear-gradient(180deg, rgba(78,102,164,.98), rgba(51,73,132,.98));
}

.layerAssetsAutomapGhostButton{
  padding:0 15px;
  background:rgba(25,37,69,.82);
}

.layerAssetsAutomapGhostButton.is-danger{
  color:rgba(255,191,191,.94);
}

.layerAssetsAutomapGhostButton:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.layerAssetsAutomapPrimaryButton{
  min-width:154px;
  padding:0 17px;
}

.layerAssetsAutomapIconButton{
  width:40px;
  display:grid;
  place-items:center;
  padding:0;
}

.layerAssetsAutomapIconButton .layerAssetsIcon{
  width:17px;
  height:17px;
}

.layerAssetsAutomapTileGrid{
  width:100%;
  aspect-ratio:1 / 1;
  display:grid;
  grid-template-columns:repeat(16, minmax(0, 1fr));
  grid-template-rows:repeat(16, minmax(0, 1fr));
  overflow:hidden;
  border-radius:7px;
  border:1px solid rgba(116,140,190,.22);
  background:rgba(13,21,39,.94);
}

.layerAssetsAutomapTileCell{
  min-width:0;
  min-height:0;
  border:0;
  border-right:1px solid rgba(220,228,245,.13);
  border-bottom:1px solid rgba(220,228,245,.13);
  padding:0;
  background-image:var(--automap-tile-image);
  background-size:1600% 1600%;
  background-position:var(--automap-tile-pos-x) var(--automap-tile-pos-y);
  cursor:pointer;
}

.layerAssetsAutomapTileCell:hover,
.layerAssetsAutomapTileCell:focus-visible,
.layerAssetsAutomapTileCell.is-active{
  outline:2px solid rgba(166,190,245,.9);
  outline-offset:-2px;
  z-index:1;
}

.layerAssetsAutomapPreviewRow{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.layerAssetsAutomapPreviewBlock{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 14px;
  border-radius:8px;
  background:rgba(8,15,31,.42);
  color:rgba(194,207,236,.9);
  font:800 14px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAutomapTilePreview{
  width:56px;
  height:56px;
  flex:0 0 auto;
  border-radius:6px;
  border:1px solid rgba(220,228,245,.2);
  background-image:var(--automap-tile-image);
  background-size:1600% 1600%;
  background-position:var(--automap-tile-pos-x) var(--automap-tile-pos-y);
}

.layerAssetsAutomapConditionWrap{
  padding:16px;
  border-radius:8px;
  background:rgba(8,15,31,.38);
}

.layerAssetsAutomapConditionHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:10px;
  color:rgba(194,207,236,.86);
  font:800 14px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAutomapConditionGrid{
  width:min(330px, 100%);
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:10px;
}

.layerAssetsAutomapConditionCell{
  aspect-ratio:1 / 1;
  display:grid;
  place-items:center;
  border:1px solid rgba(111,136,190,.28);
  border-radius:7px;
  background:rgba(24,35,63,.72);
  color:rgba(219,228,249,.9);
  font:900 20px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

button.layerAssetsAutomapConditionCell{
  cursor:pointer;
}

.layerAssetsAutomapConditionCell.is-full{
  background:rgba(61,93,155,.86);
}

.layerAssetsAutomapConditionCell.is-empty{
  background:rgba(85,55,92,.82);
}

.layerAssetsAutomapConditionCell.is-center{
  background:rgba(9,16,31,.8);
  color:rgba(132,225,197,.95);
}

.layerAssetsAutomapProps{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.layerAssetsAutomapCheck{
  min-height:38px;
  padding:0 10px;
  border:1px solid rgba(111,136,190,.18);
  border-radius:7px;
  background:rgba(8,15,31,.32);
}

.layerAssetsAutomapRulesHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.layerAssetsAutomapRuleList{
  min-height:0;
  display:flex;
  flex-direction:column;
  gap:7px;
  overflow:auto;
  padding-right:3px;
}

.layerAssetsAutomapRuleItem{
  width:100%;
  min-height:74px;
  display:flex;
  align-items:center;
  gap:12px;
  border:1px solid rgba(111,136,190,.2);
  border-radius:8px;
  padding:8px;
  background:rgba(8,15,31,.36);
  color:rgba(232,239,255,.92);
  text-align:left;
  cursor:pointer;
}

.layerAssetsAutomapRuleItem.is-active{
  border-color:rgba(143,184,255,.44);
  background:rgba(45,63,108,.74);
}

.layerAssetsAutomapRuleItem .layerAssetsAutomapTilePreview{
  width:48px;
  height:48px;
}

.layerAssetsAutomapRuleItem strong,
.layerAssetsAutomapRuleItem small{
  display:block;
}

.layerAssetsAutomapRuleItem strong{
  font:850 14px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAutomapRuleItem small,
.layerAssetsAutomapRuleEmpty,
.layerAssetsAutomapEmptyRules{
  color:rgba(180,194,228,.8);
  font:700 13px/1.35 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

.layerAssetsAutomapEmptyRules{
  display:grid;
  gap:4px;
  padding:20px;
  border-radius:8px;
  background:rgba(8,15,31,.38);
}

.layerAssetsAutomapBuilderFooter{
  min-height:60px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:12px 18px 14px 22px;
  border-top:1px solid rgba(118,143,197,.14);
  color:rgba(180,194,228,.84);
  font:700 14px/1.35 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
}

@media (max-width: 980px){
  .layerAssetsAutomapBuilderBody{
    grid-template-columns:1fr;
    overflow:auto;
  }

  .layerAssetsAutomapTileGrid{
    max-height:420px;
  }

  .layerAssetsAutomapBuilderMeta{
    grid-template-columns:1fr;
    align-items:stretch;
  }

  .layerAssetsAutomapBuilderSaveStatus{
    justify-self:start;
  }
}

@media (max-height: 820px){
  .layerAssetsAutomapBuilder{
    padding:16px;
  }

  .layerAssetsAutomapBuilderPanel{
    height:calc(100vh - var(--canvas-clip-top, 0px) - var(--canvas-clip-bottom, 0px) - 32px);
    min-height:0;
  }

  .layerAssetsAutomapBuilderBody{
    grid-template-columns:minmax(480px, 640px) minmax(340px, 1fr) 320px;
    gap:14px;
    padding:14px;
  }

  .layerAssetsAutomapTilePreview{
    width:46px;
    height:46px;
  }

  .layerAssetsAutomapConditionGrid{
    width:min(270px, 100%);
  }
}

.layerAssetsTilePickerStage{
  display:grid;
  place-items:center;
  min-width:0;
  min-height:0;
}

.layerAssetsTilePickerCanvasFrame{
  display:grid;
  place-items:center;
  justify-self:center;
  width:var(--layer-assets-tile-picker-width, 448px);
  height:var(--layer-assets-tile-picker-height, 448px);
  overflow:hidden;
  border-radius:6px;
  background:rgba(16,23,41,.94);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 0 0 1px rgba(88,108,162,.42);
}

.layerAssetsTilePickerCanvasFrame .layerAssetsTilePickerCanvas{
  display:block;
  position:relative;
  inset:auto;
  width:100%;
  height:100%;
  -webkit-clip-path:none;
  clip-path:none;
  image-rendering:pixelated;
  image-rendering:crisp-edges;
  cursor:crosshair;
  touch-action:none;
  user-select:none;
}

.visualArea.is-editor-active .canvasArea .layerAssetsTilePickerCanvasFrame .layerAssetsTilePickerCanvas{
  -webkit-clip-path:none;
  clip-path:none;
}

.layerAssetsTilePickerFooter{
  display:grid;
  gap:3px;
  color:rgba(196,206,229,.82);
  font:600 12px/1.35 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  letter-spacing:0;
}

.layerAssetsTilePickerFooter strong{
  color:rgba(238,246,255,.96);
  font-weight:760;
}

.layerAssetsPreview{
  position:fixed;
  left:var(--layer-assets-preview-left, 50vw);
  top:var(--layer-assets-preview-top, 50vh);
  z-index:32;
  display:grid;
  gap:8px;
  width:var(--layer-assets-preview-size, 420px);
  height:auto;
  grid-template-rows:auto minmax(0, 1fr);
  pointer-events:auto;
}

.layerAssetsPreviewHeader{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:12px;
}

.layerAssetsPreviewTitle{
  display:inline-block;
  justify-self:start;
  max-width:min(100%, var(--layer-assets-preview-size, 420px));
  overflow:hidden;
  color:rgba(230,230,255,.72);
  font:700 12px/1.2 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,sans-serif;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.layerAssetsPreviewNav{
  display:grid;
  grid-auto-flow:column;
  gap:6px;
}

.layerAssetsPreviewNav button{
  display:grid;
  place-items:center;
  width:26px;
  height:24px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:8px;
  background:rgba(42,56,93,.72);
  cursor:pointer;
  padding:0;
}

.layerAssetsPreviewNav button:hover{
  background:rgba(49,66,109,.92);
}

.layerAssetsPreviewNav button:disabled{
  cursor:not-allowed;
  opacity:.34;
}

.layerAssetsPreviewNav .layerAssetsIcon{
  width:8px;
  height:8px;
}

.layerAssetsPreviewFrame{
  display:grid;
  place-items:center;
  width:var(--layer-assets-preview-size, 420px);
  aspect-ratio:1 / 1;
  max-height:var(--layer-assets-preview-size, 420px);
  min-width:0;
  min-height:0;
  overflow:hidden;
  border-radius:10px;
  border:1px solid rgba(104,128,188,.34);
  background:
    linear-gradient(90deg, rgba(77,99,143,.22) 1px, transparent 1px) 0 0/6.25% 100%,
    linear-gradient(rgba(77,99,143,.22) 1px, transparent 1px) 0 0/100% 6.25%,
    rgba(10,20,39,.96);
  box-shadow:
    inset 0 1px 0 rgba(214,228,255,.08),
    inset 0 0 0 1px rgba(10,20,39,.58),
    0 14px 34px rgba(0,0,0,.30),
    0 0 0 1px rgba(20,34,66,.72);
}

.layerAssetsPreviewImage{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}

.layerAssetsPreviewTintedImage{
  position:relative;
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  opacity:var(--layer-assets-preview-tint-alpha, 1);
}

.layerAssetsPreviewTintedImage::before{
  content:"";
  position:absolute;
  inset:0;
  background:var(--layer-assets-preview-tint, #fff);
  -webkit-mask-image:var(--layer-assets-preview-tint-url);
  mask-image:var(--layer-assets-preview-tint-url);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
}

.layerAssetsPreviewTintedImage .layerAssetsPreviewImage{
  position:relative;
  mix-blend-mode:multiply;
}

@media (max-width: 1200px){
  .layerAssetsPanel{
    width:min(386px, calc(100% - 28px));
  }

  .layerAssetsAssignOverlay{
    width:228px;
  }

  .layerAssetsAssignOverlay.is-sound-assign{
    width:300px;
  }
}