/* Nyx Creators Hub — front-end styles
   Design tokens match nyx_creators_hub_demo.html so the plugin UI and
   the earlier flow demo feel like one product. */

:root{
  --nch-bg:#14121a;
  --nch-surface:#1e1b28;
  --nch-surface2:#262233;
  --nch-line:#332d44;
  --nch-purple:#9b51e0;
  --nch-pink:#e0519b;
  --nch-amber:#f0a63d;
  --nch-green:#4ade80;
  --nch-text:#f2eef7;
  --nch-dim:#a99fc0;
  --nch-dim2:#766c8c;
  --nch-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

.nch-card{
  background:var(--nch-surface);
  border:1px solid var(--nch-line);
  border-radius:14px;
  padding:20px;
  margin-bottom:14px;
  color:var(--nch-text);
}

.nch-h3{ font-size:18px; margin:0 0 14px; color:var(--nch-text); }
.nch-h4{ font-size:15px; margin:0; color:var(--nch-text); }

.nch-label{
  display:block; font-size:11px; text-transform:uppercase; letter-spacing:.06em;
  color:var(--nch-dim2); font-weight:700; margin-bottom:5px;
}

.nch-input{
  width:100%; background:var(--nch-surface2); border:1px solid var(--nch-line);
  border-radius:8px; padding:10px 12px; color:var(--nch-text); font-size:13px;
  margin-bottom:12px; box-sizing:border-box;
}
.nch-input:focus{ outline:2px solid var(--nch-purple); outline-offset:1px; }

.nch-row2{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }

.nch-btn{
  background:linear-gradient(135deg,var(--nch-purple),var(--nch-pink));
  color:#fff; border:none; padding:11px 20px; border-radius:8px;
  font-size:13px; font-weight:700; cursor:pointer;
}
.nch-btn:disabled{ opacity:.4; cursor:not-allowed; }
.nch-btn-sm{ padding:8px 14px; font-size:12px; }
.nch-ghost{ background:var(--nch-surface2); border:1px solid var(--nch-line); color:var(--nch-text); }

.nch-role-toggle{ display:flex; gap:16px; margin-bottom:14px; font-size:13px; color:var(--nch-text); }

.nch-note{ color:var(--nch-dim); font-size:13px; }
.nch-error{ color:var(--nch-pink); font-size:13px; }
.nch-success{ color:var(--nch-green); }
.nch-dim{ color:var(--nch-dim); font-size:13px; }

.nch-job-head{ display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; }
.nch-job-foot{ display:flex; justify-content:space-between; align-items:center; margin-top:12px; }

.nch-pill{
  font-size:11px; background:var(--nch-surface2); color:var(--nch-dim);
  padding:4px 10px; border-radius:100px;
}

.nch-amt{ font-family:var(--nch-mono); font-weight:700; color:var(--nch-pink); font-size:14px; }
.nch-amt-lg{ font-family:var(--nch-mono); font-weight:700; font-size:20px; color:var(--nch-text); }

.nch-badge{
  display:inline-block; font-size:11px; font-weight:700; padding:4px 10px;
  border-radius:100px; text-transform:uppercase; letter-spacing:.04em;
}
.nch-badge-open, .nch-badge-pending{ background:rgba(240,166,61,.15); color:var(--nch-amber); }
.nch-badge-hired, .nch-badge-in_progress{ background:rgba(155,81,224,.15); color:var(--nch-purple); }
.nch-badge-funded{ background:rgba(155,81,224,.15); color:var(--nch-purple); }
.nch-badge-released, .nch-badge-verified{ background:rgba(74,222,128,.15); color:var(--nch-green); }
.nch-badge-rejected, .nch-badge-disputed{ background:rgba(224,81,149,.15); color:var(--nch-pink); }

.nch-bid{
  display:flex; justify-content:space-between; align-items:center;
  background:var(--nch-surface2); border:1px solid var(--nch-line);
  border-radius:10px; padding:12px 14px; margin-bottom:8px;
}

.nch-split-summary{
  display:flex; gap:18px; flex-wrap:wrap; font-size:12px; color:var(--nch-dim);
  background:var(--nch-surface2); border:1px solid var(--nch-line);
  border-radius:10px; padding:12px 14px; margin:12px 0;
}
.nch-split-summary b{ color:var(--nch-text); font-family:var(--nch-mono); }

.nch-wallet-card{ display:flex; gap:32px; }

.nch-form-msg{ font-size:12px; margin-top:8px; }
.nch-form-msg.is-success{ color:var(--nch-green); }
.nch-form-msg.is-error{ color:var(--nch-pink); }

/* Portfolio masonry (Pinterest-style) */
.nch-masonry{
  column-count:3; column-gap:12px;
}
@media (max-width:700px){ .nch-masonry{ column-count:2; } }
.nch-masonry-item{
  position:relative; break-inside:avoid; margin-bottom:12px;
  border-radius:10px; overflow:hidden; border:1px solid var(--nch-line);
}
.nch-masonry-item img{ width:100%; display:block; }
.nch-portfolio-remove{
  position:absolute; top:6px; right:6px; width:24px; height:24px; border-radius:50%;
  background:rgba(20,18,26,.8); color:#fff; border:none; cursor:pointer; font-size:14px; line-height:1;
}

.nch-ai-helper{ margin-bottom:14px; }
