*{box-sizing:border-box;margin:0;padding:0}body{color:#fff;background-color:#121212;justify-content:center;align-items:center;min-height:100vh;font-family:Inter,sans-serif;display:flex}#root{justify-content:center;align-items:center;width:100%;display:flex}.app-container{flex-direction:column;align-items:center;gap:20px;width:100%;padding:20px;display:flex}.controls{gap:15px;margin-top:10px;display:flex}button{color:#fff;cursor:pointer;background-color:#2b3a32;border:none;border-radius:8px;padding:12px 24px;font-family:Inter,sans-serif;font-size:1rem;font-weight:500;transition:background-color .2s,transform .1s}button:hover{background-color:#3b4d44}button:active{transform:scale(.98)}.quote-canvas-wrapper{border-radius:4px;width:400px;height:711px;position:relative;overflow:hidden;box-shadow:0 10px 30px #00000080}.quote-canvas{transform-origin:0 0;background-color:#1b2420;flex-direction:column;align-items:center;width:1080px;height:1920px;display:flex;position:absolute;top:0;left:0;transform:scale(.37037)}.portrait-container{width:100%;height:1000px;position:relative}.portrait{object-fit:cover;object-position:top center;width:100%;height:100%}.portrait-overlay{background:linear-gradient(#1b242000 0%,#1b2420 100%);width:100%;height:350px;position:absolute;bottom:0;left:0}.quote-content{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;width:80%;padding-bottom:100px;display:flex}.separator{background-color:#e0e0e0;width:100%;height:4px;margin:50px 0}.quote-text{color:#f0f0f0;margin-bottom:60px;font-size:64px;font-weight:400;line-height:1.4}.author{color:#9ea8a2;font-size:48px;font-style:italic;font-weight:300}