:root{--paper:#f4f2ee;--card:#fff;--ink:#1b1a18;--muted:#6d6a63;--line:#e2ded6;--accent:#1d4ed8;--accent-ink:#fff;--danger:#b42318;--ok:#15803d;--radius:14px;--shadow:0 1px 2px #14120e0f, 0 8px 24px #14120e0f}@media (prefers-color-scheme:dark){:root{--paper:#17171a;--card:#202024;--ink:#f2f0ec;--muted:#a09c95;--line:#33323a;--accent:#6d93ff;--accent-ink:#10121a;--danger:#ff8f83;--ok:#6ee7a8;--shadow:0 1px 2px #0006, 0 8px 24px #00000059}}*{box-sizing:border-box}[hidden]{display:none!important}html,body{margin:0;padding:0}body{background:var(--paper);color:var(--ink);-webkit-text-size-adjust:100%;flex-direction:column;min-height:100dvh;font:16px/1.55 system-ui,-apple-system,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;display:flex}body.dragging:after{content:"";border:3px dashed var(--accent);pointer-events:none;z-index:10;border-radius:20px;position:fixed;inset:8px}.topbar{justify-content:space-between;align-items:center;gap:12px;width:100%;max-width:1100px;margin:0 auto;padding:18px clamp(16px,4vw,32px) 6px;display:flex}.brand{align-items:center;gap:12px;min-width:0;display:flex}.logo{fill:none;width:38px;height:38px;stroke:var(--ink);stroke-width:1.8px;stroke-linejoin:round;stroke-linecap:round;flex:none}.logo .fold{stroke:var(--accent)}.logo .rule{stroke:var(--muted);stroke-width:1.6px}h1{letter-spacing:-.01em;margin:0;font-size:19px}.topbar p{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;margin:1px 0 0;font-size:13px;overflow:hidden}main{flex-direction:column;flex:1;gap:16px;width:100%;max-width:1100px;margin:0 auto;padding:10px clamp(16px,4vw,32px) 32px;display:flex}.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);padding:clamp(18px,3vw,28px)}.footer{text-align:center;color:var(--muted);padding:0 16px 28px;font-size:12.5px}.drop{text-align:center;cursor:pointer;border-style:dashed;border-width:2px;padding:clamp(32px,7vw,64px) clamp(18px,4vw,28px);transition:border-color .15s,transform .15s}.drop:hover,.drop:focus-visible{border-color:var(--accent);outline:none}.drop:active{transform:scale(.995)}.drop-icon{fill:none;width:46px;height:46px;stroke:var(--accent);stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;margin-bottom:8px}.drop h2{margin:0 0 4px;font-size:21px}.muted{color:var(--muted);margin:0;font-size:14.5px}.privacy{color:var(--muted);margin:18px 0 0;font-size:12.5px}.primary,.secondary,.ghost{font:inherit;cursor:pointer;border:1px solid #0000;border-radius:10px;justify-content:center;align-items:center;padding:11px 20px;text-decoration:none;transition:filter .12s,background .12s;display:inline-flex}.primary{background:var(--accent);color:var(--accent-ink);margin-top:16px;font-weight:600}.primary:hover{filter:brightness(1.07)}.secondary{color:var(--ink);border-color:var(--line);background:0 0}.secondary:hover{border-color:var(--accent);color:var(--accent)}.ghost{color:var(--muted);background:0 0}.ghost:hover{color:var(--ink)}.small{border:1px solid var(--line);border-radius:8px;padding:6px 12px;font-size:13px}.working{justify-content:center;align-items:center;gap:16px;min-height:120px;display:flex}.spinner{border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;flex:none;width:26px;height:26px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.spinner{animation-duration:2.4s}}.compare{grid-template-columns:1fr 1fr;gap:16px;display:grid}@media (max-width:720px){.compare{grid-template-columns:1fr}}.compare figure{min-width:0;margin:0}.compare figcaption{letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;font-size:12.5px;font-weight:600}.frame{border:1px solid var(--line);background:color-mix(in srgb, var(--ink) 6%, var(--card));border-radius:10px;width:-moz-fit-content;width:fit-content;max-width:100%;min-height:120px;margin:0 auto;line-height:0;position:relative;overflow:hidden}.frame img{width:auto;max-width:100%;height:auto;max-height:68vh;display:block}.corners{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;display:flex}.corners .field-label{margin:0}.frame canvas{touch-action:none;cursor:crosshair;width:100%;height:100%;position:absolute;inset:0}.frame canvas.grabbing{cursor:grabbing}.toggle{color:var(--muted);cursor:pointer;align-items:center;gap:8px;margin-top:14px;font-size:14px;display:inline-flex}.orientation{border-top:1px solid var(--line);margin-top:18px;padding-top:14px}.orient-hint{color:var(--muted);margin:0 0 8px;font-size:13px}.orient-choices{flex-wrap:wrap;gap:10px;display:flex}.orient-option{border:2px solid var(--line);background:color-mix(in srgb, var(--ink) 6%, var(--card));cursor:pointer;border-radius:10px;padding:0;line-height:0;transition:border-color .12s,transform .12s;overflow:hidden}.orient-option:hover{transform:translateY(-1px)}.orient-option[aria-checked=true]{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent)}.orient-option img{object-fit:contain;background:#fff;width:78px;height:78px;display:block}@media (prefers-color-scheme:dark){.orient-option img{background:#2a2a30}}.stats{border-top:1px solid var(--line);grid-template-columns:auto 1fr auto 1fr;gap:6px 14px;margin:16px 0 0;padding:14px 0 0;font-size:14px;display:grid}@media (max-width:620px){.stats{grid-template-columns:auto 1fr}}.stats dt{color:var(--muted)}.stats dd{font-variant-numeric:tabular-nums;margin:0}.actions{flex-wrap:wrap;align-items:center;gap:10px;margin-top:18px;display:flex}.actions .primary{margin-top:0}.advanced{border-top:1px solid var(--line);margin-top:20px;padding-top:14px}.advanced summary{cursor:pointer;color:var(--muted);font-size:14px;list-style:none}.advanced summary::-webkit-details-marker{display:none}.advanced summary:before{content:"▸ "}.advanced[open] summary:before{content:"▾ "}.field{margin-top:14px}.field-label{color:var(--muted);margin-bottom:6px;font-size:13px;display:block}.choices{flex-wrap:wrap;gap:8px;display:flex}.choices label{border:1px solid var(--line);cursor:pointer;border-radius:9px;align-items:center;gap:7px;padding:8px 12px;font-size:13.5px;display:inline-flex}.choices label:has(input:checked){border-color:var(--accent);color:var(--accent)}.choices input{accent-color:var(--accent);margin:0}.error{border-color:color-mix(in srgb, var(--danger) 40%, var(--line));text-align:center;padding:clamp(24px,5vw,40px)}.error p{color:var(--ink);margin:0}