:root{--bg:#0b0f12;--card:#0f1720;--muted:#9aa4b2}
*{box-sizing:border-box}html,body{height:100%;margin:0;font-family:Inter,system-ui}
body{background:var(--bg);color:#e6eef6;display:flex;align-items:center;justify-content:center;padding:20px}
.card{width:100%;max-width:640px;background:linear-gradient(180deg,rgba(255,255,255,0.02),transparent);border-radius:16px;padding:24px;box-shadow:0 8px 24px rgba(0,0,0,0.6)}
textarea{width:100%;padding:12px;border-radius:10px;background:rgba(255,255,255,0.02);border:1px solid rgba(255,255,255,0.03);color:inherit;resize:vertical}
.actions{margin-top:12px}
button{padding:10px 14px;border-radius:10px;border:1px solid rgba(255,255,255,0.06);background:transparent;color:inherit;cursor:pointer}
.view-card{text-align:center}
.timer{font-size:28px;font-weight:700;margin:8px;padding:10px 18px;border-radius:999px;display:inline-block;animation:pulse 3s ease-in-out infinite}
.message{margin-top:12px;padding:16px;border-radius:12px;background:rgba(0,0,0,0.06);white-space:pre-wrap}
.small{color:var(--muted);font-size:13px;margin-top:12px}
@keyframes pulse{0%{box-shadow:0 6px 20px rgba(155,89,182,0.06)}50%{box-shadow:0 10px 26px rgba(155,89,182,0.09)}100%{box-shadow:0 6px 20px rgba(155,89,182,0.06)}}