/* Shared interaction timing for both themes. The screen itself never moves. */
:root {
  --p-motion-press: 100ms;
  --p-motion-response: 160ms;
  --p-motion-ease: cubic-bezier(.22, 1, .36, 1);
}
.screen.active { animation: none; }
#screen-menu.active .menu-card {
  animation: none;
  animation-delay: 0s;
}
/* Classic's old looping shine must stop even while its pseudo-element is hidden. */
:is(#screen-auth, #screen-menu, #screen-settings, #screen-round-setup, #screen-ai-menu, #screen-challenge, #screen-tips, #screen-game-setup, #screen-result, #consent-gate, #control-guide, #daily-wrap, #billing-confirm) .primary-btn::before {
  animation: none;
}

/* Deliberate press feedback, scoped away from live training and media controls. */
:is(#screen-menu, #screen-settings, #screen-round-setup, #screen-ai-menu, #screen-challenge, #screen-tips, #screen-game-setup, #screen-result, #consent-gate, #control-guide, #daily-wrap) :is(button, summary) {
  transition-property: transform, background-color, border-color, color, box-shadow;
  transition-duration: var(--p-motion-response);
  transition-timing-function: var(--p-motion-ease);
  -webkit-tap-highlight-color: transparent;
}
:is(#screen-menu, #screen-settings, #screen-round-setup, #screen-ai-menu, #screen-challenge, #screen-tips, #screen-game-setup, #screen-result, #consent-gate, #control-guide, #daily-wrap) :is(button, summary):not(:disabled):active {
  transform: translateY(1px) scale(.995);
  transition-duration: var(--p-motion-press);
}
#screen-menu #menu-today-card {
  background: #fcf8ef !important;
  box-shadow: 0 8px 24px #08160e19;
}
/* Undo the legacy unconditional hover before applying fine-pointer feedback. */
#screen-menu #menu-today-card:hover {
  background: #fcf8ef !important;
  box-shadow: 0 8px 24px #08160e19;
}
@media (hover: hover) and (pointer: fine) {
  #screen-menu .menu-card:hover { transform: translateY(-1px); }
  #screen-menu #menu-today-card:hover {
    background: #fffdf8 !important;
    box-shadow: 0 9px 26px #08160e29;
    transform: translateY(-1px);
  }
}
#screen-menu #menu-today-card:not(:disabled):active {
  transform: translateY(1px) scale(.995);
  box-shadow: 0 3px 10px #08160e19;
}
#screen-menu .menu-more-sum:focus-visible {
  outline: 2px solid var(--p-accent);
  outline-offset: -4px;
  border-radius: 6px;
}
@media (hover: none), (pointer: coarse) {
  #screen-menu .menu-card:hover:not(:active) { transform: none; }
  #screen-menu .companion-choices button:hover:not([aria-pressed="true"]) { color: var(--p-muted); }
}
@media (prefers-reduced-motion: reduce) {
  .screen.active { animation: none !important; }
  :is(#screen-menu, #screen-settings, #screen-round-setup, #screen-ai-menu, #screen-challenge, #screen-tips, #screen-game-setup, #screen-result, #consent-gate, #control-guide, #daily-wrap) :is(button, summary) {
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }
  #screen-menu .menu-more-chev { transition: none !important; }
}

/* Finite boxing accents and outcome celebrations. Never an interactive layer. */
.punchy-delight {
  position: fixed;
  width: 1px;
  height: 1px;
  z-index: 80;
  pointer-events: none;
  user-select: none;
  contain: layout style;
}
.punchy-delight, .punchy-delight * { pointer-events: none !important; }
.punchy-delight--tap { --impact-rim:#b1ebcd; --impact-highlight:#eefcef; --impact-haze:#b7eaca; --impact-cut:#e9f8e7; --impact-copper:#edba87; --impact-core:#fff0d6; }
:root[data-theme="soft"] .punchy-delight--tap { --impact-rim:#568a70; --impact-highlight:#eff8e9; --impact-haze:#397b59; --impact-cut:#3d7157; --impact-copper:#b26840; --impact-core:#a7653e; }
.punchy-impact-ring {
  position: absolute;
  width: 100px;
  height: 100px;
  left: -50px;
  top: -50px;
  border: 2.5px solid var(--impact-rim);
  border-top-color: var(--impact-highlight);
  border-radius: 50%;
  box-sizing: border-box;
  box-shadow: 0 1px 1px color-mix(in srgb, var(--impact-rim) 40%, transparent), inset 0 1px 1px var(--impact-highlight);
  -webkit-mask-image: conic-gradient(from 14deg, #000 0deg 150deg, transparent 150deg 180deg, #000 180deg 330deg, transparent 330deg);
  mask-image: conic-gradient(from 14deg, #000 0deg 150deg, transparent 150deg 180deg, #000 180deg 330deg, transparent 330deg);
}
.punchy-impact-core, .punchy-impact-cut {
  position: absolute;
  background: var(--impact-cut);
  transform-origin: center;
}
.punchy-impact-core {
  width: 8px; height: 24px; left: -4px; top: -12px;
  background: var(--impact-core);
  clip-path: polygon(25% 0, 100% 42%, 75% 100%, 0 58%);
}
.punchy-impact-cut {
  width: 14px; height: 3px; left: -7px; top: -1.5px;
  clip-path: polygon(0 0, 100% 50%, 20% 100%);
}
.punchy-impact-cut--copper { background: var(--impact-copper); }
.punchy-impact-haze {
  position: absolute;
  width: 128px;
  height: 128px;
  left: -64px;
  top: -64px;
  border-radius: 50%;
  background: radial-gradient(circle, transparent 25%, color-mix(in srgb, var(--impact-haze) 14%, transparent) 45%, transparent 65%);
}
.punchy-impact-canvas {
  position: fixed;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 80;
  pointer-events: none !important;
  user-select: none;
}
.punchy-impact-canvas[hidden] { display: none !important; }
/* The same acknowledged 0%/OS policy stops CSS press movement too. */
.punchy-tap-still :is(#screen-menu, #screen-settings, #screen-round-setup, #screen-ai-menu, #screen-challenge, #screen-tips, #screen-game-setup, #screen-journal, #screen-chat, #screen-voice-setup, #gym-config, #three-plan, #daily-navigation) :is(button, summary):active,
.punchy-tap-still :is(#screen-tutorial .back-btn, #screen-three-minute .back-btn, #screen-setup-guide .back-btn, #screen-result [data-action="back-to-menu"]):active {
  transform: none !important;
  scale: none !important;
  transition: none !important;
}
.punchy-delight-star {
  position: absolute;
  width: 15px;
  height: 15px;
  left: -7px;
  top: -7px;
  overflow: visible;
  fill: #f4d46c;
  stroke: #203d36;
  stroke-width: 1.7;
  stroke-linejoin: round;
  filter: drop-shadow(0 1.5px 0 #203d3640);
}
.punchy-delight-star--coral { fill: #f49a7d; }
.punchy-delight-star--mint { fill: #a9d8bc; }
:is(.punchy-delight--complete, .punchy-delight--save) .punchy-delight-star {
  width: 22px; height: 22px; left: -11px; top: -11px;
}
.punchy-delight-stamp {
  position: absolute;
  width: 64px;
  height: 66px;
  left: 0;
  top: 0;
  display: grid;
  place-items: center;
  border: 2px solid #203d36;
  border-radius: 20px;
  background: #fffdf6;
  box-shadow: 0 4px 0 #203d36;
}
.punchy-delight-stamp img {
  width: 48px;
  height: 48px;
  display: block;
  object-fit: cover;
  border-radius: 13px;
}
.punchy-delight-check {
  position: absolute;
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  right: -9px;
  bottom: -5px;
  border: 2px solid #203d36;
  border-radius: 50%;
  background: #f4d46c;
  color: #203d36;
  font: 900 17px/1 system-ui, sans-serif;
}
.punchy-delight--save .punchy-delight-check { background: #a9d8bc; }
@media (prefers-reduced-motion: reduce) {
  .punchy-delight, .punchy-impact-canvas { display: none !important; }
  #three-result-mark { animation: none !important; transform: none !important; }
}