/* XYSHIMA homepage: floating learning progress */

.xy-public-3d .xy-hero-metric {
  position: absolute;
  z-index: 5;
  right: -30px;
  bottom: -38px;
  width: 225px;
  padding: 19px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.85);
  background: linear-gradient(
    145deg,
    rgba(255,255,255,.98),
    rgba(224,250,244,.97)
  );
  backdrop-filter: blur(18px);
  box-shadow:
    0 28px 60px rgba(6,75,67,.22),
    0 5px 16px rgba(6,75,67,.08);
  color: #143b35;
  transform: perspective(900px) rotateY(10deg);
  animation: xyMetricFloat 5s ease-in-out infinite;
}

.xy-hero-metric small {
  display: block;
  font-size: 10px;
  font-weight: 850;
  color: #0d7a6b;
  letter-spacing: .12em;
}

.xy-hero-metric strong {
  display: block;
  font-size: 16px;
  margin: 7px 0 16px;
}

.xy-hero-metric-row {
  margin-top: 12px;
}

.xy-hero-metric-label {
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  font-weight: 750;
  margin-bottom: 6px;
}

.xy-hero-metric-track {
  height: 8px;
  overflow: hidden;
  border-radius: 99px;
  background: #d8eae5;
}

.xy-hero-metric-track span {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg,#0c8574,#37c9b0);
  transform-origin: left;
  animation: xyMetricFill 1.3s ease-out both;
}

@keyframes xyMetricFloat {
  0%,100% {
    transform: perspective(900px)
      rotateY(10deg) translateY(0);
  }
  50% {
    transform: perspective(900px)
      rotateY(10deg) translateY(-9px);
  }
}

@keyframes xyMetricFill {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

@media(max-width:980px) {
  .xy-public-3d .xy-hero-metric {
    position: relative;
    right: auto;
    bottom: auto;
    width: 100%;
    margin-top: 20px;
    transform: none;
    animation: none;
  }
}

@media(prefers-reduced-motion:reduce) {
  .xy-public-3d .xy-hero-metric,
  .xy-hero-metric-track span {
    animation: none;
  }
}

/* XYSHIMA Stage 3 layout correction */

.xy-public-3d .workspace-preview.xy-3d-preview {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-width: 0;
}

/* Remove floating labels that obscure study content */
.xy-public-3d .xy-3d-preview > .xy-3d-badge {
  display: none !important;
}

/* Arrange dashboard sections in the correct order */
.xy-public-3d .xy-3d-preview > .preview-top {
  order: 1;
}

.xy-public-3d .xy-3d-preview > .focus-card {
  order: 2;
}

.xy-public-3d .xy-3d-preview > .preview-list {
  order: 3;
}

/* Move progress panel below the learning tasks */
.xy-public-3d .xy-3d-preview > .xy-hero-metric {
  order: 4;
  position: relative;
  inset: auto;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 18px 0 0;
  transform: none;
  animation: none;

  border: 1px solid rgba(13,122,107,.16);
  box-shadow: 0 12px 28px rgba(6,75,67,.09);
}