/*
 * Buttons and form fields, late enough to win over the screen rules above.
 *
 * Part of the ordered atlas stylesheet — the files in this directory are
 * linked in filename order and the order is load-bearing, so a rule moved
 * between them can change what wins.
 */
/* ===================== Buttons ===================== */
.btn{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:10px;font-size:13px;
  font-weight:600;cursor:pointer;border:1px solid var(--line2);background:var(--panel);color:var(--txt);
  transition:.15s}
.btn:hover{border-color:var(--accent);transform:translateY(-1px)}
.btn svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.btn.grad{background:var(--accent);color:var(--accent-ink,#fff);border:none;box-shadow:0 1px 2px color-mix(in srgb,var(--accent) 30%,transparent)}
.btn.grad:hover{background:var(--accent-d,#1a55c0)}
.btn.green{background:#0E6E63;color:#fff;border:none;box-shadow:0 1px 2px rgba(14,110,99,.3)}
.btn.green:hover{background:#0b5a51;transform:translateY(-1px)}
.btn.ghost{background:transparent}
.btn.sm{padding:6px 10px;font-size:12px}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:18px}
.spacer{flex:1}

/* ===================== Modal + forms ===================== */
.modal-bg{position:fixed;inset:0;background:rgba(5,8,16,.62);backdrop-filter:blur(5px);
  display:grid;place-items:center;z-index:60;animation:fade .2s ease}
.modal{width:520px;max-width:94vw;max-height:90vh;overflow:auto;background:var(--panel);
  border:1px solid var(--line2);border-radius:20px;padding:26px;box-shadow:var(--shadow);
  animation:rise .28s cubic-bezier(.2,.8,.2,1)}
.modal h3{font-size:19px;margin-bottom:4px}
.modal .msub{color:var(--muted);font-size:13px;margin-bottom:20px}
.field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px}
.field>label{font-size:12px;color:var(--muted);font-weight:600}
.field input,.field select,.field textarea{background:var(--bg2);border:1px solid var(--line2);
  border-radius:10px;padding:10px 12px;color:var(--txt);font-size:14px;font-family:inherit;transition:.15s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);
  box-shadow:0 0 0 3px rgba(99,102,241,.16)}
.field textarea{resize:vertical;min-height:74px}
.field.check{flex-direction:row;align-items:center;gap:8px}
.field.check input{width:16px;height:16px}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.modal-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
.merr{background:rgba(248,113,113,.12);border:1px solid rgba(248,113,113,.35);color:#fca5a5;
  padding:9px 12px;border-radius:9px;font-size:13px;margin-bottom:14px}