.card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 14px; }
.btn { background: var(--accent); color: var(--accent-ink); border: 0; border-radius: 999px; padding: 10px 16px; cursor: pointer; }
.btn.secondary { background: transparent; color: var(--ink); border: 1px solid var(--border); }
.btn.ghost { background: transparent; color: var(--accent); border: 0; }
.btn.danger { background: #b91c1c; color: #fff; }
.btn:disabled { opacity: 0.6; cursor: not-allowed; }
.field { display: grid; gap: 6px; }
.field label { font-weight: 600; font-size: 0.9rem; }
.input, textarea.input, select.input { width: 100%; border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; background: #fff; color: var(--ink); }
textarea.input { min-height: 80px; }
.pill { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); border-radius: 999px; padding: 2px 10px; font-size: 0.8rem; background: #fff; }
.status { font-size: 0.8rem; }
.status.pending { color: #b45309; }
.status.failed { color: #b91c1c; }
.wall-item img { max-width: 100%; border-radius: 10px; display: block; }
.wall-item audio { width: 100%; }
.empty { border: 1px dashed var(--border); border-radius: var(--radius); padding: 18px; text-align: center; color: var(--muted); background: #fff; }
canvas.draw { width: 100%; background: #fff; border: 1px solid var(--border); border-radius: 10px; touch-action: none; }
.toast { position: fixed; bottom: 18px; left: 50%; transform: translateX(-50%); background: var(--ink); color: #fff; padding: 10px 14px; border-radius: 999px; z-index: 30; }
.modal-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,0.35); display: grid; place-items: center; padding: 16px; z-index: 20; }
.modal { background: var(--surface); border-radius: 16px; max-width: 640px; width: 100%; max-height: 90vh; overflow: auto; padding: 16px; }
.scrap-page { aspect-ratio: 4/3; border: 1px solid var(--border); border-radius: 10px; background: #fff; position: relative; overflow: hidden; }
.scrap-el { position: absolute; border: 1px solid rgba(0,0,0,0.08); background: rgba(255,255,255,0.85); border-radius: 6px; overflow: hidden; }
.scrap-el img { width: 100%; height: 100%; object-fit: cover; }
