<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>This link has a password</title>
<style>
:root { color-scheme: dark; }
body { margin: 0; min-height: 100vh; display: grid; place-items: center;
background: #14121f; color: #f4efe6; font: 16px/1.5 ui-monospace, Menlo, monospace; }
form { width: min(22rem, calc(100vw - 32px)); display: grid; gap: 12px; text-align: center; }
pre { margin: 0; font-size: clamp(18px, 5vw, 24px); color: #ffb86b; }
h1 { font-size: clamp(20px, 5vw, 26px); margin: 0; color: #ff79c6; }
p { margin: 0; color: #b9b3c9; }
input, button { font: inherit; font-size: 17px; padding: 12px 14px; border-radius: 10px; }
input { border: 1px solid #6f6a80; background: #1e1b2e; color: #f4efe6; text-align: center; }
button { border: 0; background: #ff79c6; color: #14121f; font-weight: 700; }
.error { color: #ffb86b; }
.error:empty { display: none; }
small { color: #6f6a80; }
</style>
</head>
<body>
<form method="post" action="/_bunflared/password">
<pre>
(\(\
( -.-) 🔒
o_(")(")
</pre>
<h1>This link has a password</h1>
<p>Ask the person who sent it.</p>
<input type="password" name="password" autocomplete="current-password"
autocapitalize="off" autocorrect="off" spellcheck="false"
aria-label="Password" placeholder="password" required autofocus>
<input type="hidden" name="next" value="{next}">
<p class="error" role="alert">{error}</p>
<button type="submit">Open</button>
<small>shared with bunflared</small>
</form>
</body>
</html>