/* ============================================================
   ARIFE 자동 제작 · 재료함 v1 (2026-09-08)
   arife-auto-light-v5300.css 의 --ad-* 변수를 그대로 쓴다(다크는 거기서 바뀐다).
   ============================================================ */
.auto-director-page .ad-mats{margin:0 0 18px}
.auto-director-page .ad-mats-lead{
  margin:12px 15px 10px;color:var(--ad-dim);font:700 11.5px/1.65 inherit;
}
.auto-director-page .ad-mats-lead b{color:var(--ad-ink);font-weight:900}
.auto-director-page .ad-mats-body{display:flex;flex-direction:column;gap:10px}

.auto-director-page .ad-mat-group{
  border:1px solid var(--ad-edge);border-radius:12px;background:var(--ad-card,#fff);
  padding:10px 12px 11px;
}
.auto-director-page .ad-mat-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.auto-director-page .ad-mat-ic{font-size:14px;line-height:1}
.auto-director-page .ad-mat-head > b{color:var(--ad-ink);font:900 12.5px/1 inherit}
.auto-director-page .ad-mat-head > small{
  flex:1 1 220px;min-width:0;color:var(--ad-faint);font:700 11px/1.5 inherit;
}
.auto-director-page .ad-mat-add:not(#nope):not(#_):not(#__){
  margin-left:auto;min-height:28px;padding:0 12px;border-radius:999px;
  border:1px solid var(--ad-edge-strong) !important;background:var(--ad-key-soft) !important;
  color:var(--ad-key) !important;font:800 11px/1 inherit;cursor:pointer;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 2px 5px -3px rgba(16,40,90,.35) !important;
}
.auto-director-page .ad-mat-add:hover:not(#nope):not(#_):not(#__){filter:brightness(.97)}

.auto-director-page .ad-mat-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:9px;margin-top:10px}
.auto-director-page .ad-mat-item{
  position:relative;padding:9px 10px 8px;border:1px dashed var(--ad-edge-strong);border-radius:12px;
  background:var(--ad-well);transition:border-color .12s ease,background .12s ease;
}
.auto-director-page .ad-mat-item.is-over{border-color:var(--ad-key);background:var(--ad-key-soft)}
.auto-director-page .ad-mat-item.is-busy{opacity:.6}
.auto-director-page .ad-mat-thumbs{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.auto-director-page .ad-mat-th{
  position:relative;margin:0;width:64px;height:64px;border-radius:9px;overflow:hidden;
  border:1px solid var(--ad-edge);background:#000;
}
.auto-director-page .ad-mat-th img,.auto-director-page .ad-mat-th video{width:100%;height:100%;object-fit:cover;display:block}
.auto-director-page .ad-mat-x:not(#nope):not(#_):not(#__){
  position:absolute;top:2px;right:2px;width:18px;height:18px;min-height:0;padding:0;border-radius:6px;
  border:0 !important;background:rgba(0,0,0,.62) !important;color:#fff !important;font:900 12px/1 inherit;cursor:pointer;
}
.auto-director-page .ad-mat-drop{
  display:grid;place-items:center;width:84px;height:64px;border-radius:9px;cursor:pointer;
  border:1px dashed var(--ad-edge-strong);background:var(--ad-card,#fff);
  color:var(--ad-key);font:800 10.5px/1.3 inherit;text-align:center;padding:4px;
}
.auto-director-page .ad-mat-drop:hover{background:var(--ad-key-soft)}
.auto-director-page .ad-mat-lib:not(#nope):not(#_):not(#__){
  min-height:26px;padding:0 10px;border-radius:999px;
  border:1px solid var(--ad-edge-strong) !important;background:var(--ad-card,#fff) !important;
  color:var(--ad-dim) !important;font:800 10.5px/1 inherit;cursor:pointer;
}
.auto-director-page .ad-mat-row{display:flex;gap:6px;align-items:center;margin-top:8px}
.auto-director-page .ad-mat-name:not(#nope):not(#_):not(#__){
  flex:1 1 auto;min-width:0;min-height:30px;padding:0 10px;border-radius:9px;
  border:1px solid var(--ad-edge-strong) !important;background:var(--ad-card,#fff) !important;
  color:var(--ad-ink) !important;font:800 11.5px/1 inherit;
}
.auto-director-page .ad-mat-del:not(#nope):not(#_):not(#__){
  min-height:30px;padding:0 10px;border-radius:9px;
  border:1px solid transparent !important;background:transparent !important;
  color:var(--ad-faint) !important;font:800 10.5px/1 inherit;cursor:pointer;
}
.auto-director-page .ad-mat-del:hover:not(#nope):not(#_):not(#__){color:#b3402a !important;background:#fdf1ee !important}
.auto-director-page .ad-mat-cnt{display:block;margin-top:5px;color:var(--ad-faint);font:700 10.5px/1.4 inherit}

/* 스토리보드 씬 줄 — 이음새·배역·참조 계획 */
.auto-director-page .ad-shot-tags{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 7px}
.auto-director-page .ad-shot-tags > span{
  display:inline-flex;align-items:center;min-height:20px;padding:0 8px;border-radius:999px;
  font:800 10.5px/1 inherit;border:1px solid var(--ad-edge);background:var(--ad-card,#fff);color:var(--ad-dim);
}
.auto-director-page .ad-shot-link.is-cut{background:var(--ad-key-soft);border-color:transparent;color:var(--ad-key)}
.auto-director-page .ad-shot-link.is-continue{background:#e8f6ee;border-color:transparent;color:#1f6b3f}
.auto-director-page .ad-shot-refs{display:block;margin:5px 0 0;color:var(--ad-key);font:800 10.5px/1.5 inherit}

html[data-theme="dark"] .auto-director-page .ad-shot-link.is-continue{background:rgba(72,190,120,.18);color:#8fe0b0}
html[data-theme="dark"] .auto-director-page .ad-mat-del:hover:not(#nope):not(#_):not(#__){background:rgba(220,90,60,.18) !important;color:#ffb3a0 !important}
html[data-theme="dark"] .auto-director-page .ad-mat-add:not(#nope):not(#_):not(#__){box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 2px 5px -3px rgba(0,0,0,.6) !important}

@media (max-width:760px){
  .auto-director-page .ad-mat-items{grid-template-columns:1fr}
}

/* v2.1 — 씬 줄의 둘째 칸(움직임) */
.auto-director-page .ad-shot textarea[data-motion]:not(#_):not(#_){margin-top:6px;font-size:11px;color:var(--ad-dim)}