:root{--border-radius:6px;--content-padding:12px;--accent-color:#f9971f;--border-color:#fbba6a;--box-color:#fef3e6;--font-color:#393128;--danger-color:#d94141;--primary-color:#41d95b;--secondary-color:#417ed9}@font-face{font-family:Nerd Icons;src:url(/fonts/NerdIcons.woff2)format("woff2")}@font-face{font-family:DM Sans;src:url(/fonts/DMSans/DMSans-Light.woff2)format("woff2");font-weight:300}@font-face{font-family:DM Sans;src:url(/fonts/DMSans/DMSans-Medium.woff2)format("woff2");font-weight:500}@font-face{font-family:DM Sans;src:url(/fonts/DMSans/DMSans-Bold.woff2)format("woff2");font-weight:700}@font-face{font-family:DM Sans;src:url(/fonts/DMSans/DMSans-Black.woff2)format("woff2");font-weight:900}body{background-color:#f2f2f2;flex-direction:column;min-height:100dvh;margin:0;font-family:DM Sans,Nerd Icons,sans-serif;font-size:1rem;font-weight:500;display:flex}.navbar{z-index:1000;background-color:#fff;height:64px;padding:0 24px;position:sticky;top:0;box-shadow:0 0 20px #00000040}.navbar li:first-child{justify-self:start}.navbar li:nth-child(2){justify-self:center}.navbar li:nth-child(3){justify-self:end}.navbar ul{grid-template-columns:1fr auto 1fr;align-items:center;height:100%;margin:0;padding:0;list-style-type:none;display:grid}.navbar img{width:auto;max-height:40px;display:block}.navbar a{color:#000;text-decoration:none;transition:opacity .25s}.nav-label-short{display:none}@media (width<=600px){.nav-label-full{display:none}.nav-label-short{font-size:1.5rem;display:inline}}.navbar a:hover{opacity:.7}.navbar a:active,.navbar a:focus-visible{opacity:.5}footer{box-sizing:border-box;flex:0 0 64px;align-items:center;height:64px;padding:0 24px;display:grid}footer p{color:color-mix(in srgb, var(--font-color) 60%, transparent)}footer a{color:var(--font-color);opacity:.6;transition:opacity .25s}footer a:hover{opacity:1}main{flex:1 0 auto;width:40%;min-width:min(864px,100% - 80px);max-width:1152px;margin:0 auto;padding:0 40px}main h1{text-align:center;color:var(--font-color);margin-top:48px;margin-bottom:8px;font-size:clamp(1.25rem,5vw,3rem);font-weight:900}main h3{text-align:center;color:var(--font-color);margin:0}p{text-align:center;font-size:clamp(.8rem,2vw,1rem)}main p{margin-top:6px;margin-bottom:var(--content-padding);color:var(--font-color)}#tool-description{margin-top:0;margin-bottom:48px}.steps{box-sizing:border-box;background-color:var(--box-color);border-radius:var(--border-radius);border:2px solid var(--border-color);width:100%;height:auto;transition:height .45s,box-shadow .25s;position:relative;overflow:hidden}.steps.is-upload-step{border-style:dashed}.steps.is-upload-step:has(#drop-zone.dragover){border-style:solid;border-color:var(--border-color);box-shadow:0 0 16px var(--accent-color)}.step{box-sizing:border-box;opacity:0;visibility:hidden;pointer-events:none;width:100%;min-height:0;transition:opacity .25s,visibility 0s linear .45s;position:absolute;inset:0 0 auto}.step.is-active{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .25s .15s,visibility linear;position:relative;inset:auto}.step>div{box-sizing:border-box;width:100%;min-height:0;padding:var(--content-padding);flex-direction:column;justify-content:center;align-items:center;display:flex;overflow:hidden}main img{margin:var(--content-padding) auto;object-fit:contain;border-radius:var(--border-radius);flex:auto;max-width:80%;min-height:0;display:block}main canvas{margin:var(--content-padding);border-radius:var(--border-radius);touch-action:pinch-zoom;-webkit-user-select:none;user-select:none;width:80%;height:auto}.button-container{border:0;justify-content:center;align-items:center;width:100%;margin:0;padding:0;display:flex}button{color:#fff;border-radius:var(--border-radius);border:none;font-family:DM Sans,Nerd Icons,sans-serif;font-size:clamp(.8rem,2vw,1rem);transition:opacity .25s}button:hover{opacity:.7;cursor:pointer}button:active{opacity:.5}button.primary,button.secondary,button.danger{aspect-ratio:3.75;width:max(15%,96px);margin:0 8px}button.primary{background-color:var(--primary-color)}button.secondary{background-color:var(--secondary-color)}button.danger{background-color:var(--danger-color)}button.decrease,button.increase{aspect-ratio:1;width:max(4%,25.6px)}button.decrease{background-color:var(--danger-color);margin-left:2%;margin-right:1%}button.increase{background-color:var(--primary-color);margin-left:1%;margin-right:2%}div.upload{aspect-ratio:2.88;box-sizing:border-box;min-height:240px}#drop-zone{border:0;transition:box-shadow .25s;display:flex}#drop-zone.dragover{border:0}#drop-zone:hover{cursor:pointer}#drag-info{opacity:.5;margin-top:6px;margin-bottom:0;font-size:.8rem}#upload-status{color:var(--danger-color);margin-top:0;margin-bottom:var(--content-padding)}#upload-status:empty{display:none}#upload-select-button{box-shadow:0 0 8px var(--accent-color);background-color:var(--accent-color);aspect-ratio:5;height:clamp(38px,8vw,45px);margin-top:6px}#preview-select-canvas,#preview-complete-canvas{margin-top:0}