/* Shared clear glass for the channel capsule and the three information cards */
.board-widget.widget-type-socials,
.board-widget.widget-type-next-stream,
.board-widget.widget-type-film,
.board-widget.widget-type-setup {
  border-color:rgba(241,233,217,.22);
  background:linear-gradient(135deg,rgba(241,233,217,.025),rgba(165,188,214,.008)),rgba(35,24,21,.045);
  box-shadow:inset 0 1px 1px rgba(241,233,217,.12),0 8px 24px rgba(19,15,17,.075);
  backdrop-filter:blur(7px) saturate(1.02);
  -webkit-backdrop-filter:blur(7px) saturate(1.02);
}
.board-widget.widget-type-socials {
  --social-min-height:64px;
  --social-max-height:68px;
  max-width:420px;
  min-height:var(--social-min-height);
  max-height:var(--social-max-height);
  border-radius:999px;
}
.widget-type-next-stream .widget-heading h2,
.widget-type-film .widget-heading h2,
.widget-type-setup .widget-heading h2 {
  font-family:var(--header-font);
  font-synthesis:none;
  font-weight:400;
  line-height:18px;
  letter-spacing:.055em;
}
.widget-type-next-stream .next-copy .widget-main,
.widget-type-film .film-copy h3 {
  font-family:var(--header-font);
  font-synthesis:none;
  font-weight:400;
  line-height:1.16;
  letter-spacing:-.035em;
}
.widget-type-film .widget-film-layout {
  grid-template-columns:minmax(76px,.9fr) minmax(0,1fr);
  gap:14px;
}
.widget-type-film .widget-poster {
  width:100%;
  height:auto;
  max-width:min(100%,max(52px,calc(100cqh - 84px)));
  max-height:none;
  aspect-ratio:1;
  align-self:center;
}
.widget-type-socials .widget-content {
  padding:6px;
  gap:0;
  justify-content:center;
}
.social-dock {
  --dock-gap:4px;
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:var(--dock-gap);
  align-items:stretch;
  width:100%;
  height:100%;
  min-height:44px;
}
.social-dock::before,
.board-nav::before {
  content:'';
  position:absolute;
  inset-block:3px;
  left:3px;
  width:max(0px,calc(var(--dock-width,0px) - 6px));
  border:1px solid rgba(241,233,217,.18);
  border-radius:999px;
  background:linear-gradient(145deg,rgba(241,233,217,.12),rgba(241,233,217,.035));
  box-shadow:inset 0 1px 0 rgba(241,233,217,.18),0 3px 12px rgba(19,15,17,.05);
  opacity:0;
  pointer-events:none;
  transform:translateX(var(--dock-x,0px));
  transition:transform .3s var(--ease),width .3s var(--ease),opacity .18s var(--ease);
}
.social-dock[data-highlight=visible]::before,
.board-nav[data-highlight=visible]::before { opacity:1; }
.social-dock[data-highlight-ready=false]::before,
.board-nav[data-highlight-ready=false]::before { opacity:0; transition:none; }
.social-link {
  position:relative;
  display:grid;
  place-items:center;
  min-width:0;
  min-height:44px;
  border:1px solid transparent;
  border-radius:999px;
  color:var(--cream);
  background:transparent;
}
.social-symbol { display:flex; }
.social-symbol .ui-icon { width:22px; height:22px; stroke-width:1.55; }
.social-symbol:has(.social-art) { flex-shrink:0; }
.social-symbol .social-art { display:block; width:40px; height:40px; object-fit:contain; }
.social-link[aria-disabled=true] { color:#b8ada3; cursor:default; }
.social-link:focus-visible {
  outline:2px solid var(--blue);
  outline-offset:-2px;
}
.nav-monitor-screen .ui-icon rect { fill:currentColor; }
.board-nav button:is(:hover,:focus-visible) { text-shadow:0 0 10px rgba(255,235,200,.22); }
.board-nav button .ui-icon { transition:filter .3s var(--ease); }
.board-nav button:is(:hover,:focus-visible) .ui-icon { filter:drop-shadow(0 0 4px rgba(255,235,200,.24)); }
.board-nav button>span:last-child {
  transition:translate .3s var(--ease),color .3s var(--ease);
}
.board-nav button:focus-visible .ui-icon { animation:social-sway .65s var(--ease); }
.board-nav button:focus-visible>span:last-child { translate:3px 0; }
@media(hover:hover) {
  .board-nav button:hover .ui-icon { animation:social-sway .65s var(--ease); }
  .board-nav button:hover>span:last-child { translate:3px 0; }
}
@media(prefers-reduced-motion:reduce) {
  .board-nav button>span:last-child { transition:none; }
  .board-nav button:is(:hover,:focus-visible) .ui-icon { animation:none; }
  .board-nav button:is(:hover,:focus-visible)>span:last-child { translate:none; }
}
body[data-layout-editor=true] .widget-type-socials { --social-min-height:72px; --social-max-height:76px; max-width:500px; }
body[data-layout-editor=true] .widget-type-socials .widget-content { padding:6px 78px 6px 6px; }
body[data-layout-editor=true] .widget-type-socials .widget-edit-controls { top:50%; right:10px; transform:translateY(-50%); }
@media(hover:hover) {
  body:not([data-layout-editor=true]) .board-widget.widget-type-socials:hover {
    transform:none;
    border-color:rgba(241,233,217,.25);
    box-shadow:inset 0 1px 1px rgba(241,233,217,.12),0 8px 24px rgba(19,15,17,.075);
  }
  body:not([data-layout-editor=true]) .board-widget.widget-type-next-stream:hover,
  body:not([data-layout-editor=true]) .board-widget.widget-type-film:hover,
  body:not([data-layout-editor=true]) .board-widget.widget-type-setup:hover {
    border-color:rgba(241,233,217,.25);
    box-shadow:inset 0 1px 1px rgba(241,233,217,.12),0 8px 24px rgba(19,15,17,.075);
  }
  .social-link[href]:hover {
    color:var(--cream);
    transform:none;
  }
}
@media(max-width:767px) {
  .board-widget.widget-type-socials { max-width:none; }
}
@media(max-height:650px) {
  body:not([data-layout-editor=true]) .board-widget.widget-type-socials { --social-min-height:54px; --social-max-height:58px; }
  body:not([data-layout-editor=true]) .widget-type-socials .widget-content { padding:4px; }
}
@container(max-width:260px) {
  body[data-layout-editor=true] .widget-type-socials .widget-content { padding:32px 4px 4px; }
  body[data-layout-editor=true] .widget-type-socials .widget-edit-controls { top:4px; right:8px; transform:none; }
  body[data-layout-editor=true] .widget-type-socials .social-dock { --dock-gap:0px; min-height:22px; }
  body[data-layout-editor=true] .widget-type-socials .social-link { min-height:22px; }
  body[data-layout-editor=true] .widget-type-socials .social-symbol .ui-icon { width:16px; height:16px; }
}

/* One borderless tray: the travelling light ties all six links together. */
.board-widget.widget-type-socials,
body:not([data-layout-editor=true]) .board-widget.widget-type-socials:hover {
  border:0;
  background:transparent;
  box-shadow:none;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
}
.widget-type-socials .social-dock {
  --dock-gap:0px;
  max-width:360px;
  margin-inline:auto;
  border-radius:20px;
  background:linear-gradient(135deg,rgba(255,240,219,.085),rgba(30,23,25,.2));
  backdrop-filter:blur(18px) saturate(110%);
  -webkit-backdrop-filter:blur(18px) saturate(110%);
}
.social-dock::before {
  border:0;
  border-radius:16px;
  background:radial-gradient(ellipse at 50% 100%,rgba(255,225,184,.19),rgba(255,241,221,.065) 65%,transparent);
  box-shadow:none;
  transition:transform .4s var(--ease),width .4s var(--ease),opacity .25s var(--ease);
}
.social-dock .social-link { border:0; border-radius:16px; }
.social-dock .social-symbol {
  transition:transform .4s cubic-bezier(.2,.8,.25,1.3),filter .35s var(--ease),color .25s var(--ease);
}
.social-dock .social-link:focus-visible .social-symbol {
  transform:translateY(-3px);
  filter:drop-shadow(0 4px 7px rgba(255,225,184,.3));
}
.social-dock .social-link:active .social-symbol { transform:translateY(0) scale(.9); }
@media(hover:hover) {
  .social-dock .social-link:hover .social-symbol {
    transform:translateY(-3px);
    filter:drop-shadow(0 4px 7px rgba(255,225,184,.3));
    color:#fff3df;
  }
  .social-dock .social-link:active .social-symbol { transform:translateY(0) scale(.9); }
}
@media(prefers-reduced-motion:reduce) {
  .social-dock::before,.social-dock .social-symbol { transition:none; }
  .social-dock .social-link:is(:hover,:focus-visible,:active) .social-symbol { transform:none; }
}

/* A single launcher keeps the artwork clear; its links unfold above it. */
.board-widget.widget-type-socials { overflow:visible; container-type:normal; }
.board-widget.widget-type-socials:has(.social-links-panel:not([hidden])) { z-index:10; }
.social-launcher { position:relative; align-self:flex-start; max-width:100%; font-family:var(--header-font); }
.social-toggle {
  display:flex; align-items:center; gap:12px;
  min-height:48px; padding:12px 18px;
  border:0; border-radius:18px;
  background:linear-gradient(135deg,rgba(255,240,219,.16),rgba(40,26,29,.35));
  color:#f4e9d8; font:inherit; font-size:18px;
  backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px);
  box-shadow:0 6px 24px rgba(15,10,13,.12);
}
.social-toggle .ui-icon { width:19px; height:19px; }
.social-toggle-chevron { opacity:.65; transition:transform .3s var(--ease); }
.social-toggle-chevron .ui-icon { width:15px; height:15px; }
.social-toggle[aria-expanded=true] .social-toggle-chevron { transform:rotate(180deg); }
.social-toggle:hover,.social-toggle[aria-expanded=true] { background:linear-gradient(135deg,rgba(255,240,219,.23),rgba(40,26,29,.45)); }
.social-links-panel {
  position:absolute; bottom:100%; left:0;
  width:min(360px,calc(100vw - 64px));
  padding-bottom:34px;
  transform-origin:24px bottom;
  animation:social-unfold .28s cubic-bezier(.2,.7,.3,1) both;
}
.social-links-panel .social-dock {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:4px; padding:10px; height:auto;
  border:1px solid rgba(255,240,219,.17); border-radius:22px;
  background:linear-gradient(145deg,rgba(89,64,54,.65),rgba(31,23,27,.83));
  box-shadow:0 16px 40px rgba(12,7,12,.25),inset 0 1px 0 rgba(255,243,221,.08);
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
}
.social-links-panel .social-dock::before { display:none; }
.social-links-panel .social-link {
  display:flex; align-items:center; justify-content:flex-start;
  gap:12px; padding:12px 10px; min-height:56px; border-radius:13px;
}
.social-links-panel .social-link,
.social-toggle {
  font-family:'Tenor Sans','Golos Text',Arial,sans-serif;
  font-weight:400;
  font-synthesis:none;
}
.social-link-caption { min-width:0; font-size:18px; line-height:1.2; overflow-wrap:anywhere; }
.social-link-caption small { display:block; margin-top:4px; font-size:13px; line-height:1.3; color:#d3c7b7; }
.social-links-panel .social-link { min-height:68px; }
@media(max-width:380px) {
  .social-links-panel .social-link { gap:8px; padding-inline:8px; }
  .social-link-caption { font-size:16px; }
}
.social-links-panel .social-link:hover,.social-links-panel .social-link:focus-visible { background:rgba(255,239,217,.09); }
body[data-layout-editor=true] .social-launcher { margin-right:0; }
@keyframes social-unfold {
  from { opacity:0; transform:translateY(8px) scale(.96); }
  to { opacity:1; transform:translateY(0) scale(1); }
}
@media(max-height:500px) {
  .social-links-panel .social-link { min-height:44px; padding-block:7px; }
}
@media(prefers-reduced-motion:reduce) {
  .social-links-panel { animation:none; }
  .social-toggle-chevron { transition:none; }
}

/* Short, interaction-led motion for every link, including upcoming channels. */
.social-toggle { position:relative; overflow:hidden; }
.social-toggle::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(110deg,transparent 25%,rgba(255,246,224,.17) 50%,transparent 75%);
  transform:translateX(-110%);
}
.social-toggle[aria-expanded=true]::after { animation:social-sheen .8s var(--ease) both; }
.social-toggle-icon { display:flex; transition:transform .35s var(--ease); }
.social-toggle[aria-expanded=true] .social-toggle-icon { transform:rotate(-9deg) translateY(-1px); }
.social-toggle:active { scale:.97; }
.social-links-panel:not([hidden]) .social-link {
  animation:social-link-enter .36s var(--ease) backwards;
  animation-delay:var(--social-delay,0ms);
}
.social-links-panel .social-link:nth-child(1) { --social-delay:40ms; --social-motion:social-sway; }
.social-links-panel .social-link:nth-child(2) { --social-delay:85ms; --social-motion:social-sway; }
.social-links-panel .social-link:nth-child(3) { --social-delay:130ms; --social-motion:social-sway; }
.social-links-panel .social-link:nth-child(4) { --social-delay:175ms; --social-motion:social-heart; }
.social-links-panel .social-link:nth-child(5) { --social-delay:220ms; --social-motion:social-sway; }
.social-links-panel .social-link:nth-child(6) { --social-delay:265ms; --social-motion:social-heart; }
.social-links-panel .social-link-caption { transition:translate .3s var(--ease),color .3s var(--ease); }
.social-links-panel .social-link:focus-visible .social-link-caption { translate:3px 0; color:#fff3df; }
.social-links-panel .social-link:focus-visible :is(.ui-icon,.social-art) { animation:var(--social-motion) .65s var(--ease); }
.social-links-panel .social-link:active .social-symbol { scale:.9; }
@media(hover:hover) {
  .social-links-panel .social-link:hover .social-link-caption { translate:3px 0; color:#fff3df; }
  .social-links-panel .social-link:hover :is(.ui-icon,.social-art) { animation:var(--social-motion) .65s var(--ease); }
}
@keyframes social-link-enter {
  from { opacity:0; transform:translateY(8px); }
  to { opacity:1; transform:translateY(0); }
}
@keyframes social-sheen { to { transform:translateX(110%); } }
@keyframes social-sway {
  30% { transform:translateY(-2px) rotate(-8deg); }
  65% { transform:translateY(-1px) rotate(5deg); }
  85% { transform:rotate(-2deg); }
}
@keyframes social-heart {
  25%,65% { transform:scale(1.16); }
  45% { transform:scale(.96); }
}

/* Pixel cat is the disclosure button itself, with a quiet hint underneath. */
.board-widget.widget-type-socials:has(.social-cat) {
  --social-min-height:clamp(134px,13vw,196px);
  --social-max-height:clamp(134px,13vw,196px);
}
.social-launcher:has(.social-cat) { width:min(100%,clamp(180px,18vw,280px)); }
.social-toggle:has(.social-cat),
.social-toggle:has(.social-cat):hover,
.social-toggle:has(.social-cat)[aria-expanded=true] {
  width:100%; height:auto; aspect-ratio:150 / 98; min-height:0;
  display:block; padding:0; overflow:visible;
  border-radius:14px; background:none; box-shadow:none;
  backdrop-filter:none; -webkit-backdrop-filter:none;
}
.social-toggle:has(.social-cat)::after { display:none; }
.social-cat { position:absolute; width:100%; height:auto; aspect-ratio:150 / 84; left:0; bottom:18px; pointer-events:none; }
.social-cat svg { display:block; width:100%; height:100%; overflow:visible; filter:drop-shadow(0 3px 5px rgba(10,6,10,.25)); }
.cat-toggle-label {
  position:absolute; left:0; right:0; bottom:0;
  font-size:clamp(14px,1.2vw,18px); line-height:1.2; color:#e9dcc9;
  text-shadow:0 2px 4px #10090d,0 0 10px rgba(13,7,10,.85);
  transition:color .25s var(--ease);
}
.cat-head { transform-origin:45px 50px; transition:transform .35s var(--ease); }
.cat-small .cat-head { transform:rotate(-9deg); }
.cat-head-sway { transform-origin:45px 50px; animation:cat-head-sway 4.8s ease-in-out infinite; }
.cat-small .cat-head-sway { animation-duration:5.6s; animation-delay:-2.3s; }
.cat-eyes { transform-origin:45px 36px; animation:cat-blink 6s infinite; transition:transform .2s var(--ease); }
.social-toggle:is(:hover,:focus-visible) .cat-eyes { animation:none; transform:scaleY(.3); }
.cat-small .cat-eyes { animation-delay:1.8s; }
.cat-tail { transform-origin:72px 56px; transition:transform .4s var(--ease); }
.cat-spark { opacity:0; transition:opacity .3s var(--ease); }
.cat-star { transform-box:fill-box; transform-origin:center; fill:#f3e5c7; stroke-width:.5; filter:drop-shadow(0 0 3px rgba(255,231,183,.55)); }
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-star {
  animation:cat-star-twinkle 1.8s ease-in-out infinite;
}
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-star-second { animation-delay:.45s; }
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-star-third { animation-delay:.8s; }
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-star-fourth { animation-delay:1.15s; }
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-head { transform:translateY(-3px) rotate(-5deg); }
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-small .cat-head { transform:translate(-2px,-3px) rotate(-13deg); }
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-tail { animation:cat-tail-wave 1.4s ease-in-out infinite; }
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-small .cat-tail { animation-delay:-.5s; animation-duration:1.7s; }
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-spark { opacity:.8; }
.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-toggle-label { color:#fff0d7; }
.social-toggle:has(.social-cat):active .cat-head { transform:translateY(1px); }
@keyframes cat-blink { 0%,43%,47%,100% { transform:scaleY(1); } 45% { transform:scaleY(.1); } }
@keyframes cat-head-sway { 0%,100% { transform:rotate(-2deg); } 50% { transform:rotate(2deg); } }
@keyframes cat-tail-wave { 0%,100% { transform:rotate(-6deg); } 50% { transform:rotate(9deg); } }
@keyframes cat-star-twinkle {
  0%,100% { opacity:.45; transform:scale(.6); }
  50% { opacity:.95; transform:scale(.86); }
}
@media(max-width:767px) {
  body:not([data-layout-editor=true]) .board-widget.widget-type-socials:has(.social-cat) {
    top:auto!important;
    bottom:12px!important;
  }
}
@media(max-height:650px) {
  body .board-widget.widget-type-socials:has(.social-cat) {
    --social-min-height:94px;
    --social-max-height:94px;
  }
  .social-launcher:has(.social-cat) { width:min(100%,clamp(110px,19vh,150px)); }
}
@media(prefers-reduced-motion:reduce) {
  .social-toggle::after,.social-links-panel:not([hidden]) .social-link,
  .social-links-panel .social-link:is(:hover,:focus-visible) :is(.ui-icon,.social-art) { animation:none; }
  .social-toggle-icon,.social-links-panel .social-link-caption { transition:none; }
  .social-toggle[aria-expanded=true] .social-toggle-icon { transform:none; }
  .social-links-panel .social-link:is(:hover,:focus-visible) .social-link-caption { translate:none; }
  .social-toggle:active,.social-links-panel .social-link:active .social-symbol { scale:1; }
  .cat-head-sway,.cat-eyes,.social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-tail { animation:none; }
  .social-toggle:is(:hover,:focus-visible,[aria-expanded=true]) .cat-star { animation:none; }
  .cat-head,.cat-tail,.cat-spark,.cat-toggle-label,.cat-eyes { transition:none; }
  .social-toggle:is(:hover,:focus-visible,[aria-expanded=true],:active) .cat-head { transform:none; }
}

/* Stagger the exit before removing the panel from layout. */
.social-links-panel[data-closing=true] { pointer-events:none; animation:social-fold .46s ease both; }
.social-links-panel[data-closing=true] .social-link { animation:social-link-exit .2s ease both; animation-delay:calc(265ms - var(--social-delay,40ms)); }
@keyframes social-link-exit { to { opacity:0; transform:translateY(6px); } }
@keyframes social-fold { 0%,55% { opacity:1; transform:translateY(0) scale(1); } 100% { opacity:0; transform:translateY(8px) scale(.96); } }
@media(prefers-reduced-motion:reduce) { .social-links-panel[data-closing=true],.social-links-panel[data-closing=true] .social-link { animation:none; } }