/* Watermark — tool-specific styles */
.wm-stage { display: grid; grid-template-columns: 1fr 300px; gap: 20px; align-items: start; }
.wm-canvaswrap { background: var(--bg-soft); border: 1px solid var(--line); border-radius: var(--radius-sm); padding: 10px; display: grid; place-items: center; overflow: hidden; }
#wmCanvas { max-width: 100%; height: auto; border-radius: 6px; display: block; }
.wm-controls { display: flex; flex-direction: column; gap: 12px; }
.wm-controls .field label { font-size: .82rem; }
.wm-controls input[type=text] { background: var(--bg-soft); border: 1px solid var(--line); color: var(--text); padding: 10px 12px; border-radius: var(--radius-sm); font-family: inherit; width: 100%; }
.wm-controls input[type=text]:focus { outline: none; border-color: var(--accent); }
.wm-ctrl { display: flex; align-items: center; gap: 10px; font-size: .85rem; color: var(--muted); }
.wm-ctrl select { background: var(--bg-soft); border: 1px solid var(--line); color: var(--text); padding: 8px 10px; border-radius: var(--radius-sm); font-family: inherit; flex: 1; }
.wm-ctrl input[type=range] { flex: 1; accent-color: var(--accent); }
.wm-up { display: flex; gap: 8px; flex-wrap: wrap; font-size: .82rem; color: var(--muted); align-items: center; }
.wm-up .btn { padding: 8px 12px; font-size: .82rem; }
.wm-actions { display: flex; gap: 10px; margin-top: 4px; }
@media (max-width: 760px) { .wm-stage { grid-template-columns: 1fr; } }
