.psmr-hub,
.psmr-game {
  --psmr-blue: #168ed1;
  --psmr-blue-dark: #09628f;
  --psmr-ink: #17394d;
  --psmr-muted: #567382;
  --psmr-yellow: #ffd455;
  --psmr-white: #ffffff;
  --psmr-border: rgba(23, 87, 121, 0.18);
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  overflow-x: clip;
  color: var(--psmr-ink);
  font-family: inherit;
}

.psmr-hub *,
.psmr-game * {
  box-sizing: border-box;
}

.psmr-game-selector {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
  margin: 0 0 22px;
}

.psmr-selector-button {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 76px;
  padding: 13px 16px;
  border: 2px solid #dbe8ef;
  border-radius: 18px;
  background: #fff;
  color: #21475a;
  text-align: left;
  min-width: 0;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.psmr-selector-button:hover {
  transform: translateY(-2px);
  border-color: #99cae4;
}

.psmr-selector-button.is-active {
  border-color: var(--psmr-blue);
  box-shadow: 0 8px 22px rgba(22, 142, 209, .14);
}

.psmr-selector-icon {
  display: grid;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  place-items: center;
  border-radius: 15px;
  background: #eaf7fe;
  font-size: 25px;
}

.psmr-selector-button strong,
.psmr-selector-button small {
  display: block;
}

.psmr-selector-button strong {
  margin-bottom: 3px;
  overflow-wrap: anywhere;
  font-size: 16px;
}

.psmr-selector-button small {
  color: #6a8492;
  font-size: 12px;
}

.psmr-game-panel[hidden] {
  display: none !important;
}

.psmr-status-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 9px;
  margin-bottom: 12px;
}

.psmr-stat {
  min-width: 0;
  padding: 10px 8px;
  border: 1px solid #e0eaf0;
  border-radius: 14px;
  background: #fff;
  text-align: center;
}

.psmr-stat span,
.psmr-stat strong {
  display: block;
}

.psmr-stat span {
  margin-bottom: 3px;
  color: var(--psmr-muted);
  font-size: 12px;
}

.psmr-stat strong {
  overflow: hidden;
  font-size: 20px;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.psmr-lives-stat strong {
  font-size: 15px;
}

.psmr-arena {
  position: relative;
  width: 100%;
  height: clamp(560px, 76vw, 680px);
  min-height: 0;
  overflow: hidden;
  border: 1px solid #b9dbea;
  border-radius: 24px;
  background: linear-gradient(to bottom, #5bbcf1 0%, #a6def8 42%, #ddf4ff 72%, #f7fcff 100%);
  touch-action: none;
}

.psmr-sky {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.psmr-sun {
  position: absolute;
  top: 140px;
  right: 30px;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: radial-gradient(circle, #fffde0 0%, #ffe778 58%, #ffc94d 100%);
  box-shadow: 0 0 38px rgba(255, 226, 105, .58);
  animation: psmrSunPulse 3.5s ease-in-out infinite alternate;
}

.psmr-cloud {
  position: absolute;
  height: 32px;
  border-radius: 999px;
  background: rgba(255,255,255,.93);
  filter: drop-shadow(0 5px 7px rgba(30,88,120,.12));
  animation: psmrCloudFloat 8s ease-in-out infinite alternate;
}

.psmr-cloud::before,
.psmr-cloud::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  background: inherit;
}

.psmr-cloud-1 { top: 155px; left: 5%; width: 118px; }
.psmr-cloud-1::before { width: 44px; height: 44px; left: 15px; top: -20px; }
.psmr-cloud-1::after { width: 56px; height: 56px; right: 11px; top: -27px; }

.psmr-cloud-2 { top: 275px; right: 12%; width: 100px; opacity: .9; animation-delay: .8s; }
.psmr-cloud-2::before { width: 38px; height: 38px; left: 13px; top: -17px; }
.psmr-cloud-2::after { width: 46px; height: 46px; right: 9px; top: -21px; }

.psmr-cloud-3 { top: 420px; left: 18%; width: 92px; opacity: .74; animation-delay: 1.5s; }
.psmr-cloud-3::before { width: 34px; height: 34px; left: 11px; top: -15px; }
.psmr-cloud-3::after { width: 42px; height: 42px; right: 8px; top: -19px; }

.psmr-cloud-4 { top: 545px; right: 22%; width: 84px; opacity: .62; animation-delay: 2s; }
.psmr-cloud-4::before { width: 31px; height: 31px; left: 10px; top: -13px; }
.psmr-cloud-4::after { width: 38px; height: 38px; right: 7px; top: -17px; }

.psmr-decor-note {
  position: absolute;
  color: rgba(255,255,255,.72);
  font-size: 28px;
  animation: psmrNoteFloat 4.5s ease-in-out infinite;
}

.psmr-note-1 { top: 230px; left: 54%; }
.psmr-note-2 { top: 355px; left: 78%; animation-delay: 1s; }
.psmr-note-3 { top: 475px; left: 48%; animation-delay: 1.8s; }
.psmr-note-4 { top: 575px; left: 72%; animation-delay: 2.4s; }

.psmr-objective {
  position: absolute;
  z-index: 20;
  top: 12px;
  left: 50%;
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr);
  grid-template-rows: auto 1fr;
  align-items: center;
  width: min(94%, 430px);
  min-height: 100px;
  padding: 9px 17px;
  transform: translateX(-50%);
  border: 3px solid var(--psmr-blue);
  border-radius: 21px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 7px 0 rgba(24,91,128,.12);
}

.psmr-objective-label {
  grid-column: 1 / 3;
  color: var(--psmr-blue);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .04em;
  text-align: center;
}

.psmr-target-icon {
  display: grid;
  width: 68px;
  height: 64px;
  place-items: center;
  color: var(--psmr-blue);
}

.psmr-target-icon svg {
  width: 60px;
  height: 60px;
}

.psmr-target-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.psmr-target-copy strong {
  overflow: hidden;
  font-size: 19px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.psmr-target-copy small {
  margin-top: 3px;
  color: var(--psmr-muted);
  font-size: 13px;
}

.psmr-start-screen {
  position: absolute;
  z-index: 40;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 11px;
  padding: 145px 28px 30px;
  background: rgba(222,245,255,.96);
  color: var(--psmr-ink);
  text-align: center;
}

.psmr-start-screen.is-hidden {
  display: none;
}

.psmr-start-screen h3 {
  margin: 0;
  color: var(--psmr-ink);
  font-size: clamp(23px, 4vw, 32px);
}

.psmr-start-screen p {
  max-width: 430px;
  margin: 0 0 6px;
  color: var(--psmr-muted);
  font-size: 15px;
  line-height: 1.55;
}

.psmr-start-symbol {
  color: var(--psmr-blue);
  font-size: 70px;
  animation: psmrStartBounce 1.3s ease-in-out infinite alternate;
}

.psmr-primary-button,
.psmr-move-button,
.psmr-secondary-controls button {
  font: inherit;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.psmr-primary-button {
  border: 0;
  border-radius: 16px;
  background: var(--psmr-blue);
  color: #fff;
  font-weight: 800;
  box-shadow: 0 5px 0 var(--psmr-blue-dark);
  transition: transform .12s ease, box-shadow .12s ease;
}

.psmr-primary-button:active {
  transform: translateY(3px);
  box-shadow: 0 2px 0 var(--psmr-blue-dark);
}

.psmr-start-screen .psmr-primary-button {
  min-width: 210px;
  padding: 14px 23px;
}

.psmr-ship {
  position: absolute;
  z-index: 12;
  left: calc(50% - 38px);
  bottom: 18px;
  width: 76px;
  height: 86px;
  will-change: left;
}

.psmr-ship-window {
  position: absolute;
  z-index: 4;
  top: 0;
  left: 20px;
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 3px solid var(--psmr-blue-dark);
  border-radius: 50%;
  background: #fff;
  color: var(--psmr-blue);
  font-size: 18px;
}

.psmr-ship-body {
  position: absolute;
  z-index: 3;
  top: 25px;
  left: 16px;
  width: 44px;
  height: 46px;
  border: 3px solid var(--psmr-blue-dark);
  border-radius: 52% 52% 13px 13px;
  background: var(--psmr-blue);
}

.psmr-ship-wing {
  position: absolute;
  z-index: 2;
  top: 49px;
  width: 30px;
  height: 23px;
  background: var(--psmr-yellow);
}

.psmr-wing-left {
  left: 0;
  clip-path: polygon(100% 0,100% 100%,0 100%);
}

.psmr-wing-right {
  right: 0;
  clip-path: polygon(0 0,100% 100%,0 100%);
}

.psmr-ship-fire {
  position: absolute;
  top: 69px;
  left: 29px;
  width: 18px;
  height: 17px;
  background: linear-gradient(to bottom,#ffeb6a,#ff8b45);
  clip-path: polygon(0 0,100% 0,50% 100%);
  animation: psmrFireMove .22s ease-in-out infinite alternate;
}

.psmr-falling-figure {
  position: absolute;
  z-index: 8;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 82px;
  min-height: 84px;
  padding: 6px;
  border: 3px solid rgba(20,102,145,.25);
  border-radius: 18px;
  background: rgba(255,255,255,.97);
  box-shadow: 0 6px 0 rgba(24,91,128,.12);
  color: var(--psmr-ink);
}

.psmr-falling-figure svg {
  width: 44px;
  height: 44px;
  color: var(--psmr-blue);
}

.psmr-falling-figure strong {
  margin-top: 4px;
  font-size: 10px;
  text-align: center;
}

.psmr-falling-figure small {
  color: var(--psmr-muted);
  font-size: 9px;
}

.psmr-laser {
  position: absolute;
  z-index: 7;
  width: 9px;
  height: 44px;
  border-radius: 999px;
  background: #fff45e;
  box-shadow: 0 0 10px #fff, 0 0 18px #ffe85e;
}

.psmr-banner {
  position: absolute;
  z-index: 35;
  top: 48%;
  left: 50%;
  padding: 12px 22px;
  transform: translate(-50%,-50%) scale(.7);
  border-radius: 999px;
  background: #fff;
  color: var(--psmr-blue);
  font-weight: 800;
  opacity: 0;
  pointer-events: none;
}

.psmr-banner.is-visible {
  animation: psmrBannerShow 1.3s ease forwards;
}

.psmr-soft-boom {
  position: absolute;
  z-index: 25;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: radial-gradient(circle,#fff 0%,#fff29b 32%,rgba(255,209,76,.65) 53%,rgba(255,209,76,0) 75%);
  pointer-events: none;
  animation: psmrBoom .5s ease-out forwards;
}

.psmr-spark {
  position: absolute;
  z-index: 26;
  pointer-events: none;
  animation: psmrSparkFly .82s ease-out forwards;
}

.psmr-spark-star {
  width: 13px;
  height: 13px;
  background: #ffe64d;
  clip-path: polygon(50% 0%,61% 35%,100% 50%,61% 65%,50% 100%,39% 65%,0 50%,39% 35%);
}

.psmr-spark-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 0 8px #fff;
}

.psmr-spark-music {
  color: #fff;
  font-size: 18px;
  font-weight: 800;
  text-shadow: 0 2px 4px rgba(20,90,130,.28);
}

.psmr-success {
  animation: psmrSuccessHit .3s ease-out forwards;
}

.psmr-error {
  animation: psmrErrorHit .3s linear;
}

.psmr-message {
  min-height: 25px;
  margin: 10px 0 8px;
  color: var(--psmr-ink);
  font-size: 14px;
  text-align: center;
}

.psmr-main-controls {
  display: grid;
  grid-template-columns: 1fr 1.7fr 1fr;
  gap: 9px;
}

.psmr-move-button,
.psmr-fire-button {
  min-height: 62px;
  padding: 10px 14px;
  border-radius: 16px;
  font-size: 19px;
  font-weight: 800;
}

.psmr-move-button {
  border: 2px solid #dbe7ed;
  background: #fff;
  color: var(--psmr-ink);
}

.psmr-secondary-controls {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 9px;
  margin-top: 9px;
}

.psmr-secondary-controls button {
  min-height: 43px;
  padding: 9px 10px;
  border: 1px solid #dbe7ed;
  border-radius: 13px;
  background: #fff;
  color: var(--psmr-ink);
  font-size: 13px;
}

.psmr-help {
  margin: 9px 0 0;
  color: var(--psmr-muted);
  font-size: 12px;
  text-align: center;
}

@keyframes psmrCloudFloat {
  from { transform: translateX(-10px); }
  to { transform: translateX(15px); }
}

@keyframes psmrSunPulse {
  from { transform: scale(.96); }
  to { transform: scale(1.04); }
}

@keyframes psmrNoteFloat {
  0%,100% { transform: translateY(0) rotate(-7deg); }
  50% { transform: translateY(-13px) rotate(8deg); }
}

@keyframes psmrStartBounce {
  from { transform: translateY(0); }
  to { transform: translateY(-10px); }
}

@keyframes psmrFireMove {
  from { transform: scaleY(.72); }
  to { transform: scaleY(1.18); }
}

@keyframes psmrBoom {
  from { transform: translate(-50%,-50%) scale(.3); opacity: 1; }
  to { transform: translate(-50%,-50%) scale(3.2); opacity: 0; }
}

@keyframes psmrSparkFly {
  from { transform: translate(-50%,-50%) scale(1); opacity: 1; }
  to { transform: translate(calc(-50% + var(--psmr-dx)),calc(-50% + var(--psmr-dy))) scale(.45) rotate(320deg); opacity: 0; }
}

@keyframes psmrSuccessHit {
  to { transform: scale(1.55) rotate(8deg); opacity: 0; }
}

@keyframes psmrErrorHit {
  25% { transform: translateX(-9px); }
  75% { transform: translateX(9px); }
}

@keyframes psmrBannerShow {
  0% { opacity: 0; transform: translate(-50%,-50%) scale(.7); }
  20%,75% { opacity: 1; transform: translate(-50%,-50%) scale(1); }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(1.12); }
}

@media (max-width: 760px) {
  .psmr-hub,
  .psmr-game,
  .psmr-game-panel {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .psmr-game-selector {
    grid-template-columns: 1fr;
    gap: 9px;
    margin-bottom: 14px;
  }

  .psmr-selector-button {
    width: 100%;
  }

  .psmr-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 7px;
  }

  .psmr-lives-stat {
    grid-column: 1 / -1;
  }

  .psmr-arena {
    height: clamp(450px, 125vw, 590px);
    max-height: 72svh;
    min-height: 450px;
  }

  .psmr-objective {
    top: 8px;
    width: calc(100% - 16px);
  }

  .psmr-start-screen {
    padding-inline: 18px;
  }

  .psmr-main-controls,
  .psmr-secondary-controls {
    width: 100%;
  }
}

@media (max-width: 480px) {
  .psmr-selector-button {
    min-height: 64px;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 15px;
  }

  .psmr-selector-icon {
    flex-basis: 40px;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    font-size: 22px;
  }

  .psmr-selector-button strong {
    font-size: 14px;
  }

  .psmr-selector-button small {
    font-size: 11px;
  }

  .psmr-status-grid {
    margin-bottom: 8px;
  }

  .psmr-stat {
    padding: 7px 5px;
    border-radius: 12px;
  }

  .psmr-stat span {
    font-size: 10px;
  }

  .psmr-stat strong {
    font-size: 16px;
  }

  .psmr-lives-stat strong {
    font-size: 12px;
  }

  .psmr-arena {
    height: clamp(430px, 128vw, 550px);
    max-height: 70svh;
    min-height: 430px;
    border-radius: 16px;
  }

  .psmr-objective {
    top: 7px;
    width: calc(100% - 12px);
    min-height: 82px;
    grid-template-columns: 54px minmax(0, 1fr);
    padding: 6px 9px;
    border-width: 2px;
    border-radius: 16px;
    box-shadow: 0 5px 0 rgba(24,91,128,.1);
  }

  .psmr-objective-label {
    font-size: 10px;
  }

  .psmr-target-icon,
  .psmr-target-icon svg {
    width: 49px;
    height: 49px;
  }

  .psmr-target-copy strong {
    font-size: 14px;
  }

  .psmr-target-copy small {
    margin-top: 1px;
    font-size: 11px;
  }

  .psmr-start-screen {
    gap: 8px;
    padding: 105px 16px 20px;
  }

  .psmr-start-symbol {
    font-size: 54px;
  }

  .psmr-start-screen h3 {
    font-size: 22px;
  }

  .psmr-start-screen p {
    font-size: 13px;
    line-height: 1.4;
  }

  .psmr-start-screen .psmr-primary-button {
    min-width: 0;
    width: min(100%, 230px);
    padding: 12px 16px;
  }

  .psmr-sun {
    top: 110px;
    right: 14px;
    width: 58px;
    height: 58px;
  }

  .psmr-cloud-1 { top: 130px; transform: scale(.8); transform-origin: left center; }
  .psmr-cloud-2 { top: 230px; transform: scale(.78); transform-origin: right center; }
  .psmr-cloud-3 { top: 335px; transform: scale(.72); transform-origin: left center; }
  .psmr-cloud-4 { top: 420px; transform: scale(.68); transform-origin: right center; }

  .psmr-note-1 { top: 190px; }
  .psmr-note-2 { top: 285px; }
  .psmr-note-3 { top: 365px; }
  .psmr-note-4 { top: 445px; }

  .psmr-ship {
    bottom: 12px;
    transform: scale(.88);
    transform-origin: bottom center;
  }

  .psmr-falling-figure {
    width: 64px;
    min-height: 67px;
    padding: 4px;
    border-width: 2px;
    border-radius: 14px;
    box-shadow: 0 4px 0 rgba(24,91,128,.11);
  }

  .psmr-falling-figure svg {
    width: 32px;
    height: 32px;
  }

  .psmr-falling-figure strong {
    margin-top: 2px;
    font-size: 8px;
  }

  .psmr-falling-figure small {
    font-size: 8px;
  }

  .psmr-message {
    min-height: 36px;
    margin: 7px 0;
    padding: 0 4px;
    font-size: 12px;
    line-height: 1.35;
  }

  .psmr-main-controls {
    grid-template-columns: .9fr 1.45fr .9fr;
    gap: 6px;
  }

  .psmr-move-button,
  .psmr-fire-button {
    min-width: 0;
    min-height: 54px;
    padding: 7px 4px;
    border-radius: 14px;
    font-size: 15px;
  }

  .psmr-secondary-controls {
    gap: 5px;
    margin-top: 6px;
  }

  .psmr-secondary-controls button {
    min-width: 0;
    min-height: 40px;
    padding: 7px 3px;
    border-radius: 11px;
    font-size: 10px;
  }

  .psmr-help {
    margin-top: 7px;
    padding: 0 6px;
    font-size: 10px;
    line-height: 1.35;
  }
}

@media (max-width: 360px) {
  .psmr-arena {
    height: 430px;
    min-height: 430px;
  }

  .psmr-stat strong {
    font-size: 15px;
  }

  .psmr-main-controls {
    grid-template-columns: 52px minmax(0, 1fr) 52px;
  }

  .psmr-move-button,
  .psmr-fire-button {
    font-size: 14px;
  }

  .psmr-secondary-controls button {
    font-size: 9px;
  }
}

@media (max-width: 760px) and (orientation: landscape) {
  .psmr-arena {
    height: 430px;
    min-height: 430px;
    max-height: none;
  }

  .psmr-start-screen {
    padding-top: 98px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .psmr-game *,
  .psmr-game *::before,
  .psmr-game *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
  }
}

/* Introducción educativa v1.0.3 */
.psmr-intro-welcome,
.psmr-intro-lesson {
  display: flex;
  width: min(100%, 470px);
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 10px;
}

.psmr-intro-welcome[hidden],
.psmr-intro-lesson[hidden] {
  display: none !important;
}

.psmr-intro-actions {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}

.psmr-text-button,
.psmr-skip-link {
  border: 1px solid #bfd9e7;
  border-radius: 14px;
  background: rgba(255,255,255,.9);
  color: var(--psmr-blue-dark);
  font: inherit;
  font-weight: 700;
  cursor: pointer;
  touch-action: manipulation;
}

.psmr-text-button {
  min-height: 46px;
  padding: 10px 16px;
}

.psmr-skip-link {
  padding: 7px 13px;
  border: 0;
  background: transparent;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.psmr-intro-count {
  padding: 5px 11px;
  border-radius: 999px;
  background: rgba(22,142,209,.12);
  color: var(--psmr-blue-dark);
  font-size: 12px;
  font-weight: 800;
}

.psmr-intro-icon {
  display: grid;
  width: 94px;
  height: 94px;
  place-items: center;
  border: 3px solid rgba(22,142,209,.28);
  border-radius: 24px;
  background: #fff;
  color: var(--psmr-blue);
  box-shadow: 0 7px 0 rgba(24,91,128,.10);
}

.psmr-intro-icon svg {
  width: 74px;
  height: 74px;
}

.psmr-intro-value {
  color: var(--psmr-blue-dark);
  font-size: 17px;
}

.psmr-intro-example {
  display: block;
  max-width: 430px;
  color: var(--psmr-muted);
  font-size: 13px;
  line-height: 1.4;
}

.psmr-duration-demo {
  width: min(100%, 390px);
  padding: 10px 12px;
  border: 1px solid rgba(23,87,121,.14);
  border-radius: 14px;
  background: rgba(255,255,255,.82);
}

.psmr-duration-label {
  display: block;
  margin-bottom: 7px;
  color: var(--psmr-muted);
  font-size: 11px;
}

.psmr-duration-track {
  position: relative;
  display: block;
  width: 100%;
  height: 18px;
  overflow: hidden;
  border-radius: 999px;
  background: #d9edf7;
}

.psmr-duration-fill {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;
  width: var(--psmr-duration-width);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--psmr-yellow), var(--psmr-blue));
  transform-origin: left center;
}

.psmr-duration-fill.is-playing {
  animation: psmrDurationPlay var(--psmr-duration-ms) linear both;
}

.psmr-beat-line {
  position: absolute;
  z-index: 2;
  top: 0;
  width: 1px;
  height: 100%;
  background: rgba(23,57,77,.22);
}

.psmr-intro-lesson-actions {
  margin-top: 2px;
}

.psmr-intro-actions .psmr-primary-button {
  min-height: 46px;
  padding: 11px 18px;
}

.psmr-intro-actions button:disabled {
  cursor: not-allowed;
  opacity: .48;
  transform: none;
  box-shadow: none;
}

/* Aprendizaje progresivo */
.psmr-level-two .psmr-target-copy small {
  display: none;
}

.psmr-shape-only .psmr-objective {
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr;
}

.psmr-shape-only .psmr-objective-label {
  grid-column: 1;
}

.psmr-shape-only .psmr-target-icon {
  grid-column: 1;
  justify-self: center;
}

.psmr-shape-only .psmr-target-copy {
  display: none;
}

.psmr-falling-figure.psmr-name-only small {
  display: none;
}

.psmr-falling-figure.psmr-shape-card {
  width: 72px;
  min-height: 72px;
}

.psmr-falling-figure.psmr-shape-card svg {
  width: 48px;
  height: 48px;
}

@keyframes psmrDurationPlay {
  from { transform: scaleX(.04); filter: brightness(1.15); }
  to { transform: scaleX(1); filter: brightness(1); }
}

@media (max-width: 480px) {
  .psmr-start-screen {
    overflow-y: auto;
    justify-content: flex-start;
    padding-top: 92px;
  }

  .psmr-intro-welcome,
  .psmr-intro-lesson {
    gap: 7px;
  }

  .psmr-intro-icon {
    width: 72px;
    height: 72px;
    border-radius: 18px;
  }

  .psmr-intro-icon svg {
    width: 56px;
    height: 56px;
  }

  .psmr-intro-value {
    font-size: 14px;
  }

  .psmr-duration-demo {
    padding: 8px 9px;
  }

  .psmr-intro-actions {
    gap: 6px;
  }

  .psmr-intro-actions .psmr-primary-button,
  .psmr-text-button {
    min-height: 42px;
    padding: 9px 11px;
    font-size: 12px;
  }

  .psmr-secondary-controls {
    grid-template-columns: repeat(2, 1fr);
  }

  .psmr-falling-figure.psmr-shape-card {
    width: 61px;
    min-height: 61px;
  }

  .psmr-falling-figure.psmr-shape-card svg {
    width: 41px;
    height: 41px;
  }
}

/* Plataforma 1.1: ajustes globales y modo tranquilo */
.psmr-global-settings {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 14px;
  align-items: center;
  padding: 16px;
  margin-bottom: 16px;
  border: 1px solid rgba(75, 112, 130, .18);
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(239, 250, 246, .96), rgba(247, 251, 255, .96));
}
.psmr-settings-copy,.psmr-setting-switch{display:flex;align-items:center;gap:10px}
.psmr-settings-copy>span{font-size:30px}
.psmr-settings-copy strong,.psmr-settings-copy small,.psmr-setting-switch strong,.psmr-setting-switch small{display:block}
.psmr-settings-copy small,.psmr-setting-switch small{font-size:12px;opacity:.72;margin-top:2px}
.psmr-setting-switch{cursor:pointer;padding:10px;border-radius:14px;background:rgba(255,255,255,.72)}
.psmr-setting-switch input{width:22px;height:22px;accent-color:#398b79;flex:0 0 auto}
.psmr-calm-mode .psmr-cloud,.psmr-calm-mode .psmr-decor-note,.psmr-calm-mode .psmr-spark,.psmr-calm-mode .psmr-soft-boom{display:none!important}
.psmr-calm-mode .psmr-arena{background:linear-gradient(#eaf7f6,#f7fbff 65%,#edf5e9)}
.psmr-calm-mode .psmr-ship-fire{animation:none!important;opacity:.45}
.psmr-calm-mode .psmr-banner{animation-duration:.8s!important}
.psmr-calm-mode .psmr-falling-figure{transition:filter .25s ease,opacity .25s ease}
.psmr-calm-success{position:absolute;z-index:20;transform:translate(-50%,-50%);font-size:42px;color:#398b79;animation:psmrCalmSuccess .65s ease-out forwards;pointer-events:none}
@keyframes psmrCalmSuccess{0%{opacity:0;transform:translate(-50%,-40%) scale(.75)}45%{opacity:1}100%{opacity:0;transform:translate(-50%,-95%) scale(1.08)}}
@media(max-width:760px){.psmr-global-settings{grid-template-columns:1fr}.psmr-setting-switch{min-height:58px}}
@media(prefers-reduced-motion:reduce){.psmr-hub *{scroll-behavior:auto!important}.psmr-cloud,.psmr-decor-note,.psmr-ship-fire{animation:none!important}}