/* Publish-everywhere orbit of the public home (src/flicko-network-orbit.js). The panel keeps .publish-stage (glass,
   light/dark). Dots are muted at rest and light up in Urucum/Caju while a post card travels. */
.fk-orbit{
 --fk-orbit-dot:rgba(26,16,36,.24);
 --fk-orbit-badge:58px;--fk-orbit-glyph:26px;--fk-orbit-hub:96px;--fk-orbit-card:22px;
 --fk-orbit-urucum:var(--fk-brand-mark,#FF4A1C);--fk-orbit-caju:var(--fk-caju,#FFB21E);
 position:relative;isolation:isolate;
}
html.dark .fk-orbit,html[data-theme=dark] .fk-orbit{--fk-orbit-dot:rgba(255,255,255,.22)}

/* Text alternative + the server-filtered source list. Without JS it is the visible fallback: a centred row of badges. */
.fk-orbit-list{display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:14px;height:100%;margin:0;padding:24px;list-style:none}
.fk-orbit-list li[hidden]{display:none}
.fk-orbit-list [data-network]{display:grid;place-items:center;width:52px;height:52px;border-radius:9999px;color:var(--fk-text,#1A1024)}
.fk-orbit-list [data-network] svg{width:24px;height:24px}
.fk-orbit.is-mounted .fk-orbit-list{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

.fk-orbit-layer{position:absolute;inset:0;pointer-events:none;user-select:none}
.fk-orbit-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.fk-orbit-path,.fk-orbit-trace,.fk-orbit-comet{fill:none;stroke-linecap:round}
.fk-orbit-path{stroke:var(--fk-orbit-dot);stroke-width:1.8;stroke-dasharray:.1 6.5}
.fk-orbit-trace{stroke-width:2.6;stroke-dasharray:.1 6.5;opacity:0;transition:opacity .7s var(--fk-ease-settle,ease-out)}
.fk-orbit-trace.is-on{opacity:1;transition:opacity .18s ease-out}
.fk-orbit-comet{stroke-width:2.4;stroke-dasharray:.22 2;opacity:0}

/* Badge. Rest: monochrome official glyph on the panel disc. Lit (card arrival, .is-hit): the same path in the network's
   official colour on its own disc (ring + halo + glow in that colour), an expanding glow ring and the name pill. Colours
   come per badge from src/brand-glyphs.js as custom properties (--fk-net*), set by the orbit module; only opacity and
   transform animate. Dark: the lit disc goes near-black so every official colour keeps >= 3:1, black marks turn white. */
.fk-orbit-badge{position:absolute;left:0;top:0;width:var(--fk-orbit-badge);height:var(--fk-orbit-badge);
 --fk-net-on:var(--fk-net,#1A1024);--fk-net-ring-on:var(--fk-net-ring,rgba(26,16,36,.42));--fk-net-halo-on:var(--fk-net-halo,rgba(26,16,36,.08));--fk-net-glow-on:var(--fk-net-glow,rgba(26,16,36,.34));--fk-net-lit-bg:#FFFFFF}
html.dark .fk-orbit-badge,html[data-theme=dark] .fk-orbit-badge{--fk-net-on:var(--fk-net-dark,#FFFFFF);--fk-net-ring-on:var(--fk-net-ring-dark,rgba(255,255,255,.55));--fk-net-halo-on:var(--fk-net-halo-dark,rgba(255,255,255,.12));--fk-net-glow-on:var(--fk-net-glow-dark,rgba(255,255,255,.3));--fk-net-lit-bg:#0B0810}
.fk-orbit-face{position:absolute;inset:0}
.fk-orbit-disc{position:absolute;inset:0;display:grid;place-items:center;border-radius:9999px;color:var(--fk-text,#1A1024)}
.fk-orbit-disc svg,.fk-orbit-lit svg{width:var(--fk-orbit-glyph);height:var(--fk-orbit-glyph)}
.fk-orbit-lit{position:absolute;inset:0;display:grid;place-items:center;border-radius:9999px;background:var(--fk-net-lit-bg);color:var(--fk-net-on);
 box-shadow:0 0 0 1.5px var(--fk-net-ring-on),0 0 0 6px var(--fk-net-halo-on),0 10px 26px -8px var(--fk-net-glow-on);opacity:0;transition:opacity .55s var(--fk-ease-settle,cubic-bezier(.2,.8,.2,1))}
.fk-orbit-ring{position:absolute;inset:0;border-radius:9999px;border:2px solid var(--fk-net-ring-on);box-shadow:0 0 14px var(--fk-net-glow-on);opacity:0}
.fk-orbit-tag{position:absolute;left:50%;top:calc(100% + 7px);padding:4px 10px;border-radius:9999px;background:rgba(255,255,255,.94);color:var(--fk-text,#1A1024);
 font:600 .75rem/1.25 var(--fk-font-text,Figtree,system-ui,sans-serif);letter-spacing:.005em;white-space:nowrap;box-shadow:0 0 0 1px rgba(26,16,36,.07),0 8px 18px -10px rgba(26,16,36,.45);
 opacity:0;transform:translate(calc(-50% + var(--fk-tag-dx,0px)),-4px);transition:opacity .45s var(--fk-ease-settle,cubic-bezier(.2,.8,.2,1)),transform .45s var(--fk-ease-settle,cubic-bezier(.2,.8,.2,1))}
.fk-orbit-badge.is-tag-above .fk-orbit-tag{top:auto;bottom:calc(100% + 7px);transform:translate(calc(-50% + var(--fk-tag-dx,0px)),4px)}
html.dark .fk-orbit-tag,html[data-theme=dark] .fk-orbit-tag{background:rgba(31,21,40,.94);color:#FBF8F6;box-shadow:0 0 0 1px rgba(255,255,255,.12),0 8px 18px -10px rgba(0,0,0,.8)}
.fk-orbit.is-phone .fk-orbit-tag{padding:3px 8px;font-size:.6875rem}
.fk-orbit-badge.is-hit .fk-orbit-lit{opacity:1;transition-duration:.16s}
.fk-orbit-badge.is-hit .fk-orbit-tag{opacity:1;transform:translate(calc(-50% + var(--fk-tag-dx,0px)),0);transition-duration:.22s}
.fk-orbit.is-phone .fk-orbit-badge.is-all .fk-orbit-tag{opacity:0} /* broadcast on a phone: colours only, nine pills would crowd */
.fk-orbit-badge.is-hit .fk-orbit-face{animation:fk-orbit-pulse .6s var(--fk-ease-flick,cubic-bezier(.22,1.32,.36,1))}
.fk-orbit-badge.is-hit .fk-orbit-ring{animation:fk-orbit-ring .9s cubic-bezier(.22,1,.36,1) forwards}
@keyframes fk-orbit-pulse{0%{transform:scale(1)}35%{transform:scale(1.14)}100%{transform:scale(1)}}
@keyframes fk-orbit-ring{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(1.75)}}
/* Pointer hover shows the lit state too (the only coloured state with reduced motion, where nothing travels). */
@media (hover:hover){
 .fk-orbit-badge{pointer-events:auto}
 .fk-orbit-badge:hover .fk-orbit-lit{opacity:1;transition-duration:.16s}
 .fk-orbit-badge:hover .fk-orbit-tag{opacity:1;transform:translate(calc(-50% + var(--fk-tag-dx,0px)),0);transition-duration:.22s}
}

/* "Ver todos os canais" under the orbit: opens the public channels page (/canais). */
.fk-orbit-more{display:flex;justify-content:center;margin:28px 0 0}
.fk-orbit-more-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 20px;border-radius:9999px;color:var(--fk-text,#1A1024);
 font:600 .9375rem/1 var(--fk-font-text,Figtree,system-ui,sans-serif);text-decoration:none;background:var(--fk-glass-fill,rgba(255,255,255,.64));border:1px solid var(--fk-glass-border,rgba(255,255,255,.8));
 box-shadow:var(--fk-glass-highlight,inset 0 1px rgba(255,255,255,.95)),var(--fk-elev-2,0 6px 16px -6px rgba(26,16,36,.18));-webkit-backdrop-filter:var(--fk-glass-blur,blur(20px));backdrop-filter:var(--fk-glass-blur,blur(20px));
 transition:transform var(--fk-dur-tap,125ms) var(--fk-ease-settle,ease-out)}
.fk-orbit-more-link svg{flex-shrink:0;color:var(--fk-text-brand,#A9280B);transition:transform var(--fk-dur-flick,250ms) var(--fk-ease-flick,ease-out)}
.fk-orbit-more-link:hover{transform:translateY(-1px)}
.fk-orbit-more-link:hover svg{transform:translateX(3px)}
.fk-orbit-more-link:focus-visible{outline:2px solid var(--fk-focus,#2B4BE0);outline-offset:3px}

.fk-orbit-hub{position:absolute;left:0;top:0;width:var(--fk-orbit-hub);height:var(--fk-orbit-hub)}
.fk-orbit-hub-disc{position:absolute;inset:0;border-radius:9999px}
.fk-orbit-hub-ripple{position:absolute;inset:0;border-radius:9999px;border:1.5px solid var(--fk-orbit-urucum);opacity:0}
.fk-orbit-hub-ripple.is-on{animation:fk-orbit-ring 1.1s cubic-bezier(.22,1,.36,1) forwards}
.fk-orbit-hub-rig{position:absolute;inset:0;display:grid;place-items:center;transform-origin:50% 70%}
.fk-orbit-hub-rig>*{grid-area:1/1}
.fk-orbit-hub-slot{display:grid;place-items:center;line-height:0}
.fk-orbit-hub.has-mascot .fk-orbit-hub-pingo{display:none}
.fk-orbit-hub-pingo{display:grid;place-items:center;line-height:0}
.fk-orbit-hub-pingo svg{width:calc(var(--fk-orbit-hub) * .46);height:calc(var(--fk-orbit-hub) * .46)}
.fk-orbit-hub-rig.is-flick{animation:fk-orbit-flick .42s var(--fk-ease-flick,cubic-bezier(.22,1.32,.36,1))}
.fk-orbit-hub-rig.is-flick.is-big{animation:fk-orbit-flick-big .56s var(--fk-ease-flick,cubic-bezier(.22,1.32,.36,1))}
@keyframes fk-orbit-flick{0%{transform:none}30%{transform:scale(1.07,.9) rotate(-12deg)}62%{transform:scale(.97,1.05) rotate(5deg)}100%{transform:none}}
@keyframes fk-orbit-flick-big{0%{transform:none}25%{transform:scale(1.12,.86) rotate(12deg)}55%{transform:scale(.94,1.1) rotate(-6deg)}100%{transform:none}}

/* Mini post card (4:5): a neutral customer-like placeholder, never Flicko branding. */
.fk-orbit-card{position:absolute;left:0;top:0;display:flex;flex-direction:column;gap:2px;box-sizing:border-box;width:var(--fk-orbit-card);height:calc(var(--fk-orbit-card) * 1.25);padding:2px;border-radius:4px;background:#fff;box-shadow:0 6px 14px -6px rgba(26,16,36,.5),0 0 0 .5px rgba(26,16,36,.08);opacity:0;will-change:transform,opacity}
.fk-orbit-card.is-ghost{box-shadow:none}
.fk-orbit-card-img{flex:1;border-radius:2px;background:linear-gradient(140deg,#d7e7dc,#93b9a6)}
.fk-orbit-card i{display:block;height:2px;width:80%;border-radius:1px;background:#d8d3dc}
.fk-orbit-card i+i{width:52%}
.fk-orbit-card[data-tone="1"] .fk-orbit-card-img{background:linear-gradient(140deg,#f2e2c9,#d6b086)}
.fk-orbit-card[data-tone="2"] .fk-orbit-card-img{background:linear-gradient(140deg,#d3e2f2,#8eaed4)}
.fk-orbit-card[data-tone="3"] .fk-orbit-card-img{background:linear-gradient(140deg,#e2dde9,#ad9fc2)}

/* Reduced motion: static layout, every path visible, one gentle highlight when the panel first shows. */
.fk-orbit.is-lit .fk-orbit-trace{opacity:.7;transition:opacity 1.2s ease}
@media (prefers-reduced-motion:reduce){
 .fk-orbit-trace{transition:opacity 1.2s ease}
 .fk-orbit-badge.is-hit .fk-orbit-face,.fk-orbit-badge.is-hit .fk-orbit-ring,.fk-orbit-hub-rig.is-flick,.fk-orbit-hub-ripple.is-on{animation:none}
 .fk-orbit-lit,.fk-orbit-tag,.fk-orbit-more-link,.fk-orbit-more-link svg{transition:none}
 .fk-orbit-more-link:hover,.fk-orbit-more-link:hover svg{transform:none}
 .fk-orbit-card{display:none}
}