*{box-sizing:border-box;margin:0;padding:0}body{color:#3d3530;background:#f5f0e8;min-height:100vh;font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,Noto Sans JP,sans-serif}#root{min-height:100vh}.app{max-width:720px;margin:0 auto;padding:40px 20px}.header{text-align:center;margin-bottom:40px}.header h1{color:#2d2520;margin-bottom:6px;font-size:28px;font-weight:700}.header p{color:#8a7f75;font-size:15px}.main{flex-direction:column;gap:32px;display:flex}.form-section{background:#fff;border:1px solid #e8e0d4;border-radius:16px;flex-direction:column;gap:20px;padding:28px;display:flex;box-shadow:0 2px 12px #0000000f}.field{flex-direction:column;gap:8px;display:flex;position:relative}.field label{color:#8a7f75;text-transform:uppercase;letter-spacing:.06em;font-size:13px;font-weight:600}.field input{color:#2d2520;background:#faf7f2;border:1px solid #e8e0d4;border-radius:10px;outline:none;padding:13px 56px 13px 16px;font-family:inherit;font-size:15px;transition:border-color .2s}.field input::placeholder{color:#bfb8b0}.field input:focus{border-color:#7c9e6e}.char-count{color:#c0b8b0;font-size:12px;position:absolute;bottom:13px;right:14px}.genre-buttons{flex-wrap:wrap;gap:8px;display:flex}.genre-btn{color:#6b6058;cursor:pointer;background:#faf7f2;border:1px solid #e8e0d4;border-radius:20px;padding:7px 16px;font-family:inherit;font-size:14px;transition:all .2s}.genre-btn:hover{color:#4a7040;border-color:#7c9e6e}.genre-btn.active{color:#fff;background:#7c9e6e;border-color:#7c9e6e}.error{color:#c0392b;font-size:14px}.generate-btn{color:#fff;cursor:pointer;background:#7c9e6e;border:none;border-radius:12px;padding:15px;font-family:inherit;font-size:15px;font-weight:700;transition:background .2s}.generate-btn:hover:not(:disabled){background:#6a8c5c}.generate-btn:disabled{opacity:.5;cursor:not-allowed}.preview-section{flex-direction:column;gap:14px;display:flex}.preview-section h2{color:#8a7f75;font-size:16px;font-weight:600}.canvas-wrapper{background:#fff;border:1px solid #e8e0d4;border-radius:12px;width:100%;position:relative;overflow:hidden;box-shadow:0 2px 12px #0000000f}.canvas-wrapper canvas{width:100%;height:auto;display:block}.canvas-wrapper.placeholder{background:#faf7f2}.placeholder-text{color:#c0b8b0;text-align:center;pointer-events:none;white-space:nowrap;font-size:14px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.download-btn{color:#5a8050;cursor:pointer;background:#fff;border:1px solid #7c9e6e;border-radius:10px;align-self:flex-start;padding:12px 22px;font-family:inherit;font-size:14px;font-weight:600;transition:all .2s}.download-btn:hover{color:#fff;background:#7c9e6e}