*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
body {
  min-height:100vh; font-family:'Josefin Sans',sans-serif; -webkit-font-smoothing:antialiased;
  color:#5c3144; background:linear-gradient(160deg,#fbe9ee 0%,#f3e3f2 45%,#e9ddfb 100%);
  display:flex; align-items:flex-start; justify-content:center; padding:40px 18px;
  position:relative; overflow-x:hidden;
}
body::before, body::after { content:""; position:fixed; border-radius:50%; filter:blur(90px); z-index:0; pointer-events:none; }
body::before { width:480px; height:480px; background:rgba(217,138,166,.45); top:-160px; left:-120px; }
body::after  { width:520px; height:520px; background:rgba(183,156,240,.45); bottom:-180px; right:-140px; }
.screen {
  position:relative; z-index:1; width:560px; max-width:100%; border-radius:34px;
  background:linear-gradient(170deg,rgba(251,233,238,.95),rgba(239,226,255,.95));
  --ink:#5c3144; --muted:rgba(92,49,68,.7); --border:rgba(217,138,166,.4);
  --acc:#d98aa6; --acc2:#8d6fc0; --tintbg:rgba(183,156,240,.2); --tintbd:rgba(183,156,240,.4);
  padding:40px 34px 34px; text-align:left;
  box-shadow:0 30px 70px rgba(180,130,170,.4), inset 0 0 0 1px rgba(255,255,255,.65); overflow:hidden;
}
.screen.live  { --acc2:#c96f96; --tintbg:rgba(217,138,166,.18); --tintbd:rgba(217,138,166,.4); }
.screen.audio { --acc2:#8d6fc0; --tintbg:rgba(183,156,240,.2);  --tintbd:rgba(183,156,240,.4); }
.back { display:inline-block; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--acc2); text-decoration:none; margin-bottom:18px; }
.back:hover { color:var(--acc); }
.ic-big { width:70px; height:70px; border-radius:20px; display:grid; place-items:center; font-size:34px; margin:0 auto 14px; background:var(--tintbg); border:1px solid var(--tintbd); }
.title { font-family:'Gilda Display',serif; font-size:27px; color:var(--ink); text-align:center; line-height:1.15; }
.meta { text-align:center; font-size:12.5px; color:var(--muted); letter-spacing:.06em; margin:8px 0 4px; }
.price { text-align:center; font-size:30px; font-weight:600; color:var(--acc2); margin:6px 0 20px; }
.price small { font-size:14px; color:var(--muted); font-weight:400; }
.lede { font-size:14.5px; font-style:italic; line-height:1.6; color:var(--ink); opacity:.92; margin-bottom:18px; }
h3 { font-family:'Gilda Display',serif; font-size:16px; color:var(--ink); margin:20px 0 8px; }
p, li { font-size:14px; line-height:1.62; color:var(--ink); }
ul { margin:6px 0 6px 20px; } li { margin-bottom:5px; }
.box { background:rgba(255,255,255,.5); border:1px solid var(--border); border-radius:16px; padding:14px 16px; margin:14px 0; }
.box.warn { background:rgba(217,138,166,.12); }
.box h3 { margin-top:0; }
.note { font-size:13px; color:var(--muted); }
.cta { display:block; text-align:center; text-decoration:none; margin:24px 0 8px; background:linear-gradient(135deg,#d98aa6,#b79cf0); color:#fff; font-size:17px; font-weight:600; letter-spacing:.03em; padding:17px; border-radius:18px; box-shadow:0 12px 26px rgba(180,120,170,.45); transition:transform .18s, box-shadow .22s; }
.cta:hover { transform:translateY(-3px); box-shadow:0 16px 32px rgba(180,120,170,.55); }
.cta-note { text-align:center; font-size:11.5px; color:var(--muted); line-height:1.6; }
.cta-note a { color:var(--acc2); }