.button {
    display: inline-flex;
    min-height: 2.75rem;
    align-items: center;
    justify-content: center;
    padding: 0.68rem 1.15rem;
    border: 1px solid var(--color-accent);
    border-radius: var(--radius-small);
    background: var(--color-accent);
    box-shadow: inset 0 1px 0 rgb(255 255 255 / 22%), var(--shadow-small);
    color: #fff;
    font-weight: 680;
    line-height: 1.2;
    text-decoration: none;
    transition: background-color 180ms cubic-bezier(0.16, 1, 0.3, 1), box-shadow 180ms cubic-bezier(0.16, 1, 0.3, 1), transform 180ms cubic-bezier(0.16, 1, 0.3, 1);
    cursor: pointer;
}
.button:hover { background: var(--color-accent-dark); color: #fff; transform: translateY(-1.5px); box-shadow: inset 0 1px 0 rgb(255 255 255 / 30%), var(--shadow); }
.button:active { transform: translateY(0); box-shadow: var(--shadow-small); }
.button--secondary { background: var(--color-surface); color: var(--color-accent); border-color: var(--color-border); box-shadow: var(--shadow-small); }
.button--secondary:hover { background: #edf3ef; border-color: var(--color-accent); color: var(--color-accent-dark); }
.button--small { min-height: 2.25rem; padding: 0.4rem 0.75rem; font-size: 0.9rem; }
.button--quiet { border-color: rgb(var(--accent-rgb) / 25%); background: transparent; color: inherit; box-shadow: none; }
.button--quiet:hover { background: rgb(255 255 255 / 12%); box-shadow: none; }
.text-link { display: inline-flex; align-items: center; gap: 0.45rem; font-weight: 680; text-decoration: none; }
.text-link::after { content: "→"; transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1); }
.text-link:hover::after { transform: translateX(0.28rem); }
.card-grid { display: grid; gap: var(--space-2); }
.card { padding: var(--space-3); border: 1px solid var(--color-border); border-radius: var(--radius); background: var(--color-surface); box-shadow: var(--shadow-small); transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease; }
.flash-stack { padding-top: var(--space-2); }
.flash, .notice { padding: 0.85rem 1rem; border: 1px solid var(--color-border); border-radius: var(--radius-small); background: var(--color-surface); box-shadow: var(--shadow-small); }
.flash--success { border-color: #91b2a4; color: var(--color-success); }
.flash--error { border-color: #d3a1a1; color: var(--color-error); }
.empty-state { color: var(--color-muted); }
label { display: grid; gap: 0.35rem; font-weight: 650; }
input, textarea, select { width: 100%; padding: 0.72rem 0.82rem; border: 1px solid #aeb9b3; border-radius: var(--radius-small); background: #fff; color: var(--color-text); transition: border-color 160ms ease, box-shadow 160ms ease; }
textarea { resize: vertical; }
input:focus, textarea:focus, select:focus { border-color: var(--color-accent); outline: none; box-shadow: 0 0 0 3px rgb(var(--accent-rgb) / 14%); }
.checkbox-field { display: flex; align-items: center; gap: 0.6rem; font-weight: 500; }
.checkbox-field input { width: auto; }
.button--danger { border-color: var(--color-error); background: var(--color-error); }
.button--danger:hover { background: #732222; }
.button:disabled, input:disabled, textarea:disabled { cursor: not-allowed; opacity: 0.55; }
.form-columns { display: grid; gap: var(--space-2); }
fieldset { margin: 0; padding: var(--space-2); border: 1px solid var(--color-border); border-radius: var(--radius-small); }
.honeypot-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

@media (min-width: 42rem) {
    .card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .form-columns { grid-template-columns: 1fr 1fr; }
}