<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>SVG Viewer</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
display: flex; align-items: center; justify-content: center;
min-height: 100vh; background: #f5f5f5;
padding: 20px;
}
#svg-container {
max-width: 100%; max-height: 90vh;
overflow: auto;
}
#svg-container img { max-width: 100%; height: auto; display: block; }
#error { color: #c00; font-family: sans-serif; text-align: center; }
* { scrollbar-width: thin; scrollbar-color: #414868 #16161e; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-track { background: #16161e; }
*::-webkit-scrollbar-thumb { background: #414868; }
*::-webkit-scrollbar-corner { background: transparent; }
*::-webkit-scrollbar-button { display: none; }
</style>
</head>
<body>
<div id="svg-container"></div>
<script>
const params = new URLSearchParams(location.search);
const url = params.get('url');
if (!url) {
document.getElementById('svg-container').innerHTML = '<div id="error">No URL provided</div>';
} else {
const img = document.createElement('img');
img.src = url;
img.alt = 'SVG';
img.onerror = () => {
document.getElementById('svg-container').innerHTML = '<div id="error">Failed to load SVG</div>';
};
document.getElementById('svg-container').appendChild(img);
}
</script>
</body>
</html>