.wie-panel-aio,
.wie-panel-aio *{ box-sizing:border-box; }
.wie-panel-aio{
  color:#eaf1ff;
}
.wie-panel-aio .wie-aio-card{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:14px 15px;
  border:1px solid rgba(124,255,234,.16);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(20,31,56,.92) 0%, rgba(12,18,33,.92) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), 0 8px 24px rgba(0,0,0,.18);
}
.wie-panel-aio .wie-aio-card strong{ color:#f2f7ff; font-size:14px; }
.wie-panel-aio .wie-aio-card small,
.wie-panel-aio .wie-aio-quality-note{ color:#aebfe6; line-height:1.45; font-size:12px; }
.wie-panel-aio .wie-aio-actions{ margin-top:10px; }
.wie-panel-aio .wie-aio-actions .button{ min-width:110px; }
.wie-panel-aio .wie-aio-status{ min-height:18px; margin-top:10px; color:#7cffea; font-size:12px; font-weight:700; }
.wie-panel-aio .wie-aio-status.is-error{ color:#ff9e9e; }
.wie-panel-aio .wie-output{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:64px;
  min-height:32px;
  padding:6px 10px;
  margin-top:6px;
  border-radius:999px;
  font-weight:800;
  color:#dff2ff;
  background:#0f1930;
  border:1px solid rgba(111,140,255,.2);
}
.wie-aio-stage{ position:absolute; inset:0; padding:16px; z-index:3; display:none; }
.wie-aio-has-items .wie-aio-stage{ display:block; }
.wie-aio-has-items canvas.wie-canvas{
  opacity:0 !important;
  pointer-events:none !important;
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
}
.wie-aio-stage-shell,.wie-aio-dropzone{ width:100%; height:100%; }
.wie-aio-dropzone{
  position:relative;
  border-radius:20px;
  border:1px dashed rgba(124,255,234,.18);
  background:
    radial-gradient(circle at top right, rgba(124,255,234,.08), transparent 35%),
    linear-gradient(180deg, rgba(17,26,49,.92) 0%, rgba(8,13,26,.96) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03), 0 14px 32px rgba(0,0,0,.22);
  overflow:hidden;
}
.wie-aio-dropzone.is-dragover{
  border-color:rgba(124,255,234,.58);
  box-shadow:inset 0 0 0 2px rgba(124,255,234,.25), 0 14px 32px rgba(0,0,0,.26);
}
.wie-aio-empty{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px;
  padding:24px; text-align:center; color:#e8f1ff;
}
.wie-aio-empty-icon{
  width:72px; height:72px; border-radius:999px; display:flex; align-items:center; justify-content:center;
  font-size:30px; background:linear-gradient(180deg, rgba(124,255,234,.18), rgba(111,140,255,.18)); border:1px solid rgba(124,255,234,.18);
}
.wie-aio-empty h3{ margin:0; font-size:24px; line-height:1.15; color:#f3f7ff; }
.wie-aio-empty p{ margin:0; max-width:600px; color:#b4c7ea; line-height:1.55; }
.wie-aio-empty small{ color:#9fb4de; }
.wie-aio-grid-wrap{ display:flex; flex-direction:column; height:100%; min-height:0; overflow:hidden; }
.wie-aio-grid-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 18px; border-bottom:1px solid rgba(111,140,255,.10); background:rgba(255,255,255,.02); }
.wie-aio-grid-title{ font-size:14px; font-weight:800; color:#f4f7ff; }
.wie-aio-grid-subtitle{ font-size:12px; color:#9fb4de; }
.wie-aio-grid{ flex:1 1 auto; min-height:0; overflow:hidden; padding:18px; display:grid; grid-template-columns:repeat(var(--wie-aio-cols, 3), minmax(0, 1fr)); grid-auto-rows:var(--wie-aio-item-h, minmax(180px, 1fr)); gap:var(--wie-aio-gap, 16px); align-content:stretch; }
.wie-aio-item{ position:relative; display:grid; grid-template-rows:minmax(0,1fr) auto; min-height:0; height:100%; overflow:hidden; border-radius:18px; border:1px solid rgba(111,140,255,.14); background:linear-gradient(180deg, rgba(21,31,56,.96) 0%, rgba(10,16,31,.98) 100%); box-shadow:inset 0 1px 0 rgba(255,255,255,.03), 0 10px 24px rgba(0,0,0,.18); }
.wie-aio-item.is-done{ border-color:rgba(124,255,234,.24); }
.wie-aio-thumb{ position:relative; min-height:0; height:100%; aspect-ratio:auto; background:linear-gradient(45deg, rgba(255,255,255,.04) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.04) 75%, rgba(255,255,255,.04)), linear-gradient(45deg, rgba(255,255,255,.04) 25%, transparent 25%, transparent 75%, rgba(255,255,255,.04) 75%, rgba(255,255,255,.04)); background-size:18px 18px; background-position:0 0, 9px 9px; border-bottom:1px solid rgba(111,140,255,.08); }
.wie-aio-thumb img{ width:100%; height:100%; max-width:100%; max-height:100%; object-fit:contain; display:block; }
.wie-aio-item-body{ display:flex; flex-direction:column; gap:8px; padding:14px; color:#eaf1ff; }
.wie-aio-item-title{ font-weight:800; color:#f4f7ff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.wie-aio-badges{ display:flex; flex-wrap:wrap; gap:6px; }
.wie-aio-badge{ display:inline-flex; align-items:center; justify-content:center; min-height:26px; padding:5px 10px; border-radius:999px; font-size:11px; font-weight:800; color:#dbebff; background:#0f1930; border:1px solid rgba(111,140,255,.2); }
.wie-aio-badge.is-result{ color:#dcfff8; border-color:rgba(124,255,234,.24); }
.wie-aio-meta{ font-size:12px; line-height:1.45; color:#aebfe6; }
.wie-aio-meta strong{ color:#f1f6ff; }
.wie-aio-progress{ width:100%; height:10px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; }
.wie-aio-progress span{ display:block; width:0; height:100%; border-radius:inherit; background:linear-gradient(90deg, rgba(111,140,255,.95), rgba(124,255,234,.95)); transition:width .18s ease; }
.wie-aio-status-line{ color:#d7e8ff; min-height:18px; }
.wie-aio-saved-line{ color:#7cffea; min-height:18px; }
.wie-aio-card-actions{ display:flex; gap:8px; margin-top:2px; }
.wie-aio-card-actions .button[disabled]{ opacity:.52; }
.wie-aio-remove{ position:absolute; top:10px; right:10px; z-index:2; width:32px; height:32px; border:0; border-radius:999px; cursor:pointer; font-size:18px; line-height:1; color:#fff; background:rgba(8,12,23,.82); box-shadow:0 4px 12px rgba(0,0,0,.22); }
.wie-aio-remove:hover{ background:rgba(35,49,82,.96); }
@media (max-width: 900px){
  .wie-aio-stage{ padding:12px; }
  .wie-aio-grid{ grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:12px; padding:12px; }
  .wie-aio-grid-head{ flex-direction:column; align-items:flex-start; }
}

.wie-panel-aio .wie-aio-panel-queue{
  margin-top:14px;
  padding:12px;
  border-radius:14px;
  border:1px solid rgba(111,140,255,.16);
  background:rgba(10,16,31,.46);
}
.wie-panel-aio .wie-aio-panel-queue-title{
  font-size:12px;
  font-weight:800;
  letter-spacing:.02em;
  color:#f3f7ff;
  margin-bottom:10px;
}
.wie-panel-aio .wie-aio-panel-queue-list{
  display:flex;
  flex-direction:column;
  gap:10px;
  max-height:280px;
  overflow:auto;
  padding-right:2px;
}
.wie-panel-aio .wie-aio-queue-item{
  padding:10px;
  border-radius:12px;
  border:1px solid rgba(111,140,255,.14);
  background:linear-gradient(180deg, rgba(21,31,56,.72) 0%, rgba(10,16,31,.86) 100%);
}
.wie-panel-aio .wie-aio-queue-item.is-done{
  border-color:rgba(124,255,234,.24);
}
.wie-panel-aio .wie-aio-queue-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:6px;
}
.wie-panel-aio .wie-aio-queue-name{
  min-width:0;
  flex:1 1 auto;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#f4f7ff;
  font-weight:800;
  font-size:12px;
}
.wie-panel-aio .wie-aio-queue-pct{
  flex:0 0 auto;
  color:#7cffea;
  font-size:12px;
  font-weight:800;
}
.wie-panel-aio .wie-aio-progress-small{
  height:8px;
  margin-bottom:6px;
}
.wie-panel-aio .wie-aio-queue-meta,
.wie-panel-aio .wie-aio-queue-status{
  font-size:11px;
  line-height:1.45;
}
.wie-panel-aio .wie-aio-queue-meta{ color:#c8d8f6; }
.wie-panel-aio .wie-aio-queue-status{ color:#7cffea; margin-top:2px; }
.wie-aio-grid.is-compact .wie-aio-item-body{ padding:10px; gap:6px; }
.wie-aio-grid.is-compact .wie-aio-item-title{ font-size:13px; }
.wie-aio-grid.is-compact .wie-aio-meta{ font-size:11px; line-height:1.35; }
.wie-aio-grid.is-compact .wie-aio-badge{ min-height:24px; padding:4px 8px; font-size:10px; }
.wie-aio-grid.is-compact .wie-aio-card-actions .button{ min-height:30px; padding:4px 10px; font-size:12px; }
.wie-aio-grid.is-tight .wie-aio-item-body{ padding:8px; gap:5px; }
.wie-aio-grid.is-tight .wie-aio-badges{ gap:4px; }
.wie-aio-grid.is-tight .wie-aio-card-actions{ gap:6px; }
.wie-aio-grid.is-tight .wie-aio-card-actions .button{ min-height:28px; padding:2px 8px; font-size:11px; }
.wie-aio-grid.is-tight .wie-aio-meta{ font-size:10px; line-height:1.3; }
.wie-aio-grid.is-tight .wie-aio-progress{ height:8px; }
.wie-aio-grid.is-tiny .wie-aio-item-body{ padding:7px; gap:4px; }
.wie-aio-grid.is-tiny .wie-aio-meta{ display:none; }
.wie-aio-grid.is-tiny .wie-aio-badges{ display:none; }
.wie-aio-grid.is-tiny .wie-aio-card-actions .button{ width:100%; }
.wie-aio-grid.is-tiny .wie-aio-remove{ width:28px; height:28px; font-size:16px; }