/* Transferred from AngelAmi/note/soon.html; common navigation belongs to Note. */
.secret-page { background: #050505; }
.secret-page body::before {
  content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(#05050599, #05050599), url('assets/secret/vault-bg.jpg') center / cover no-repeat;
}
.secret-page .home-shell { position: relative; isolation: isolate; }
.vault-container { position: relative; max-width: 480px; margin: 0 auto; padding: 32px 24px 40px; text-align: center; --accent: #c9a227; --muted: #8c8780; }
.vault-container p { margin: 0; }
    .vault-apple { font-size:1.8rem; filter:drop-shadow(0 0 14px rgba(196,30,58,0.55)); animation:vault-apple-pulse 4s ease-in-out infinite; }
    @keyframes vault-apple-pulse { 0%,100%{ opacity:0.75; transform:scale(1); } 50%{ opacity:1; transform:scale(1.08); } }

    .deco { display:flex; align-items:center; justify-content:center; gap:12px; margin:14px 0 28px; opacity:0.8; }
    .deco .line { width:44px; height:1px; background:linear-gradient(90deg,transparent,var(--accent)); }
    .deco .line:last-child { background:linear-gradient(90deg,var(--accent),transparent); }
    .deco .star { color:var(--accent); font-size:0.8rem; text-shadow:0 0 12px rgba(201,162,39,0.7); }

    .vault-frame {
      position:relative; border-radius:16px; overflow:hidden; margin-bottom:28px; line-height:0;
      border:1px solid rgba(201,162,39,0.4); background:#000;
      box-shadow:0 0 0 1px rgba(0,0,0,0.4), 0 20px 50px rgba(0,0,0,0.5), 0 0 40px rgba(201,162,39,0.12);
    }
    .vault-frame img { display:block; width:100%; height:auto; }

    .vault-subtitle {
      font-size:1.02rem; font-weight:700; letter-spacing:0.04em; color:var(--accent);
      text-shadow:0 0 14px rgba(201,162,39,0.4); margin-bottom:18px;
    }

    .vault-body { color:#a19c93; font-size:0.98rem; line-height:1.7; margin-bottom:30px; }
    .vault-body p { margin-bottom:2px; }

    .vault-key-box {
      border:1px solid rgba(201,162,39,0.35); border-radius:14px; padding:18px 16px;
      margin-bottom:16px; background:rgba(201,162,39,0.03);
    }
    .vault-key {
      font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
      font-size:1.15rem; font-weight:700; letter-spacing:0.1em; color:#f2eee6;
      overflow-wrap:break-word;
    }

    .vault-copy-btn {
      display:inline-flex; align-items:center; gap:8px; margin-bottom:32px;
      padding:10px 20px; border-radius:999px; border:1px solid rgba(201,162,39,0.4);
      background:rgba(201,162,39,0.06); color:var(--accent); font-size:0.88rem; font-weight:600;
      cursor:pointer; transition:background 0.2s ease, opacity 0.2s ease; letter-spacing:0.02em;
      font-family:inherit;
    }
    .vault-copy-btn:hover { background:rgba(201,162,39,0.12); }
    .vault-copy-btn svg { width:15px; height:15px; flex-shrink:0; }
    .vault-copy-btn.is-copied { opacity:0.7; }
    .vault-copy-btn.is-hidden { display:none; }

    .vault-deco-small { display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:22px; opacity:0.7; }
    .vault-deco-small .line { width:32px; height:1px; background:linear-gradient(90deg,transparent,var(--accent)); }
    .vault-deco-small .line:last-child { background:linear-gradient(90deg,var(--accent),transparent); }

    .vault-save-text { font-size:1.08rem; font-weight:700; color:#f2eee6; line-height:1.5; margin-bottom:28px; }

    .vault-footer-apple { font-size:1.3rem; margin-bottom:10px; filter:drop-shadow(0 0 12px rgba(196,30,58,0.5)); }
    .vault-footer-text { font-size:0.86rem; font-style:italic; color:var(--muted); margin-bottom:28px; }


.vault-container .vault-subtitle { margin: 0 0 18px; line-height: 1.5; }
.vault-container .vault-copy-status:empty { display: none; }
.vault-container .vault-copy-status { margin: 0 0 16px; color: var(--gold); font-size: 13px; line-height: 1.5; }
@media (max-width: 640px) { .vault-container { padding: 24px 12px 28px; } }
@media (prefers-reduced-motion: reduce) { .vault-apple { animation: none; } }

.vault-apple img, .vault-footer-apple img { display: block; margin: 0 auto; object-fit: contain; }

.vault-container { max-width: 640px; }
.vault-container .vault-subtitle { font-size: clamp(30px,5vw,46px); font-weight: 500; letter-spacing: -.035em; text-transform: none; line-height: 1.25; text-shadow: none; }
#vault-connect { color: #f1f0eb; cursor: pointer; margin: 16px auto; }

#vault-offer-status.vault-premium-title { text-align: center; margin: 24px 0; font: 500 clamp(30px, 5vw, 39px)/1.2 Georgia, serif; letter-spacing: .04em; color: #f3d79f; background: linear-gradient(180deg, #fff4d8, #e8c680 65%, #c29b57); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
