:root{--vt-c-white: #ffffff;--vt-c-white-soft: #f8f8f8;--vt-c-white-mute: #f2f2f2;--vt-c-black: #181818;--vt-c-black-soft: #222222;--vt-c-black-mute: #282828;--vt-c-indigo: #2c3e50;--vt-c-divider-light-1: rgba(60, 60, 60, .29);--vt-c-divider-light-2: rgba(60, 60, 60, .12);--vt-c-divider-dark-1: rgba(84, 84, 84, .65);--vt-c-divider-dark-2: rgba(84, 84, 84, .48);--vt-c-text-light-1: var(--vt-c-indigo);--vt-c-text-light-2: rgba(60, 60, 60, .66);--vt-c-text-dark-1: var(--vt-c-white);--vt-c-text-dark-2: rgba(235, 235, 235, .64)}:root{--color-background: var(--vt-c-white);--color-background-soft: var(--vt-c-white-soft);--color-background-mute: var(--vt-c-white-mute);--color-border: var(--vt-c-divider-light-2);--color-border-hover: var(--vt-c-divider-light-1);--color-heading: var(--vt-c-text-light-1);--color-text: var(--vt-c-text-light-1);--section-gap: 160px}@media (prefers-color-scheme: dark){:root{--color-background: var(--vt-c-black);--color-background-soft: var(--vt-c-black-soft);--color-background-mute: var(--vt-c-black-mute);--color-border: var(--vt-c-divider-dark-2);--color-border-hover: var(--vt-c-divider-dark-1);--color-heading: var(--vt-c-text-dark-1);--color-text: var(--vt-c-text-dark-2)}}*,*:before,*:after{box-sizing:border-box;margin:0;font-weight:400}body{min-height:100vh;color:var(--color-text);background:var(--color-background);transition:color .5s,background-color .5s;line-height:1.6;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;font-size:15px;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#app{max-width:1280px;margin:0 auto;padding:2rem;font-weight:400}a,.green{text-decoration:none;color:#00bd7e;transition:.4s;padding:3px}@media (hover: hover){a:hover{background-color:#00bd7e33}}@media (min-width: 1024px){body{display:flex;place-items:center}#app{display:grid;grid-template-columns:1fr 1fr;padding:0 2rem}}*{border:0;box-sizing:border-box;margin:0;padding:0}:root{--hue: 223;--bg: hsl(var(--hue),10%,85%);--fg: hsl(var(--hue),10%,5%);--trans-dur: .3s;font-size:calc(16px + (20 - 16) * (100vw - 320px) / (2560 - 320))}body,button{font:1em/1.5 Nunito,Helvetica,sans-serif}body{background-color:var(--bg);color:var(--fg);height:100vh;display:flex;align-items:center;justify-content:center;transition:background-color var(--trans-dur),color var(--trans-dur);margin:0}.modal{background-color:#333;border-radius:1em;box-shadow:0 .75em 1em hsla(var(--hue),10%,5%,.3);color:hsl(var(--hue),10%,5%);width:calc(100% - 3em);max-width:34.5em;overflow:hidden;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);transition:background-color var(--trans-dur),color var(--trans-dur)}.modal:before{background-color:#3d71f5;border-radius:50%;content:"";filter:blur(60px);opacity:.15;position:absolute;top:-8em;right:-15em;width:25em;height:25em;z-index:0;transition:background-color var(--trans-dur)}.modal__actions{animation-delay:.2s;display:flex;align-items:center;flex-wrap:wrap}.modal__body,.modal__header{position:relative;z-index:1}.modal__body{display:flex;flex-direction:column;padding:0 2em 1.875em 1.875em}.modal__button,.modal__close-button{color:currentColor;cursor:pointer;-webkit-tap-highlight-color:transparent}.modal__button{background-color:gray;border-radius:.25rem;font-size:.75em;padding:.5rem 2rem;transition:background-color var(--trans-dur),border-color var(--trans-dur),opacity var(--trans-dur);width:100%;color:#fff}.modal__button+.modal__button{margin-top:.75em}.modal__button:disabled{opacity:.5}.modal__button:focus,.modal__close-button:focus{outline:transparent}.modal__button:hover,.modal__button:focus-visible{background-color:hsla(var(--hue),10%,60%,.2)}.modal__button--upload{background-color:transparent;border:.125rem dashed hsl(0,0%,60%);flex:1;padding:.375rem 2rem;color:#fff}.modal__col+.modal__col{flex:1;margin-top:1.875em}.modal__progress-value{color:#fff;transition:color var(--trans-dur)}.modal__close-button{background-color:transparent;display:flex;width:1.5em;height:1.5em;transition:color var(--trans-dur);color:gray}.modal__close-button:hover,.modal__close-button:focus-visible{color:hsl(var(--hue),10%,40%)}.modal__close-icon{display:block;margin:auto;pointer-events:none;width:50%;height:auto}.modal__content>*{animation-name:fadeSlideIn;animation-duration:.5s;animation-timing-function:ease-in-out;animation-fill-mode:forwards;opacity:0}.modal__file{flex:1;font-size:.75em;font-weight:700;margin-right:.25rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.modal__file~.modal__button{margin-top:1.5em}.modal__file-icon{color:hsl(var(--hue),10%,50%);display:block;margin-right:.75em;width:1.5em;height:1.5em;transition:color var(--trans-dur)}.modal__header{display:flex;justify-content:flex-end;align-items:center;height:2.5em;padding:.5em}.modal__icon{display:block;margin:auto;width:2.25em;height:2.25em}.modal__icon--blue g{stroke:#0d4ef2}.modal__icon--red g{stroke:#f2180d}.modal__icon--green g{stroke:#0ac241}.modal__icon circle,.modal__icon line,.modal__icon polyline{animation:sdo .25s ease-in-out forwards;transition:stroke var(--trans-dur)}.modal__icon :nth-child(2){animation-delay:.25s}.modal__icon :nth-child(3){animation-delay:.5s}.modal__icon-sdo10{stroke-dashoffset:10}.modal__icon-sdo14{stroke-dashoffset:14.2}.modal__icon-sdo69{stroke-dashoffset:69.12;transform:rotate(-90deg);transform-origin:12px 12px}.modal__message{animation-delay:.1s;font-size:1em;margin-bottom:1.5em;min-height:3em;color:gray}.modal__progress{flex:1}.modal__progress+.modal__button{margin-top:1.75em}.modal__progress-bar{background-image:linear-gradient(90deg,hsl(var(--hue),90%,50%),hsl(var(--hue),90%,70%));border-radius:.2em;overflow:hidden;width:100%;height:.4em;transform:translateZ(0)}.modal__progress-fill{background-color:hsl(var(--hue),10%,90%);width:inherit;height:inherit;transition:transform .1s ease-in-out}.modal__progress-value{font-size:.75em;font-weight:700;line-height:1.333;text-align:right}.modal__sr{overflow:hidden;position:absolute;width:1px;height:1px}.modal__title{font-size:1.25em;font-weight:500;line-height:1.2;margin-bottom:1.5rem;text-align:center;color:#fff}[data-state="2"]:before{background-color:#f5463d}[data-state="3"]:before{background-color:#3df574}.modal__icon+.modal__icon,[data-state="1"] .modal__icon:first-child,[data-state="2"] .modal__icon:first-child,[data-state="3"] .modal__icon:first-child,.modal__content+.modal__content,[data-state="1"] .modal__content:first-child,[data-state="2"] .modal__content:first-child,[data-state="3"] .modal__content:first-child{display:none}[data-state="1"] .modal__icon:first-child,[data-state="2"] .modal__icon:nth-child(2),[data-state="3"] .modal__icon:nth-child(3),[data-state="1"] .modal__content:nth-child(2),[data-state="2"] .modal__content:nth-child(3),[data-state="3"] .modal__content:nth-child(4){display:block}[data-ready=false] .modal__content:first-child .modal__actions:nth-of-type(2),[data-ready=true] .modal__content:first-child .modal__actions:first-of-type{display:none}[data-ready=true] .modal__content:first-child .modal__actions:nth-of-type(2){display:flex}@media (prefers-color-scheme: dark){:root{--bg: hsl(var(--hue),10%,35%);--fg: hsl(var(--hue),10%,95%)}.modal{background-color:hsl(var(--hue),10%,10%);color:hsl(var(--hue),10%,95%)}.modal__close-button,.modal__progress-value{color:hsl(var(--hue),10%,70%)}.modal__close-button:hover,.modal__close-button:focus-visible{color:hsl(var(--hue),10%,80%)}.modal__file-icon{color:hsl(var(--hue),10%,60%)}.modal__icon--blue g{stroke:#3d71f5}.modal__icon--red g{stroke:#f5463d}.modal__icon--green g{stroke:#3df574}.modal__progress-fill{background-color:hsl(var(--hue),10%,20%)}}@keyframes fadeSlideIn{0%{opacity:0;transform:translateY(33%)}to{opacity:1;transform:translateY(0)}}@keyframes sdo{to{stroke-dashoffset:0}}@media (min-width: 768px){.modal__actions--center{justify-content:center;margin-left:-4.125em}.modal__body{flex-direction:row;align-items:center}.modal__button{width:auto}.modal__button+.modal__button{margin-top:0;margin-left:1.5rem}.modal__file~.modal__button{margin-top:0}.modal__file~.modal__close-button{margin-right:1.5rem}.modal__progress{margin-right:2em}.modal__progress+.modal__button{margin-top:0}.modal__col+.modal__col{margin-top:0;margin-left:1.875em}.modal__title{text-align:left}}
