/* KONNEKTION Share button (Round 4 pattern, 12 Nov 2026).
   Button = the house Liquid Glass recipe, NEUTRAL by default (Round 2 rule R2-A, copied from kx-round2.css);
   red only in the pressed state ("Link copied", panel open).
   .kx-share-panel = NEW (needs Niko's approval): small glass box, recipe scaled down from .saved-spotlight-shell. */
.kx-share{--kxs-hx:84%;--kxs-hy:12%;display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px;min-width:0;max-width:100%}
.kx-share:not(.kx-share--host) .kx-share-btn,
.kx-share:not(.kx-share--host) .kx-share-opt{position:relative;overflow:hidden;isolation:isolate;display:inline-flex!important;align-items:center;justify-content:center;gap:8px;
  box-sizing:border-box;max-width:100%;min-height:44px;margin:0;padding:0 16px!important;border:1px solid rgba(255,255,255,.2)!important;border-radius:8px!important;
  color:#fff8ef!important;font:500 15px/1.2 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif!important;letter-spacing:0!important;text-transform:none!important;
  text-decoration:none!important;white-space:nowrap;cursor:pointer;
  background:radial-gradient(circle at var(--kxs-hx) var(--kxs-hy),rgba(255,255,255,.12),transparent 42%),linear-gradient(135deg,rgba(255,255,255,.08),rgba(237,28,36,.055) 50%,rgba(255,255,255,.04)),rgba(255,255,255,.04)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),inset 0 -1px 0 rgba(255,255,255,.06),0 7px 16px rgba(0,0,0,.18),0 0 0 1px rgba(255,255,255,.05)!important;
  -webkit-backdrop-filter:blur(14px) saturate(128%);backdrop-filter:blur(14px) saturate(128%);
  transition:color .25s ease,background .25s ease,border-color .25s ease,transform .25s ease}
.kx-share:not(.kx-share--host) .kx-share-btn{min-height:48px;font-size:16px!important}
.kx-share .kx-share-btn svg{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.kx-share:not(.kx-share--host) .kx-share-btn:hover,
.kx-share:not(.kx-share--host) .kx-share-opt:hover{color:#fff!important;border-color:rgba(255,255,255,.52)!important;transform:translateY(-1px);
  background:radial-gradient(circle at var(--kxs-hx) var(--kxs-hy),rgba(255,255,255,.18),transparent 42%),linear-gradient(135deg,rgba(255,255,255,.12),rgba(237,28,36,.23) 58%,rgba(255,255,255,.08)),rgba(237,28,36,.24)!important}
/* pressed = red (panel open, Link copied) */
.kx-share.is-open .kx-share-btn,
.kx-share .kx-share-opt.is-copied{color:#fff!important;border-color:rgba(237,28,36,.74)!important;
  background:radial-gradient(circle at var(--kxs-hx) var(--kxs-hy),rgba(255,255,255,.16),transparent 42%),linear-gradient(135deg,rgba(255,255,255,.1),rgba(237,28,36,.38) 58%,rgba(255,255,255,.07)),rgba(237,28,36,.5)!important}
.kx-share .kx-share-btn:focus-visible,
.kx-share .kx-share-opt:focus-visible,
.kx-share .kx-share-manual:focus-visible{outline:3px solid #fff!important;outline-offset:2px}
/* NEW: the panel (computers without a share menu) */
.kx-share .kx-share-panel{flex:1 1 100%;box-sizing:border-box;max-width:560px;display:flex;flex-wrap:wrap;gap:8px;padding:12px;
  border:1px solid rgba(255,255,255,.24);border-radius:12px;
  background:radial-gradient(circle at 92% 3%,rgba(255,255,255,.16),transparent 32%),linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.045) 48%,rgba(237,28,36,.08)),rgba(12,14,20,.72);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 22px 60px rgba(0,0,0,.26);
  -webkit-backdrop-filter:blur(24px) saturate(1.25);backdrop-filter:blur(24px) saturate(1.25)}
.kx-share .kx-share-panel[hidden]{display:none!important}
.kx-share .kx-share-opt{flex:0 1 auto}
.kx-share .kx-share-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.kx-share .kx-share-status.has-manual{position:static;width:auto;height:auto;overflow:visible;clip:auto;flex:1 1 100%}
.kx-share .kx-share-manual{box-sizing:border-box;width:100%;min-height:40px;padding:0 10px;border:1px solid rgba(255,255,255,.3);border-radius:8px;background:rgba(0,0,0,.35);color:#f7f6f4;font:14px/1.2 Inter,ui-sans-serif,system-ui,sans-serif}
@media (max-width:480px){.kx-share .kx-share-opt{flex:1 1 calc(50% - 4px)}}
@media (prefers-reduced-motion:reduce){.kx-share .kx-share-btn,.kx-share .kx-share-opt{transition:none}.kx-share .kx-share-btn:hover,.kx-share .kx-share-opt:hover{transform:none}}
/* AEO page: the Share button sits as the last button of "Tickets and tables" and takes the full width of its cell */
/* .kx-share--host = the Share button and the panel buttons wear the page's own button class (AEO page: .button),
   so they always look exactly like their neighbours (flat today, Liquid Glass once Round 2 p4 is applied). */
.kx-share--host .kx-share-btn,.kx-share--host .kx-share-opt{box-sizing:border-box;cursor:pointer;font-family:inherit;text-align:left}
.kx-share--host .kx-share-btn svg{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.kx-share--host .kx-share-opt{flex:1 1 calc(50% - 4px);min-height:48px}
.service-actions>.kx-share{min-width:0}
.service-actions>.kx-share .kx-share-btn{flex:1 1 100%;width:100%}
.service-actions>.kx-share.is-open{grid-column:1/-1}
.kx-share--host .kx-share-btn svg{order:2}
/* v79 integration: Share inside an app hero row (.hero-actions, daily-party pages): icon beside the word, same height as its neighbours */
.hero-actions .kx-share--host .kx-share-btn{display:inline-flex!important;align-items:center;justify-content:center;gap:8px}
/* KX-V86-SHARE-PANEL (round 9, Niko Review 33 note 4: "the frame that all the buttons reside is longer on the right side").
   The panel was a wrapping flex row inside a box up to 560 px wide, so the empty end of the last row made the right inner
   space larger than the left. Now: a grid of equal columns whose box hugs the buttons (width: fit-content) = the same 12 px
   inside the frame on the left and on the right at every width. Computers: 3 columns (2 rows of 3); up to 480 px: 2 columns
   filling the width. The "Link copied: paste it in your story or bio" line (Instagram / TikTok, NEW) spans the whole row. */
.kx-share .kx-share-panel{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));width:fit-content;max-width:100%;flex:0 0 auto;gap:8px;padding:12px}
.kx-share .kx-share-panel[hidden]{display:none!important}
.kx-share .kx-share-panel>.kx-share-opt{width:100%;min-width:0}
.kx-share--host .kx-share-panel{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}
.kx-share .kx-share-status.has-note{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;grid-column:1/-1;
  margin:2px 2px 0;color:#f7f6f4;font:500 13px/1.35 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;text-align:center}
.kx-share .kx-share-status.has-manual{grid-column:1/-1}
@media (max-width:480px){.kx-share .kx-share-panel{width:100%;grid-template-columns:repeat(2,minmax(0,1fr))}}