/* Kiko hologram assistant — adapted from the supplied AXIOM v1.0 assets. */

kiko-guide-agent {
  --kiko-cyan: #67f6ff;
  --kiko-violet: #a982ff;
  --kiko-amber: #ffc857;
  --kiko-mint: #73ffbf;
  --kiko-danger: #ff6675;
  --kiko-ink: #e6faff;
  --kiko-ink-secondary: #a8cbd5;
  --kiko-ink-muted: #688995;
  --kiko-panel: rgba(3, 12, 16, 0.96);
  --kiko-accent: var(--kiko-cyan);
  --kiko-host-bottom: max(14px, env(safe-area-inset-bottom));
  --kiko-bust-width: min(clamp(288px, 18vw, 328px), calc((100dvh - 28px) / 2));
  /* Keep the visible top of every full-body master inside the viewport. The
     lower edge may extend below it to preserve the intentional floor crop. */
  --kiko-full-body-width: min(clamp(420px, 34vw, 560px), calc(62.5dvh - 10px));
  --kiko-character-width: var(--kiko-bust-width);
  --kiko-frame-crop: 0px;
  --kiko-visible-bottom-shift: 0%;
  --kiko-card-width: clamp(270px, 20vw, 320px);
  --kiko-card-dock-gap: 10px;
  --kiko-mobile-nav-offset: 78px;
  --kiko-font: Inter, "Avenir Next", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --kiko-mono: "SFMono-Regular", Menlo, Monaco, Consolas, monospace;
  position: fixed;
  /* Hovered chart panels rise to 3000 so their tooltips escape neighboring
     cards. Keep Kiko above the panel surface; the mobile tooltip remains above
     her at 3200. */
  z-index: 3050;
  right: max(14px, env(safe-area-inset-right));
  bottom: var(--kiko-host-bottom);
  display: block;
  width: min(650px, calc(100% - 24px));
  height: min(670px, calc(100dvh - 28px));
  max-width: calc(100% - 24px);
  overflow: visible;
  color: var(--kiko-ink);
  contain: layout style;
  font-family: var(--kiko-font);
  overflow-anchor: none;
  pointer-events: none;
  transition: opacity 160ms ease, visibility 0s linear 0s;
}

kiko-guide-agent[hidden] {
  display: none;
}

kiko-guide-agent[position="bottom-left"] {
  right: auto;
  left: max(14px, env(safe-area-inset-left));
}

kiko-guide-agent[position="top-right"] {
  top: max(86px, calc(env(safe-area-inset-top) + 14px));
  bottom: auto;
}

kiko-guide-agent[position="top-left"] {
  top: max(86px, calc(env(safe-area-inset-top) + 14px));
  right: auto;
  bottom: auto;
  left: max(14px, env(safe-area-inset-left));
}

/* Character footage always resolves against the viewport floor. Top/bottom
   placement still controls the information card, never the character crop. */
kiko-guide-agent[data-framing][position="top-right"],
kiko-guide-agent[data-framing][position="top-left"] {
  top: auto;
  bottom: var(--kiko-host-bottom);
}

kiko-guide-agent[data-framing][position="top-right"] .kiko-card,
kiko-guide-agent[data-framing][position="top-left"] .kiko-card {
  top: auto;
  bottom: 18px;
}

kiko-guide-agent[data-framing="bust"] {
  --kiko-character-width: var(--kiko-bust-width);
  --kiko-frame-crop: 0px;
  /* The Runway safe-frame packager centers every complete bust inside the
     portrait canvas. Consume only its verified transparent floor so the
     complete silhouette meets the viewport without being clipped. */
  --kiko-visible-bottom-shift: 24.5%;
}

kiko-guide-agent[data-framing="full-body"] {
  --kiko-character-width: var(--kiko-full-body-width);
  --kiko-frame-crop: 0px;
  --kiko-visible-bottom-shift: 4.5%;
}

kiko-guide-agent[position="bottom-left"] .kiko-stage,
kiko-guide-agent[position="top-left"] .kiko-stage {
  right: auto;
  left: 0;
}

kiko-guide-agent[position="bottom-left"] .kiko-card,
kiko-guide-agent[position="top-left"] .kiko-card {
  right: 0;
  left: auto;
}

kiko-guide-agent[position="bottom-left"] .kiko-beacon,
kiko-guide-agent[position="top-left"] .kiko-beacon {
  right: auto;
  left: 12px;
}

kiko-guide-agent[data-state="warning"] {
  --kiko-accent: var(--kiko-amber);
}

kiko-guide-agent[data-state="success"] {
  --kiko-accent: var(--kiko-mint);
}

kiko-guide-agent[data-state="confirm"] {
  --kiko-accent: var(--kiko-violet);
}

kiko-guide-agent[data-state="manual"] {
  --kiko-accent: var(--kiko-danger);
}

kiko-guide-agent[data-performance="protect"] {
  --kiko-accent: var(--kiko-amber);
}

kiko-guide-agent[data-performance="execute"],
kiko-guide-agent[data-performance="confirm"] {
  --kiko-accent: var(--kiko-violet);
}

kiko-guide-agent[data-performance="recover"] {
  --kiko-accent: var(--kiko-mint);
}

kiko-guide-agent .kiko-shell {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: visible;
}

kiko-guide-agent .kiko-stage {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: calc(0px - var(--kiko-host-bottom) - var(--kiko-frame-crop));
  width: var(--kiko-character-width);
  aspect-ratio: 9 / 16;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  opacity: 0;
  mix-blend-mode: normal;
  pointer-events: none;
  transform: translate3d(10px, 8px, 0) scale(0.97);
  transform-origin: 50% 100%;
  transition:
    opacity 260ms ease,
    transform 420ms cubic-bezier(0.16, 1, 0.3, 1);
  translate: 0 var(--kiko-visible-bottom-shift);
}

kiko-guide-agent .kiko-prop-library {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
  pointer-events: none;
}

kiko-guide-agent .kiko-scene-layer {
  position: absolute;
  z-index: 4;
  inset: 0;
  overflow: visible;
  color: var(--kiko-accent);
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease 120ms;
}

kiko-guide-agent[data-open="true"] .kiko-scene-layer {
  opacity: 0.92;
}

kiko-guide-agent .kiko-scene-prop {
  position: absolute;
  top: 16%;
  left: 3%;
  width: 24%;
  min-width: 54px;
  max-width: 76px;
  overflow: visible;
  fill: none;
  filter:
    drop-shadow(0 0 5px color-mix(in srgb, var(--kiko-accent) 84%, transparent))
    drop-shadow(0 0 16px color-mix(in srgb, var(--kiko-accent) 38%, transparent));
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
  transform-box: fill-box;
  transform-origin: 50% 50%;
}

kiko-guide-agent .kiko-prop-fill {
  fill: currentColor;
  stroke: none;
}

kiko-guide-agent[data-scene="network"] .kiko-scene-prop,
kiko-guide-agent[data-scene="transaction"] .kiko-scene-prop,
kiko-guide-agent[data-scene="security"] .kiko-scene-prop,
kiko-guide-agent[data-scene="guard"] .kiko-scene-prop {
  top: 12%;
  right: 1%;
  left: auto;
}

kiko-guide-agent[data-scene="timer"] .kiko-scene-prop,
kiko-guide-agent[data-scene="yield"] .kiko-scene-prop,
kiko-guide-agent[data-scene="repair"] .kiko-scene-prop,
kiko-guide-agent[data-scene="scout"] .kiko-scene-prop {
  top: 23%;
}

kiko-guide-agent .kiko-scene-orbit {
  position: absolute;
  top: 12%;
  left: 0;
  width: 29%;
  aspect-ratio: 1;
  border: 1px solid color-mix(in srgb, var(--kiko-accent) 35%, transparent);
  border-radius: 50%;
  box-shadow: 0 0 12px color-mix(in srgb, var(--kiko-accent) 18%, transparent);
  opacity: 0.38;
  transform-origin: center;
}

kiko-guide-agent .kiko-scene-orbit-b {
  top: 14%;
  left: 2%;
  width: 25%;
  border-style: dashed;
  animation-direction: reverse;
}

kiko-guide-agent[data-scene="network"] .kiko-scene-orbit,
kiko-guide-agent[data-scene="transaction"] .kiko-scene-orbit,
kiko-guide-agent[data-scene="security"] .kiko-scene-orbit,
kiko-guide-agent[data-scene="guard"] .kiko-scene-orbit {
  right: 0;
  left: auto;
}

kiko-guide-agent .kiko-scene-particle {
  position: absolute;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 9px currentColor;
  opacity: 0;
}

kiko-guide-agent .kiko-scene-particle-a {
  top: 20%;
  left: 7%;
}

kiko-guide-agent .kiko-scene-particle-b {
  top: 27%;
  left: 19%;
  width: 3px;
  height: 3px;
}

kiko-guide-agent .kiko-scene-particle-c {
  top: 13%;
  left: 25%;
  width: 4px;
  height: 4px;
}

kiko-guide-agent .kiko-humor-beat {
  position: absolute;
  top: 38%;
  left: 2%;
  max-width: 112px;
  padding: 4px 6px;
  border: 1px solid color-mix(in srgb, var(--kiko-accent) 32%, transparent);
  border-radius: 999px;
  color: color-mix(in srgb, var(--kiko-accent) 84%, white);
  background: rgba(3, 11, 16, 0.72);
  box-shadow: 0 0 12px color-mix(in srgb, var(--kiko-accent) 12%, transparent);
  font: 700 7px/1 var(--kiko-mono);
  letter-spacing: 0.08em;
  opacity: 0;
  text-align: center;
  text-transform: uppercase;
  transform: translateY(5px) scale(0.9);
  white-space: nowrap;
}

kiko-guide-agent[data-humor="none"] .kiko-humor-beat,
kiko-guide-agent .kiko-humor-beat:empty {
  display: none;
}

kiko-guide-agent[data-open="true"]:not([data-humor="none"]) .kiko-humor-beat {
  animation: kiko-humor-pop 5.6s ease-in-out 900ms infinite;
}

kiko-guide-agent[data-effect="scan"] .kiko-scene-prop {
  animation: kiko-prop-scan 4.2s linear infinite;
}

kiko-guide-agent[data-effect="ping"] .kiko-scene-prop,
kiko-guide-agent[data-effect="submit"] .kiko-scene-prop {
  animation: kiko-prop-ping 2.2s ease-in-out infinite;
}

kiko-guide-agent[data-effect="ticker"] .kiko-scene-prop {
  animation: kiko-prop-ticker 3.2s steps(4, end) infinite;
}

kiko-guide-agent[data-effect="orbit"] .kiko-scene-prop,
kiko-guide-agent[data-effect="unlock"] .kiko-scene-prop {
  animation: kiko-prop-orbit 5s ease-in-out infinite;
}

kiko-guide-agent[data-effect="tick"] .kiko-scene-prop {
  animation: kiko-prop-tick 4s cubic-bezier(0.6, 0, 0.4, 1) infinite;
}

kiko-guide-agent[data-effect="float"] .kiko-scene-prop,
kiko-guide-agent[data-effect="shower"] .kiko-scene-prop {
  animation: kiko-prop-float 2.8s ease-in-out infinite;
}

kiko-guide-agent[data-effect="align"] .kiko-scene-prop {
  animation: kiko-prop-align 2.6s ease-in-out infinite;
}

kiko-guide-agent[data-effect="guard"] .kiko-scene-prop {
  animation: kiko-prop-guard 1.8s ease-in-out infinite;
}

kiko-guide-agent[data-effect="repair"] .kiko-scene-prop {
  animation: kiko-prop-repair 3.4s cubic-bezier(0.5, 0, 0.2, 1) infinite;
}

kiko-guide-agent[data-effect="scout"] .kiko-scene-prop {
  animation: kiko-prop-scout 3.8s ease-in-out infinite;
}

kiko-guide-agent[data-effect="handoff"] .kiko-scene-prop {
  animation: kiko-prop-handoff 3.2s ease-in-out infinite;
}

kiko-guide-agent[data-effect="scan"] .kiko-scene-orbit,
kiko-guide-agent[data-effect="orbit"] .kiko-scene-orbit,
kiko-guide-agent[data-effect="guard"] .kiko-scene-orbit,
kiko-guide-agent[data-effect="scout"] .kiko-scene-orbit {
  animation: kiko-scene-orbit 5.5s linear infinite;
}

kiko-guide-agent[data-effect="ping"] .kiko-scene-particle,
kiko-guide-agent[data-effect="submit"] .kiko-scene-particle,
kiko-guide-agent[data-effect="shower"] .kiko-scene-particle,
kiko-guide-agent[data-effect="repair"] .kiko-scene-particle,
kiko-guide-agent[data-effect="scout"] .kiko-scene-particle {
  animation: kiko-scene-particle 2.4s ease-out infinite;
}

kiko-guide-agent .kiko-scene-particle-b {
  animation-delay: -800ms !important;
}

kiko-guide-agent .kiko-scene-particle-c {
  animation-delay: -1.55s !important;
}

kiko-guide-agent[data-phase="entering"] .kiko-stage,
kiko-guide-agent[data-phase="leaving"] .kiko-stage,
kiko-guide-agent[data-phase="entering"] .kiko-card,
kiko-guide-agent[data-phase="leaving"] .kiko-card {
  will-change: opacity, transform;
}

kiko-guide-agent .kiko-sprite {
  position: absolute;
  z-index: 1;
  inset: 0;
  background-position: 0 0;
  background-repeat: no-repeat;
  background-size: 600% 100%;
  filter:
    drop-shadow(0 0 7px rgba(103, 246, 255, 0.4))
    drop-shadow(0 0 18px color-mix(in srgb, var(--kiko-accent) 56%, transparent));
  opacity: 0.84;
}

kiko-guide-agent .kiko-video,
kiko-guide-agent .kiko-video-poster {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  object-fit: contain;
  object-position: 50% 100%;
  pointer-events: none;
  transition: opacity 180ms ease;
}

kiko-guide-agent .kiko-video {
  opacity: 0;
  filter: none;
}

kiko-guide-agent[data-media-format="alpha"] .kiko-video {
  filter:
    saturate(1.08)
    contrast(1.18)
    drop-shadow(0 0 8px rgba(103, 246, 255, 0.38))
    drop-shadow(0 0 24px color-mix(in srgb, var(--kiko-accent) 42%, transparent));
}

kiko-guide-agent .kiko-video-poster {
  opacity: 0;
  filter:
    saturate(1.04)
    contrast(1.16)
    drop-shadow(0 0 8px rgba(103, 246, 255, 0.36))
    drop-shadow(0 0 22px color-mix(in srgb, var(--kiko-accent) 38%, transparent));
}

/* The v9/v10 safe-frame media already includes transparent guard space on the
   top and both sides. Do not inset, mask, or paint-clip that frame: those
   treatments can erase moving hair wisps at the alpha boundary. */
kiko-guide-agent[data-framing="bust"] .kiko-video,
kiko-guide-agent[data-framing="bust"] .kiko-video-poster {
  inset: 0;
  width: 100%;
  height: 100%;
  -webkit-mask-image: none;
  mask-image: none;
}

kiko-guide-agent[data-media="video"] .kiko-video[data-active="true"] {
  opacity: 1;
}

kiko-guide-agent[data-phase="entering"][data-media="video"] .kiko-video[data-active="true"] {
  animation: kiko-projector-on 680ms cubic-bezier(0.2, 0.72, 0.18, 1) both;
}

kiko-guide-agent[data-phase="leaving"][data-media="video"] .kiko-video[data-active="true"] {
  animation: kiko-projector-off 620ms cubic-bezier(0.55, 0.04, 0.78, 0.34) both;
}

kiko-guide-agent[data-media="video"] .kiko-video-poster {
  opacity: 0;
}

kiko-guide-agent[data-media="loading"] .kiko-video-poster {
  opacity: 0.9;
}

kiko-guide-agent[data-media="poster"] .kiko-video-poster {
  opacity: 0.9;
}

kiko-guide-agent[data-media="loading"] .kiko-sprite,
kiko-guide-agent[data-media="poster"] .kiko-sprite,
kiko-guide-agent[data-media="video"] .kiko-sprite {
  opacity: 0;
}

kiko-guide-agent[data-performance="protect"] .kiko-video,
kiko-guide-agent[data-performance="protect"] .kiko-video-poster {
  filter:
    saturate(1.02)
    contrast(1.1)
    drop-shadow(0 0 8px rgba(255, 200, 87, 0.4))
    drop-shadow(0 0 26px rgba(255, 200, 87, 0.24));
}

kiko-guide-agent[data-performance="recover"] .kiko-video,
kiko-guide-agent[data-performance="recover"] .kiko-video-poster {
  filter:
    saturate(1.12)
    contrast(1.08)
    drop-shadow(0 0 9px rgba(115, 255, 191, 0.45))
    drop-shadow(0 0 28px rgba(115, 255, 191, 0.22));
}

kiko-guide-agent .kiko-stage::before {
  position: absolute;
  z-index: 2;
  inset: 0;
  background:
    repeating-linear-gradient(180deg, transparent 0 4px, rgba(103, 246, 255, 0.045) 4px 5px),
    linear-gradient(180deg, transparent 0 74%, rgba(103, 246, 255, 0.08) 90%, transparent 100%);
  content: "";
  -webkit-mask-image: var(--kiko-poster-mask);
  -webkit-mask-position: 50% 100%;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-size: contain;
  mask-image: var(--kiko-poster-mask);
  mask-position: 50% 100%;
  mask-repeat: no-repeat;
  mask-size: contain;
  mix-blend-mode: normal;
  opacity: 0.6;
  pointer-events: none;
}

kiko-guide-agent .kiko-stage::after {
  position: absolute;
  z-index: 3;
  top: 4%;
  right: 5%;
  left: 8%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(230, 250, 255, 0.82), transparent);
  box-shadow: 0 0 14px var(--kiko-accent);
  content: "";
  opacity: 0.42;
  pointer-events: none;
  animation: kiko-scan 3.8s linear infinite;
}

kiko-guide-agent .kiko-projection-base {
  position: absolute;
  z-index: -1;
  bottom: -12px;
  left: 50%;
  width: 166%;
  max-width: 540px;
  opacity: 0.68;
  filter: drop-shadow(0 0 14px rgba(103, 246, 255, 0.22));
  transform: translateX(-50%);
}

/* The projection ring belongs to full-body appearances. On bust footage it
   creates a second visual baseline below the torso and defeats edge anchoring. */
kiko-guide-agent[data-framing="bust"] .kiko-projection-base {
  display: none;
}

/* On desktop, derive the card's horizontal offset from the active character
   width. This keeps the copy docked beside Kiko even when the viewport changes
   the bust scale instead of leaving it at the host canvas' legacy edge. */
@media (min-width: 761px) {
  kiko-guide-agent[data-framing="bust"] .kiko-card {
    left: max(
      0px,
      calc(100% - var(--kiko-character-width) - var(--kiko-card-width) - var(--kiko-card-dock-gap))
    );
  }

  kiko-guide-agent[data-framing="bust"][position="bottom-left"] .kiko-card,
  kiko-guide-agent[data-framing="bust"][position="top-left"] .kiko-card {
    right: max(
      0px,
      calc(100% - var(--kiko-character-width) - var(--kiko-card-width) - var(--kiko-card-dock-gap))
    );
    left: auto;
  }
}

kiko-guide-agent .kiko-card {
  position: absolute;
  z-index: 1;
  bottom: 18px;
  left: 0;
  width: var(--kiko-card-width);
  min-height: 154px;
  padding: 14px 16px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--kiko-accent) 42%, transparent);
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--kiko-accent) 7%, transparent), transparent 44%),
    linear-gradient(180deg, rgba(8, 22, 32, 0.97), var(--kiko-panel));
  box-shadow:
    0 18px 44px rgba(0, 0, 0, 0.42),
    0 0 26px color-mix(in srgb, var(--kiko-accent) 8%, transparent),
    inset 0 1px rgba(255, 255, 255, 0.035);
  clip-path: polygon(0 0, calc(100% - 16px) 0, 100% 16px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  opacity: 0;
  pointer-events: none;
  transform: translate3d(-8px, 6px, 0) scale(0.985);
  transition:
    opacity 200ms ease,
    visibility 0s linear 240ms,
    transform 380ms cubic-bezier(0.16, 1, 0.3, 1),
    border-color 180ms ease;
  visibility: hidden;
}

kiko-guide-agent .kiko-card::before,
kiko-guide-agent .kiko-card::after {
  position: absolute;
  content: "";
  pointer-events: none;
}

kiko-guide-agent .kiko-card::before {
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0 14%, rgba(103, 246, 255, 0.055) 14% 14.4%, transparent 14.4%),
    repeating-linear-gradient(180deg, transparent 0 7px, rgba(103, 246, 255, 0.018) 7px 8px);
  opacity: 0.75;
}

kiko-guide-agent .kiko-card::after {
  top: 0;
  left: 14px;
  width: 36%;
  height: 1px;
  background: linear-gradient(90deg, var(--kiko-accent), transparent);
  box-shadow: 0 0 12px var(--kiko-accent);
}

kiko-guide-agent .kiko-card-header,
kiko-guide-agent .kiko-card-body,
kiko-guide-agent .kiko-card-footer {
  position: relative;
  z-index: 1;
}

kiko-guide-agent .kiko-card-header {
  display: flex;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 10px;
}

kiko-guide-agent .kiko-identity {
  display: flex;
  min-width: 0;
  gap: 7px;
  align-items: center;
  overflow: hidden;
  color: var(--kiko-accent);
  font: 650 10px/1.1 var(--kiko-mono);
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

kiko-guide-agent .kiko-live-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--kiko-accent);
  box-shadow: 0 0 9px var(--kiko-accent);
  animation: kiko-pulse 1.9s ease-in-out infinite;
}

kiko-guide-agent .kiko-source {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

kiko-guide-agent .kiko-dismiss {
  display: grid;
  width: 32px;
  height: 32px;
  flex: 0 0 auto;
  padding: 0;
  border: 1px solid rgba(103, 246, 255, 0.18);
  border-radius: 3px;
  color: var(--kiko-ink-muted);
  background: rgba(3, 8, 13, 0.58);
  cursor: pointer;
  place-items: center;
  pointer-events: auto;
}

kiko-guide-agent .kiko-dismiss:hover,
kiko-guide-agent .kiko-dismiss:focus-visible {
  border-color: var(--kiko-accent);
  outline: 2px solid transparent;
  color: var(--kiko-ink);
  background: rgba(8, 22, 32, 0.92);
}

kiko-guide-agent .kiko-dismiss svg {
  width: 12px;
  height: 12px;
}

kiko-guide-agent .kiko-dismiss path {
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-width: 1.5;
}

kiko-guide-agent .kiko-kicker {
  margin-bottom: 5px;
  color: var(--kiko-ink-muted);
  font: 650 9px/1.2 var(--kiko-mono);
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

kiko-guide-agent .kiko-title {
  margin: 0;
  color: var(--kiko-ink);
  font-size: clamp(15px, 1.2vw, 18px);
  font-weight: 650;
  letter-spacing: -0.015em;
  line-height: 1.16;
}

kiko-guide-agent .kiko-message {
  display: -webkit-box;
  margin: 7px 0 0;
  overflow: hidden;
  color: var(--kiko-ink-secondary);
  font-size: 12px;
  line-height: 1.48;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
}

kiko-guide-agent .kiko-meta {
  min-height: 14px;
  margin-top: 10px;
  color: var(--kiko-ink-muted);
  font: 500 9px/1.35 var(--kiko-mono);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

kiko-guide-agent .kiko-meta:empty {
  display: none;
}

kiko-guide-agent .kiko-card-footer {
  display: none;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(103, 246, 255, 0.1);
}

kiko-guide-agent .kiko-card-footer[data-has-actions="true"] {
  display: flex;
}

kiko-guide-agent .kiko-action {
  min-height: 36px;
  padding: 7px 11px;
  border: 1px solid rgba(103, 246, 255, 0.22);
  border-radius: 3px;
  color: var(--kiko-ink-secondary);
  background: rgba(4, 11, 17, 0.72);
  cursor: pointer;
  font: 650 10px/1 var(--kiko-mono);
  letter-spacing: 0.04em;
  pointer-events: auto;
}

kiko-guide-agent .kiko-action:hover,
kiko-guide-agent .kiko-action:focus-visible {
  border-color: var(--kiko-accent);
  outline: 2px solid transparent;
  color: var(--kiko-ink);
}

kiko-guide-agent .kiko-action[data-kind="primary"] {
  border-color: var(--kiko-accent);
  color: #041017;
  background: var(--kiko-accent);
  box-shadow: 0 0 14px color-mix(in srgb, var(--kiko-accent) 55%, transparent);
}

kiko-guide-agent .kiko-beacon {
  position: absolute;
  right: 12px;
  bottom: 14px;
  display: grid;
  width: 70px;
  height: 70px;
  padding: 0;
  overflow: visible;
  border: 1px solid rgba(103, 246, 255, 0.36);
  border-radius: 50%;
  color: var(--kiko-cyan);
  background: radial-gradient(circle, rgba(9, 28, 38, 0.98), rgba(3, 9, 14, 0.98));
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.42), 0 0 24px rgba(103, 246, 255, 0.14);
  cursor: pointer;
  opacity: 1;
  place-items: center;
  pointer-events: auto;
  transform: scale(1);
  transition: opacity 180ms ease, transform 260ms cubic-bezier(0.16, 1, 0.3, 1), visibility 0s;
  visibility: visible;
}

kiko-guide-agent .kiko-beacon:hover,
kiko-guide-agent .kiko-beacon:focus-visible {
  border-color: var(--kiko-cyan);
  outline: 2px solid var(--kiko-cyan);
  outline-offset: 3px;
  transform: scale(1.035);
}

kiko-guide-agent .kiko-beacon::before,
kiko-guide-agent .kiko-beacon::after {
  position: absolute;
  inset: -5px;
  border: 1px solid rgba(103, 246, 255, 0.18);
  border-radius: 50%;
  content: "";
  animation: kiko-ring 3.2s linear infinite;
  pointer-events: none;
}

kiko-guide-agent .kiko-beacon::after {
  inset: -10px;
  opacity: 0.4;
  animation-delay: -1.6s;
}

kiko-guide-agent .kiko-beacon img {
  width: 62px;
  height: 62px;
  object-fit: contain;
  filter: drop-shadow(0 0 8px rgba(103, 246, 255, 0.4));
}

kiko-guide-agent .kiko-beacon-label {
  position: absolute;
  right: -2px;
  bottom: -9px;
  left: -2px;
  overflow: hidden;
  color: var(--kiko-cyan);
  font: 700 8px/1 var(--kiko-mono);
  letter-spacing: 0.14em;
  text-align: center;
  text-shadow: 0 0 9px rgba(103, 246, 255, 0.8);
}

kiko-guide-agent .kiko-beacon-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  display: none;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border: 1px solid rgba(5, 14, 22, 0.9);
  border-radius: 999px;
  color: #041017;
  background: var(--kiko-accent);
  box-shadow: 0 0 10px var(--kiko-accent);
  font: 700 9px/1 var(--kiko-mono);
  place-items: center;
}

kiko-guide-agent .kiko-beacon-badge[data-visible="true"] {
  display: grid;
}

/* Responsive CSS notification pills. No raster frame is stretched around
   dynamic copy, so borders stay crisp at every size and zoom level. */
kiko-guide-agent .kiko-identity,
kiko-guide-agent .kiko-beacon-badge {
  overflow: visible;
  border: 1px solid color-mix(in srgb, var(--kiko-accent) 42%, transparent);
  border-radius: 999px;
  color: var(--kiko-accent);
  background:
    linear-gradient(105deg, color-mix(in srgb, var(--kiko-accent) 11%, transparent), transparent 62%),
    rgba(3, 13, 18, 0.82);
  box-shadow:
    0 0 12px color-mix(in srgb, var(--kiko-accent) 10%, transparent),
    inset 0 1px color-mix(in srgb, var(--kiko-accent) 10%, transparent);
}

kiko-guide-agent .kiko-identity {
  position: relative;
  min-height: 28px;
  padding: 6px 11px;
  overflow-wrap: break-word;
  text-wrap: balance;
  white-space: normal;
  word-break: normal;
}

kiko-guide-agent .kiko-identity::after,
kiko-guide-agent .kiko-beacon-badge::after {
  position: absolute;
  z-index: 2;
  inset: 2px;
  box-sizing: border-box;
  border: 0;
  border-radius: inherit;
  background:
    linear-gradient(90deg, var(--kiko-accent), transparent 22%) top left / 28% 1px no-repeat,
    linear-gradient(270deg, var(--kiko-accent), transparent 22%) bottom right / 28% 1px no-repeat;
  content: "";
  filter: none;
  opacity: 0.5;
  pointer-events: none;
}

kiko-guide-agent .kiko-beacon-badge {
  width: max-content;
  min-width: 38px;
  height: auto;
  min-height: 24px;
  padding: 4px 8px;
  color: var(--kiko-accent);
  background: transparent;
  text-shadow: 0 0 7px var(--kiko-accent);
}

kiko-guide-agent[data-open="true"] .kiko-stage {
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

kiko-guide-agent[data-open="true"] .kiko-card {
  opacity: 1;
  pointer-events: auto;
  transform: translate3d(0, 0, 0) scale(1);
  transition-delay: 90ms, 0s, 90ms, 0s;
  visibility: visible;
}

kiko-guide-agent[data-open="true"] .kiko-beacon {
  opacity: 0;
  pointer-events: none;
  transform: scale(0.74);
  transition-delay: 0s, 0s, 180ms;
  visibility: hidden;
}

kiko-guide-agent[data-phase="leaving"] .kiko-card {
  opacity: 0;
  transform: translate3d(-5px, 5px, 0) scale(0.98);
  transition-delay: 0s;
}

kiko-guide-agent[data-phase="leaving"][data-media-format="alpha"] .kiko-video[data-active="true"] {
  filter:
    saturate(1.2)
    brightness(1.12)
    drop-shadow(0 0 9px rgba(103, 246, 255, 0.42));
}

kiko-guide-agent[data-phase="entering"] .kiko-stage::before {
  animation: kiko-projector-noise-on 680ms ease-out both;
}

kiko-guide-agent[data-phase="leaving"] .kiko-stage::before {
  animation: kiko-projector-noise-off 620ms ease-in both;
}

kiko-guide-agent[data-phase="entering"] .kiko-stage::after {
  animation: kiko-projector-line-on 680ms cubic-bezier(0.2, 0.72, 0.18, 1) both;
}

kiko-guide-agent[data-phase="leaving"] .kiko-stage::after {
  animation: kiko-projector-line-off 620ms cubic-bezier(0.55, 0.04, 0.78, 0.34) both;
}

kiko-guide-agent[data-state="warning"] .kiko-card {
  background:
    linear-gradient(135deg, rgba(255, 200, 87, 0.11), transparent 44%),
    linear-gradient(180deg, rgba(20, 20, 18, 0.97), rgba(10, 14, 18, 0.96));
}

kiko-guide-agent[data-state="manual"] .kiko-card {
  background:
    linear-gradient(135deg, rgba(255, 102, 117, 0.12), transparent 44%),
    linear-gradient(180deg, rgba(23, 15, 18, 0.97), rgba(10, 13, 18, 0.96));
}

/* Event-specific choreography layers distinct operational meaning over the
   reusable zero-credit character footage. */
kiko-guide-agent[data-event-animation="deposit-received"] {
  --kiko-accent: var(--kiko-mint);
}

kiko-guide-agent[data-event-animation="deposit-received"] .kiko-scene-prop {
  width: 31%;
  animation: kiko-event-deposit 1.35s cubic-bezier(0.18, 0.85, 0.22, 1) infinite;
}

kiko-guide-agent[data-event-animation="deposit-received"] .kiko-scene-particle {
  width: 8px;
  height: 8px;
  animation-duration: 1.2s;
  box-shadow: 0 0 16px currentColor;
}

kiko-guide-agent[data-event-animation="fees-disbursed"] {
  --kiko-accent: #8affc4;
}

kiko-guide-agent[data-event-animation="fees-disbursed"] .kiko-scene-orbit {
  border-width: 2px;
  animation-duration: 1.6s;
  box-shadow: 0 0 24px color-mix(in srgb, var(--kiko-accent) 34%, transparent);
}

kiko-guide-agent[data-event-animation="fees-disbursed"] .kiko-scene-prop {
  animation: kiko-event-payout 1.8s ease-in-out infinite;
}

kiko-guide-agent[data-event-animation="mode-defensive"] {
  --kiko-accent: var(--kiko-amber);
}

kiko-guide-agent[data-event-animation="mode-defensive"] .kiko-scene-orbit {
  border-style: solid;
  border-width: 2px;
  animation: kiko-event-shield 1.7s ease-in-out infinite;
}

kiko-guide-agent[data-event-animation="mode-defensive"] .kiko-stage {
  filter: drop-shadow(0 0 22px rgba(255, 200, 87, 0.3));
}

kiko-guide-agent[data-event-animation="mode-balanced"] {
  --kiko-accent: #a982ff;
}

kiko-guide-agent[data-event-animation="mode-balanced"] .kiko-scene-orbit-a {
  animation-duration: 1.9s;
}

kiko-guide-agent[data-event-animation="mode-balanced"] .kiko-scene-orbit-b {
  animation-duration: 2.7s;
}

kiko-guide-agent[data-event-animation="mode-balanced"] .kiko-scene-prop {
  animation: kiko-event-balance 2.2s ease-in-out infinite;
}

kiko-guide-agent[data-event-animation="mode-yield"] {
  --kiko-accent: var(--kiko-mint);
}

kiko-guide-agent[data-event-animation="mode-yield"] .kiko-scene-particle {
  animation: kiko-event-yield 1.15s ease-out infinite;
}

kiko-guide-agent[data-event-animation="mode-yield"] .kiko-scene-particle-b {
  animation-delay: -0.55s;
}

@keyframes kiko-event-deposit {
  0%, 100% { opacity: 0.78; transform: translateY(6px) scale(0.92); }
  45% { opacity: 1; transform: translateY(-8px) scale(1.12); }
}

@keyframes kiko-event-payout {
  0%, 100% { opacity: 0.7; transform: translateX(-5px) rotate(-4deg); }
  50% { opacity: 1; transform: translateX(10px) rotate(5deg); }
}

@keyframes kiko-event-shield {
  0%, 100% { opacity: 0.48; transform: scale(0.92); }
  48% { opacity: 1; transform: scale(1.14); }
}

@keyframes kiko-event-balance {
  0%, 100% { transform: rotate(-9deg) translateY(2px); }
  50% { transform: rotate(9deg) translateY(-5px); }
}

@keyframes kiko-event-yield {
  0% { opacity: 0; transform: translate(0, 12px) scale(0.5); }
  28% { opacity: 1; }
  100% { opacity: 0; transform: translate(22px, -42px) scale(1.35); }
}

@keyframes kiko-prop-scan {
  0% { transform: rotate(-12deg) scale(0.94); }
  50% { transform: rotate(168deg) scale(1.04); }
  100% { transform: rotate(348deg) scale(0.94); }
}

@keyframes kiko-projector-on {
  0% {
    clip-path: inset(49% 0 49% 0);
    filter: brightness(2.5) saturate(0.25) blur(2px);
    opacity: 0;
    transform: translate3d(-5px, 2px, 0) scaleX(0.88);
  }
  18% {
    clip-path: inset(41% 0 42% 0);
    opacity: 0.19;
  }
  32% {
    clip-path: inset(26% 0 29% 0);
    filter: brightness(1.9) saturate(1.65) blur(0.8px);
    opacity: 0.12;
    transform: translate3d(3px, 0, 0) scaleX(0.95);
  }
  56% {
    clip-path: inset(10% 0 13% 0);
    opacity: 0.62;
  }
  78% {
    clip-path: inset(2% 0 3% 0);
    filter: brightness(1.28) saturate(1.2) blur(0);
    opacity: 0.9;
    transform: translate3d(-1px, 0, 0) scaleX(1.005);
  }
  100% {
    clip-path: inset(0);
    opacity: 1;
    transform: translate3d(0, 0, 0) scaleX(1);
  }
}

@keyframes kiko-projector-off {
  0% {
    clip-path: inset(0);
    opacity: 1;
    transform: translate3d(0, 0, 0) scaleX(1);
  }
  42% {
    clip-path: inset(5% 0 8% 0);
    filter: brightness(1.36) saturate(1.48);
    opacity: 0.78;
    transform: translate3d(2px, 0, 0) scaleX(0.995);
  }
  72% {
    clip-path: inset(34% 0 37% 0);
    filter: brightness(2.1) saturate(0.48) blur(0.8px);
    opacity: 0.34;
    transform: translate3d(-4px, 1px, 0) scaleX(0.93);
  }
  100% {
    clip-path: inset(49.5% 0 49.5% 0);
    filter: brightness(2.8) saturate(0.2) blur(2px);
    opacity: 0;
    transform: translate3d(5px, 2px, 0) scaleX(0.78);
  }
}

@keyframes kiko-projector-noise-on {
  0% { opacity: 0; }
  34% { opacity: 0.92; }
  62% { opacity: 0.48; }
  100% { opacity: 0.6; }
}

@keyframes kiko-projector-noise-off {
  0% { opacity: 0.6; }
  58% { opacity: 0.82; }
  100% { opacity: 0; }
}

@keyframes kiko-projector-line-on {
  0% { top: 50%; opacity: 0; transform: scaleX(0.2); }
  24% { opacity: 0.96; transform: scaleX(0.82); }
  78% { top: 4%; opacity: 0.56; transform: scaleX(1); }
  100% { top: 4%; opacity: 0.42; transform: scaleX(1); }
}

@keyframes kiko-projector-line-off {
  0% { top: 4%; opacity: 0.42; transform: scaleX(1); }
  72% { top: 50%; opacity: 0.92; transform: scaleX(0.72); }
  100% { top: 50%; opacity: 0; transform: scaleX(0.12); }
}

@keyframes kiko-prop-ping {
  0%, 100% { opacity: 0.72; transform: translateY(0) scale(0.96); }
  45% { opacity: 1; transform: translateY(-5px) scale(1.05); }
  55% { opacity: 0.45; transform: translateY(-5px) scale(1.05); }
}

@keyframes kiko-prop-ticker {
  0%, 100% { transform: translateY(2px); }
  35% { transform: translateY(-5px); }
  68% { transform: translateY(1px); }
}

@keyframes kiko-prop-orbit {
  0%, 100% { transform: rotate(-5deg) translateY(1px); }
  50% { transform: rotate(9deg) translateY(-5px); }
}

@keyframes kiko-prop-tick {
  0%, 38% { transform: rotate(0); }
  52%, 88% { transform: rotate(180deg); }
  100% { transform: rotate(360deg); }
}

@keyframes kiko-prop-float {
  0%, 100% { transform: translateY(3px) rotate(-2deg); }
  50% { transform: translateY(-7px) rotate(3deg); }
}

@keyframes kiko-prop-align {
  0%, 100% { transform: scaleX(1.08); }
  48%, 62% { transform: scaleX(0.88); }
}

@keyframes kiko-prop-guard {
  0%, 100% { opacity: 0.78; transform: scale(0.95); }
  50% { opacity: 1; transform: scale(1.08); }
}

@keyframes kiko-prop-repair {
  0%, 18% { transform: rotate(-10deg); }
  52% { transform: rotate(36deg); }
  68% { transform: rotate(24deg); }
  100% { transform: rotate(350deg); }
}

@keyframes kiko-prop-scout {
  0%, 38%, 100% { transform: translate(0, 0) scale(0.96); }
  48% { transform: translate(7px, -4px) scale(1.08); }
  58% { transform: translate(-4px, 2px) scale(1.03); }
}

@keyframes kiko-prop-handoff {
  0%, 100% { transform: translateX(0) rotate(-2deg); }
  46%, 62% { transform: translateX(8px) rotate(4deg); }
}

@keyframes kiko-scene-orbit {
  from { transform: rotate(0deg) scale(0.94); }
  to { transform: rotate(360deg) scale(1.05); }
}

@keyframes kiko-scene-particle {
  0% { opacity: 0; transform: translate(0, 8px) scale(0.4); }
  24% { opacity: 0.9; }
  100% { opacity: 0; transform: translate(18px, -28px) scale(1.2); }
}

@keyframes kiko-humor-pop {
  0%, 12%, 68%, 100% { opacity: 0; transform: translateY(5px) scale(0.9); }
  20%, 56% { opacity: 0.86; transform: translateY(0) scale(1); }
  61% { opacity: 0.5; transform: translateY(-2px) scale(0.98); }
}

@keyframes kiko-scan {
  0% {
    opacity: 0;
    transform: translateY(2px);
  }
  8% {
    opacity: 0.44;
  }
  82% {
    opacity: 0.32;
  }
  100% {
    opacity: 0;
    transform: translateY(calc(var(--kiko-character-width) * 1.84));
  }
}

@keyframes kiko-pulse {
  0%,
  100% {
    opacity: 0.62;
    transform: scale(0.9);
  }
  50% {
    opacity: 1;
    transform: scale(1.14);
  }
}

@keyframes kiko-ring {
  from {
    transform: rotate(0) scale(0.97);
  }
  to {
    transform: rotate(360deg) scale(1.03);
  }
}

@media (max-width: 760px) {
  kiko-guide-agent {
    --kiko-host-bottom: calc(var(--kiko-mobile-nav-offset) + max(8px, env(safe-area-inset-bottom)));
    --kiko-bust-width: min(236px, calc((100svh - var(--kiko-mobile-nav-offset) - 16px) / 2));
    --kiko-full-body-width: min(92vw, 360px, calc(62.5svh - 10px));
    --kiko-card-width: min(230px, calc(100% - 112px));
    right: max(6px, env(safe-area-inset-right));
    bottom: var(--kiko-host-bottom);
    left: max(6px, env(safe-area-inset-left));
    width: auto;
    height: min(484px, calc(100svh - var(--kiko-mobile-nav-offset) - 16px));
    max-width: none;
    transform: none;
  }

  /* Large exterior shadows collapse into a hard cyan rim when the portrait
     canvas is scaled to phone size. Keep Kiko's internal holographic color and
     projector animation, but composite the transparent edge without a halo. */
  kiko-guide-agent[data-media-format="alpha"][data-performance] .kiko-video,
  kiko-guide-agent[data-performance] .kiko-video-poster,
  kiko-guide-agent[data-open="true"] .kiko-sprite {
    filter: saturate(1.04) contrast(1.1);
  }

  kiko-guide-agent[data-open="true"][data-event-animation] .kiko-stage {
    filter: none;
  }

  kiko-guide-agent[position] {
    right: max(6px, env(safe-area-inset-right));
    left: max(6px, env(safe-area-inset-left));
    width: auto;
  }

  kiko-guide-agent[position="top-right"],
  kiko-guide-agent[position="top-left"] {
    top: auto;
    bottom: var(--kiko-host-bottom);
  }

  kiko-guide-agent .kiko-stage {
    right: 0;
    bottom: calc(0px - var(--kiko-host-bottom) - var(--kiko-frame-crop));
  }

  kiko-guide-agent[position="bottom-left"] .kiko-stage,
  kiko-guide-agent[position="top-left"] .kiko-stage {
    right: auto;
    left: 0;
  }

  kiko-guide-agent .kiko-scene-prop {
    min-width: 46px;
  }

  kiko-guide-agent .kiko-projection-base {
    bottom: -8px;
    width: 150%;
  }

  kiko-guide-agent .kiko-card {
    z-index: 3;
    top: auto;
    bottom: 10px;
    min-height: 140px;
    padding: 12px 13px;
  }

  kiko-guide-agent[data-framing][position="top-right"] .kiko-card,
  kiko-guide-agent[data-framing][position="top-left"] .kiko-card {
    top: auto;
    bottom: 10px;
  }

  kiko-guide-agent .kiko-title {
    font-size: 15px;
  }

  kiko-guide-agent .kiko-message {
    font-size: 11px;
    line-height: 1.42;
  }

  kiko-guide-agent .kiko-card-footer {
    flex-wrap: wrap;
  }

  kiko-guide-agent .kiko-action {
    min-height: 40px;
  }

  kiko-guide-agent .kiko-beacon {
    /* The mobile launcher has one permanent home. Event choreography may move
       the open performance, but collapsing Kiko must never make users hunt on
       the opposite edge for the activation control. */
    right: auto;
    bottom: 14px;
    left: 12px;
    width: 64px;
    height: 64px;
  }

  kiko-guide-agent .kiko-beacon img {
    width: 56px;
    height: 56px;
  }
}

@media (max-width: 430px) {
  kiko-guide-agent {
    --kiko-bust-width: min(212px, calc((100svh - var(--kiko-mobile-nav-offset) - 16px) / 2));
    --kiko-full-body-width: min(94vw, 340px, calc(62.5svh - 10px));
    --kiko-card-width: min(220px, calc(100% - 108px));
    height: min(448px, calc(100svh - var(--kiko-mobile-nav-offset) - 16px));
  }

  kiko-guide-agent .kiko-stage {
    right: 0;
  }

  kiko-guide-agent .kiko-card {
    min-height: 132px;
    padding: 11px 12px;
  }

  kiko-guide-agent .kiko-card-header {
    margin-bottom: 7px;
  }

  kiko-guide-agent .kiko-kicker {
    font-size: 8px;
  }

  kiko-guide-agent .kiko-title {
    font-size: 14px;
  }

  kiko-guide-agent .kiko-message {
    font-size: 10.5px;
    -webkit-line-clamp: 3;
  }

  kiko-guide-agent .kiko-meta {
    margin-top: 7px;
    font-size: 8px;
  }
}

@media (max-height: 560px) and (orientation: landscape) {
  kiko-guide-agent {
    --kiko-host-bottom: max(8px, env(safe-area-inset-bottom));
    --kiko-bust-width: min(184px, calc((100svh - 16px) / 2));
    --kiko-full-body-width: min(42vw, calc(62.5svh - 10px));
    --kiko-card-width: min(286px, calc(100% - 78px));
    right: max(8px, env(safe-area-inset-right));
    bottom: var(--kiko-host-bottom);
    left: auto;
    width: min(520px, calc(100% - 16px));
    height: min(376px, calc(100svh - 16px));
  }

  kiko-guide-agent[position] {
    right: max(8px, env(safe-area-inset-right));
    left: max(8px, env(safe-area-inset-left));
    width: auto;
  }

  kiko-guide-agent[position="top-right"],
  kiko-guide-agent[position="top-left"] {
    top: auto;
    bottom: var(--kiko-host-bottom);
  }

  kiko-guide-agent .kiko-stage {
    right: 12px;
  }

  kiko-guide-agent .kiko-card {
    top: 5px;
    bottom: auto;
    min-height: 118px;
    padding: 10px 12px;
  }

  kiko-guide-agent[data-framing][position="top-right"] .kiko-card,
  kiko-guide-agent[data-framing][position="top-left"] .kiko-card {
    top: 5px;
    bottom: auto;
  }

  kiko-guide-agent .kiko-card-header {
    margin-bottom: 6px;
  }

  kiko-guide-agent .kiko-message {
    -webkit-line-clamp: 2;
  }
}

@media (forced-colors: active) {
  kiko-guide-agent .kiko-card,
  kiko-guide-agent .kiko-beacon,
  kiko-guide-agent .kiko-dismiss,
  kiko-guide-agent .kiko-action {
    border-color: CanvasText;
  }
}

@media (prefers-reduced-motion: reduce) {
  kiko-guide-agent,
  kiko-guide-agent .kiko-stage,
  kiko-guide-agent .kiko-card,
  kiko-guide-agent .kiko-beacon {
    transition-duration: 1ms;
  }

  kiko-guide-agent .kiko-stage::after,
  kiko-guide-agent .kiko-scene-prop,
  kiko-guide-agent .kiko-scene-orbit,
  kiko-guide-agent .kiko-scene-particle,
  kiko-guide-agent .kiko-humor-beat,
  kiko-guide-agent .kiko-live-dot,
  kiko-guide-agent .kiko-beacon::before,
  kiko-guide-agent .kiko-beacon::after {
    animation: none;
  }

  kiko-guide-agent .kiko-video {
    display: none;
  }
}