.button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:10px 18px;
  border-radius:10px;
  border:1px solid transparent;
  font-size:14px;
  font-weight:400;
  line-height:1.3;
  transition:background .15s,border-color .15s;
  white-space:nowrap
}

.button-primary {
  background:#111;
  color:#fff;
  border-color:#111
}

.button-primary:hover:not(:disabled) {
  background:#302a20
}

.button-secondary {
  background:transparent;
  border-color:var(--line);
  color:var(--ink)
}

.button-secondary:hover:not(:disabled) {
  background:#fff;
  border-color:var(--line-strong)
}

.button:disabled {
  opacity:.42
}

.text-action {
  font-size:13px;
  color:var(--ink-soft);
  text-decoration:underline;
  text-decoration-color:var(--line-strong);
  text-underline-offset:4px
}

.text-action:hover {
  color:var(--accent)
}

.icon-button {
  min-width:36px;
  width:36px;
  height:36px;
  border:1px solid var(--line);
  border-radius:9px;
  font-size:18px;
  background:#fff
}

.icon-button:disabled {
  opacity:.35
}

.status-pill {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  white-space:nowrap;
  border:1px solid var(--line);
  border-radius:6px;
  padding:4px 9px;
  color:var(--muted);
  background:var(--surface-softer)
}

.status-pill.is-ready,.status-pill.is-complete {
  color:var(--success);
  border-color:#c9decd;
  background:var(--success-soft)
}

.status-pill.is-blocked,.status-pill.is-failed {
  color:var(--danger);
  border-color:#e3c4bf;
  background:var(--danger-soft)
}

.status-pill.is-warning {
  color:var(--warning);
  background:var(--warning-soft);
  border-color:#e2d3b5
}

.app-dialog {
  border:1px solid var(--line);
  border-radius:22px;
  background:var(--surface);
  color:var(--ink);
  padding:28px;
  width:min(460px,calc(100vw - 28px));
  max-height:88dvh;
  overflow:auto;
  box-shadow:0 22px 70px #0003
}

.app-dialog::backdrop {
  background:#17150e60;
  backdrop-filter:blur(2px)
}

.app-dialog h2 {
  font-size:1.65rem;
  font-weight:350;
  letter-spacing:-.025em;
  margin:0 0 16px
}

.dialog-actions {
  display:flex;
  gap:10px;
  justify-content:flex-end;
  align-items:center;
  flex-wrap:wrap;
  margin-top:24px
}

.dialog-delete {
  margin-right:auto;
  color:var(--danger)
}

.dialog-error {
  font-size:13px;
  color:var(--danger);
  line-height:1.5
}

.app-dialog p { color:var(--muted); font-size:.92rem; line-height:1.55 }
.app-dialog .field-stack { margin-top:18px }
.app-dialog .dialog-error { color:var(--danger); font-size:.82rem; margin-top:12px }

.app-dialog form {
  margin:0
}

.field-caption {
  font-size:13px;
  color:var(--muted)
}

.required-marker {
  color:var(--accent)
}

/* Native disclosure keeps controls reachable with keyboard and without scripts. */
.disclosure { position:relative; }
.disclosure > summary { list-style:none; cursor:pointer; font-size:13px; color:var(--ink-soft); }
.disclosure > summary::-webkit-details-marker { display:none; }
.disclosure > summary:focus-visible, button:focus-visible { outline:2px solid var(--accent); outline-offset:3px; }
.disclosure-menu { position:absolute; top:calc(100% + 6px); left:0; z-index:45; min-width:170px; max-width:min(320px,82vw); max-height:260px; overflow:auto; border:1px solid var(--line); background:var(--surface); padding:6px; box-shadow:var(--shadow); }
.disclosure-menu > button { display:block; width:100%; text-align:left; white-space:normal; padding:10px 12px; font-size:13px; border:0; background:transparent; border-radius:0; text-decoration:none; }
.disclosure-menu > button:hover, .disclosure-menu > button:focus-visible { background:var(--surface-soft); }
.field-picker > summary { padding:7px 0; color:var(--accent-strong); }
.field-picker > summary span { margin-left:6px; }