/* Shared components: use these classes on every page; do not restyle per page. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s2);min-height:44px;padding:0 var(--s5);border:1px solid transparent;border-radius:var(--r-md);font:700 var(--fs-md) var(--font);cursor:pointer;text-decoration:none;transition:background .2s,box-shadow .2s}
.btn-primary{background:var(--kv-700);color:#fff}.btn-primary:hover{background:var(--kv-800);box-shadow:var(--sh-1)}
.btn-ghost{background:#fff;color:var(--kv-700);border-color:var(--line)}.btn-ghost:hover{background:var(--kv-50)}
.btn-danger{background:var(--err);color:#fff}
.btn:disabled,.btn[aria-busy=true]{opacity:.6;cursor:not-allowed}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s5);box-shadow:var(--sh-1)}
.field{display:grid;gap:var(--s2);margin-bottom:var(--s4)}.field label{font-weight:600}
.input,.select{min-height:44px;padding:0 var(--s4);border:1px solid var(--line);border-radius:var(--r-md);font:inherit;background:#fff;color:var(--ink)}
.input[aria-invalid=true]{border-color:var(--err)}
.field .hint{font-size:var(--fs-sm);color:var(--ink-2)}.field .error{font-size:var(--fs-sm);color:var(--err)}
.alert{padding:var(--s3) var(--s4);border-radius:var(--r-md);border:1px solid;font-size:var(--fs-sm)}
.alert-info{background:var(--kv-50);border-color:var(--kv-100);color:var(--kv-900)}
.alert-success{background:#e8f6f0;border-color:#b9e3d3;color:var(--ok)}
.alert-error{background:#fdecee;border-color:#f3c3c7;color:var(--err)}
.badge{display:inline-block;padding:2px var(--s3);border-radius:99px;background:var(--kv-50);color:var(--kv-800);font-size:var(--fs-sm);font-weight:600}
.badge-demo{background:#fff4e0;color:var(--warn)}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-md)}
.table{width:100%;border-collapse:collapse}.table th,.table td{padding:var(--s3) var(--s4);text-align:right;border-bottom:1px solid var(--line);white-space:nowrap}.table th{background:var(--bg-soft);font-size:var(--fs-sm)}
.state{display:grid;place-items:center;gap:var(--s2);padding:var(--s7) var(--s4);text-align:center;color:var(--ink-2)}
.skeleton{background:linear-gradient(90deg,var(--bg-soft),#e8f0f8,var(--bg-soft));background-size:200% 100%;animation:kv-sk 1.2s infinite;border-radius:var(--r-sm);min-height:1em}
@keyframes kv-sk{to{background-position:-200% 0}}