:root{--color-bg: oklch(1 0 0);--color-surface: oklch(.965 .004 160);--color-ink: oklch(.19 .018 160);--color-muted: oklch(.43 .018 160);--color-border: oklch(.87 .008 160);--color-primary: oklch(.52 .13 160);--color-primary-hover: oklch(.46 .13 160);--color-accent: oklch(.34 .1 245);--color-danger: oklch(.53 .18 27);--color-success-surface: oklch(.95 .035 160);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--color-ink);background:var(--color-bg);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px}button,input,textarea{font:inherit}button,a{touch-action:manipulation}a{color:inherit;text-underline-offset:.2em}header,main,footer{width:min(1120px,calc(100% - 40px));margin-inline:auto}header{height:68px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-border);font-size:14px}header>a:last-child{color:var(--color-muted)}.brand{text-decoration:none;font-weight:750;font-size:16px}.brand span{color:var(--color-primary);margin-right:5px}.intro{padding:54px 0 30px;max-width:760px}.promise{font-size:14px;font-weight:700;color:var(--color-primary);margin:0 0 15px}.intro h1{font-size:clamp(2rem,5vw,3.6rem);letter-spacing:-.035em;line-height:1.02;text-wrap:balance;margin:0 0 18px}.intro>p:last-child{font-size:18px;line-height:1.55;color:var(--color-muted);max-width:62ch;margin:0}.converter{background:var(--color-surface);padding:20px;border-radius:14px}.drop{position:relative;min-height:230px;border:1px dashed oklch(.68 .02 160);border-radius:10px;display:grid;place-items:center;text-align:center;transition:background-color .18s ease-out,border-color .18s ease-out}.drop:hover,.drop[data-dragging=true]{background:var(--color-success-surface);border-color:var(--color-primary)}.drop:focus-within{outline:3px solid oklch(.72 .12 160/.45);outline-offset:3px}.drop input{position:absolute;inset:0;opacity:0;cursor:pointer}.drop label{pointer-events:none}.drop-title{display:block;font-size:24px;font-weight:750;margin-bottom:8px}.drop-copy{color:var(--color-muted)}.drop-copy strong{color:var(--color-primary)}.selection{margin-top:14px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--color-border);padding:5px 3px 15px}.selection[hidden],.error[hidden],.result[hidden]{display:none}.selection span{display:block;color:var(--color-muted);font-size:14px;margin-top:3px}.primary,.secondary,.text-button{min-height:44px;border-radius:7px;padding:0 18px;font-weight:700;cursor:pointer}.primary{color:#f8f8f8;background:var(--color-primary);border:0;margin-top:16px}.primary:hover{background:var(--color-primary-hover)}.primary:disabled{opacity:.5;cursor:not-allowed}.secondary{border:1px solid var(--color-border);background:var(--color-bg);color:var(--color-ink)}.secondary:hover{border-color:var(--color-muted)}.text-button{border:0;background:transparent;text-decoration:underline}.error{background:oklch(.96 .025 27);color:#720309;padding:15px;border-radius:8px;margin-top:14px}.error p{margin:4px 0}.error code{font-size:12px}.result{margin-top:0}.result-head{display:flex;align-items:center;justify-content:space-between}.result h2{font-size:20px}.result-head span{font-size:14px;color:var(--color-muted)}textarea{display:block;width:100%;min-height:360px;padding:16px;resize:vertical;color:var(--color-ink);background:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;line-height:1.55}.actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.details,.api{display:grid;grid-template-columns:1fr 1fr;gap:72px;padding:72px 0;border-bottom:1px solid var(--color-border)}h2{font-size:20px;margin:0 0 16px}.details p,.api p{line-height:1.6;color:var(--color-muted)}.details strong{display:inline-block;color:var(--color-ink);min-width:108px}.api nav{display:flex;gap:20px;font-weight:700;font-size:14px}.api pre{margin:0;overflow:auto;padding:20px;background:var(--color-ink);color:#cfeddc;border-radius:9px;font-size:13px;line-height:1.7}footer{min-height:110px;display:flex;align-items:center;justify-content:space-between;color:var(--color-muted);font-size:14px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:focus-visible{outline:3px solid oklch(.66 .13 160/.55);outline-offset:3px}@media(max-width:700px){header,main,footer{width:min(100% - 28px,1120px)}.intro{padding-top:38px}.intro>p:last-child{font-size:16px}.converter{padding:12px}.drop{min-height:190px}.details,.api{grid-template-columns:1fr;gap:30px;padding:48px 0}.api nav{flex-direction:column;gap:9px}.actions{align-items:stretch}.actions button{width:100%}footer{align-items:flex-start;justify-content:center;flex-direction:column;gap:8px}.details strong{display:block}.selection{align-items:flex-start;gap:10px}.selection strong{overflow-wrap:anywhere}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important}}
