/* GALAXY-01 (owner, 2026-10-28: "get it from core engineering library"). UI taken from Core's Uiverse Galaxy collection
   (Core/Research/External Repositories/03 UI and Design System/uiverse-galaxy-main; MIT, credit requested: Uiverse.io and each creator).
   The CSS below is the collection's own, re-themed with the page's tokens (no new colour literals) and bound to classes the page
   already has. ORIGINS:
     tickets  Uiverse.io by Galahhad  "Golden Ticket"   Cards/Galahhad_breezy-insect-49.html    (foil radials, the stub's bar run)
     social   Uiverse.io by Praashoo7 "chilly-baboon-67" Buttons/Praashoo7_chilly-baboon-67.html (hover card that lifts 1em)
     share    Uiverse.io by gagan-gv  "soft-dolphin-57"  Buttons/gagan-gv_soft-dolphin-57.html   (label closes, icons open)
     toast    Uiverse.io by alexruix  "gentle-octopus-87" Notifications/alexruix_gentle-octopus-87.html (opens from one side, once)
   Left out on purpose (Core playbook 15): the Golden Ticket's flip on hover (the real words would be the back), every loop, and
   every score or level-up toast. Each motion here happens once and stops under reduced motion. */

/* ---- Tickets: Galahhad's two foil radials and its run of bars, in brand paper and tan. Side notches stay as they were. ---- */
.pr-tickets .pr-ticket{
  background-image:
    radial-gradient(ellipse farthest-corner at right bottom, color-mix(in srgb,var(--tan,#c9a36f) 40%,transparent) 0%, color-mix(in srgb,var(--brown,#9c6b3b) 14%,transparent) 8%, color-mix(in srgb,var(--tan,#c9a36f) 16%,transparent) 30%, color-mix(in srgb,var(--brown,#9c6b3b) 8%,transparent) 40%, transparent 80%),
    radial-gradient(ellipse farthest-corner at left top, color-mix(in srgb,var(--paper,#fffdf9) 90%,transparent) 0%, color-mix(in srgb,var(--paper,#fffdf9) 55%,transparent) 8%, color-mix(in srgb,var(--tan,#c9a36f) 14%,transparent) 25%, transparent 62.5%);
  background-repeat:no-repeat; background-size:200% 200%, 200% 200%; background-position:100% 100%, 0 0;
  transition:background-position .8s, transform .15s; }
.pr-tickets .pr-ticket:hover,.pr-tickets .pr-ticket:focus-within{ background-position:60% 60%, 40% 40%; }
/* The run of bars (Galahhad's stub bars, upright): one gradient layer per bar, as the original does. */
.pr-tickets .pr-ticket::after{ content:""; position:absolute; top:15px; right:16px; width:42px; height:14px; opacity:.5; pointer-events:none; color:var(--ink,#2a2017);
  background-repeat:no-repeat;
  background-image:
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor),
    linear-gradient(currentColor,currentColor);
  background-position:0.0px 0, 2.2px 0, 5.4px 0, 7.2px 0, 10.8px 0, 12.6px 0, 15.8px 0, 17.6px 0, 19.4px 0, 22.5px 0, 24.3px 0, 27.4px 0, 29.2px 0, 32.4px 0, 34.2px 0, 36.0px 0, 39.6px 0, 41.0px 0;
  background-size:1px 100%, 2.2px 100%, 1px 100%, 1.4px 100%, 1px 100%, 2.2px 100%, 1px 100%, 1px 100%, 2.2px 100%, 1px 100%, 1px 100%, 1px 100%, 2.2px 100%, 1px 100%, 1px 100%, 1px 100%, 2.2px 100%, 1px 100%; }

/* ---- Social: Praashoo7's hover card. It reads the link's own aria-label, so it can never disagree with the link. ---- */
.pr-ticket .lp-social .soc,.pr-ticket .lp-social .soc:hover{ position:static; transform:none; }
.pr-ticket .lp-social .soc::after{ content:attr(aria-label) / ""; position:absolute; left:16px; right:16px; bottom:72px; z-index:2; padding:8px 12px; border-radius:10px;
  background:var(--ink,#2a2017); color:var(--cream,#fbf1df); font:600 13px/1.3 var(--pr-display,sans-serif); text-align:center; visibility:hidden; opacity:0;
  transform:translateY(0); transition:.1s ease-in-out; pointer-events:none; }
.pr-ticket .lp-social .soc:hover::after,.pr-ticket .lp-social .soc:focus-visible::after{ transform:translateY(-1em); visibility:visible; opacity:1; }
.pr-ticket .lp-social .soc:focus-visible{ outline:3px solid #1f6fb2; outline-offset:2px; }

/* ---- Share: gagan-gv's button. The label closes and the icons open; one button, one action. ---- */
.pr-share{ position:relative; display:flex; align-items:center; justify-content:center; box-sizing:border-box; width:100%; max-width:220px; height:48px; margin-top:10px; padding:0 4px;
  border:2px solid var(--ink,#2a2017); border-radius:40px; background:var(--paper,#fffdf9); overflow:hidden; cursor:pointer; font:inherit; }
.pr-share > .pr-share__label{ z-index:1; display:inline-block; box-sizing:border-box; height:36px; width:100%; border-radius:25px; background:var(--ink,#2a2017); color:var(--cream,#fbf1df);
  font:700 14px/36px var(--pr-display,sans-serif); letter-spacing:.06em; white-space:nowrap; overflow:hidden; transition:all .5s; }
.pr-share .pr-share__icons{ position:absolute; inset:0; z-index:-1; width:0; margin:0 auto; display:flex; align-items:center; justify-content:center; gap:14px; overflow:hidden; transition:all .4s; }
.pr-share .pr-share__icons svg{ flex:0 0 auto; width:24px; height:24px; fill:var(--brown-dk,#7a4e26); }
.pr-share:hover > .pr-share__label,.pr-share:focus-visible > .pr-share__label{ width:0; }
.pr-share:hover .pr-share__icons,.pr-share:focus-visible .pr-share__icons{ z-index:2; width:100%; }
.pr-share:focus-visible{ outline:3px solid #1f6fb2; outline-offset:3px; }
.pr-share[aria-busy="true"]{ opacity:.7; cursor:progress; }

/* ---- Toast: alexruix's notification. It opens from the left once, on a dark pill with a tan dot. ---- */
@keyframes pr-toast-open{ from{ clip-path:inset(0 100% 0 0 round 14px); } to{ clip-path:inset(0 0 0 0 round 14px); } }
html .tc-toast,html .pr-toast{ display:flex; align-items:center; gap:12px; background:var(--ink,#2a2017); color:var(--cream,#fbf1df); border-radius:14px; padding:12px 20px 12px 14px;
  box-shadow:6px 3px 38px -6px color-mix(in srgb,var(--ink,#2a2017) 35%,transparent); }
html .tc-toast::before,html .pr-toast::before{ content:""; flex:0 0 auto; width:1.4em; height:1.4em; border-radius:50%; background:var(--tan,#c9a36f); box-shadow:0 0 0 4px color-mix(in srgb,var(--cream,#fbf1df) 18%,transparent); }
html .tc-toast.show,html .pr-toast.show{ animation:pr-toast-open .7s ease-in-out 1 both; }
html .tc-toast-act{ color:var(--tan,#c9a36f); }
html .pr-toast{ position:fixed; left:50%; bottom:26px; transform:translateX(-50%) translateY(20px); opacity:0; visibility:hidden; transition:all .22s; z-index:9300; max-width:90vw; font:600 13.5px -apple-system,sans-serif; }
html .pr-toast.show{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }

@media (prefers-reduced-motion: reduce){
  .pr-tickets .pr-ticket{ transition:none; }
  .pr-tickets .pr-ticket:hover,.pr-tickets .pr-ticket:focus-within{ background-position:100% 100%, 0 0; }
  .pr-ticket .lp-social .soc::after{ transition:none; transform:none; }
  .pr-ticket .lp-social .soc:hover::after,.pr-ticket .lp-social .soc:focus-visible::after{ transform:none; }
  .pr-share > .pr-share__label,.pr-share .pr-share__icons{ transition:none; }
  html .tc-toast.show,html .pr-toast.show{ animation:none; }
}