/* Quote & meme card maker */
.card-body.stack > .qc-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 22px; align-items: start; }
@media (max-width: 860px) { .card-body.stack > .qc-grid { grid-template-columns: 1fr; } .qc-prev { position: static; } }
.qc-prev { position: sticky; top: 76px; }
.qc-prev canvas { width: 100%; height: auto; display: block; border-radius: 12px; box-shadow: var(--shadow-md); background: #222; }
.qc-ctl { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.qc-ctl textarea, .qc-ctl input[type=text] { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; font: 500 15px var(--font-body); background: var(--surface); color: var(--ink); resize: vertical; }
.qc-ctl textarea:focus, .qc-ctl input[type=text]:focus { outline: 2px solid var(--tool-line); border-color: var(--tool); }
.qc-sw { display: flex; gap: 8px; flex-wrap: wrap; }
.qc-sw button { width: 40px; height: 40px; border-radius: 10px; border: 2px solid transparent; cursor: pointer; box-shadow: 0 0 0 1px var(--line); }
.qc-sw button.on { border-color: var(--ink); }
.qc-lbl { font: 600 12px var(--font-body); color: var(--ink-2); letter-spacing: .03em; text-transform: uppercase; margin: 4px 0 -4px; }
