.task-compare-modal{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;width:100%;height:100%;background-color:rgba(0,0,0,.8);z-index:-999;opacity:0;pointer-events:none;transition:.2s;padding:24px}.task-compare-modal[show]{z-index:99999;opacity:1;pointer-events:all}.task-compare-modal .task-compare-modal__body{display:flex;flex-direction:column;max-width:1024px;width:100%;max-height:100%;border-radius:10px;background-color:#fff}.task-compare-modal header{display:flex;flex-direction:row;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid #000}.task-compare-modal header .title{font-size:18px;font-weight:600}.task-compare-modal header .modal-close{display:flex;align-items:center;justify-content:center;padding:5px;border-radius:999px;color:#6b7280;cursor:pointer;transition:.2s}.task-compare-modal header .modal-close:hover{background-color:#f3f4f6}.task-compare-modal header .modal-close:active{scale:.95}.task-compare-modal section{overflow:auto}.task-compare-modal main{display:flex;flex-direction:row;gap:16px;padding:16px}.task-compare-modal main .preview{flex:1}.task-compare-modal main .preview p{margin-bottom:8px;color:#6b7280;font-size:14px;font-weight:500}.task-compare-modal main .preview img,.task-compare-modal main .preview video{width:100%;height:100%;max-height:300px;object-fit:contain;background-color:#2d2d2d}.task-compare-modal main .preview-container{display:flex;align-items:center;justify-content:center;border-radius:8px;overflow:hidden}.task-compare-modal footer{display:flex;flex-direction:row;justify-content:space-between;margin:0 16px 16px;padding:16px;background-color:#f9fafb;border-radius:10px}.task-compare-modal footer .left-box p{margin:0;margin-bottom:12px;font-size:14px;font-weight:500;color:#374151}.task-compare-modal footer .detail-box{display:flex;flex-direction:row;gap:20px}.task-compare-modal footer .detail-box .detail{display:flex;flex-direction:column}.task-compare-modal footer .detail-box .detail span{font-size:12px;color:#6b7280}.task-compare-modal footer .detail-box .detail span:last-child{font-size:14px;font-weight:500}.task-compare-modal footer .detail-box .detail:last-child span:last-child{color:#9333ea}.task-compare-modal footer .right-box{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:15px}.task-compare-modal footer .button{display:flex;align-items:center;justify-content:center;gap:10px;color:#f8fafc;padding:8px 16px;font-size:14px;font-weight:500;cursor:pointer;text-decoration:none;border-radius:5px;transition:.2s;width:100%}.task-compare-modal footer .button:hover{opacity:.8}.task-compare-modal footer .button:active{scale:.98}.task-compare-modal footer .button svg{width:1.1em;height:1.1em}.task-compare-modal footer .button span{white-space:nowrap}.task-compare-modal footer .button.download{background-color:#9333ea}.task-compare-modal footer .button.enhance{background-color:#16a34a}@media screen and (max-width: 600px){.task-compare-modal{padding:0;background-color:#fff;align-items:flex-start}.task-compare-modal .task-compare-modal__body{border-radius:0}.task-compare-modal main{flex-direction:column}.task-compare-modal footer .detail-box{flex-direction:column}.task-compare-modal footer .right-box{flex-direction:column;justify-content:flex-end}}