:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:#fff;color:#1a1a1a}#root{width:100%}.app{max-width:1400px;margin:0 auto;padding:2rem;display:grid;grid-template-columns:400px 1fr;gap:3rem;align-items:start}.controls{display:flex;flex-direction:column;gap:1.5rem;position:sticky;top:2rem}.controls h1{font-size:1.8rem;margin:0 0 1rem;color:#333}.control-group{display:flex;flex-direction:column;gap:.5rem}.control-group label{font-size:.875rem;font-weight:600;color:#555;text-transform:uppercase;letter-spacing:.5px}.control-group input[type=text],.control-group input[type=number],.control-group textarea,.control-group select{padding:.75rem;border:1px solid #ddd;border-radius:6px;font-size:1rem;font-family:inherit;transition:border-color .2s}.control-group input[type=text]:focus,.control-group input[type=number]:focus,.control-group textarea:focus,.control-group select:focus{outline:none;border-color:#646cff}.control-group textarea{resize:vertical;min-height:120px;line-height:1.6}.control-group input[type=color]{width:100%;height:40px;border:1px solid #ddd;border-radius:6px;cursor:pointer}.color-presets{display:grid;grid-template-columns:repeat(8,1fr);gap:.4rem;margin-top:.5rem}.color-swatch{width:100%;aspect-ratio:1;border:2px solid #ddd;border-radius:4px;cursor:pointer;transition:all .15s;padding:0;min-width:0}.color-swatch:hover{transform:scale(1.05);border-color:#646cff;z-index:1}.control-row{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}.control-row:has(.control-group:nth-child(3)){display:flex;flex-direction:column;gap:1rem}.action-buttons{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.action-btn{padding:1rem 1.5rem;color:#fff;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}.copy-btn{background:#10b981}.copy-btn:hover{background:#059669}.download-btn{background:#646cff}.download-btn:hover{background:#535bf2}.credits{position:fixed;top:2rem;right:2rem;font-size:.875rem;color:#888;z-index:100}.credits a{color:#646cff;text-decoration:none;font-weight:500;transition:color .2s}.credits a:hover{color:#535bf2;text-decoration:underline}.preview{display:flex;flex-direction:column;gap:1.5rem}.preview h2{font-size:1.5rem;margin:0;color:#333}.quote-container{display:flex;justify-content:center;align-items:center;min-height:500px;background:#fafafa;border-radius:12px;padding:3rem}.quote-card{padding:3rem;border-radius:12px;box-shadow:0 4px 6px #0000000d;transition:all .3s ease;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box}.quote-text{font-size:1.5rem;line-height:1.8;margin:0;color:#1a1a1a;text-align:left}.quote-text mark{border:none;padding:0;border-radius:2px}.quote-meta{margin-top:2rem;padding-top:1.5rem;border-top:1px solid rgba(0,0,0,.1);display:flex;flex-direction:column;gap:.25rem}.author{font-size:1rem;font-weight:600;color:#333}.source{font-size:.875rem;color:#666;font-style:italic}@media(max-width:1024px){.app{grid-template-columns:1fr}.controls{position:static}.quote-container{min-height:400px;padding:2rem}}@media(max-width:640px){.control-row{grid-template-columns:1fr}.control-row:has(.control-group:nth-child(3)){grid-template-columns:1fr}.action-buttons{grid-template-columns:1fr}.quote-card{padding:2rem}.quote-text{font-size:1.25rem}.credits{top:1rem;right:1rem;font-size:.75rem}}