/* ==========================================================
   DigiClicks UX v2.0 — radial Digi Hub + speaker identities
   Incremental override. No gameplay handlers are replaced.
   ========================================================== */

/* ---------- DIGI HUB: contextual radial menu ---------- */
#digiHubFab.dc-hub-moving,
#digiHubFab.dc-hub-returning{
  z-index:100090 !important;
  transition:left .34s cubic-bezier(.2,.8,.2,1),top .34s cubic-bezier(.2,.8,.2,1),transform .34s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,filter .28s ease !important;
}
#digiHubFab.dc-hub-moving{
  width:58px !important;height:58px !important;min-width:58px !important;min-height:58px !important;
}
#digiHubFab.dc-hub-moving .dc-hub-sigil svg,
#digiHubFab.dc-hub-returning .dc-hub-sigil svg{
  width:28px !important;height:28px !important;
  filter:drop-shadow(0 0 7px currentColor) !important;
}

#digiHubPanel.dc-radial-open{
  position:fixed !important;
  inset:0 !important;
  left:0 !important;top:0 !important;right:0 !important;bottom:0 !important;
  width:100vw !important;height:100vh !important;
  max-width:none !important;max-height:none !important;
  padding:0 !important;margin:0 !important;
  border:0 !important;border-radius:0 !important;
  overflow:hidden !important;
  transform:none !important;
  background:radial-gradient(circle at center,rgba(5,24,36,.18) 0%,rgba(2,8,14,.14) 28%,rgba(0,0,0,.44) 62%,rgba(0,0,0,.74) 100%) !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  opacity:1 !important;
  pointer-events:auto !important;
  z-index:100040 !important;
}
#digiHubPanel.dc-radial-open .dc-hub-radial-vignette{
  position:absolute !important;inset:0 !important;pointer-events:auto !important;
  background:radial-gradient(circle at center,transparent 0 17%,rgba(105,245,255,.035) 23%,transparent 38%),radial-gradient(circle at center,rgba(0,0,0,0) 0,rgba(0,0,0,.16) 58%,rgba(0,0,0,.46) 100%) !important;
}
.dc-hub-radial-core-label{
  position:fixed !important;left:50% !important;top:calc(50% + 48px) !important;
  transform:translateX(-50%) !important;text-align:center !important;
  pointer-events:none !important;opacity:0 !important;
  color:#dffcff !important;text-shadow:0 0 12px rgba(105,245,255,.38) !important;
  transition:opacity .28s ease .1s !important;
}
#digiHubPanel.dc-radial-open .dc-hub-radial-core-label{opacity:1 !important;}
.dc-hub-radial-core-label span{display:block;font:900 9px/1 'Orbitron',sans-serif !important;letter-spacing:2px !important;}
.dc-hub-radial-core-label small{display:block;margin-top:5px;color:#6e9eaa;font:800 5px/1 'Orbitron',sans-serif !important;letter-spacing:1.2px !important;}

.dc-hub-radial-item{
  --hub-radius:128px;
  position:fixed !important;left:50% !important;top:50% !important;
  width:82px !important;height:82px !important;min-width:82px !important;min-height:82px !important;
  margin:0 !important;padding:6px !important;box-sizing:border-box !important;
  display:grid !important;grid-template-rows:40px 11px 10px !important;place-items:center !important;gap:2px !important;
  border:1px solid rgba(105,245,255,.28) !important;
  color:#dffcff !important;
  background:linear-gradient(145deg,rgba(7,35,49,.72),rgba(2,14,24,.58)) !important;
  backdrop-filter:blur(14px) saturate(145%) !important;-webkit-backdrop-filter:blur(14px) saturate(145%) !important;
  clip-path:polygon(0 8px,8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px)) !important;
  box-shadow:inset 0 0 15px rgba(105,245,255,.05),0 8px 24px rgba(0,0,0,.38),0 0 14px rgba(105,245,255,.09) !important;
  opacity:0 !important;pointer-events:none !important;
  transform:translate(-50%,-50%) rotate(var(--angle)) translateY(calc(-1 * var(--hub-radius))) rotate(calc(-1 * var(--angle))) scale(.35) !important;
  transition:transform .38s cubic-bezier(.15,.8,.2,1),opacity .28s ease,filter .18s ease,box-shadow .18s ease !important;
}
#digiHubPanel.dc-radial-open .dc-hub-radial-item{
  opacity:1 !important;pointer-events:auto !important;
  transform:translate(-50%,-50%) rotate(var(--angle)) translateY(calc(-1 * var(--hub-radius))) rotate(calc(-1 * var(--angle))) scale(1) !important;
}
#digiHubPanel.dc-radial-open .dc-hub-radial-item:nth-of-type(2){transition-delay:.04s !important;}
#digiHubPanel.dc-radial-open .dc-hub-radial-item:nth-of-type(3){transition-delay:.08s !important;}
#digiHubPanel.dc-radial-open .dc-hub-radial-item:nth-of-type(4){transition-delay:.12s !important;}
#digiHubPanel.dc-radial-open .dc-hub-radial-item:nth-of-type(5){transition-delay:.16s !important;}
#digiHubPanel.dc-radial-open .dc-hub-radial-item:nth-of-type(6){transition-delay:.20s !important;}
#digiHubPanel.dc-radial-open .dc-hub-radial-item:nth-of-type(7){transition-delay:.24s !important;}
.dc-hub-radial-item:hover{filter:brightness(1.16) saturate(1.08) !important;box-shadow:inset 0 0 18px rgba(105,245,255,.08),0 10px 28px rgba(0,0,0,.42),0 0 24px rgba(105,245,255,.20) !important;}
.dc-hub-radial-item.is-ready{border-color:rgba(105,245,255,.58) !important;box-shadow:inset 0 0 18px rgba(105,245,255,.10),0 0 19px rgba(105,245,255,.20),0 8px 24px rgba(0,0,0,.38) !important;}
.dc-hub-radial-item.is-ready::after{content:'' !important;position:absolute !important;inset:-2px !important;z-index:-1 !important;border-radius:inherit !important;box-shadow:0 0 18px rgba(105,245,255,.45),0 0 36px rgba(161,140,255,.14) !important;opacity:.55 !important;animation:dcHubRadialReady 1.25s ease-in-out infinite !important;pointer-events:none !important;}
@keyframes dcHubRadialReady{0%,100%{opacity:.35;filter:brightness(.94)}50%{opacity:1;filter:brightness(1.18)}}
.dc-radial-icon{width:38px !important;height:38px !important;display:grid !important;place-items:center !important;color:#69f5ff !important;}
.dc-radial-icon svg{width:31px !important;height:31px !important;stroke-width:1.45 !important;filter:drop-shadow(0 0 7px currentColor) !important;}
.dc-hub-radial-item:nth-of-type(odd) .dc-radial-icon{color:#69f5ff !important;}
.dc-hub-radial-item:nth-of-type(even) .dc-radial-icon{color:#b6a6ff !important;}
.dc-radial-label{max-width:74px !important;overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important;color:#efffff !important;font:900 6.5px/1 'Orbitron',sans-serif !important;letter-spacing:.65px !important;text-shadow:0 0 8px rgba(105,245,255,.16) !important;}
.dc-hub-radial-item small{max-width:74px !important;overflow:hidden !important;text-overflow:ellipsis !important;white-space:nowrap !important;color:#77a8b4 !important;font:800 5px/1 'Orbitron',sans-serif !important;letter-spacing:.35px !important;}

/* Restore hub appearance when closed: it remains a normal peer of Daily in the top HUD. */
#digiHubFab:not(.dc-hub-moving):not(.dc-hub-returning){transition:filter .18s ease,box-shadow .18s ease,transform .18s ease !important;}

/* ---------- STORY SPEAKER IDENTITY ---------- */
.dialogo-historia,.dialogo-evo{
  grid-template-columns:38px minmax(0,1fr) !important;
  gap:8px !important;
}
.dc-story-speaker{
  width:34px !important;height:34px !important;
  display:grid !important;place-items:center !important;
  position:relative !important;overflow:hidden !important;
  border-radius:9px !important;
  border:1px solid rgba(105,245,255,.20) !important;
  background:linear-gradient(145deg,rgba(12,44,59,.82),rgba(3,17,28,.74)) !important;
  box-shadow:inset 0 0 10px rgba(105,245,255,.045),0 0 10px rgba(105,245,255,.06) !important;
}
.dc-story-speaker--player{border-color:rgba(161,140,255,.32) !important;box-shadow:inset 0 0 10px rgba(161,140,255,.08),0 0 12px rgba(161,140,255,.08) !important;}
.dc-story-speaker--pet{border-color:rgba(105,245,255,.34) !important;}
.dc-story-speaker img{width:29px !important;height:29px !important;object-fit:contain !important;filter:drop-shadow(0 0 6px rgba(105,245,255,.18)) !important;}
.dc-story-speaker--player img{object-fit:cover !important;border-radius:6px !important;}
.dc-story-speaker-dot{
  width:10px !important;height:10px !important;border-radius:50% !important;
  background:radial-gradient(circle,#f7ffff 0 18%,#69f5ff 38%,#6d88ff 72%,transparent 74%) !important;
  box-shadow:0 0 9px rgba(105,245,255,.84),0 0 18px rgba(161,140,255,.28) !important;
  animation:dcSpeakerDotPulse 1.5s ease-in-out infinite !important;
}
@keyframes dcSpeakerDotPulse{0%,100%{transform:scale(.82);opacity:.72}50%{transform:scale(1.14);opacity:1}}

/* ---------- BOTTOM HUD: no enclosing frame ---------- */
#dcBottomDock{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  outline:0 !important;
  padding:0 !important;
}

@media(max-width:700px){
  .dc-hub-radial-item{--hub-radius:96px;width:72px !important;height:72px !important;min-width:72px !important;min-height:72px !important;grid-template-rows:34px 10px 9px !important;}
  .dc-radial-icon{width:32px !important;height:32px !important;}.dc-radial-icon svg{width:27px !important;height:27px !important;}
  .dc-radial-label{font-size:5.7px !important;max-width:64px !important;}.dc-hub-radial-item small{font-size:4.5px !important;max-width:64px !important;}
  .dc-hub-radial-core-label{top:calc(50% + 41px) !important;}.dc-hub-radial-core-label span{font-size:7px !important;}
  #digiHubFab.dc-hub-moving{width:52px !important;height:52px !important;min-width:52px !important;min-height:52px !important;}
  #digiHubFab.dc-hub-moving .dc-hub-sigil svg{width:24px !important;height:24px !important;}
}
@media(max-width:420px){
  .dc-hub-radial-item{--hub-radius:82px;width:66px !important;height:66px !important;min-width:66px !important;min-height:66px !important;grid-template-rows:30px 9px 8px !important;}
  .dc-radial-icon{width:28px !important;height:28px !important;}.dc-radial-icon svg{width:24px !important;height:24px !important;}
  .dc-radial-label{font-size:5px !important;max-width:59px !important;}.dc-hub-radial-item small{font-size:4px !important;max-width:59px !important;}
}