{"id":"6KP5RdKTYN","url":"https://pastebin.ca/6KP5RdKTYN","raw_url":"https://raw.anybin.ca/6KP5RdKTYN","visibility":"public","access":"public","created_at":1791380817326,"expires_at":1799156817326,"fetch_limit":null,"fetches_used":0,"reads_remaining":null,"size_bytes":13891,"syntax_hint":"html","title":"hh","filename":"hh","change_note":null,"cipher":null,"cipher_meta":null,"parent_id":null,"root_id":"6KP5RdKTYN","version":1,"owner_id":null,"recipient_id":null,"body":"<!DOCTYPE html>\n<html lang=\"zh-CN\">\n<head>\n<meta charset=\"UTF-8\">\n<meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n<title>超级帅帅帅的恒 国庆快乐</title>\n<style>\n  * { margin: 0; padding: 0; box-sizing: border-box; }\n\n  body {\n    background: linear-gradient(180deg, #0a0a1a 0%, #111133 40%, #1a1a3e 100%);\n    min-height: 100vh;\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    font-family: \"PingFang SC\", \"Microsoft YaHei\", sans-serif;\n    overflow: hidden;\n    color: #fff;\n  }\n\n  /* ===== 画布层 ===== */\n  #starfield, #fireworks {\n    position: fixed; top: 0; left: 0;\n    width: 100%; height: 100%;\n  }\n  #starfield { z-index: 0; }\n  #fireworks { z-index: 1; }\n\n  /* ===== 主内容 ===== */\n  .container {\n    position: relative;\n    z-index: 2;\n    text-align: center;\n    padding: 20px;\n  }\n\n  /* 国旗飘落 */\n  .flag {\n    position: fixed;\n    font-size: 28px;\n    animation: fall linear infinite;\n    z-index: 1;\n    opacity: 0.6;\n    pointer-events: none;\n  }\n  @keyframes fall {\n    0%   { transform: translateY(-60px) rotate(0deg) translateX(0);   opacity: 0.7; }\n    25%  { transform: translateY(25vh) rotate(90deg) translateX(20px); }\n    50%  { transform: translateY(50vh) rotate(180deg) translateX(-15px); }\n    75%  { transform: translateY(75vh) rotate(270deg) translateX(10px); }\n    100% { transform: translateY(110vh) rotate(360deg) translateX(0); opacity: 0; }\n  }\n\n  /* 标题 */\n  .title {\n    font-size: 44px;\n    font-weight: 800;\n    background: linear-gradient(90deg, #ffffff, #cccccc, #ffffff, #cccccc);\n    background-size: 300% auto;\n    -webkit-background-clip: text;\n    -webkit-text-fill-color: transparent;\n    animation: shimmer 3s linear infinite, fadeUp 1.2s 0.5s forwards;\n    opacity: 0;\n    text-shadow: none;\n    filter: drop-shadow(0 0 20px rgba(255, 217, 61, 0.3));\n  }\n  @keyframes shimmer {\n    to { background-position: 300% center; }\n  }\n  @keyframes fadeUp {\n    from { opacity: 0; transform: translateY(30px); }\n    to   { opacity: 1; transform: translateY(0); }\n  }\n\n  /* 副标题 */\n  .subtitle {\n    font-size: 16px;\n    color: rgba(255,255,255,0.5);\n    margin-top: 8px;\n    opacity: 0;\n    animation: fadeUp 1s 1.5s forwards;\n    letter-spacing: 4px;\n  }\n\n  /* 打字机 */\n  .typewriter {\n    font-size: 17px;\n    line-height: 2.2;\n    min-height: 140px;\n    margin: 24px auto;\n    max-width: 440px;\n    text-align: left;\n    white-space: pre-wrap;\n  }\n  .cursor {\n    display: inline-block;\n    width: 2px;\n    height: 1em;\n    background: #ffd93d;\n    animation: blink 0.6s step-end infinite;\n    vertical-align: text-bottom;\n  }\n  @keyframes blink {\n    50% { opacity: 0; }\n  }\n\n  /* 隐藏按钮 - 脉冲光晕 */\n  .secret-btn {\n    margin-top: 28px;\n    padding: 14px 36px;\n    border: 2px solid #ffd93d;\n    background: transparent;\n    color: #ffd93d;\n    font-size: 16px;\n    border-radius: 30px;\n    cursor: pointer;\n    opacity: 0;\n    animation: fadeUp 1s 8s forwards, pulse 2s 9s ease-in-out infinite;\n    transition: all 0.4s;\n    position: relative;\n    overflow: visible;\n  }\n  .secret-btn::before {\n    content: '';\n    position: absolute;\n    top: -4px; left: -4px; right: -4px; bottom: -4px;\n    border-radius: 34px;\n    border: 2px solid rgba(255, 217, 61, 0.3);\n    animation: pulseRing 2s ease-in-out infinite;\n  }\n  @keyframes pulse {\n    0%, 100% { box-shadow: 0 0 0 0 rgba(255, 217, 61, 0.4); }\n    50%      { box-shadow: 0 0 20px 8px rgba(255, 217, 61, 0.2); }\n  }\n  @keyframes pulseRing {\n    0%, 100% { transform: scale(1); opacity: 1; }\n    50%      { transform: scale(1.08); opacity: 0; }\n  }\n  .secret-btn:hover {\n    background: #ffd93d;\n    color: #1a1a3e;\n    transform: scale(1.08);\n    box-shadow: 0 0 30px rgba(255, 217, 61, 0.6);\n  }\n\n  /* 隐藏心意 */\n  .heart-reveal {\n    margin-top: 24px;\n    font-size: 20px;\n    color: #ff9a9a;\n    opacity: 0;\n    transform: translateY(20px);\n    transition: all 1.5s ease;\n  }\n  .heart-reveal.show {\n    opacity: 1;\n    transform: translateY(0);\n  }\n  .heart-reveal .heart {\n    display: inline-block;\n    animation: heartbeat 1s ease-in-out infinite;\n    font-size: 28px;\n  }\n  @keyframes heartbeat {\n    0%, 100% { transform: scale(1); }\n    15%      { transform: scale(1.3); }\n    30%      { transform: scale(1); }\n    45%      { transform: scale(1.2); }\n    60%      { transform: scale(1); }\n  }\n\n  /* 底部 */\n  .footer {\n    position: fixed;\n    bottom: 16px;\n    font-size: 12px;\n    color: rgba(255,255,255,0.25);\n    z-index: 2;\n    letter-spacing: 2px;\n  }\n</style>\n</head>\n<body>\n\n<canvas id=\"starfield\"></canvas>\n<canvas id=\"fireworks\"></canvas>\n<div class=\"container\">\n  <div class=\"title\">帅恒 国庆快乐</div>\n  <div class=\"subtitle\">— 2026 · 一份悄悄的祝福 —</div>\n  <div class=\"typewriter\" id=\"typewriter\"><span class=\"cursor\"></span></div>\n  <button class=\"secret-btn\" id=\"secretBtn\" onclick=\"revealHeart()\">\n    ✨ 点我领取隐藏祝福\n  </button>\n  <div class=\"heart-reveal\" id=\"heartReveal\">\n    <span class=\"heart\">🎆</span><br>\n    其实……<br>\n    这个假期最想见的人是你，<br>\n    在这人来人往的世界里，每个人都有自己的节奏与底色，<br>\n    每个人都有独属于自己的光芒，<br>\n    而你那份恰好照射到我，<br>\n    温暖且让人依赖。<br>\n    你们河南竞争大，你不要有太大的压力<br>\n    尽力就好，开心最重要！<br>\n    提前祝你高考取得一个令你满意的成绩。<br>\n    愿你往后的日子里少些烦恼与疲惫<br>\n    多几分欢喜与安然<br><br>\n    <small style=\"color:rgba(255,255,255,0.45);font-size:14px;\">\n      （加油！相信自己！）\n    </small>\n  </div>\n</div>\n<div class=\"footer\">2026.10.01</div>\n\n<script>\n// ========== 1. 星空背景 ==========\nconst starCanvas = document.getElementById('starfield');\nconst sCtx = starCanvas.getContext('2d');\nstarCanvas.width = window.innerWidth;\nstarCanvas.height = window.innerHeight;\nwindow.addEventListener('resize', () => {\n  starCanvas.width = window.innerWidth;\n  starCanvas.height = window.innerHeight;\n  initStars();\n});\n\nclass Star {\n  constructor() {\n    this.reset();\n  }\n  reset() {\n    this.x = Math.random() * starCanvas.width;\n    this.y = Math.random() * starCanvas.height * 0.85;\n    this.size = Math.random() * 2;\n    this.alpha = Math.random();\n    this.speed = 0.005 + Math.random() * 0.015;\n    this.direction = Math.random() > 0.5 ? 1 : -1;\n  }\n  update() {\n    this.alpha += this.speed * this.direction;\n    if (this.alpha >= 1) { this.alpha = 1; this.direction = -1; }\n    if (this.alpha <= 0.1) { this.alpha = 0.1; this.direction = 1; }\n  }\n  draw() {\n    sCtx.beginPath();\n    sCtx.arc(this.x, this.y, this.size, 0, Math.PI * 2);\n    sCtx.fillStyle = `rgba(255, 255, 255, ${this.alpha})`;\n    sCtx.fill();\n  }\n}\n\nlet stars = [];\nfunction initStars() {\n  stars = [];\n  const count = Math.min(200, Math.floor(starCanvas.width * starCanvas.height / 5000));\n  for (let i = 0; i < count; i++) stars.push(new Star());\n}\ninitStars();\n\n// ========== 2. 流星 ==========\nclass ShootingStar {\n  constructor() { this.reset(); }\n  reset() {\n    this.x = Math.random() * starCanvas.width;\n    this.y = Math.random() * starCanvas.height * 0.4;\n    this.len = 60 + Math.random() * 80;\n    this.speed = 6 + Math.random() * 6;\n    this.angle = Math.PI / 5 + Math.random() * 0.3;\n    this.alpha = 1;\n    this.decay = 0.01 + Math.random() * 0.015;\n    this.active = false;\n  }\n  launch() {\n    this.reset();\n    this.active = true;\n  }\n  update() {\n    if (!this.active) return;\n    this.x += Math.cos(this.angle) * this.speed;\n    this.y += Math.sin(this.angle) * this.speed;\n    this.alpha -= this.decay;\n    if (this.alpha <= 0) this.active = false;\n  }\n  draw() {\n    if (!this.active) return;\n    const tailX = this.x - Math.cos(this.angle) * this.len;\n    const tailY = this.y - Math.sin(this.angle) * this.len;\n    const grad = sCtx.createLinearGradient(this.x, this.y, tailX, tailY);\n    grad.addColorStop(0, `rgba(255, 255, 255, ${this.alpha})`);\n    grad.addColorStop(1, `rgba(255, 255, 255, 0)`);\n    sCtx.beginPath();\n    sCtx.moveTo(this.x, this.y);\n    sCtx.lineTo(tailX, tailY);\n    sCtx.strokeStyle = grad;\n    sCtx.lineWidth = 1.5;\n    sCtx.stroke();\n  }\n}\n\nconst shootingStars = [new ShootingStar(), new ShootingStar()];\nsetInterval(() => {\n  const idle = shootingStars.find(s => !s.active);\n  if (idle) idle.launch();\n}, 3000 + Math.random() * 4000);\n\n// ========== 3. 国旗飘落 ==========\nfunction createFlag() {\n  const flag = document.createElement('div');\n  flag.className = 'flag';\n  flag.textContent = ['帅恒','🎆','✨','🎇'][Math.floor(Math.random()*4)];\n  flag.style.left = Math.random() * 100 + 'vw';\n  flag.style.animationDuration = (5 + Math.random() * 5) + 's';\n  flag.style.fontSize = (16 + Math.random() * 18) + 'px';\n  document.body.appendChild(flag);\n  setTimeout(() => flag.remove(), 10000);\n}\nsetInterval(createFlag, 500);\n\n// ========== 4. 打字机 ==========\nconst messages = [\n  \"国庆快乐 超级帅帅帅的恒\",\n  \"\",\n  \"愿你的假期——\",\n  \"有吃不完的零食 🍿\",\n  \"睡到自然醒的早晨 🌙\",\n  \"和刚刚好的好心情 ☀️\",\n  \"\",\n  \"如果可以的话……\",\n  \"以后一起去看看烟花吧 🎆\",\n];\n\nlet lineIndex = 0, charIndex = 0;\nconst twEl = document.getElementById('typewriter');\nconst cursor = twEl.querySelector('.cursor');\n\nfunction typeLine() {\n  if (lineIndex >= messages.length) { cursor.style.display = 'none'; return; }\n  const line = messages[lineIndex];\n  if (charIndex < line.length) {\n    const span = document.createElement('span');\n    span.textContent = line[charIndex];\n    span.style.opacity = '0';\n    span.style.transition = 'opacity 0.15s';\n    twEl.insertBefore(span, cursor);\n    requestAnimationFrame(() => span.style.opacity = '1');\n    charIndex++;\n    setTimeout(typeLine, 70);\n  } else {\n    twEl.appendChild(document.createElement('br'));\n    lineIndex++; charIndex = 0;\n    setTimeout(typeLine, 350);\n  }\n}\nsetTimeout(typeLine, 1200);\n\n// ========== 5. 烟花 Canvas ==========\nconst fwCanvas = document.getElementById('fireworks');\nconst fCtx = fwCanvas.getContext('2d');\nfwCanvas.width = window.innerWidth;\nfwCanvas.height = window.innerHeight;\nwindow.addEventListener('resize', () => {\n  fwCanvas.width = window.innerWidth;\n  fwCanvas.height = window.innerHeight;\n});\n\nclass Particle {\n  constructor(x, y, color, isHeart = false) {\n    this.x = x; this.y = y;\n    this.color = color;\n    this.alpha = 1;\n    this.decay = 0.008 + Math.random() * 0.018;\n    const angle = Math.random() * Math.PI * 2;\n    const speed = isHeart ? 2 + Math.random() * 3 : 1 + Math.random() * 5;\n    this.vx = Math.cos(angle) * speed;\n    this.vy = Math.sin(angle) * speed;\n    this.isHeart = isHeart;\n    this.size = isHeart ? 8 : 1.5 + Math.random() * 2;\n    this.trail = [];\n  }\n  update() {\n    this.trail.push({ x: this.x, y: this.y, alpha: this.alpha });\n    if (this.trail.length > 4) this.trail.shift();\n    this.x += this.vx;\n    this.y += this.vy;\n    this.vy += 0.035;\n    this.vx *= 0.99;\n    this.alpha -= this.decay;\n  }\n  draw() {\n    // 拖尾\n    this.trail.forEach((t, i) => {\n      fCtx.beginPath();\n      fCtx.arc(t.x, t.y, this.size * 0.5, 0, Math.PI * 2);\n      fCtx.fillStyle = this.isHeart\n        ? `rgba(255,107,107,${t.alpha * 0.3 * (i/this.trail.length)})`\n        : `${this.color.replace('1)', `${t.alpha * 0.3 * (i/this.trail.length)})`)}`;\n      fCtx.fill();\n    });\n    fCtx.save();\n    fCtx.globalAlpha = this.alpha;\n    if (this.isHeart) {\n      fCtx.font = this.size + 'px serif';\n      fCtx.fillText('❤️', this.x, this.y);\n    } else {\n      fCtx.beginPath();\n      fCtx.arc(this.x, this.y, this.size, 0, Math.PI * 2);\n      fCtx.fillStyle = this.color;\n      fCtx.fill();\n      // 发光\n      fCtx.shadowBlur = 8;\n      fCtx.shadowColor = this.color;\n      fCtx.fill();\n    }\n    fCtx.restore();\n  }\n}\n\nlet particles = [];\nconst colors = [\n  'rgba(255,107,107,1)', 'rgba(255,217,61,1)', 'rgba(107,203,119,1)',\n  'rgba(77,150,255,1)', 'rgba(255,107,203,1)', 'rgba(255,255,255,1)'\n];\n\nfunction explode(x, y) {\n  const color = colors[Math.floor(Math.random() * colors.length)];\n  const count = 50 + Math.floor(Math.random() * 30);\n  for (let i = 0; i < count; i++) particles.push(new Particle(x, y, color));\n}\n\nfunction launchHeart() {\n  const x = Math.random() * fwCanvas.width;\n  const y = Math.random() * fwCanvas.height * 0.5;\n  for (let i = 0; i < 10; i++) particles.push(new Particle(x, y, 'rgba(255,107,107,1)', true));\n}\n\n// 自动烟花\nsetInterval(() => {\n  explode(\n    fwCanvas.width * 0.15 + Math.random() * fwCanvas.width * 0.7,\n    fwCanvas.height * 0.1 + Math.random() * fwCanvas.height * 0.35\n  );\n}, 1200);\n\nfunction animate() {\n  // 星空\n  sCtx.clearRect(0, 0, starCanvas.width, starCanvas.height);\n  stars.forEach(s => { s.update(); s.draw(); });\n  shootingStars.forEach(s => { s.update(); s.draw(); });\n\n  // 烟花 - 半透明清除制造残影\n  fCtx.fillStyle = 'rgba(10, 10, 26, 0.15)';\n  fCtx.fillRect(0, 0, fwCanvas.width, fwCanvas.height);\n  particles = particles.filter(p => p.alpha > 0);\n  particles.forEach(p => { p.update(); p.draw(); });\n\n  requestAnimationFrame(animate);\n}\nanimate();\n\n// ========== 6. 隐藏心意 ==========\nfunction revealHeart() {\n  document.getElementById('heartReveal').classList.add('show');\n  document.getElementById('secretBtn').style.display = 'none';\n  // 爱心烟花连发\n  for (let i = 0; i < 40; i++) setTimeout(() => launchHeart(), i * 80);\n  // 再放几波大烟花庆祝\n  for (let i = 0; i < 5; i++) {\n    setTimeout(() => explode(\n      fwCanvas.width * 0.2 + Math.random() * fwCanvas.width * 0.6,\n      fwCanvas.height * 0.15 + Math.random() * fwCanvas.height * 0.3\n    ), i * 300);\n  }\n}\n</script>\n</body>\n</html>"}