.pb-wrap{
  --pb-ink:#0f172a;
  --pb-muted:#475569;
  --pb-border:#e2e8f0;
  --pb-bg:#ffffff;
  --pb-soft:#f8fafc;
  --pb-primary:#0f172a;

  font-family: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
}

.pb-theme-dark{
  --pb-ink:#e7ecff;
  --pb-muted:#a9b2d6;
  --pb-border:rgba(231,236,255,.14);
  --pb-bg:#0b1220;
  --pb-soft:rgba(16,26,46,.65);
  --pb-primary:#1b2a4d;
}

.pb-card{
  border:1px solid var(--pb-border);
  border-radius:16px;
  background:var(--pb-bg);
  padding:16px;
}

.pb-head{
  display:flex;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  align-items:flex-start;
  margin-bottom:12px;
}

.pb-title{ font-weight:800; font-size:18px; color:var(--pb-ink); }
.pb-sub{ font-size:13px; color:var(--pb-muted); margin-top:4px; line-height:1.4; }

.pb-actions{ display:flex; gap:8px; flex-wrap:wrap; }

.pb-btn{
  border:1px solid var(--pb-border);
  background:var(--pb-soft);
  color:var(--pb-ink);
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  font-weight:700;
}
.pb-btn:hover{ filter:brightness(1.02); }
.pb-btn-primary{ background:var(--pb-primary); color:#fff; border-color:transparent; }
.pb-btn-ghost{ background:transparent; }

.pb-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
}
@media (max-width: 900px){
  .pb-grid{ grid-template-columns:1fr; }
}

.pb-panel{
  border:1px solid var(--pb-border);
  border-radius:14px;
  padding:14px;
  background: var(--pb-bg);
}

.pb-label{
  display:block;
  font-size:12px;
  color:var(--pb-muted);
  margin:10px 0 6px;
}
.pb-mt{ margin-top:14px; }

.pb-select, .pb-input, .pb-textarea{
  width:100%;
  border:1px solid var(--pb-border);
  border-radius:12px;
  padding:10px 12px;
  background:var(--pb-soft);
  color:var(--pb-ink);
  outline:none;
}
.pb-textarea{ min-height:90px; resize:vertical; line-height:1.4; }

.pb-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
@media (max-width: 520px){
  .pb-row{ grid-template-columns:1fr; }
}

.pb-pills{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}

.pb-pill{
  display:inline-flex;
  gap:8px;
  align-items:center;
  border:1px solid var(--pb-border);
  background:var(--pb-soft);
  border-radius:999px;
  padding:7px 10px;
  font-size:12px;
  color:var(--pb-ink);
}

.pb-pill-x{
  border:none;
  background:transparent;
  cursor:pointer;
  font-size:14px;
  color:var(--pb-muted);
  padding:0 2px;
}

.pb-output{
  white-space:pre-wrap;
  word-break:break-word;
  background:var(--pb-soft);
  border:1px solid var(--pb-border);
  border-radius:12px;
  padding:12px;
  margin:0;
  min-height:170px;
  color:var(--pb-ink);
}

.pb-meta{
  display:flex;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px;
  font-size:12px;
  color:var(--pb-muted);
}
.pb-muted{ opacity:.9; }