*{box-sizing:border-box}html{color-scheme:light}body{margin:0;background:#fff;color:#111;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}.app{width:min(900px,calc(100% - 32px));margin:0 auto;padding:36px 0 48px}.modes{display:flex;width:220px;margin:0 auto 28px;padding:3px;background:#f1f1f1;border-radius:10px}.mode{flex:1;height:36px;border:0;border-radius:8px;background:transparent;color:#777;font:inherit;font-weight:650;cursor:pointer}.mode.active{background:#fff;color:#111;box-shadow:0 1px 4px rgba(0,0,0,.12)}h1{margin:0 0 28px;text-align:center;font-size:clamp(32px,6vw,52px);line-height:1;letter-spacing:-.045em}.drop-zone{height:150px;border:1px dashed #bbb;border-radius:12px;display:grid;place-items:center;background:#fafafa;cursor:pointer;font-size:15px;font-weight:650}.drop-zone.dragging{background:#f2f2f2;border-color:#777}.workspace{margin-top:12px}.preview{position:relative;overflow:hidden;border-radius:12px;background:#eee;line-height:0}.preview canvas{display:block;width:100%;height:auto}.after{position:absolute;inset:0;clip-path:inset(0 0 0 50%)}.split{position:absolute;top:0;bottom:0;left:50%;width:2px;background:#fff;box-shadow:0 0 0 1px rgba(0,0,0,.18);pointer-events:none}.slider{width:100%;margin:14px 0 12px;accent-color:#111}.bulk-preview{display:flex;gap:8px;overflow-x:auto;margin:0 0 10px;padding:2px 2px 8px;scrollbar-width:thin}.bulk-item{flex:0 0 110px;height:82px;border:2px solid transparent;border-radius:9px;overflow:hidden;background:#eee;cursor:pointer;outline:none}.bulk-item.selected{border-color:#111}.bulk-item:focus-visible{border-color:#777}.bulk-item canvas{display:block;width:100%;height:100%;object-fit:cover}.download{width:100%;height:48px;border:0;border-radius:10px;background:#111;color:#fff;font:inherit;font-weight:700;cursor:pointer}.download:disabled{opacity:.45;cursor:default}.settings{margin-top:42px;padding-top:18px;border-top:1px solid #eee}.metadata-row{display:grid;grid-template-columns:1fr 1.35fr 1fr 1fr;gap:8px}.location-row{display:grid;grid-template-columns:1.7fr .8fr .8fr;gap:8px;margin-top:8px}.settings input,.settings select{width:100%;height:42px;border:1px solid #ddd;border-radius:9px;background:#fff;padding:0 11px;color:#111;font:inherit;font-size:13px;outline:none}.settings input:focus,.settings select:focus{border-color:#999}.hidden{display:none!important}@media(max-width:700px){.app{padding-top:24px}.drop-zone{height:120px}.metadata-row{grid-template-columns:1fr 1fr}.location-row{grid-template-columns:1fr 1fr}.location-row>*:first-child{grid-column:1/-1}}@media(max-width:460px){.modes{width:100%;max-width:220px}.metadata-row,.location-row{grid-template-columns:1fr}.location-row>*:first-child{grid-column:auto}.bulk-item{flex-basis:92px;height:70px}}