<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HTML Viewer</title>
<style>
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: #1a1a2e; height: 100vh; }
iframe { width: 100%; height: 100%; border: none; display: block; }
#error {
color: #fff; font-family: sans-serif; text-align: center;
padding: 40px;
}
* { 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>
<script>
const params = new URLSearchParams(location.search);
const url = params.get('url');
if (!url) {
document.body.innerHTML = '<div id="error">No URL provided</div>';
} else {
const iframe = document.createElement('iframe');
iframe.src = url;
iframe.sandbox = 'allow-scripts allow-same-origin';
iframe.addEventListener('load', () => {
try {
const style = iframe.contentDocument.createElement('style');
style.textContent = `
* { 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; }
`;
iframe.contentDocument.head.appendChild(style);
} catch {
// Cross-origin content keeps its own scrollbar styling.
}
});
document.body.appendChild(iframe);
}
</script>
</body>
</html>
