@import url("./tokens.css");
*,*::before,*::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--font-sans); background: var(--color-bg); color: var(--color-text); line-height: 1.5; }
img { max-width: 100%; display: block; }
a { color: var(--color-primary); text-decoration: none; }
.container { width: min(1120px, 100% - 32px); margin-inline: auto; }
.card { background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); padding: var(--space-4); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); min-height: 44px; padding: 0 var(--space-4); border: 0; border-radius: var(--radius-sm); background: var(--color-primary); color: #fff; font-weight: 600; cursor: pointer; transition: background var(--transition), transform var(--transition); }
.btn:hover { background: var(--color-primary-dark); }
.btn:active { transform: scale(.98); }

.btn:disabled { opacity: .5; cursor: not-allowed; pointer-events: none; }