/* The playable hero follows the existing dark / orange identity. */
.hero-visual.hero-agriculture.harvest-game {
  display: flex;
  flex-direction: column;
  gap: 0;
  height: auto;
  min-height: 0;
  margin: 0 0 0 8px;
  background: #101719;
  border: 1px solid #344044;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 22px 70px #0003;
  isolation: isolate;
}
.game-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 21px 23px 18px; border-bottom: 1px solid #2c373b; }
.game-eyebrow { display: flex; align-items: center; gap: 8px; font: 500 12px var(--mono); letter-spacing: .09em; color: #c3d1d0; }
.game-eyebrow .status-dot { width: 6px; height: 6px; background: #b3df8a; box-shadow: 0 0 9px #b3df8a55; }
.game-header h2 { font-size: clamp(23px, 2.1vw, 32px); letter-spacing: -.9px; line-height: 1.25; font-weight: 500; margin-top: 9px; }
.game-header h2 span { color: #ffb078; }
.game-score { flex: none; text-align: right; font-family: var(--mono); }
.game-score > span { font-size: 12px; letter-spacing: .12em; color: #c3d1d0; }
.game-score > div { margin-top: 3px; }
.game-score strong { font-size: 30px; line-height: 1.1; font-weight: 500; color: #ffb078; }
.game-score div > span { font-size: 15px; color: #c3d1d0; }
.game-stage-wrap { position: relative; background: radial-gradient(ellipse at 50% 45%, #26393b 0, #142125 44%, #0d161a 90%); }
.hero-agriculture.harvest-game #physical-scene { position: relative; width: 100%; height: clamp(340px, 32vw, 450px); touch-action: pan-y; cursor: crosshair; outline-offset: -3px; }
.harvest-game #physical-scene canvas { position: absolute; inset: 0; }
.game-view-tools { position: absolute; top: 14px; left: 17px; z-index: 4; display: flex; background: #0b131bca; border: 1px solid #50616866; padding: 3px; border-radius: 5px; }
.game-view-tools button { min-height: 32px; padding: 5px 11px; border: 0; background: transparent; border-radius: 3px; color: #b8c9cc; font-size: 12px; cursor: pointer; }
.game-view-tools button[aria-pressed="true"] { background: #354247; color: #fff; }
.game-map-wrap { position: absolute; bottom: 13px; right: 15px; width: 140px; padding: 7px; background: #0b141ddd; border: 1px solid #50616866; border-radius: 4px; z-index: 4; }
.game-map-wrap > span { display: flex; align-items: center; justify-content: space-between; gap: 4px; font: 12px var(--mono); color: #d0dcdf; }
.game-map-wrap > span > span { font-size: 12px; }
.game-map-wrap canvas { display: block; width: 100%; height: auto; margin: 5px 0; cursor: crosshair; touch-action: pan-y; }
.game-map-wrap .game-map-caption { font-family: inherit; font-size: 12px; color: #bacace; }
.game-coordinate { position: absolute; left: 18px; bottom: 17px; display: flex; gap: 15px; font: 12px var(--mono); color: #bdced1; pointer-events: none; z-index: 3; }
.game-console { position: relative; z-index: 5; background: #121b1e; padding: 16px 20px 17px; border-top: 1px solid #344044; }
.game-status-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; min-height: 38px; }
.game-status-row p { font-size: 14px; color: #f4f8f6; line-height: 1.65; }
.game-attempts { flex: none; font: 12px var(--mono); color: #bbcbce; padding-top: 4px; }
.game-attempts b { color: #fff; font-size: 13px; font-weight: 500; margin-left: 3px; }
.game-controls { display: flex; align-items: center; gap: 18px; margin-top: 9px; }
.game-dpad { flex: none; display: grid; grid-template-columns: repeat(3, 44px); grid-template-rows: repeat(3, 44px); gap: 3px; }
.game-dpad button { padding: 0; color: #eff7f5; background: #273338; border: 1px solid #46565b; border-radius: 4px; font-size: 20px; line-height: 1; display: flex; align-items: center; justify-content: center; gap: 3px; cursor: pointer; touch-action: none; user-select: none; -webkit-user-select: none; }
.game-dpad button[data-move="back"] { grid-column: 2; grid-row: 1; }
.game-dpad button[data-move="left"] { grid-column: 1; grid-row: 2; }
.game-dpad button[data-move="right"] { grid-column: 3; grid-row: 2; }
.game-dpad button[data-move="front"] { grid-column: 2; grid-row: 3; }
.game-dpad button[data-move="back"], .game-dpad button[data-move="front"] { flex-direction: column; gap: 0; }
.game-dpad small { font-size: 12px; line-height: 1.1; }
.game-dpad-center { grid-column: 2; grid-row: 2; text-align: center; align-self: center; color: #80989e; font-size: 18px; }
.game-dpad button:hover:not(:disabled), .game-dpad button[data-active="true"] { background: #3c4e53; border-color: #ffb078; }
.game-grab-wrap { flex: 1; min-width: 0; }
.game-grab { width: 100%; min-height: 55px; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 13px; border: 1px solid #ffa05e; border-radius: 5px; background: #ff8a3d; color: #16170e; font-size: 18px; font-weight: 700; cursor: pointer; transition: background .15s; }
.game-grab:hover:not(:disabled) { background: #ffa66a; }
.game-grab > span:first-child { font-size: 26px; line-height: 1; }
.game-key { font: 12px var(--mono); border: 1px solid #43240766; padding: 3px 4px; border-radius: 3px; margin-left: auto; }
.game-grab-wrap > p { font-size: 12px; color: #c3d1d0; margin-top: 8px; text-align: center; white-space: normal; }
.game-reset { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; min-width: 42px; min-height: 52px; border: 0; background: transparent; color: #ccd9d9; cursor: pointer; }
.game-reset > span { font-size: 26px; line-height: 1; }
.game-reset small { font-size: 12px; }
.game-reset:hover { color: #ffb078; }
.harvest-game button:disabled { opacity: .42; cursor: default; }
.harvest-game button:focus-visible, .harvest-game #physical-scene:focus-visible { outline: 2px solid #ffb078; outline-offset: 3px; }
.game-instructions { margin-top: 12px; font-size: 12px; line-height: 1.8; color: #bdcccf; border-top: 1px solid #2c393d; padding-top: 11px; }
.game-mobile-break { display: none; }
.harvest-game .game-fallback { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 15px; padding: 30px; text-align: center; color: #d3e2e2; font-size: 14px; }
.game-loading-mark { font: 60px var(--mono); color: #ffb078; }
.game-paused { position: absolute; inset: 0; background: #0b151bbf; backdrop-filter: blur(5px); display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 20px; z-index: 6; font-size: 18px; }
.game-paused[hidden] { display: none; }
.game-paused button { padding: 12px 25px; background: #ff8a3d; color: #151910; border: 0; border-radius: 4px; font-size: 15px; cursor: pointer; }
.harvest-game[data-game-status="complete"] .game-score strong { color: #b3df8a; }
.harvest-game[data-game-status="fallback"] .game-map-wrap,
.harvest-game[data-game-status="fallback"] .game-view-tools,
.harvest-game[data-game-status="fallback"] .game-coordinate { display: none; }
@media (max-width: 1100px) and (min-width: 801px) {
  .game-header { padding: 18px 15px; }
  .game-console { padding: 15px 12px; }
  .game-controls { gap: 10px; }
  .game-key { display: none; }
  .game-header h2 { font-size: 23px; }
  .game-eyebrow { font-size: 12px; }
}
@media (max-width: 800px) {
  .hero-visual.hero-agriculture.harvest-game { margin: 16px 0 0; }
  .hero-agriculture.harvest-game #physical-scene { height: clamp(350px, 66vw, 460px); }
  .game-header h2 { font-size: 30px; }
  .game-dpad { grid-template-columns: repeat(3, 44px); grid-template-rows: repeat(3, 44px); }
}
@media (max-width: 520px) {
  .game-header { padding: 17px 15px; gap: 8px; }
  .game-header h2 { font-size: 25px; }
  .game-eyebrow { font-size: 12px; letter-spacing: .05em; }
  .game-score strong { font-size: 27px; }
  .game-score > span { font-size: 12px; }
  .game-console { padding: 14px 13px; }
  .game-controls { gap: 11px; }
  .game-grab { padding: 10px 7px; font-size: 17px; gap: 7px; }
  .game-grab > span:first-child { display: none; }
  .game-grab-wrap > p { font-size: 12px; white-space: normal; }
  .game-key { display: none; }
  .game-reset { min-width: 36px; }
  .game-reset small { font-size: 12px; }
  .game-dpad { grid-template-columns: repeat(3, 44px); grid-template-rows: repeat(3, 44px); }
  .game-status-row p { font-size: 14px; }
  .game-mobile-break { display: initial; }
  .game-map-wrap { width: 130px; right: 10px; bottom: 10px; }
  .game-coordinate { left: 12px; gap: 8px; font-size: 12px; }
}
@media (max-width: 1100px) and (min-width: 801px), (max-width: 380px) {
  .game-controls { display: grid; grid-template-columns: 138px minmax(0, 1fr); gap: 8px 12px; }
  .game-reset { grid-column: 1 / -1; flex-direction: row; min-height: 35px; gap: 8px; }
}
@media print { .hero-visual.hero-agriculture.harvest-game { display: none; } }

/* Grasp feedback stays visible while the physical fall and arm recovery finish. */
.game-grip-feedback { min-height: 20px; font-size: 12px; color: #bdcccf; line-height: 1.6; }
.harvest-game[data-grip-status="secure"] .game-grip-feedback { color: #b3df8a; }
.harvest-game[data-grip-status="weak"] .game-grip-feedback { color: #ffb078; }
.harvest-game[data-grip-status="slipping"] .game-grip-feedback,
.harvest-game[data-grip-status="lost"] .game-grip-feedback { color: #ff999c; }
.harvest-game[data-outcome="slip"] .game-status-row p,
.harvest-game[data-outcome="roll"] .game-status-row p,
.harvest-game[data-outcome="miss"] .game-status-row p,
.harvest-game[data-outcome="missed-basket"] .game-status-row p { color: #ffb2ad; }
