.btn{--btn-bg:var(--surface-panel);
  --btn-bg-hover:color-mix(in srgb, var(--text) 6%, var(--surface-panel));
  --btn-bg-active:color-mix(in srgb, var(--text) 11%, var(--surface-panel));
  --btn-bd:var(--line-strong); --btn-bd-hover:var(--text-dim); --btn-fg:var(--text);
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-8); border:1px solid var(--btn-bd); background:var(--btn-bg); color:var(--btn-fg); cursor:pointer; font-family:inherit; font-size:var(--fs-body); font-weight:600; padding:var(--space-8) var(--space-14); border-radius:var(--radius-6); transition:.13s; white-space:nowrap; text-decoration:none;}
.btn svg{width:var(--ic-16);height:var(--ic-16);}
.btn:disabled, .btn[aria-disabled="true"]{opacity:.42; cursor:not-allowed; box-shadow:none; filter:none;}
.btn:not(:disabled):hover{border-color:var(--btn-bd-hover); background:var(--btn-bg-hover);}
.btn:not(:disabled):active{border-color:var(--btn-bd-hover); background:var(--btn-bg-active);}

.btn-primary{--btn-bg:var(--text);
  --btn-bg-hover:var(--text-bright);
  --btn-bg-active:color-mix(in srgb, var(--text-on-bright) 12%, var(--text));
  --btn-fg:var(--text-on-bright);
  display:inline-flex; align-items:center; justify-content:center; gap:var(--space-8); border:1px solid transparent; cursor:pointer; font-family:inherit; font-size:var(--fs-body); font-weight:600; color:var(--btn-fg); background:var(--btn-bg); padding:var(--space-8) var(--space-14); border-radius:var(--radius-6); transition:.13s; white-space:nowrap; text-decoration:none;}
.btn-primary svg{width:var(--ic-16);height:var(--ic-16);}
.btn-primary:not(:disabled):hover{background:var(--btn-bg-hover);}
.btn-primary:not(:disabled):active{background:var(--btn-bg-active);}

.btn-danger{--btn-bg:var(--danger);
  --btn-bg-hover:color-mix(in srgb, var(--text-bright) 16%, var(--danger));
  --btn-bg-active:color-mix(in srgb, var(--text-on-bright) 10%, var(--danger));
  --btn-fg:var(--text-on-bright);
  border:1px solid transparent;}
.btn-danger:not(:disabled):hover{background:var(--btn-bg-hover);}
.btn-danger:not(:disabled):active{background:var(--btn-bg-active);}

.btn-security{--btn-bg:color-mix(in srgb, var(--warn) 12%, transparent);
  --btn-bg-hover:color-mix(in srgb, var(--warn) 18%, transparent);
  --btn-bg-active:color-mix(in srgb, var(--warn) 24%, transparent);
  --btn-bd:color-mix(in srgb, var(--warn) 55%, var(--line-strong));
  --btn-bd-hover:var(--warn); --btn-fg:var(--warn);}

.btn:disabled, .btn-primary:disabled, .btn-security:disabled, .btn-danger:disabled{opacity:.4; cursor:not-allowed; box-shadow:none;}

.btn.is-success, .btn-primary.is-success, .btn-security.is-success{
  --btn-bg:var(--success); --btn-bg-hover:var(--success); --btn-bg-active:var(--success);
  --btn-bd:var(--success); --btn-bd-hover:var(--success); --btn-fg:var(--text-on-bright);
  cursor:default; pointer-events:none;}
.btn.is-success svg, .btn-primary.is-success svg, .btn-security.is-success svg{stroke:var(--btn-fg);}
.btn-confirm-in{animation:btnConfirmIn .22s ease;}
@keyframes btnConfirmIn{from{transform:scale(.96);}to{transform:scale(1);}}
@media (prefers-reduced-motion: reduce){ .btn-confirm-in{animation:none;} }

.link{border:0; background:none; padding:0 0 1px; cursor:pointer;}
.link,
.f-hint a,
.md a,
.successor a,
.status-msg a,
.status-foot a,
.mt-row .v a{color:var(--text); text-decoration:underline; text-decoration-color:var(--text-dim);
             text-decoration-thickness:1px; text-underline-offset:3px;}
.link:hover,
.f-hint a:hover,
.md a:hover,
.successor a:hover,
.status-msg a:hover,
.status-foot a:hover,
.mt-row .v a:hover{color:var(--text-bright); text-decoration-color:var(--text-bright);}
.link[disabled]{color:var(--text-muted); text-decoration-color:transparent; pointer-events:none; cursor:default;}

button.link{font-family:inherit; font-size:inherit; line-height:inherit;}
