<!-- 本DIY代码来自于 https://diy.zhongzhipian.top -->
<!-- 本DIY代码来自于 https://diy.zhongzhipian.top -->
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>量子密匙验证</title>
<style>
:root {
--neon-blue: #00f3ff;
--cyber-purple: #bc13fe;
--deep-space: #0a0a1f;
}
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Segoe UI', system-ui, sans-serif;
}
body {
background: radial-gradient(circle at center, #001233, #000716);
min-height: 100vh;
display: flex;
justify-content: center;
align-items: center;
color: var(--neon-blue);
}
.cyber-container {
position: relative;
width: 90%;
max-width: 600px;
padding: 2rem;
background: rgba(0, 18, 51, 0.95);
border: 2px solid var(--neon-blue);
border-radius: 12px;
box-shadow: 0 0 30px rgba(0, 243, 255, 0.2);
backdrop-filter: blur(10px);
}
.holographic-header {
text-align: center;
margin-bottom: 2rem;
position: relative;
}
.holographic-header h1 {
font-size: 2rem;
text-transform: uppercase;
letter-spacing: 2px;
background: linear-gradient(45deg, var(--neon-blue), var(--cyber-purple));
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
animation: hologram 2s infinite alternate;
}
.quantum-input-group {
position: relative;
margin: 2rem 0;
}
.quantum-input {
width: 100%;
padding: 1rem;
background: rgba(255, 255, 255, 0.05);
border: 1px solid var(--neon-blue);
border-radius: 6px;
color: var(--neon-blue);
font-size: 1.1rem;
transition: all 0.3s ease;
padding-right: 120px;
}
.quantum-input:focus {
outline: none;
box-shadow: 0 0 15px var(--neon-blue);
}
.cyber-button {
position: absolute;
right: 5px;
top: 50%;
transform: translateY(-50%);
background: linear-gradient(45deg, var(--neon-blue), var(--cyber-purple));
border: none;
padding: 0.8rem 1.5rem;
color: #000;
font-weight: bold;
border-radius: 4px;
cursor: pointer;
transition: all 0.3s ease;
}
.cyber-button:hover {
box-shadow: 0 0 15px rgba(0, 243, 255, 0.5);
}
.cyber-console {
margin-top: 2rem;
padding: 1.5rem;
background: rgba(0, 0, 0, 0.3);
border: 1px solid var(--neon-blue);
border-radius: 6px;
min-height: 100px;
position: relative;
overflow: hidden;
}
.console-text {
font-family: 'Courier New', monospace;
line-height: 1.6;
color: var(--neon-blue);
}
.cyber-controls {
margin-top: 2rem;
display: flex;
justify-content: center;
gap: 1.5rem;
}
.control-button {
background: transparent;
border: 1px solid var(--neon-blue);
color: var(--neon-blue);
padding: 0.8rem 1.5rem;
border-radius: 4px;
cursor: pointer;
transition: all 0.3s ease;
}
.control-button:hover {
background: rgba(0, 243, 255, 0.1);
}
@keyframes hologram {
from { text-shadow: 0 0 10px var(--neon-blue); }
to { text-shadow: 0 0 20px var(--cyber-purple); }
}
</style>
</head>
<body>
<div class="cyber-container">
<div class="holographic-header">
<h1 id="title"></h1>
</div>
<div class="quantum-input-group">
<input type="text"
class="quantum-input"
id="code"
placeholder="输入量子密匙"
pattern="^[a-zA-Z0-9_-]{1,16}$">
<button class="cyber-button"
ontouchstart="mStart(this)"
ontouchend="mUp(this)"
onclick="Call_Verify(code.value)">
验证密匙
</button>
</div>
<div class="cyber-console">
<div class="console-text" id="notice"></div>
</div>
<div class="cyber-controls">
<button class="control-button"
id="Query_Trial"
ontouchstart="tStart(this)"
ontouchend="tUp(this)"
onclick="Call_Query_Trial(code.value)">
量子查码
</button>
<button class="control-button"
id="Pay"
ontouchstart="tStart(this)"
ontouchend="tUp(this)"
onclick="Call_Pay()">
获取密匙
</button>
</div>
</div>
<script>
// 保留原始功能逻辑
function Call_Verify(n) {
PanGolin.Verify(n)
}
function Call_Query_Trial(n) {
PanGolin.Is_Trial() ? PanGolin.Trial() : PanGolin.Query(n)
}
function Call_Pay() {
PanGolin.Pay()
}
function mStart(n) {
n.style.background = "linear-gradient(45deg, #075aa3, #003366)"
}
function mUp(n) {
n.style.background = "linear-gradient(45deg, var(--neon-blue), var(--cyber-purple))"
}
function tStart(n) {
n.style.color = "#00f3ff";
n.style.boxShadow = "0 0 10px rgba(0, 243, 255, 0.5)"
}
function tUp(n) {
n.style.color = "var(--neon-blue)";
n.style.boxShadow = "none"
}
// 初始化
document.getElementById("title").innerHTML = PanGolin.GetTitle();
document.getElementById("notice").innerHTML = PanGolin.GetNotice();
document.getElementById("Query_Trial").innerHTML = PanGolin.Is_Trial() ? "量子试用" : "量子查码";
document.getElementById("Pay").style.display = PanGolin.Is_Pay() ? "block" : "none";
</script>
</body>
</html>
<!-- 本DIY代码来自于 https://diy.zhongzhipian.top -->
<!-- 本DIY代码来自于 https://diy.zhongzhipian.top -->