.seek-page { background: #e5edcf; }
.seek-page .game-shell { height: 100svh; min-height: 560px; padding-bottom: 12px; }
.seek-page .shell-main { min-height: 0; justify-content: flex-start; gap: 10px; padding-top: 0; }
.seek-page .shell-topbar { flex-shrink: 0; }
.seek-page .shell-mode-badge { position: static; }
.seek-page .shell-stage {
  width: min(1180px, 100%) !important;
  height: var(--seek-height, 360px) !important;
  border: 3px solid #745034;
  background: #cbd7ad;
  box-shadow: 0 5px 0 #b6bc98;
  border-radius: 20px;
}
.seek-page .shell-canvas { cursor: crosshair; }
.seek-page .shell-canvas[data-dragging="true"] { cursor: grabbing; }
.seek-page .shell-controls { gap: 14px; flex-wrap: nowrap; min-height: 86px; }
.seek-page .shell-hint { color: #3c563d; font-size: 13px; }
.seek-hud { width: min(1180px, 100%); display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 36px; flex-shrink: 0; }
.seek-place { display: flex; align-items: baseline; gap: 12px; }
.seek-place strong { font-size: 19px; }
.seek-progress { font-size: 13px; font-weight: 800; color: #4b6347; }
.seek-hourglass { display: flex; align-items: center; gap: 8px; }
.seek-hourglass canvas { width: 32px; height: 36px; }
.seek-hourglass .seek-best { font-size: 12px; font-weight: 800; }
.seek-tray { display: flex; align-items: center; justify-content: center; flex: 1; gap: 8px; margin: 0; padding: 9px 14px; list-style: none; background: #fff9e8; border: 2px solid #b9c59c; border-radius: 17px; min-height: 80px; }
.seek-slot { position: relative; display: grid; place-items: center; width: 62px; height: 60px; flex: 0 1 62px; border: 2px dashed #b6ad83; border-radius: 12px; background: #f2ecd4; }
.seek-slot img { display: block; width: 47px; height: 47px; object-fit: contain; opacity: .75; }
.seek-slot[data-found="true"] { background: #dcebc4; border: 2px solid #527b42; }
.seek-slot[data-found="true"] img { opacity: 1; }
.seek-slot[data-found="true"]::after { content: '✓'; display: grid; place-items: center; position: absolute; right: -5px; bottom: -5px; width: 23px; height: 23px; border-radius: 50%; background: #3f713d; color: white; font-size: 15px; font-weight: 900; }
.seek-sniff { position: relative; display: flex; align-items: center; justify-content: center; gap: 6px; flex: 0 0 172px; height: 82px; padding: 4px 12px 4px 4px; border: 2px solid #bd8c25; border-radius: 24px; background: #f6c453; box-shadow: 0 4px 0 #b8892b; touch-action: none; user-select: none; }
.seek-sniff canvas { width: 86px; height: 66px; pointer-events: none; }
.seek-sniff span { display: flex; flex-direction: column; align-items: center; pointer-events: none; line-height: 1.2; font-size: 25px; }
.seek-sniff small { font-size: 12px; }
.seek-sniff[data-active="true"] { background: #ffe29a; box-shadow: inset 0 0 0 3px #fff6c8; transform: translateY(2px); }
.seek-sniff:disabled { opacity: .65; }
.seek-level-picker { display: grid; grid-template-columns: 48px 1fr 48px; align-items: center; gap: 8px; margin-top: 15px; }
.seek-level-picker button { background: #e0eacb; font-size: 27px; }
.seek-level-picker output { font-size: 14px; font-weight: 800; }
.seek-story { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 10px 0 15px; }
.seek-story img { width: 64px; height: 62px; object-fit: contain; }
.seek-story p { max-width: 22ch; margin: 0; font-size: 15px; line-height: 1.4; text-align: left; }
.seek-next { margin-top: 12px; background: #dcebc4; }
.seek-loading { position: absolute; inset: 0; display: grid; place-items: center; background: #e5edcff2; padding: 24px; text-align: center; }
.seek-loading p { margin: 0 0 12px; font-size: 19px; font-weight: 800; }
.seek-loading button { background: #f6c453; padding: 10px 24px; }
.seek-flight { position: fixed; z-index: 10; pointer-events: none; width: 52px; height: 52px; object-fit: contain; left: 0; top: 0; will-change: transform; }
.seek-page .shell-eyebrow { letter-spacing: .5px; text-transform: none; }
@media (max-width: 620px) {
  .seek-page .game-shell { padding-left: 10px; padding-right: 10px; }
  .seek-page .shell-topbar { min-height: 72px; padding: 8px 0; }
  .seek-page .shell-mode-badge { display: none; }
  .seek-page .shell-main { gap: 8px; }
  .seek-page .shell-stage { border-radius: 15px; }
  .seek-hud { min-height: 30px; }
  .seek-place { gap: 8px; }
  .seek-place strong { font-size: 16px; }
  .seek-page .shell-controls { display: grid; grid-template-columns: 1fr 100px; gap: 8px; min-height: 116px; align-items: stretch; }
  .seek-tray { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; padding: 7px; min-height: 116px; }
  .seek-slot { width: 100%; height: 48px; min-width: 48px; }
  .seek-slot img { width: 40px; height: 40px; }
  .seek-slot[data-found="true"]::after { width: 18px; height: 18px; right: -3px; bottom: -3px; font-size: 12px; }
  .seek-sniff { height: 100%; width: 100px; padding: 5px; flex-direction: column; gap: 0; border-radius: 20px; }
  .seek-sniff canvas { width: 85px; height: 60px; }
  .seek-sniff span { flex-direction: row; gap: 5px; font-size: 23px; }
  .seek-sniff small { font-size: 12px; }
  .seek-hourglass .seek-best { display: none; }
  .seek-page .shell-hint { font-size: 12px; }
}
@media (max-width: 360px) {
  .seek-page .shell-controls { grid-template-columns: 1fr 68px; }
  .seek-sniff { width: 68px; }
  .seek-sniff canvas { width: 62px; height: 52px; }
  .seek-sniff span { flex-direction: column; }
  .seek-tray { padding: 5px; gap: 3px; }
  .seek-slot { min-width: 45px; }
  .seek-page .shell-brand { font-size: 13px; }
}
@media (max-height: 600px) and (min-width: 621px) {
  .seek-page .game-shell { min-height: 440px; }
  .seek-page .shell-topbar { min-height: 58px; }
  .seek-page .shell-controls { min-height: 64px; }
  .seek-tray { min-height: 64px; padding: 3px 10px; }
  .seek-sniff { height: 64px; }
  .seek-page .shell-hint { display: none; }
}