*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--color-bg:#faf8f5;--color-surface:#f0ede8;--color-border:#ddd8cf;--color-text:#3d3833;--color-text-dimmed:#8a8279;--color-accent:#0d9488;--color-accent-light:#0d948814;--color-accent-border:#0d948866;--radius:8px;--transition:.2s ease}body{background-color:var(--color-bg);color:var(--color-text);min-height:100vh;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;line-height:1.6}.container{flex-direction:column;gap:24px;max-width:700px;margin:0 auto;padding:48px 24px 32px;display:flex}header{text-align:center}header h1{color:var(--color-accent);font-size:2rem;font-weight:700;line-height:1.2}.caption{color:var(--color-text-dimmed);font-size:.95rem}main{flex-direction:column;gap:16px;display:flex}.dropzone{border:2px dashed var(--color-border);border-radius:var(--radius);cursor:pointer;transition:transform var(--transition), border-color var(--transition), background-color var(--transition);position:relative}.dropzone:hover{border-color:var(--color-accent-border);background-color:var(--color-accent-light)}.dropzone.drag-over{border-color:var(--color-accent);background-color:var(--color-accent-light);transform:scale(1.02)}.dropzone-initial:not([hidden]){pointer-events:none;flex-direction:column;justify-content:center;align-items:center;gap:12px;min-height:152px;padding:16px 24px;display:flex}.dropzone-icon{width:48px;height:48px;color:var(--color-text-dimmed)}.dropzone-initial p{color:var(--color-text-dimmed)}.dropzone-preview:not([hidden]){pointer-events:none;align-items:center;gap:16px;padding:16px;display:flex}.preview-thumb{object-fit:cover;border-radius:var(--radius);flex-shrink:0;width:120px;height:120px}.preview-filename{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;font-weight:500;overflow:hidden}.clear-btn{pointer-events:auto;border:1px solid var(--color-border);border-radius:var(--radius);color:var(--color-text-dimmed);cursor:pointer;width:32px;height:32px;transition:color var(--transition), border-color var(--transition);background:0 0;flex-shrink:0;justify-content:center;align-items:center;font-size:1.25rem;line-height:1;display:flex}.clear-btn:hover{color:var(--color-text);border-color:var(--color-text-dimmed)}.result{background-color:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius);padding:16px;overflow:auto}.result-text{white-space:pre-wrap;word-break:break-word;color:var(--color-text);margin:0;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;font-size:.85rem;line-height:1.7}footer{text-align:center;border-top:1px solid var(--color-border);padding-top:24px}footer p{color:var(--color-text-dimmed);margin:0;font-size:.85rem}footer p+p{margin-top:4px}footer a{color:var(--color-accent);text-decoration:none}footer a:hover{text-decoration:underline}.version{opacity:.6}.github-corner{z-index:100;color:#fff;display:block;position:fixed;top:0;right:0}.github-corner svg{fill:var(--color-accent);color:var(--color-bg);width:80px;height:80px;transition:fill var(--transition)}.github-corner:hover svg{fill:#0f766e}.github-corner-arm{transform-origin:130px 106px}.github-corner:hover .github-corner-arm{animation:.56s ease-in-out wave}@keyframes wave{0%,to{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (width<=600px){.container{padding:32px 16px 24px}header h1{font-size:1.5rem}.github-corner svg{width:60px;height:60px}.dropzone-initial{padding:32px 16px}}
