:root{
  --bg:#f7f7f9;
  --card:#ffffff;
  --muted:#6b7280;
  --primary:#0d6efd;
  --ring:rgba(13,110,253,.15);
  --shadow:0 6px 24px rgba(0,0,0,.06), 0 2px 8px rgba(0,0,0,.04);
  --radius:16px;
}
html,body{background:var(--bg);}
.container-narrow{max-width:1080px;}
.navbar{background:#fff!important; box-shadow:var(--shadow);}
.brand-logo{height:28px;width:auto}
.brand-title{font-weight:700;letter-spacing:.02em}
.deadline-pill{
  display:inline-flex;align-items:center;gap:.5rem;
  background:#111;color:#fff;border-radius:999px;padding:.35rem .75rem;font-weight:600
}
.deadline-pill .dot{width:8px;height:8px;border-radius:50%;background:#22c55e;display:inline-block}
.card-soft{background:var(--card);border:0;border-radius:var(--radius);box-shadow:var(--shadow)}
.btn-soft{box-shadow:none;border-radius:12px}
.input-soft,.select-soft,.textarea-soft{
  border-radius:12px;border-color:#e5e7eb;box-shadow:none
}
.input-soft:focus,.select-soft:focus,.textarea-soft:focus{
  border-color:var(--primary);box-shadow:0 0 0 .25rem var(--ring)
}
.grid-assets{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.asset-card{border-radius:18px;overflow:hidden;background:#fff;box-shadow:var(--shadow);transition:transform .15s ease}
.asset-card:hover{transform:translateY(-2px)}
.asset-thumb{width:100%;height:220px;object-fit:cover;background:#f0f2f5}
.asset-meta{padding:10px 12px}
.badge-final{background:#22c55e!important}
.divider{height:1px;background:#eee;margin:12px 0}
.scrollbox{max-height:180px;overflow:auto;border:1px solid #eee;border-radius:12px;padding:10px;background:#fafafa}
.sidebar-sticky{position:sticky;top:84px}
.tag-muted{color:var(--muted);font-size:.9rem}
.upload-inline{
  display:flex;gap:.5rem;align-items:center;background:#fff;border:1px dashed #cbd5e1;
  border-radius:12px;padding:.5rem .5rem .5rem .75rem
}
.upload-inline input[type=file]{max-width:420px}
.list-clean .list-group-item{border:0;border-bottom:1px solid #f0f0f2}
.list-clean .list-group-item:last-child{border-bottom:0}
/* === Lightbox (asset zoom) =================================== */
.zoomable{cursor:zoom-in}
.lightbox-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.7);
  display:none; align-items:center; justify-content:center;
  z-index:1055; padding:4vw;
}
.lightbox-overlay.open{display:flex}
.lightbox-img{
  max-width:92vw; max-height:92vh; border-radius:12px; box-shadow:0 12px 32px rgba(0,0,0,.35);
  transform:scale(.98); opacity:0; transition:transform .18s ease, opacity .18s ease;
  background:#111;
}
.lightbox-overlay.open .lightbox-img{transform:scale(1); opacity:1}
.lightbox-close{
  position:fixed; top:20px; right:24px; color:#fff; font-size:28px; line-height:1; opacity:.9; cursor:pointer;
}
.lightbox-close:hover{opacity:1}
