/* ARIFE compact output controls — shared by AI Studio and Motion Control. */
.arife-output-primary{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
}
.arife-output-secondary{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(118px,1fr));
  gap:8px;
  margin-top:8px;
}
.arife-output-control{position:relative;min-width:0}
.arife-output-control[hidden]{display:none!important}
.arife-output-control>span{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}
.arife-output-native{position:absolute!important;left:0!important;bottom:0!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.arife-output-trigger{
  box-sizing:border-box;
  width:100%;
  min-width:0;
  height:43px;
  display:grid;
  grid-template-columns:18px minmax(0,1fr) 12px;
  align-items:center;
  gap:6px;
  padding:0 9px;
  border:1px solid #30363b;
  border-radius:10px;
  outline:0;
  background:linear-gradient(150deg,#24282c,#191c1f);
  box-shadow:inset 0 1px rgba(255,255,255,.055),0 3px 0 #0a0b0c,0 8px 16px rgba(0,0,0,.18);
  color:#eff2f4;
  text-align:left;
  cursor:pointer;
  transition:border-color .16s ease,transform .16s ease,background .16s ease;
}
.arife-output-trigger:hover:not(:disabled),.arife-output-control.is-open .arife-output-trigger{border-color:#667323;background:linear-gradient(150deg,#282d29,#1a1e1c);transform:translateY(-1px)}
.arife-output-trigger:focus-visible{border-color:#3a86f7;box-shadow:0 0 0 3px rgba(58, 134, 247, .1),0 3px 0 #0a0b0c}
.arife-output-trigger>i{color:#dce1e4;font:normal 14px/1 system-ui}
.arife-output-trigger>span{display:block;min-width:0}
.arife-output-trigger small,.arife-output-trigger strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arife-output-trigger small{color:#8e979e;font-size:11px;font-weight:750}
.arife-output-trigger strong{color:#f1f4f5;font-size:12px;line-height:1.2}
.arife-output-trigger>b{color:#7f898f;font:500 17px/1 system-ui;transform:rotate(0);transition:transform .16s}
.arife-output-control.is-open .arife-output-trigger>b{transform:rotate(90deg)}
.arife-output-trigger:disabled{cursor:default;opacity:1}
.arife-output-trigger.is-fixed>b{visibility:hidden}
.arife-output-primary .arife-output-trigger small{display:none}
.arife-output-primary .arife-output-trigger>b{display:none}
.arife-output-primary .arife-output-trigger{grid-template-columns:18px minmax(0,1fr);padding-inline:8px}
.arife-output-secondary .arife-output-trigger{height:43px;grid-template-columns:18px minmax(0,1fr) 12px}
.arife-output-secondary .arife-output-trigger small{font-size:11px}
.arife-output-secondary .arife-output-trigger strong{margin-top:2px;color:#6ca4f9}
.arife-output-secondary [data-output-kind=audio] .arife-output-trigger strong{color:#eef1f3}

.arife-output-menu{
  position:absolute;
  z-index:1200;
  left:0;
  top:calc(100% + 8px);
  box-sizing:border-box;
  width:max(100%,210px);
  max-width:min(280px,calc(100vw - 28px));
  max-height:min(370px,calc(100vh - 80px));
  overflow:auto;
  padding:8px;
  border:1px solid #383f44;
  border-radius:14px;
  background:linear-gradient(150deg,#25292c,#181b1e 72%);
  box-shadow:inset 0 1px rgba(255,255,255,.07),0 7px 0 #08090a,0 24px 54px rgba(0,0,0,.52);
  color:#f4f6f7;
  scrollbar-width:thin;
  scrollbar-color:#515a60 transparent;
}
.arife-output-control.opens-up .arife-output-menu{top:auto;bottom:calc(100% + 8px)}
.arife-output-primary>.arife-output-control:nth-child(n+2) .arife-output-menu{left:auto;right:0}
.arife-output-secondary>.arife-output-control:last-child .arife-output-menu{left:auto;right:0}
.arife-output-menu[hidden]{display:none!important}
.arife-output-menu-title{display:block;padding:5px 8px 9px;color:#f1f4f5;font-size:12px}
.arife-output-option{
  width:100%;
  min-height:38px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 18px;
  align-items:center;
  gap:9px;
  padding:8px 9px;
  border:0;
  border-radius:9px;
  background:transparent;
  color:#d9dee1;
  text-align:left;
  cursor:pointer;
}
.arife-output-option:hover,.arife-output-option.active{background:#303438;color:#fff}
.arife-output-option.active{box-shadow:inset 0 1px rgba(255,255,255,.04)}
.arife-output-option span{min-width:0}
.arife-output-option strong,.arife-output-option small{display:block}
.arife-output-option strong{font-size:12px;line-height:1.35}
.arife-output-option small{margin-top:3px;color:#8d969c;font-size:11px;line-height:1.35}
.arife-output-option>b{color:#4b90f7;font-size:12px;text-align:center}

.motion-node-app .motion-output-settings{overflow:visible!important}
.motion-node-app .motion-output-settings .arife-output-secondary{margin-top:8px}
.motion-node-app .motion-output-settings>p{margin-top:11px!important}
.unified-output-settings{overflow:visible!important}

@media(max-width:430px){
  .arife-output-trigger{height:41px;padding-inline:7px}
  .arife-output-primary{gap:6px!important}
  .arife-output-menu{width:max(100%,190px)}
}