/* Glass 3D Modern — Violet‑Rose Premium */
:root{--bg:#0e0a13;--panel:#120d1b;--text:#f9f6ff;--muted:#cdbbe6;--violet:#9b5cf6;--rose:#e056c8;--rose2:#ff7fcf;--edge:#2a1a46;--shadow:0 18px 40px rgba(0,0,0,.55)}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:radial-gradient(1200px 700px at 50% -200px,#241537 0%,#120d1b 55%,#0b0710 100%);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;color:var(--text)}
.container{max-width:520px;margin:0 auto;padding:16px;padding-bottom:98px}
.header{display:flex;align-items:center;justify-content:space-between;margin:6px 0 10px}
.brand{display:flex;gap:10px;align-items:center}
.logo{width:34px;height:34px;border-radius:10px;background:conic-gradient(from 210deg,#9b5cf6,#e056c8,#ff7fcf,#9b5cf6);box-shadow:0 0 0 2px #2a1a46,var(--shadow)}
.name{font-weight:900;letter-spacing:.3px}
.badges{display:flex;gap:6px}
.badge{font-size:11px;padding:6px 9px;border-radius:999px;background:#1b1230;border:1px solid #2b1b46;color:#e8dbff}
.card{background:linear-gradient(180deg,#181126,#130e1e);border:1px solid #2b1b46;border-radius:16px;box-shadow:var(--shadow);padding:16px;margin:10px 0}
.h1{font-size:clamp(22px,6vw,28px);font-weight:900;line-height:1.1;margin:2px 0 8px}
.sub{font-size:15px;color:var(--muted);margin:0 0 12px}
.btn{appearance:none;border:none;width:100%;padding:16px 18px;border-radius:18px;font-weight:900;letter-spacing:.3px;cursor:pointer;color:#130c1d;position:relative;overflow:hidden;transform:translateZ(0);backface-visibility:hidden}
.btn-glass{background:linear-gradient(180deg, rgba(255,255,255,.32), rgba(255,255,255,.12) 55%, rgba(0,0,0,.18)),linear-gradient(135deg, rgba(155,92,246,.32), rgba(224,86,200,.28));border:1px solid rgba(255,255,255,.28);box-shadow:0 16px 30px rgba(0,0,0,.55),0 2px 0 rgba(255,255,255,.25) inset,0 -6px 14px rgba(155,92,246,.22) inset,0 8px 20px rgba(224,86,200,.25),0 0 0 1px rgba(155,92,246,.22);backdrop-filter: blur(8px) saturate(1.2)}
.btn-glass::before{content:"";position:absolute;inset:3px;border-radius:14px;background:linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,0) 60%, rgba(0,0,0,.12));mix-blend-mode:screen;pointer-events:none}
.btn-glass::after{content:"";position:absolute;top:-120%;left:-40%;width:180%;height:160%;background:radial-gradient(ellipse at 30% 30%, rgba(255,255,255,.50), rgba(255,255,255,0) 45%),radial-gradient(ellipse at 80% 80%, rgba(255,255,255,.20), rgba(255,255,255,0) 55%);transform:rotate(8deg);animation:shine 6s ease-in-out infinite;pointer-events:none;filter:blur(8px)}
@keyframes shine{0%{transform:translateX(-8%) translateY(-4%) rotate(8deg)}50%{transform:translateX(6%) translateY(3%) rotate(8deg)}100%{transform:translateX(-8%) translateY(-4%) rotate(8deg)}}
.btn:active{transform:translateY(2px)}
.btn:active.btn-glass{box-shadow:0 8px 16px rgba(0,0,0,.55),0 1px 0 rgba(255,255,255,.18) inset,0 -4px 10px rgba(155,92,246,.18) inset,0 6px 16px rgba(224,86,200,.22),0 0 0 1px rgba(155,92,246,.22)}
.btn-label{position:relative;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(180deg,#2b173e,#1a1029);-webkit-background-clip:text;color:transparent;text-shadow:0 1px 0 rgba(255,255,255,.25)}
.sticky{position:fixed;left:0;right:0;bottom:0;z-index:60;background:linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04));backdrop-filter:blur(10px) saturate(1.2);border-top:1px solid rgba(255,255,255,.2);box-shadow:0 -12px 28px rgba(0,0,0,.45)}
.sticky .inner{max-width:520px;margin:0 auto;padding:10px 16px}
.fake-phone{margin-top:12px;border:1px solid #2b1b46;border-radius:20px;overflow:hidden;background:#0d0a14;padding:14px}
.chat{display:flex;flex-direction:column;gap:8px;min-height:140px}
.bubble{align-self:flex-start;max-width:86%;background:linear-gradient(135deg,#211733,#171026);border:1px solid #2b1b46;color:#efe6ff;padding:10px 12px;border-radius:14px 14px 14px 6px;font-size:14px}
.bubble.me{align-self:flex-end;background:linear-gradient(135deg,#9b5cf6,#e056c8);border:1px solid rgba(255,255,255,.35);color:#1a1126;border-radius:14px 14px 6px 14px}
.typing{display:inline-flex;gap:4px}.dot{width:6px;height:6px;background:#e6d9ff;border-radius:50%;opacity:.45;animation:blink 1.1s infinite}.dot:nth-child(2){animation-delay:.2s}.dot:nth-child(3){animation-delay:.4s}@keyframes blink{0%,80%,100%{opacity:.28}40%{opacity:1}}
.counter{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.counter .c{flex:1;min-width:140px;background:#171026;border:1px solid #2b1b46;border-radius:12px;padding:10px 12px;color:#efe6ff;font-weight:700}
.notice{display:none;margin:10px 0;background:#171026;border:1px dashed #2d1d49;border-radius:12px;padding:10px 12px;font-size:13px;color:#e5dbff}
.notice code{background:#120c1d;border:1px solid #2d1d49;border-radius:6px;padding:2px 6px;color:#e5dbff}
.loaderOverlay{position:fixed;inset:0;background:rgba(9,6,14,.92);backdrop-filter:blur(2px);display:none;align-items:center;justify-content:center;flex-direction:column;gap:12px;z-index:70}
.ring{width:46px;height:46px;border:4px solid #2b1b46;border-top-color:#e056c8;border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.loaderText{color:#efe6ff;font-weight:700}
.footer{margin:14px 4px 6px;font-size:12px;color:#d6c7f3;display:flex;justify-content:space-between;gap:8px;flex-wrap:wrap}
.footer a{color:#e8dbff;text-decoration:none}