.ppl-card-generator{box-sizing:border-box;max-width:900px;margin:32px auto;padding:24px;background:#faf7f1;border:1px solid #e3d9c6;border-radius:12px;font-family:-apple-system,"Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;color:#2b2b2b;line-height:1.5}
.ppl-card-generator *{box-sizing:border-box}
.ppl-howto{margin:0 0 20px;padding:12px 16px;background:#eef7f4;border-left:4px solid #2f8fa6;font-size:14px;border-radius:4px}
.ppl-layout{display:flex;gap:28px;flex-wrap:wrap;align-items:flex-start}
.ppl-form{flex:1 1 320px;min-width:280px}
.ppl-field{margin-bottom:16px}
.ppl-field label{display:block;font-size:13px;font-weight:700;margin-bottom:4px;color:#4a4173}
.ppl-field input[type="text"],.ppl-field textarea{width:100%;padding:8px 10px;border:1px solid #d8cdb8;border-radius:6px;font-size:14px;font-family:inherit;background:#fff;resize:vertical}
.ppl-field textarea{min-height:60px}
.ppl-counter{display:block;text-align:right;font-size:12px;color:#8a7f68;margin-top:2px}
.ppl-counter-warn{color:#c0392b;font-weight:700}
.ppl-toggle-row{display:flex;align-items:center;gap:8px;margin:18px 0 6px;padding:12px;background:#fff;border:1px dashed #2f8fa6;border-radius:6px}
.ppl-toggle-row input{width:18px;height:18px;margin:0}
.ppl-toggle-row label{font-size:14px;font-weight:700;color:#2b2b2b;margin:0}
.ppl-toggle-note{font-size:12px;color:#7a7263;margin:0 0 16px 2px}
.ppl-preview{flex:0 0 320px;max-width:340px;margin:0 auto;text-align:center}
.ppl-preview canvas{width:100%;height:auto;display:block;border-radius:6px;box-shadow:0 3px 14px rgba(0,0,0,.14);background:#fff}
.ppl-btn{display:inline-block;margin-top:14px;padding:12px 28px;background:#2f8fa6;color:#fff;border:none;border-radius:24px;font-size:15px;font-weight:700;cursor:pointer}
.ppl-size-note{font-size:12px;color:#8a7f68;margin-top:10px}
@media(max-width:700px){.ppl-layout{flex-direction:column}.ppl-preview{max-width:100%}}